Aller au contenu
Support de Zwii
  • 0

Question

Bonjour,

J'ai un décalage anormal quand je mets en ligne une video : le système de controls n'est pas cadré par rapport à la vidéo...

quelqu'un a-t-il constaté ce pb ?

 

phr1525168762.jpg

Partager ce message


Lien à poster
Partager sur d’autres sites

25 réponses à cette question

Messages recommandés

  • 0

@phr Non, mais je t'avouerai que j'ai totalement oublié ce plugin, depuis le temps. Je l'ai retiré du téléchargement comme d'autres en attendant de pouvoir vérifier sa compatibilité avec la 8.29, mais je ne pense pas que ce ce soit en rapport. Ta vidéo ne doit pas être assez large. Tu peux aussi essayer avec un nombre de contrôles plus restreint. Désolé de ne pas pouvoir t'en dire davantage. o.O

 

PS : Ça m'ennuyait de te laisser comme ça sans vérifier. J'ai rapidement installé Plyr sur une 8.3 bêta. C'est tout à fait possible même si l'architecture du plugin est à revoir et ça fonctionne directement avec une vidéo Youtube — les vidéos étant bien sûr responsives depuis que ce point a été intégré à force d'insistances diverses...

 

plyr.jpg.79147f676b66c49c153f86e3f296ae3b.jpg

 

N'hésite pas à faire des essais et à me faire part de tes retours. :)

 

Modifié par McGregor

Partager ce message


Lien à poster
Partager sur d’autres sites
  • 0

Merci pour ton message mais ce n'est pas fonction de la largeur de la video.
video controls="controls" style="width: 1088.67px; height: 544.335px;"

La css prend une valeur héritée...

    // Prend la largeur du parent et détermine la hauteur à l'aide du ratio lors du resize de la fenêtre
    $(window).on("resize", function() {
        elementDOM.each(function() {
            var _this = $(this);
            var width = _this.parent().first().width();
            _this
                .width(width)
                .height(width * _this.data("ratio"));
        });
    }).trigger("resize");

 

C'est à revoir il me semble...


 

Partager ce message


Lien à poster
Partager sur d’autres sites
  • 0

Dialogue de sourds, c'est ma faute : je croyais que tu parlais du plugin que j'avais publié qui installait Plyr. Je t'avais lu trop vite comme tout ce que je fais entre deux portes. o.O

Je te l'envoie en MP, ne voulant pas le remettre au téléchargement en l'état. 

Modifié par McGregor

Partager ce message


Lien à poster
Partager sur d’autres sites
  • 0

le bug signalé est l'utilisation de tiny pour mettre en ligne une video stockée dans le dossier file du site....

 

Le code ci dessus est dans le fichier core.js.php

Modifié par phr

Partager ce message


Lien à poster
Partager sur d’autres sites
  • 0

OK. J'ai compris, je vais essayer. En attendant, tu peux essayer ce que je t'ai envoyé.

 

Bien vu @phr et Plyr n'y change rien, du moins avec des vidéos hébergées dans le dossier "file" de Zwii.

 

procrastination.jpg.3671a334e5d5b2237e3c23257f11e6d8.jpg

 

Mais le pire, c'est que c'est une régression par rapport à la 8.10 ! :/

J'en étais resté là. C'est pour ça que ce que tu disais m'étonnait.

 

812.jpg.22f0e97574d3410b4450726eb9edd382.jpg

 

Les vidéos se mettaient en ligne sans problème (ici avec Plyr) et la boîte d'intégration avait d'autres possibilités :

 

insertvideo.jpg.2eb4862524a42ea39950c64b562d42d9.jpg

 

Il y a donc bien un problème. 

Modifié par McGregor

Partager ce message


Lien à poster
Partager sur d’autres sites
  • 0

@phr N'hésite pas à faire savoir comment, je pense que tu en intéresseras quelques-uns — à commencer par moi : si ça s'applique au player que je t'ai envoyé, je suis preneur du tuyau pour une version actualisée. :)

Partager ce message


Lien à poster
Partager sur d’autres sites
  • 0

Relis mon deuxième post, tu pourras changer de player tu auras toujours le pb....

Partager ce message


Lien à poster
Partager sur d’autres sites
  • 0

Oh, tu sais @phr, pour moi, ce n'est pas très compliqué : j'installe la version antérieure du fichier ou je reviens à la 8.10 qui reste, de fait, la dernière version sûre.

Mais je ne voudrais pas que notre échange se termine comme sur la plupart des forums d'entraide, sans que le visiteur puisse savoir ce que celui qui a trouvé a trouvé ! Et comme ton colmatage a porté ses fruits, je me disais que tu pourrais dire ce que tu avais fait. :mrgreen:

Partager ce message


Lien à poster
Partager sur d’autres sites
  • 0
il y a 34 minutes, phr a dit :

pas de pb mais ce n'est qu'une rustine : tu commentes la ligne 326

 

Celle-ci ?

.width(width)

Merci, mais ça ne vaut pas ce qu'il y avait sur la 8.10. Je regarderai ça demain, à moins que le problème n'ait été réglé avant.

Partager ce message


Lien à poster
Partager sur d’autres sites
  • 0

Je viens de tester, pour voir ce bug que je n'avais jamais rencontré.

Il semble que ce ne soit pas du à Zwii mais au lecteur html5 des navigateurs webkit et suivants (chrome, edge, opera...), la barre des contrôles semble avoir une taille prédéfinie et est parfois plus longue, parfois plus courte que la vidéo par rapport à la taille de celle-ci. Ce problème n’apparaît pas avec les navigateurs gecko et suivants (firefox...)

Partager ce message


Lien à poster
Partager sur d’autres sites
  • 0

Confirmation avec un autre navigateur basé sur Webkit et suivants, (c'est à dire le moteur de rendu qui a succédé à Webkit utilisé par Chrome, Edge, Opera, ...), ici le test est fait avec le navigateur Opera :

 

opera.thumb.jpg.1e2a3bd7c822c1e1609b1e832a1236a9.jpg

 

Le binz c'est que la quasi totalité des navigateurs récents utilisent ce moteur de rendu des pages web, sauf Firefox qui a son propre moteur de rendu.

 

Partager ce message


Lien à poster
Partager sur d’autres sites
  • 0

Le même problème existe, toujours avec Webkit et pas avec Gecko, en remplaçant le code dans le core.js.php par le script original de Ben Marshall, donc la version de @Rémi n'est pas en cause :

01.thumb.jpg.d0941554c1ca94d539bac72d47ca518f.jpg

02.jpg.b7660e931b8d30e36f1f69183fa008fb.jpg

Partager ce message


Lien à poster
Partager sur d’autres sites
  • 0

Le problème se résout en encapsulant la balise vidéo dans un calque dimensionné, tel que :

<div style="width: 640px; heigh: 480px; max-width: 100%;"><video controls="controls" width="640" height="480">
<source src="ZwiiCMS-dev-83/site/file/source/videos/video-test.mp4" type="video/mp4" />
<source src="ZwiiCMS-dev-83/site/file/source/videos/video-test.webm" type="video/webm" /></video></div>

Résultat :

 

03.jpg.c5456869909c8b1ee6bf43bea95e8e53.jpg

Modifié par CroqueWeb
css oublié

Partager ce message


Lien à poster
Partager sur d’autres sites
  • 0

Pour moi ce contournement n'est pas propre...

Ma rustine ne me convient pas aussi car cela impacte la responsivité...

A mon avis, il faudrait intégré au CMS bootstrap 4 dont le développement est remarquable et le résultat fantastique !

Partager ce message


Lien à poster
Partager sur d’autres sites
  • 0

@CroqueWeb Possible. La seule chose sûre, c'est que ça fonctionnait avant et que la boîte d'intégration était plus intéressante : mes copies d'écran avec le même navigateur l'attestent.

 

Il y a 9 heures, CroqueWeb a dit :

Le même problème existe, toujours avec Webkit et pas avec Gecko, en remplaçant le code dans le core.js.php par le script original de Ben Marshall, donc la version de @Rémi n'est pas en cause :

 

Pas si sûr que ça... Problème corrigé en rétablissant le fameux script de BM. o.O

Je sens que je vais vérifier mon plugin Plyr cet après-midi pour le remettre au téléchargement avec un patch de "core.js.php" : c'est d'ailleurs pour résoudre ce genre de problèmes esthétiques liés à html5 que je l'avais développé.

 

829videosok.jpg.41e8183ca4f5b05f55c8eae169ecfa22.jpg

 

NB : Vérification faite avec Chrome, Firefox et Edge. OK dans les trois cas.

Modifié par McGregor

Partager ce message


Lien à poster
Partager sur d’autres sites
  • 0
Il y a 5 heures, PeterRabbit a dit :

Pas si sûr que ça... Problème corrigé en rétablissant le fameux script de BM

Les captures d'écran attestent que le problème est identique.

Partager ce message


Lien à poster
Partager sur d’autres sites
  • 0
il y a 58 minutes, CroqueWeb a dit :

Les captures d'écran attestent que le problème est identique.

 

Il y avait un problème, mais Plyr permet de le résoudre :

 

829videosok.jpg.59ef0d69fbce37c312e6ab56c345869e.jpg

 

Je suis d'accord, le problème était le même, mais je confirme après vérifications, il vient bien du script.

 

bugplyr.jpg.408edaaff172b02ac4aa8755654cec5c.jpg

 

Peux-tu me rendre la main sur la page du plugin, s'il te plaît, pour que je puisse l'actualiser ?

Modifié par McGregor

Partager ce message


Lien à poster
Partager sur d’autres sites
  • 0
Il y a 1 heure, PeterRabbit a dit :

Je suis d'accord, le problème était le même, mais je confirme après vérifications, il vient bien du script.

Non, comme je l'ai remarqué et indiqué, le problème vient du media-player html5 des navigateurs utilisant le moteur de rendu Webkit (ou Blink), pas du script permettant aux vidéos d'être adaptatives.

Je viens d'effectuer une recherche dans ce sens, ce problème est connu :

https://stackoverflow.com/questions/14184846/styling-browser-native-video-controls

 

Partager ce message


Lien à poster
Partager sur d’autres sites
  • 0

Ici : https://www.quora.com/How-do-you-skin-an-HTML5-audio-player

Quelques sélecteurs CSS qui permettent de personnaliser le lecteur média, on constate que toutes les balises concernent Webkit :

    audio::-webkit-media-controls-panel
    audio::-webkit-media-controls-mute-button
    audio::-webkit-media-controls-play-button
    audio::-webkit-media-controls-timeline-container
    audio::-webkit-media-controls-current-time-display
    audio::-webkit-media-controls-time-remaining-display
    audio::-webkit-media-controls-timeline
    audio::-webkit-media-controls-volume-slider-container
    audio::-webkit-media-controls-volume-slider
    audio::-webkit-media-controls-seek-back-button
    audio::-webkit-media-controls-seek-forward-button
    audio::-webkit-media-controls-fullscreen-button
    audio::-webkit-media-controls-rewind-button
    audio::-webkit-media-controls-return-to-realtime-button
    audio::-webkit-media-controls-toggle-closed-captions-button

 

Partager ce message


Lien à poster
Partager sur d’autres sites
  • 0

Désolé, @CroqueWeb, je ne suis pas le bon interlocuteur pour ce genre de conversation technique, tu le sais. o.O

Je n'ai pas dit que j'ai résolu le problème des controls HTML5, je sais seulement que Plyr fonctionne avec les moteurs modernes moyennant quelques modifications (dans "core.js.php" en particulier). Si j'avais fait ce plugin pour moi-même dès la version 7, c'est justement pour contourner tous ces problèmes de controls HTML5 qui me dépassent.

Mais sur le fond, tout le monde a raison : toi, moi et phr.

 

 

 

Modifié par McGregor

Partager ce message


Lien à poster
Partager sur d’autres sites

×
×
  • Créer...