Annonce

  •  » Utilisation
  •  » [Résolu] Où se trouve la fonction qui génère le fil d'ariane?

#16 2012-06-13 00:21:42

notph
Membre
2011-08-02
60

Re: [Résolu] Où se trouve la fonction qui génère le fil d'ariane?

Pour l'instant on a toujours la même chose d'un point de vue utilisateur, ce n'est pas très "visuel" ;)

Je termine l'implémentation du code jQuery et je mettrai tout ça ici.

Hors ligne

#17 2012-06-13 10:58:14

notph
Membre
2011-08-02
60

Re: [Résolu] Où se trouve la fonction qui génère le fil d'ariane?

Voilà j'ai a peu prés réussi à avoir ce que je voulais. Reste un petit "clignotement" lorsque l'on rentre et sort trop vite de la zone d'hover mais je réglerai ça plus tard. Un delay fera surement l'affaire.
Pour commencer voici une démo de ce que ça rend (attention, presque aucun CSS ici c'est donc assez moche ;) )

DEMO: http://jsfiddle.net/6jMnc/7/embedded/result/

Le code:

add_event_handler('loc_end_page_header', 'notph1' );

function notph1 ()
{
global $template, $page, $conf;

$template_title = $page['title'];
$bread_array = explode($conf['level_separator'], $template_title);
$bread_array_c = $bread_array;
$bread_count = count($bread_array);
unset($bread_array_c[$bread_count-1]);
$bread_previous_part = implode($conf['level_separator'], $bread_array_c);
if ($bread_count > 1)
{
  $bread_previous = "<div style=\"float:left;overflow: hidden; height:16px;\" id=\"effect\">".$bread_previous_part. " /&nbsp;</div>";
}
else
{
$bread_previous = "<div style=\"float:left;overflow: hidden; height:16px;\" id=\"effect\">".$bread_previous_part. " </div>";
}
if (count($page['items']) > 0)
{
  $bread_array[$bread_count-1].= ' ['.count($page['items']).']';
}


$template->assign('PREVIOUS_PAGES_TITLES', $bread_previous);
$template->assign('CURRENT_PAGE_TITLE', $bread_array[$bread_count-1]);
}

Dans my_index.tpl (voir templates)

<!-- On remplace {$TITLE} par les deux nouveaux morceaux-->
<h2>{$PREVIOUS_PAGES_TITLES} {$CURRENT_PAGE_TITLE}</h2>

Et le bout de jQuery que j'ai mis dans my_footer.tpl

jQuery(document).ready(function(){
//Cacher la premiere partie du fil d'ariane
jQuery("#effect").animate({
    width: "60px",
    height: "16px",
  }, 10 );
});

// Hover
$(".titrePage").hover(
  function (e) {
    jQuery("#effect").animateAuto("width", 500);
  },
  function (e) {
    jQuery("#effect").animate({"width":"60px","height":"16px"}, 500); 
  }
);
// Fonction Size:Auto
jQuery.fn.animateAuto = function(prop, speed, callback){
    var elem, width;
    return this.each(function(i, el){
        el = jQuery(el), elem = el.clone().css({"width":"auto"}).appendTo(el.parent());
        width = elem.css("width"),
        width = width;
        elem.remove();
       
        if(prop === "width")
            el.animate({"width":width}, speed, callback); 

    }); 
}

Voilà, si vous avez des questions n'hésitez pas. Le code n'est vraiment pas propre pour l'instant...

Dernière modification par notph (2012-06-13 11:00:43)

Hors ligne

#18 2012-06-13 11:06:55

Gotcha
Ex Equipe Piwigo
Pierrelatte (26)
2007-03-14
13331

Re: [Résolu] Où se trouve la fonction qui génère le fil d'ariane?

C'est un bel effet !
Mais pour le fil d’Ariane j'aurais vu plutôt un moyen de raccourcir les noms des albums parents (quit à faire de la troncature et pouvoir les développer au survole, possible ?) mais ta fonction là je la verrais bien dans l'information de l'image qui se trouve sous la photo (taille web).

Là ce serait très utile ton fonction.

Bravo ;-)


Ayez comme premier réflexe de consulter le wiki.
Ensuite, veuillez effectuer une recherche sur le forum avant de poser votre question.

LE FAIRE EST LE REVELATEUR DE L'ETRE

Hors ligne

#19 2012-06-13 11:08:39

flop25
Équipe Piwigo
2006-07-06
6544

Re: [Résolu] Où se trouve la fonction qui génère le fil d'ariane?

Hors ligne

#20 2012-06-13 11:19:25

notph
Membre
2011-08-02
60

Re: [Résolu] Où se trouve la fonction qui génère le fil d'ariane?

Grillé pour jBreadcrumbs ;)

Mais comme ce n'était tout à fait ce que je recherchais je n'ai pas souhaité l'utiliser.
Après je pense qu'il est adaptable à Piwigo avec un peu de travail.

J'ai fait une petite modif dans le code jQuery de manière à arrêter le clignotement:

<style>#effect {width:60px; height:16px;}</style>
<script>

jQuery(document).ready(function(){
//Cacher la premiere partie du fil d'ariane
jQuery("#effect").animate({
    width: "60px",
    height: "16px",
  }, 0 );
});

// Hover
$(".titrePage").hover(
  function (e) {
    jQuery("#effect").stop(true, false).animateAuto("width", 500);
  },
  function (e) {
    jQuery("#effect").stop(true,false).delay(200).animate({"width":"60px","height":"16px"}, 500); 
  }
);
// Fonction Size:Auto
jQuery.fn.animateAuto = function(prop, speed, callback){
    var elem, width;
    return this.each(function(i, el){
        el = jQuery(el), elem = el.clone().css({"width":"auto"}).appendTo(el.parent());
        width = elem.css("width"),
        width = width;
        elem.remove();
       
        if(prop === "width")
            el.animate({"width":width}, speed, callback); 

    }); 
}
      
</script>

Nouvelle demo: http://jsfiddle.net/6jMnc/13/embedded/result/


EDIT: Que voudrais-tu qu'elle fasse cette fonction exactement sous l'image? Un simple slideout?

Dernière modification par notph (2012-06-13 11:26:49)

Hors ligne

#21 2012-06-13 11:36:30

Gotcha
Ex Equipe Piwigo
Pierrelatte (26)
2007-03-14
13331

Re: [Résolu] Où se trouve la fonction qui génère le fil d'ariane?

notph a écrit:

EDIT: Que voudrais-tu qu'elle fasse cette fonction exactement sous l'image? Un simple slideout?

Exemple : http://galerie.julien-moreau.fr/picture … tegory/543

Mais c'est un peu HS car le fil du sujet concerne le fil d'Ariane... Pourriez-vous me répondre sur un nouveau sujet (je suis pressé, je dois filer au travail).
Merci.


Ayez comme premier réflexe de consulter le wiki.
Ensuite, veuillez effectuer une recherche sur le forum avant de poser votre question.

LE FAIRE EST LE REVELATEUR DE L'ETRE

Hors ligne

#22 2012-06-13 12:51:35

ddtddt
Équipe Piwigo
Quetigny (21) - France
2007-07-27
16784

Re: [Résolu] Où se trouve la fonction qui génère le fil d'ariane?

(pour les tpl tu devrais faire un préfiltre pour que cela ne soit pas écrasé par les mise à jour)


Vous aimez Piwigo alors n'hésitez pas à participer avec nous, plus d'infos sur la page "Contribuer à Piwigo". Si vous n'avez pas beaucoup de temps et que vous souhaitez nous soutenir vous pouvez aussi le faire par un don.

Hors ligne

#23 2012-06-13 14:33:42

flop25
Équipe Piwigo
2006-07-06
6544

Re: [Résolu] Où se trouve la fonction qui génère le fil d'ariane?

ddtddt a écrit:

(pour les tpl tu devrais faire un préfiltre pour que cela ne soit pas écrasé par les mise à jour)

en effet mais je dirais même de ne PAS changer le code tpl.
tes deux variables tu les concatènes en une et tu assignes à TITTLE

Hors ligne

#24 2012-06-13 16:38:52

ddtddt
Équipe Piwigo
Quetigny (21) - France
2007-07-27
16784

Re: [Résolu] Où se trouve la fonction qui génère le fil d'ariane?

flop25 a écrit:

tes deux variables tu les concatènes en une et tu assignes à TITTLE

non

Title est utilisé ailleurs, il faut faire un préfiltre


Vous aimez Piwigo alors n'hésitez pas à participer avec nous, plus d'infos sur la page "Contribuer à Piwigo". Si vous n'avez pas beaucoup de temps et que vous souhaitez nous soutenir vous pouvez aussi le faire par un don.

Hors ligne

#25 2012-06-13 16:42:51

flop25
Équipe Piwigo
2006-07-06
6544

Re: [Résolu] Où se trouve la fonction qui génère le fil d'ariane?

ddtddt a écrit:

flop25 a écrit:

tes deux variables tu les concatènes en une et tu assignes à TITTLE

non

Title est utilisé ailleurs, il faut faire un préfiltre

ok mais où car du moins dans index.tpl il est unique

Hors ligne

#26 2012-06-13 16:49:48

flop25
Équipe Piwigo
2006-07-06
6544

Re: [Résolu] Où se trouve la fonction qui génère le fil d'ariane?

en fait il est même unique tout cours, donc tu peux écraser

Hors ligne

  •  » Utilisation
  •  » [Résolu] Où se trouve la fonction qui génère le fil d'ariane?

Pied de page des forums

Propulsé par FluxBB

github twitter newsletter Faire un don Piwigo.org © 2002-2024 · Contact