Vidéo en mediabox ?

Bonjour à tous
(et au fait : bonne année !) :slight_smile:

J'ai un article qui incorpore des liens vers des vidéos internes, du type <doc9|left> etc. Ça fonctionne bien mais chaque vidéo ouvre une nouvelle page. Comment faire pour les ouvrir dans la mediabox, en surimpression? Autrement dit, comment donner à ces "doc" la classe mediabox?

Il me semble avoir vu passer ça sur la liste mais pas moyen de remettre la main dessus...

Merci de votre aide
Christian

Salut,

Perso, j'affiche les videos en fenêtres modales. Tu installe le plugin oEmbed et médiabox. J'héberge mes videos sur un compte YouTube. J'ajoute la vidéo "Ajoute un doc depuis internet" à partir de l'article. Et tu appelles ta vidéo dans ton article comme ça : [TITRE DE TA VIDEO->doc+id].

Dans ton fichier Head, tu ajoute un bout de JS :
$(" #article a, .spip_in[href^='IMG/distant/html/']").not(" .spip_mail, a.permalink, a.spip_out[href^='http:'], a[href^='IMG/pdf']").mediabox({
transition:"elastic",
opacity:"0.75",
innerHeight:"auto",
innerWidth:"auto",
slideshow:true,
preloading:true
});

où "#article a"est la balise HTML qui correspond à l'article qui reçoit ta vidéo.
Cela, tu peux le changer comme tu veux...
.not(" .spip_mail, a.permalink, a.spip_out[href^='http:'], a[href^='IMG/pdf']") empêche d'ouvrir des fenêtres intempestives sur tes PDF, mails, et liens spip_out...

Tu peux voir que cela donne ici : http://www.festivaldufilmdesarlat.com/-Les-films- (cliques sur les vignettes)

Marc

Le 17/01/2018 à 13:28, Christian Marget a écrit :

Bonjour à tous
(et au fait : bonne année !) :slight_smile:

J'ai un article qui incorpore des liens vers des vidéos internes, du type <doc9|left> etc. Ça fonctionne bien mais chaque vidéo ouvre une nouvelle page. Comment faire pour les ouvrir dans la mediabox, en surimpression? Autrement dit, comment donner à ces "doc" la classe mediabox?

Il me semble avoir vu passer ça sur la liste mais pas moyen de remettre la main dessus...

Merci de votre aide
Christian
_______________________________________________
liste spip
spip@rezo.net - désabonnement : envoyer un mail à spip-off@rezo.net

Archives : https://www.mail-archive.com/spip@rezo.net/maillist.html

Infos : http://listes.rezo.net/mailman/listinfo/spip

Documentation de SPIP : http://www.spip.net/

Irc : de l'aide à toute heure : http://spip.net/irc

Le 17/01/2018 à 16:06, info@desdemains.fr a écrit :

Perso, j'affiche les videos en fenêtres modales. Tu installe le plugin oEmbed et médiabox. J'héberge mes videos sur un compte YouTube.

Merci mais ce n'est pas ce que je cherche. Ces vidéos ne concernent que des soirées entre amis ou en famille, elles sont hébergées sur un site à accès restreint et je n'ai pas envie de les diffuser sur le tube même s'il n'y a rien de répréhensible là-dedans.

CM

ça ne change pas grand chose... TU uploads tes vidéos sur ton site intra, puis tu les incorpores dans ton article comme n'importe quel doc, et tu continue avec ce que j'ai expliqué avant... Normalement ça devrait fonctionner...

Le 17/01/2018 à 16:25, Christian Marget a écrit :

Le 17/01/2018 à 16:06, info@desdemains.fr a écrit :

Perso, j'affiche les videos en fenêtres modales. Tu installe le plugin oEmbed et médiabox. J'héberge mes videos sur un compte YouTube.

Merci mais ce n'est pas ce que je cherche. Ces vidéos ne concernent que des soirées entre amis ou en famille, elles sont hébergées sur un site à accès restreint et je n'ai pas envie de les diffuser sur le tube même s'il n'y a rien de répréhensible là-dedans.

CM
_______________________________________________
liste spip
spip@rezo.net - désabonnement : envoyer un mail à spip-off@rezo.net

Archives : https://www.mail-archive.com/spip@rezo.net/maillist.html

Infos : http://listes.rezo.net/mailman/listinfo/spip

Documentation de SPIP : http://www.spip.net/

Irc : de l'aide à toute heure : http://spip.net/irc

Bonsoir,

Le 17/01/2018 à 18:02, info@desdemains.fr a écrit :

ça ne change pas grand chose... TU uploads tes vidéos sur ton site intra, puis tu les incorpores dans ton article comme n'importe quel doc, et tu continue avec ce que j'ai expliqué avant... Normalement ça devrait fonctionner...

J'ai essayé mais je ne dois pas être très au point car toujours pas de boîte modale. En fait je ne comprends pas tout sur la façon d'appliquer ton code :

- je l'insère dans la boucle "articles" du fichier squelettes/head/article.html, c'est bien ça?

- tu parles de JS, donc je dois l'encadrer par <script type="text/javascript"> et </script>?"

- je change 'IMG/distant/html/' en 'IMG/mp4/' puisque ce sont des vidéos locales en mp4. Tu confirmes ?

- je n'arrive pas à interpréter le début de ton code '$(" #article a,'. En fait je ne comprends pas ce que fait le '$' initial (la console JS me signale une erreur), ni par quoi je dois remplacer '#article'. #URL_ARTICLE?

Quelques explications me seraient utiles...

Christian

- je l'insère dans la boucle "articles" du fichier squelettes/head/article.html, c'est bien ça?
Dans ton article, tu place où tu veux : [TITRE DE TA VIDEO->doc+id]

- tu parles de JS, donc je dois l'encadrer par <script type="text/javascript"> et </script>?"
oui, dans le head.

- je change 'IMG/distant/html/' en 'IMG/mp4/' puisque ce sont des vidéos locales en mp4. Tu confirmes ?
Normalement, tu n'as pas à changer cela. Cela doit rester un <doc>.

- je n'arrive pas à interpréter le début de ton code '$(" #article a,'. En fait je ne comprends pas ce que fait le '$' initial (la console JS me signale une erreur), ni par quoi je dois remplacer '#article'. #URL_ARTICLE?
J'ai fait un essai, en upload Video, via FTP : ça marche bien. Puis tu ajoute ta video via un article, depuis ton serveur. Ta video doit rester en <doc>. Tu incorpores ensuite [TITRE DE TA VIDEO->doc+id] dans ton article. Tu enregistre.

Par contre, vérifies ton code HTML sur ta page en Front, là où est ta vidéo. Ta balise "a href" de ta video. Par exemple, dans mon exemple, c'est celle-ci : a href="IMG/mp4.
Dans ton head, tu change la class dans le JS :

<script type="text/javascript" >
$(document).ready(function(){
$(" href="IMG/mp4").not(" .spip_mail, a.permalink, a[href^='IMG/pdf']").mediabox({
transition:"elastic",
opacity:"0.75",
innerHeight:"auto",
innerWidth:"auto",
slideshow:true,
preloading:true
});
</script>

Vérifies que tu as bien la balise #INSERT_HEAD, et installé le plugin Oembed.

Et voilà.

Marc

_______________________________________________
liste spip
spip@rezo.net - désabonnement : envoyer un mail à spip-off@rezo.net

Archives : https://www.mail-archive.com/spip@rezo.net/maillist.html

Infos : http://listes.rezo.net/mailman/listinfo/spip

Documentation de SPIP : http://www.spip.net/

Irc : de l'aide à toute heure : http://spip.net/irc

J'ai zappé le "a" dans le JS :

<script type="text/javascript" >
$(document).ready(function(){
$("a href="IMG/mp4").not(" .spip_mail, a.permalink, a[href^='IMG/pdf']").mediabox({

// en dessous, tu configures comme tu veux. Rappporte-toi à la doc de mediabox.

transition:"elastic",
opacity:"0.75",
innerHeight:"auto",
innerWidth:"auto",
slideshow:true,
preloading:true
});
</script>

Le 19/01/2018 à 10:11, info@desdemains.fr a écrit :

<script type="text/javascript" >
$(document).ready(function(){
$(" href="IMG/mp4").not(" .spip_mail, a.permalink, a[href^='IMG/pdf']").mediabox({
transition:"elastic",
opacity:"0.75",
innerHeight:"auto",
innerWidth:"auto",
slideshow:true,
preloading:true
});
</script>