Transitions dans le diaporama Transitions dans le diaporama
 

News:

cpg1.5.48 Security release - upgrade mandatory!
The Coppermine development team is releasing a security update for Coppermine in order to counter a recently discovered vulnerability. It is important that all users who run version cpg1.5.46 or older update to this latest version as soon as possible.
[more]

Main Menu

Transitions dans le diaporama

Started by pbasmo, March 01, 2007, 04:00:49 PM

Previous topic - Next topic

0 Members and 1 Guest are viewing this topic.

pbasmo

Bonjour,
Quoi de neuf dans le monde de Coppermine ?  ;)
Depuis quelques jours je glane çà et là des informations me permettant d'enjoliver le diaporama existant (histoire de justifier mon statut de contributeur  ;) )
Je sais qu'il est fortement déconseillé de modifier le code de Coppermine (c'est humain d'être attiré par l'interdit  ;D ) mais j'ai tenté une modification du script include/slideshow.inc.php afin d'ajouter des transitions supplémentaires dans le diaporama.
Il s'agit de la fonction RunSlideShow que je vous livre ici :


function runSlideShow(){
if (xIE4Up){
//*********************************************************************************
// Transition de base désactivée (le 1/3/2007)
//---------------------------------------------------------------------------------
//document.images.SlideShow.style.filter="blendTrans(duration=2)"
//document.images.SlideShow.style.filter= "blendTrans(duration=crossFadeDuration)"
//document.images.SlideShow.filters.blendTrans.Apply()
//*********************************************************************************

//*********************************************************************************
// Pour utiliser une transition aléatoire parmi les 23 transitions disponibles sour IE (1/3/2007)
//---------------------------------------------------------------------------------
document.images.SlideShow.style.filter="revealTrans(duration=crossFadeDuration)"
document.images.SlideShow.style.filter="revealTrans(transition=23)"
document.images.SlideShow.filters.revealTrans.Apply()
//*********************************************************************************
}
document.images.SlideShow.src = preLoad[j].src
if (xIE4Up){
//*********************************************************************************
// Transition de base désactivée (1/3/2007)
//document.images.SlideShow.filters.blendTrans.Play()
//*********************************************************************************

//*********************************************************************************
// Pour jouer la transition aléatoire (1/3/2007)
document.images.SlideShow.filters.revealTrans.Play()
//*********************************************************************************
}

pos = j

j = j + 1
if (j > (p-1)) j=0
t = setTimeout('runSlideShow()', slideShowSpeed)
preLoadPic(j)
}


Le filtre 'blendtrans' a été changé par le filtre 'revealTrans'. Il permet d'appeler aléatoirement l'une des 23 filtres de transitions disponibles dans IE uniquement.
Ce filtre demande 2 paramètres :

  • duration : durée de la transition en utilisant la variable déjà définie;
  • transition : code de la transition ou code 23 qui signifie transition aléatoire

Pour respecter le code original de Coppermine voici ce qu'il convient de faire :

  • dupliquer le script include/slideshow.inc.php en include/slideshow2.inc.php (donc, dans le répertoire include)
  • dans ce nouveau script, remplacer la fonction RunSlideShow écrite ci-dessus
  • en fin du fichier theme.php du thème utilisé, ajouter la fonction suivante avant la balise ?> :

function theme_slideshow()
{
    global $CONFIG, $lang_display_image_php, $template_display_media;

    pageheader($lang_display_image_php['slideshow']);

    include "include/slideshow2.inc.php"; // Nouveau script pour utilisation des transitions aléatoires (copie du script original include/slideshow.inc.php mais avec remplacement de la fonction RunSlideShow()

    $start_slideshow = '<script language="JavaScript" type="text/JavaScript">runSlideShow()</script>';
    template_extract_block($template_display_media, 'img_desc', $start_slideshow);

    $params = array('{CELL_HEIGHT}' => $CONFIG['picture_width'] + 100,
        '{IMAGE}' => '<img src="' . $start_img . '" name="SlideShow" class="image" /><br />',
        '{ADMIN_MENU}' => '',
        );

    starttable();
    echo template_eval($template_display_media, $params);
    endtable();
    starttable();
    echo <<<EOT
        <tr>
                <td align="center" class="navmenu" style="white-space: nowrap;">
                        <a href="javascript:endSlideShow()" class="navmenu">{$lang_display_image_php['stop_slideshow']}</a>
                </td>
        </tr>

EOT;
    endtable();
    pagefooter();
}

    La ligne d'include de ce code appellera donc le nouveau script include/slideshow2.inc.php qui utilise le nouveau mode de transition.

Bonne continuation à tous....
Pierre