Changeset 82655 in spip-zone


Ignore:
Timestamp:
May 21, 2014, 11:11:51 AM (5 years ago)
Author:
chankalan@…
Message:

ajout fonctionnalités (liens_individuels historique + tooltip et mediabox comme avant) + choix du message pauseonhover + langue (en cours)

Location:
_plugins_/sjcycle/trunk
Files:
3 added
6 edited

Legend:

Unmodified
Added
Removed
  • _plugins_/sjcycle/trunk/formulaires/configurer_sjcycle.html

    r82610 r82655  
    7878                        </li>
    7979                       
     80                        #SET{name,pauseonhovercontent}
     81                        <li class="editer editer_[(#GET{name})]">
     82                                <label>[(#GET{cc}|concat{':label_',#GET{name}}|_T)]</label>
     83                                <input type="text" name="#GET{name}" class="text" value="#ENV*{#GET{name}}" id="#GET{name}" />
     84                                <p class="explication">[(#GET{cc}|concat{':explication_',#GET{name}}|_T)]</p>
     85                        </li>
     86                       
    8087                        #SET{name,random}
    8188                        <li class="editer editer_[(#GET{name})]">
     
    144151                       
    145152                </ul>
     153                <fieldset>
     154                <legend><:sjcycle:legend_tooltip_box:></legend>
     155                <ul>
     156                       
     157                        #SET{name,tooltip}
     158                        <li class="editer editer_[(#GET{name})]">
     159                                <label>[(#GET{cc}|concat{':label_',#GET{name}}|_T)]</label>
     160                                #SET{val,oui}
     161                                <div class="choix">
     162                                        <input type="checkbox" name="#GET{name}" class="checkbox" id="#GET{name}_#GET{val}" value="#GET{val}"[(#GET{val}|=={#ENV{#GET{name}}}|oui)checked="checked"] />
     163                                        <label for="#GET{name}_#GET{val}">[(#GET{cc}|concat{':label_',#GET{name},'_',#GET{val}}|_T)]</label>
     164                                        <p class="explication">[(#GET{cc}|concat{':explication_',#GET{name}}|_T)]</p>
     165                                </div>
     166                        </li>
     167                       
     168                        #SET{name,tooltiptech}
     169                        <li class="editer editer_[(#GET{name})]">
     170                                <label>[(#GET{cc}|concat{':label_',#GET{name}}|_T)]</label>
     171                                #SET{val,oui}
     172                                <div class="choix">
     173                                        <input type="checkbox" name="#GET{name}" class="checkbox" id="#GET{name}_#GET{val}" value="#GET{val}"[(#GET{val}|=={#ENV{#GET{name}}}|oui)checked="checked"] />
     174                                        <label for="#GET{name}_#GET{val}">[(#GET{cc}|concat{':label_',#GET{name},'_',#GET{val}}|_T)]</label>
     175                                        <p class="explication">[(#GET{cc}|concat{':explication_',#GET{name}}|_T)]</p>
     176                                </div>
     177                        </li>
     178                       
     179                        #SET{name,mediabox}
     180                        <li class="editer editer_[(#GET{name})]">
     181                                <label>[(#GET{cc}|concat{':label_',#GET{name}}|_T)]</label>
     182                                #SET{val,oui}
     183                                <div class="choix">
     184                                        <input type="checkbox" name="#GET{name}" class="checkbox" id="#GET{name}_#GET{val}" value="#GET{val}"[(#GET{val}|=={#ENV{#GET{name}}}|oui)checked="checked"] />
     185                                        <label for="#GET{name}_#GET{val}">[(#GET{cc}|concat{':label_',#GET{name},'_',#GET{val}}|_T)]</label>
     186                                        <p class="explication">[(#GET{cc}|concat{':explication_',#GET{name}}|_T)]</p>
     187                                </div>
     188                        </li>
     189                       
     190                </ul>
     191                </fieldset>
    146192               
    147193                <fieldset>
  • _plugins_/sjcycle/trunk/lang/sjcycle_en.php

    r70842 r82655  
    99
    1010        // C
    11         'configurer_titre' => 'jQuery Cycle Configuration',
     11        'configurer_titre' => 'Cycle2 Configuration',
    1212
    1313        // E
    14         'erreur_config_creer_preview' => 'Caution: the generation of miniatures of the images is currently inactive, please activate it in the <a href=".?exec=config_fonctions">advanced functions</a> of the site configuration !',
    15         'erreur_config_image_process' => 'Caution: Method of thumbnails creation was not selected, please select of them one din the <a href=".?exec=config_fonctions">advanced functions</a> of the site configuration !',
     14        'erreur_config_creer_preview' => 'Caution: the generation of miniatures of the images is currently inactive, please activate it in the <a href=".?exec=configurer_avancees">advanced functions</a> of the site configuration !',
     15        'erreur_config_image_process' => 'Caution: Method of thumbnails creation was not selected, please select of them one din the <a href=".?exec=configurer_avancees">advanced functions</a> of the site configuration !',
    1616        'explication_afficher_aide'=>'Display the help box in the left column on the edition pages of articles',
    17         'explication_fx'=>'Consultez les exemples en ligne : <a href="http://malsup.com/jquery/cycle/browser.html" target="_blank">jQuery Cycle Plugin</a>',
    18         'explication_img_background' => 'Type the background color in hexa format or with the palette if the Palette Plugin is available. To force transparent background, type "transparent" (in which case, the final images will be with in png format)',
    19         'explication_imgparams'=>'Images are automatically resized and cropped in order to preserve the page layout during the insertion of the slideshow within the text. This treatment is carried out on the images according to:
    20 -* their position in the slideshow, combination of the values of alignment "left/center/right" and "top/center/bottom" (ex "left center")
    21 -* their desired final size (width height)',
    22         'explication_mediabox'=>'On clic, display the original image in a jQuery mediabox. Need the <a href="http://www.spip-contrib.net/MediaBox" target="_blank">Mediabox plugin</a>',
    23         'explication_pause'=>'Enable pause of the slideshow on hover',
    24         'explication_random'=>'true for random, false for sequence (not applicable to shuffle fx) ',   
     17        'explication_fx'=>'See exemples : <a href="http://jquery.malsup.com/cycle2/" target="_blank">Cycle2 Plugin</a>',
     18        'explication_backgroundcolor' => 'Type the background color in hexa format or with the palette if the Palette Plugin is available. To force transparent background, type "transparent" (in which case, the final images will be with in png format)',
     19        'explication_pauseonhover'=>'&lt;sjcycleXX<strong>|pauseonhover=true</strong>&gt; ou &lt;sjcycleXX<strong>|pauseonhover=false</strong>&gt;',
     20        'explication_random'=>'&lt;sjcycleXX<strong>|random=true</strong>&gt; ou &lt;sjcycleXX<strong>|random=false</strong>&gt;',     
    2521        'explication_speed'=>'speed of the transition in milliseconds',
    26         'explication_sync'=>'Define if in/out transitions should occur simultaneously',
    2722        'explication_timeout'=>'Milliseconds between slide transitions (0 to disable auto advance)',
    28         'explication_tooltip'=>'On hover, display a tooltip with image title and description. Use the jQuery tooltip plugin',
    29         'explication_tooltip_carac'=>'Display the characteristics of the original image in the tooltip: width, heigth and size',
    30         'explication_text_next' => 'You can introduce the "next" button by adding to your slide shows <code>|btn_suivant=1 </code><br /> Choose here the title of this button.',
    31         'explication_text_prev' => 'You can introduce the "previous" button by adding to your slide shows <code>|btn_precedent=1 </code><br /> Choose here the title of this button.',
    3223
    3324        // L
    3425        'label_afficher_aide' => 'Display the help box',
    35         'label_div_background' => 'Border color',
    36         'label_div_class' => 'Class name css',
    37         'label_div_margin' => 'External margin',
    3826        'label_fx' => 'Effect',
    39         'label_img_background' => 'Background color',   
    40         'label_img_bordure' => 'Border width',
    41         'label_img_height' => 'Height',
    42         'label_img_position' => 'Positioning',
    43         'label_img_width' => 'Width',
     27        'label_backgroundcolor' => 'Background color', 
    4428        'label_mediabox' => 'Mediabox',
    45         'label_pause' => 'Pause on hover',
     29        'label_pauseonhover' => 'Pause on hover',
    4630        'label_random' => 'Random slideshow',
    4731        'label_speed' => 'speed of the transition',
    48         'label_sync' => 'Synchronisation',
    49         'label_text_next' => 'Title of the button <strong>"next"</strong>',
    50         'label_text_prev' => 'Title of the button <strong>"previous"</strong>',
     32        'label_next' => 'Button <strong>"next"</strong>',
     33        'label_prev' => 'Button <strong>"previous"</strong>',
    5134        'label_timeout' => 'Display time',
    52         'label_tooltip' => 'Display tooltips',
    53         'label_tooltip_carac' => 'Characteristics of the original image',
    54         'legend_autres' => 'Other parameters',
    55         'legend_cssparams' => 'SjCycle styles parameters',
    56         'legend_imgparams' => 'Images treatments SjCycle',
    57         'legend_jsparams' => 'jQuery Cycle javascript parameters',
     35        'legend_parametres_suplementaires' => 'Other parameters',
    5836        'legend_tooltip_box' => 'Tooltip & mediabox Parameters',
    5937
    6038        // N
    61         'next' => 'next',
    6239        'noisette_alea_description' => 'Display a random slideshow',
    6340        'noisette_alea_nom_noisette' => 'Random slideshow',
     
    7956       
    8057        // P
    81         'prev' => 'previous',
    8258
    8359        // T
  • _plugins_/sjcycle/trunk/lang/sjcycle_fr.php

    r82430 r82655  
    2323        'erreur_config_image_process' => 'Attention : La méthode de fabrication des vignettes n\'a pas été choisie, veuillez  en sélectionner une dans les <a href=".?exec=configurer_avancees">fonctions avancées</a> de la configuration du site !',
    2424        'explication_caption' => 'Afficher une légende pour chaque image. Cibler un bloc html par sa classe ou son identifiant css, ou bien par défaut "<strong>.cycle-caption</strong>".<br />&lt;sjcycleXX<strong>|caption=.cycle-caption</strong>&gt;',
    25         'explication_captiontemplate' => 'Vide pour avoir le décompte/le nombre total, "<strong>{{alt}}</strong>" pour avoir les titres des images en légende, ou encore par exemple "<strong>Diapositive {{slideNum}} : {{alt}}</strong>"".<br />&lt;sjcycleXX<strong>|captiontemplate={{alt}}</strong>&gt;',
     25        'explication_captiontemplate' => 'Vide pour avoir le décompte/le nombre total, "<strong>{{alt}}</strong>" pour avoir les titres des images en légende, ou encore par exemple "<strong>Diapositive {{slideNum}} : {{alt}}</strong>"". <a href="http://jquery.malsup.com/cycle2/demo/caption.php">Voir des exemples.</a><br />&lt;sjcycleXX<strong>|captiontemplate={{alt}}</strong>&gt;',
    2626        'explication_largeurmax' => 'Toutes les images seront retaillées en largeur à cette valeur, en pixels. Les diaporamas étant en taille proportionnelle, ils s\'adapteront à la largeur définie par l\'interface du site, mais dans la limite définie ici.<br />&lt;sjcycleXX<strong>|largeurmax=150</strong>&gt;',
     27        'explication_hauteurmax' => 'En laissant le champ vide, les images seront toujours à la largeur maximum possible. Sinon toutes les images seront retaillées en hauteur à cette valeur, en pixels. Si la largeur de l\'image n\'est pas suffisante, la couleur de fond configurée sera visible. La valeur de couleur de fond "transparent" rendra par contre un fond blanc.<br />&lt;sjcycleXX<strong>|hauteurmax=450</strong>&gt;',
    2728        'explication_timeout' => 'Temps d\'affichage pour chaque image (en millisecondes).<br />&lt;sjcycleXX<strong>|timeout=4000</strong>&gt;',
    2829        'explication_speed' => 'Temps de transition entre chaque image (en millisecondes).<br />&lt;sjcycleXX<strong>|speed=1000</strong>&gt;',
    2930        'explication_backgroundcolor' => 'Une valeur de couleur héxadécimale avec le "#", ex "#C5E41C". La valeur "transparent" rétabli la transparence.',
    3031        'explication_palette' => 'Avec le plugin Palette, commencez par taper le "#" avant de choisir la couleur.<br />&lt;sjcycleXX<strong>|backgroundcolor=#C5E41C</strong>&gt;',
    31         'explication_fx' => '&lt;sjcycleXX<strong>|fx=scrollHorz</strong>&gt;',
     32        'explication_fx' => 'Consultez les exemples en ligne : <a href="http://jquery.malsup.com/cycle2/" target="_blank">Cycle2 Plugin</a>. <br />&lt;sjcycleXX<strong>|fx=scrollHorz</strong>&gt;',
    3233        'explication_next' => 'Cibler un bloc html par sa classe ou son identifiant. Par défaut "<strong>.cycle-next</strong>" place une flèche à droite au survol de l\'image.<br />&lt;sjcycleXX<strong>|next=.cycle-next</strong>&gt;',
    3334        'explication_prev' => 'Cibler un bloc html par sa classe ou son identifiant. Par défaut "<strong>.cycle-prev</strong>" place une flèche gauche au survol de l\'image.<br />&lt;sjcycleXX<strong>|prev=.cycle-prev</strong>&gt;',
     
    3637        'explication_paused' => '&lt;sjcycleXX<strong>|paused=true</strong>&gt; ou &lt;sjcycleXX<strong>|paused=false</strong>&gt;',
    3738        'explication_pager' => 'Cibler un bloc html qui contiendra la pagination en nommant sa classe ou son identifiant css. Par défaut : "<strong>.cycle-pager</strong>". &lt;sjcycleXX<strong>|pager=.cycle-pager</strong>&gt;',
     39        'explication_mediabox'=>'Ouvre l\'image d\'origine suivant <a href=".?exec=configurer_mediabox">vos paramétrages de la mediabox</a>.',
    3840
    3941        // L
     
    4446        'label_captiontemplate' => 'Format de la légende',
    4547        'label_largeurmax' => 'Largeur maximum',
     48        'label_hauteurmax' => 'Hauteur maximum',
    4649        'label_timeout' => 'Affichage',
    4750        'label_speed' => 'Transition',
     
    6770        'label_pager' => 'Pagination',
    6871        'legend_parametres_suplementaires' => 'Paramètres supplémentaires',
     72        'legend_tooltip_box' => 'Paramètres tooltip et mediabox',
    6973       
    7074        // P
  • _plugins_/sjcycle/trunk/modeles/sjcycle.html

    r82610 r82655  
    1414[(#SET{caption,         [(#ENV{caption,         #CONFIG{sjcycle/caption}})]})]
    1515[(#SET{captiontemplate, [(#ENV{captiontemplate, #CONFIG{sjcycle/captiontemplate}})]})]
     16[(#SET{pauseonhovercontent,     [(#ENV{pauseonhovercontent,     #CONFIG{sjcycle/pauseonhovercontent}})]})]
    1617
    1718[(#SET{liens_individuels,       [(#ENV{liens_individuels,       0})]})]
     
    2021[(#SET{style,   [float:(#ENV{align}|match{left|right});#GET{marginfl}:1em;margin-top:0;][background-color:(#GET{backgroundcolor});][max-width:(#GET{largeurmax})px;]    })]
    2122
     23[(#SET{cssbox,  [(#EVAL{8}|randomString)]})]
     24
    2225<B_img>
     26[<style type="text/css">
     27.cycle-paused:after { content:'(#GET{pauseonhovercontent})'; }
     28</style>]
     29<script type="text/javascript">/*<!#EVAL{chr(91)}CDATA#EVAL{chr(91)}*/
     30$(document).ready(function() {
     31        [(#CONFIG{sjcycle/tooltip}|=={oui}|oui)
     32                $('.infobulle').tooltip({
     33                        bodyHandler: function() {
     34                                return $($(this).children(".textinfobulle")).html();
     35                        },
     36                        track: true,
     37                        delay: 0,
     38                        showURL: false,
     39                        opacity: 1,
     40                        fixPNG: true,
     41                        extraClass: "pretty",
     42                        top: -15,
     43                        left: 5
     44                });
     45        ]
     46        [(#CONFIG{sjcycle/mediabox}|=={oui}|oui)
     47                $("a.#GET{cssbox}").mediabox(box_settings);
     48        ]
     49});
    2350
    24 <div class="cycle-slideshow"[ style="(#GET{style})"][(#GET{liens_individuels}|oui)
     51/*#EVAL{chr(93)}[(#EVAL{chr(93)})]>*/</script>
     52<div class="cycle-slideshow"[ style="(#GET{style})"][(#GET{liens_individuels}|oui|ou{#CONFIG{sjcycle/mediabox}|=={oui}|oui})
    2553        data-cycle-slides="a"][
    2654        data-cycle-speed="(#GET{speed})"][
     
    4068        <div class="cycle-caption"></div>]
    4169        <BOUCLE_img(DOCUMENTS){id_article=#ENV{id_sjcycle}}{extension==jpg|png|gif}{id_document==^((#ENV{docs}|replace{',',|}|sinon{.*}))$}{par num titre, date}{doublons}{0,#ENV{limite,100000000}}>[
     70               
     71                 #SET{fermer_a,non}
     72         
     73                [(#REM) Doit-on afficher les infobulles ET y a t'il quelque chose a afficher ?]
     74                #SET{afficher_infobulle,non}
     75                [(#CONFIG{sjcycle/tooltip}|=={oui}|oui)
     76                        [(#SET{texte_infobulle,[<h4>(#TITRE|supprimer_numero)</h4>][(#DESCRIPTIF)<br />]})]
     77                        [(#CONFIG{sjcycle/tooltiptech}|=={oui}|oui)
     78                                [(#SET{texte_infobulle,[(#GET{texte_infobulle}|concat{<strong>Original :</strong> l. #LARGEUR x L. #HAUTEUR pixels, [(#TAILLE|taille_en_octets)]})]})]
     79                        ]
     80                        [(#SET{texte_infobulle,[(#GET{texte_infobulle}|trim)]})]
     81                        [(#GET{texte_infobulle}|strlen|!={0}|oui) #SET{afficher_infobulle,oui}]
     82                ]
     83
     84       
    4285                [(#GET{liens_individuels}|=={article}|oui)
    4386                <a href="#URL_ARTICLE"[ title="(#TITRE)"]>#SET{fermer_a,oui}]
    44                
     87                [(#GET{liens_individuels}|=={rubrique}|oui)
     88                <a href="#URL_RUBRIQUE{#DESCRIPTIF|supprimer_tags}"[ title="(#TITRE)"]>
     89                #SET{fermer_a,oui}]
     90                [(#GET{liens_individuels}|=={externe}|oui)
     91                <a href="[(#DESCRIPTIF|supprimer_tags)]"[ title="(#TITRE)"]>
     92                #SET{fermer_a,oui}]
     93                [(#GET{id_article_a_lier}|oui)
     94                <a href="#URL_ARTICLE{#GET{id_article_a_lier}}" title="#GET{titre_article_a_lier}">
     95                #SET{fermer_a,oui}]
     96                [(#GET{fermer_a}|=={oui}|non|et{#CONFIG{sjcycle/mediabox}|=={oui}|oui})
     97                <a href="[(#URL_DOCUMENT)]" type="#MIME_TYPE"
     98                                                class="#GET{cssbox}"
     99                                                rel="#GET{cssbox}"
     100                                                [(#CONFIG{sjcycle/tooltip}|=={oui}|non) title="[(#TITRE|supprimer_numero|attribut_html)]"]
     101                                                style="display:block;padding:0px;margin:0px;">
     102                #SET{fermer_a,oui}]
     103       
     104                [(#GET{afficher_infobulle}|=={oui}|oui)
     105                        <div class="infobulle">
     106                ]
    45107                        <img class="no_image_filtrer" src="(#FICHIER|image_reduire{#GET{largeurmax},#GET{hauteurmax}}|image_recadre{#GET{largeurmax},#GET{hauteurmax},top center,#GET{backgroundcolor}}|extraire_attribut{src})"[ alt="(#TITRE)"] />
    46108               
     109                [(#GET{afficher_infobulle}|=={oui}|oui)
     110                <div class="textinfobulle" style="display:none;text-align:left;">#GET{texte_infobulle}</div>
     111                </div> <!-- .infobulle -->
     112                ]
    47113                [(#GET{fermer_a}|=={oui}|oui)</a>]
     114                       
     115               
    48116        ]</BOUCLE_img>
    49117</div>
  • _plugins_/sjcycle/trunk/paquet.xml

    r82436 r82655  
    22        prefix="sjcycle"
    33        categorie="multimedia"
    4         version="3.0.1"
     4        version="3.0.2"
    55        etat="dev"
    66        compatibilite="[3.0.0;3.1.*]"
  • _plugins_/sjcycle/trunk/sjcycle_pipelines.php

    r82430 r82655  
    66
    77function sjcycle_insert_head_css($flux){
     8        $conf_sjcycle = lire_config('sjcycle');
     9
     10        if($conf_sjcycle['tooltip']) {
     11                $flux .="\n".'<link rel="stylesheet" href="'.find_in_path('lib/jquery.tooltip.css').'" type="text/css" media="all" />';
     12        }
    813        $flux .= "\n".'<link rel="stylesheet" type="text/css" href="'.find_in_path('css/sjcycle.css').'" media="all" />'."\n";
    914        return $flux;
     
    1116
    1217function sjcycle_insert_head($flux){
     18        $conf_sjcycle = lire_config('sjcycle');
    1319
    1420        $flux .="\n".'<script src="'.find_in_path('lib/jquery.cycle2.js').'" type="text/javascript"></script>';
     
    1824        $flux .="\n".'<script src="'.find_in_path('lib/jquery.cycle2.shuffle.js').'" type="text/javascript"></script>';
    1925        $flux .="\n".'<script src="'.find_in_path('lib/jquery.cycle2.tile.js').'" type="text/javascript"></script>';
     26        if($conf_sjcycle['tooltip']) {
     27                $flux .="\n".'<script src="'.find_in_path('lib/jquery.tooltip.js').'" type="text/javascript" charset="utf-8"></script>';
     28        }
    2029       
    2130        return $flux;
Note: See TracChangeset for help on using the changeset viewer.