[MOD/HACK] Image Scroller - based on Filmstrip

[claude]

Bonjour
Merci tout d'abord d'avoir reperé ma question et de m'avoir orienté sur le forum en français
J'ai un peu du mal à comprendre comment implémenter Image Scroller - based on Filmstrip dans mon site
je ne sais pas où mettre le code ou bien où faire un incude (ça marche très bien à partir de la page que j'ai crée mais quant à aller plus loin ...)
m'enfin, je voudrais le mettre dans ma page d'accueil mais j'y arrive pas
j'espère être compréhensible  
merci de votre aide
claude

http://www.voyagevirtuel.info
Voyagez avant de partir
http://www.voyagevirtuel.info/concoursphoto/
Concours photo : l'hiver

[Pascal YAP]

 Bonjour Claude,
Image Scroller based on FilmStrip est une création de rphMedia , que j'ai contacté pour accord de diffusion dans le forum Français de Coppermine... wait and see !

Voici un exemple d'ImageScroller Based on FilmStripe [/url]. Les vignettes proviennent de la Galerie de PYAP. (GALERIE HORS LIGNE !)

voici le lien qui mêne vers ce sujet en anglais:
http://forum.coppermine-gallery.net/index.php?topic=12299.0

A bientot

Pascal

[Pascal YAP]

Claude,

Voir le MOD "Image Scroller - based on Filmstrip"
On recommande de placer "Image Scroller - based on Filmstrip" dans le fichier ANYCONTENT.PHP
Ci-dessous le ANYCONTENT.PHP que j'ai renommé anyfilmstripe715.php (+modif à faire dans /index.php) à cause d'autres ANYCONTENT... (mais c'est un autre sujet)

Code Select Expand

<?php

// ------------------------------------------------------------------------- //
// Coppermine Photo Gallery 1.3.0                                            //
// ------------------------------------------------------------------------- //
// Copyright (C) 2002,2003 Gregory DEMAR                                     //
// http://www.chezgreg.net/coppermine/                                       //
// ------------------------------------------------------------------------- //
// Updated by the Coppermine Dev Team                                        //
// see /docs/credits.html for details                                        //
// ------------------------------------------------------------------------- //
// This program is free software; you can redistribute it and/or modify      //
// it under the terms of the GNU General Public License as published by      //
// the Free Software Foundation; either version 2 of the License, or         //
// (at your option) any later version.                                       //
// ------------------------------------------------------------------------- //

/*
$Id: anycontent.php,v 1.7 2004/03/16 09:26:18 gaugau Exp $
*/
starttable("100%", "TITRE DU FILMSTRIPE");?>
<table width="100%" border="0" cellspacing="0" cellpadding="0">
 <tr>
  <td>
<center>
<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="715" height="190"  codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,0,0" align="middle">
               <param name="bgcolor" value="#000000" />
               <param name="menu" value="false" />
               <param name="movie" value="main.swf" />
               <param name="play" value="true" />
               <param name="loop" value="false" />
               <param name="quality" value="high" />
               <param name="wmode" value="opaque" />
               <embed src="main.swf" width="715" height="190" loop="false" quality="high" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/shockwave/download/index.cgi?P1_Prod_Version=ShockwaveFlash" swliveconnect="true">
               </embed>
           </object></center></td>
 </tr>
<tr>
</tr>

<?php endtable(); ?>
<br  />

Les fichiers MAIN.SWF, FLASHTHUMB.PHP et FLASHTHUMB.SWF sont à placer à la racine du dossier de Coppermine.

Rappel : on déclare ANYCONTENT  via le panneau de configuration :  anycontent/alblist/catlist/last,2 comme indiqué dans la documentation en ligne =>ici=> http://coppermine.sourceforge.net/manual.php#config_album_list
That's All !

Pascal

[FireFox]

Salut,

     

Voir le MOD "Image Scroller - based on Filmstrip" en fonction sur http://expo.pays-dignois.com

carrément Superbe !
FireFox

[Pascal YAP]

FireFox, 

Je te remercie.
Personnellement, j'ai choisi de placer le Flash à l'horizontal.
Rph, propose différentes dimensions et orientation dans le sujet suivant (en anglais)
http://forum.coppermine-gallery.net/index.php?topic=12299.0
Le FilmStrip que j'utilise mesure 715x190 pixels et affiche 24 images différentes en tout, et sur 6 zones.
C'est très esthétique n'est-ce-pas ?

RphMedia, c'est vraiment le GOUROU du Flash associé à Coppermine !
Pascal

[Pascal YAP]

Bonjour,
Autres informations concernant ce SlideShow en Flash   :

Si vous ne désirez pas de défilement des images, mais qu'au contraire elles restent fixes et en place avec le fondu enchainé tout e même, ne pointez plus vers le fichier Flash "main.swf" mais vers "flashthumb.swf".

ceci avec main.swf

Code Select Expand

<param name="movie" value="main.swf" />
devient :

Code Select Expand

<param name="movie" value="flashthumb.swf" />

Pascal

[Pascal YAP]

Rappel du lien qui mêne vers le sujet d'origine :
http://forum.coppermine-gallery.net/index.php?topic=12299.0

Voici un exemple  d'ImageScroller Based on FilmStripe [/url].
Les vignettes de cet exemple proviennent de la Galerie de PYAP.

Pascal

[claude]

Merci pour tout et BONNE ANNEE A TOUS  
ça marche super bien
voir http://www.voyagevirtuel.info/concoursphoto/  

[Pascal YAP]

Claude,

Meilleurs Voeux également,

 Il y a le même MOD positionné à la vertical. Puis Horizontal sans les bandes FilmStripe
La même chose encore mais cette fois pour une seule vignette/images etc

Pascal

[chap50]

Bonjour,
J'ai cherché dans le post anglais de ce mod pour essayer de trouver comment afficher à l'horizontal sans les bandes FilmStrip mais je n'ai pas trouvé !
Par contre en parcourant le post j'ai trouvé quelque chose d'intéressant (je pense :-\\) :

Pour ceux qui ne veulent pas du fond noir mais plutôt un fond transparent, il suffit d'ajouter ces deux lignes :

- dans le tag <embed> :

Code Select Expand

wmode="transparent"
- dans le tag <object> :

Code Select Expand

<param name="wmode" value="transparent">

Merci pour votre aide ! 

[chap50]

Ah c'est bon j'ai trouvé !
En fait j'avais déjà téléchargé le bon fichier mais le filmstrip était toujours là !
Il faut vider le cache du navigateur !

Voici le lien pour télécharger le fichier (sans le filmstrip) : http://forum.coppermine-gallery.net/index.php?action=dlattach;topic=12299.0;id=918

Voila ce que ça donne : http://chappy50.free.fr/pages/parking/index.php (Mod/Hack désactivé)

[Pascal YAP]

Bonjour Chap50,
Excellent retour d'infos. Cette intervention fait progresser tout le monde, et c'est le but 

Merci et bonne journée
PYAP

[chap50]

Ben y'a pas de quoi !
J'ai été content de trouver de l'aide (et j'en demanderais surement encore ) rapide et en français alors j'essaie de faire ce que je peux pour aider à mon tour !
Bonne journée !

P.S : Je suis allé voir votre galerie, toute mes félicitations, il y a une paire de photos absolument magnifique !!

[Daddy Cool]

Est-ce que vous savez si ce MOD peut fonctionner sur un CMS (le mien= e107).

Je n'arrive pas à le faire fonctionner...  :-\\

ma page

et pourtant, j'ai le cadre qui s'affiche??

Donc, ce que j'ai fait: copié les fichiers main.swf, flashthumb.php&swf dans le répertoire de coppermine (moi = e107_plugins/coppermine_menu )
et complètement réédité le fichier anycontent.php par ce qui était proposé par PYAP (j'ai TOUT remplacé).
Ah oui, pour l'afficher là, j'ai mis le chemin d'accés à la page principale : anycontent/alblist/catlist/last,2

et puis résultat un rectangle noir...  Aide? kelkun?

[Pascal YAP]

Bonjour,

Est-ce que vous savez si ce MOD peut fonctionner sur un CMS

Il est possible de l'insérer partout au moyen un cadre IFRAME !

Code Select Expand

<iframe src="http://www.Votre-web.nut/VOTRE-CPG/image_scroller_www2.html" width="100%" height="238" frameborder="0" ALLOWTRANSPARENCY="true" scrolling="auto" name="FrameWebotron"></iframe>
Les fichiers ImageScoller étant situés à la racine de votre Coppermine.

comme ma galerie de famille : http://webotron.online.fr

PYAP

ps : pour cause de foudre, mes réponses peuvent être tardives et rapides (PCs fumés, etc...)  :-\\

[Daddy Cool]

Excuse moi PYAP, merci de ta réponse foudroyante mais là, je suis un peu perdu..

image_scroller_www2.html   il sort d'où ce fichier?

Pour l'instant, j'essaie juste de le faire fonctionner à l'entrée de ma gallerie photo..

ps. j'ai réussi à obtenir les fichiers, mais pas du topic de base, d'un autre site web, ici, le téléchargement ne fonctionnait pas  :-\\
J'ai l'impression que j'ai peut-être pas les bons.. si tu pouvais me les envoyer ou quelqu'un d'autre..
mon adresse :   david.coll @ arcur.asso.fr

[Pascal YAP]

Euh OK oui, j'ai oublié de signaler ce fichier HTML a la racine de Coppermine !
C'est le fichier HTML qui sera appelé dans le IFRAME.
Dans le fichier que j'ai créé, mais il est possible de donner n'importe quel nom, j'ai placé ImageScroller comme ceci :

Code Select Expand

<body bgcolor="#000000" text="#99FFFF" link="#000066" vlink="#000066" alink="#FFCC00" background="images/carre_blinkopti2.gif" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
<div>
  <table width="100%" border="0" cellspacing="0" cellpadding="0" height="100%" align="center">
    <tr>
      <td>
        <div align="center">
          <table width="745" border="0" cellspacing="0" cellpadding="0" align="center" height="193">
            <tr>
              <td width="15" background="http://webotron.online.fr/photon/themes/Xtra-Z-Zone/images/lt.gif" height="15"></td>
              <td width="715" bgcolor="#000000" height="15"></td>
              <td width="15" background="http://webotron.online.fr/photon/themes/Xtra-Z-Zone/images/rt.gif" height="15"></td>
            </tr>
            <tr>
              <td width="15" bgcolor="#000000" height="190"></td>
              <td width="715" height="190"><object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=5,0,0,0" width="715" height="190" align="middle" vspace="0" hspace="0">
                  <param name=movie value="http://webotron.online.fr/photon/main.swf">
                  <param name=menu value="false">
                  <param name="BGCOLOR" value="000000">
                  <embed src="http://webotron.online.fr/photon/main.swf" pluginspage="http://www.macromedia.com/shockwave/download/index.cgi?P1_Prod_Version=ShockwaveFlash" type="application/x-shockwave-flash" width="715" height="190" align="middle" vspace="0" hspace="0" menu="false" bgcolor="000000">
                  </embed>
                </object></td>
              <td width="15" bgcolor="#000000" height="190"></td>
            </tr>
            <tr>
              <td width="15" background="http://webotron.online.fr/photon/themes/Xtra-Z-Zone/images/bl.gif" height="15"></td>
              <td width="713" bgcolor="#000000" height="14"></td>
              <td width="15" background="http://webotron.online.fr/photon/themes/Xtra-Z-Zone/images/rb.gif" height="15"></td>
            </tr>
            <tr>
              <td colspan="3" background="" height="15" class="PYAPBASED">
                <div align="center"><font face="Courier New, Courier, mono" size="-1">Extraits
                  de la Galerie WEBOTRON &copy; <a href="http://coppermine.sourceforge.net/board/index.php?action=profile;u=1545" target="_blank" title="Contactez PYAP via le Forum Coppermine.Gallery.net">PYAP</a>
                  </font></div>
              </td>
            </tr>
          </table>
        </div>
      </td>
    </tr>
  </table>
</div>
</body>
(ce fichier HTML en direct-live : http://webotron.online.fr/photon/image_scroller_www2.html )
Wait and See maintenant 

PYAP

[Daddy Cool]

OK, merci beaucoup!
J'ai fait quelques recherche sur ton site pour comprendre la structure et c'est bon, là j'ai compris, merci!

Bon, donc, j'ai fait le test avec main.swf dans tous les répertoires possibles du ../ à ../e107_plugins/coppermine_menu/albums/rabotins
Donc, le flash semble fonctionner, tu n'as qu'à faire le test pour en voir le déroulement.. Mais aucune image n'apparaît    Il n'en trouve pas!

Comment ce flash trouve-t-il les images à faire apparaître?
Est-ce qu'il va chercher les images dans la base de données?? parce que dans ce cas, c'est normal qu'il ne trouve pas, toutes mes BdD commencent par le préfixe e107_xxxxxxx, même celle de CPG  :-\\

OU bien, est-ce que je dois éditer manuellement flashthumb.php C'est dommage qu'il n'y ai pas encore de FAQ pour cette MOD qui a un succés compréhensible..

[Daddy Cool]

Ah ouais.. c'est bien ça le problème..

J'ai besoin de transformer le fichier flashthumb.php pour qu'il soit fonctionnel avec mon site "made in e107"

Code Select Expand

<?php
define('IN_COPPERMINE', true);
require('include/init.inc.php');
$xml = '<?xml version="1.0" encoding="UTF-8" ?> <slideshow><settings><image_folder></image_folder><time>5</time><fade>3</fade><repeat>true</repeat><captions>false</captions></settings><images>';
if ($FORBIDDEN_SET != "") $FORBIDDEN_SET = "AND $FORBIDDEN_SET";
$result = mysql_query("SELECT * FROM {$CONFIG['TABLE_PICTURES']} AS p WHERE filename LIKE '%.jpg' $FORBIDDEN_SET ORDER BY RAND() LIMIT 13");
while ($row = mysql_fetch_array($result))
{
$type = 'thumb';
$xml .= "<image><file><![CDATA[".get_pic_url($row, $type) ."]]></file><caption></caption></image>";
}
$xml .= '</images></slideshow>';
echo $xml;
?>
Le répertoire de coppermine se trouve à ../e107_plugins/coppermine_menu/
et la base de données est nommée       e107_CGP_pictures

Si vous avez une idée sur la façon de l'adapter..  Moi, je galère grave dans tous ces codes..
(ps. je préfère un accès à la base de données qu'une alternative directe, car mon site est sujet à un gros roulement de photos...)

[Daddy Cool]

Bonjour, voilà, après un fort long moment, je me suis repris l'envie de faire fonctionner ce super système et j'y suis cette fois arrivé... (merci à l'entraînement  )

Pour comprendre comment fonctionne ce filmstrip, tout d'abord, il faut comprendre que les fichiers Flash (main.swf et flashthumb.swf) vont chercher l'adresse des images à afficher dans un "fichier" XML. Ce fichier XML est créé dynamiquement par le fichier flashthumb.php , c'est celui ci que vous devez éditer pour qu'il réfère correctement l'adresse des images de votre gallerie de photos. Attention lors de 'édition de ce fichier, lorsqu'il est lancé seul (directement, en l'entrant dans la barre d'adresse), le contenu doit être uniquement du contenu XML (<?xml ...... ).

Ce fichier (flashthumb.php) est lancé directement par le flash (main ou flashthumb). D'où l'importance de l'ecrire correctement pour qu'il soit 'autonome' (qu'il est l'accès à la base de données tout seul).

Dans le post précédent, vous voyez donc le code original pour que ça fonctionne avec une gallerie Coppermine "pure" (qui n'est pas intégré/hacké).

Maintenant, si vous voulez l'utiliser avec une gallerie photos montée dans un autre système de site web, vous devez transformer ce fichier afin qu'il aille farfouiller dans votre base de données les photos existantes et qu'il renvoit l'adresse correcte.

Voici ce que ça donne avec le CMS e107 :

Code Select Expand

<?php
require_once("../../class2.php");
$xml = '<?xml version="1.0" encoding="UTF-8" ?> <slideshow><settings><image_folder></image_folder><time>5</time><fade>3</fade><repeat>true</repeat><captions>false</captions></settings><images>';
$sql->db_Select("CPG_pictures","filepath,filename"," filename LIKE '%.jpg' ORDER BY RAND() LIMIT 16");
while ($row = $sql->db_Fetch())
{

$type = 'thumb';
$xml .= "<image><file><![CDATA[albums/". $row['filepath']."thumb_".$row['filename'] ."]]></file><caption></caption></image>";
}
$xml .= '</images></slideshow>';
echo $xml;
?>

Quelle est la différence ?
De 1, vous voyez qu'il n'y a plus de référence (require(...)) à des fichiers de coppermine, ce code n'utilise que les fonctions propres au CMS e107.
Pourquoi ? Parce que lors du lancement de la référence require('include/init.inc.php');, le pont qui est constitué entre la gallerie photo Coppermine et le CMS e107 lançait le thème du CMS e107. C'est à dire que le site web était en partie activé, donc le contenu renvoyé lors de l'activation de flashthumb.php n'était pas simplement un contenu XML.

Bref, de cette façon, vous créez un fichier contenant purement que du XML.

Donc, pour vous assurer que votre fichier est correctement construit, lancez le fichier flashthumb.php directement à partir de la barre d'adresse et ensuite vérifiez le code source de la page obtenue (Affichage/Code source). Vérifiez si le code est bien formé (surtout l'adressage des images), voici un exemple de ce qui doit être obtenu :

Code Select Expand

<?xml version="1.0" encoding="UTF-8" ?> <slideshow>
<settings>
<image_folder></image_folder>
<time>5</time>
<fade>3</fade>
<repeat>true</repeat>
<captions>false</captions>
</settings>
<images>
<image>
<file><![CDATA[albums/mechoui/thumb_IMG14.jpg]]></file>
<caption></caption></image>
<image>
<file><![CDATA[albums/mechoui/thumb_IMG17.JPG]]></file>
</images>
</slideshow>

Si vous obtenez quelque chose du genre, vous devriez avoir réussi ^_^