Changeset 95190 in spip-zone


Ignore:
Timestamp:
Feb 18, 2016, 3:12:14 PM (4 years ago)
Author:
jcvilleneuve@…
Message:

EscalV3 : modification complète du javascript pour les objets défilants et adaptation des noisettes concernées pour un défilement plus propre + traitement json

Location:
_squelettes_/escal/branche_V3
Files:
1 added
1 deleted
11 edited

Legend:

Unmodified
Added
Removed
  • _squelettes_/escal/branche_V3/config.css.html

    r94754 r95190  
    118118]
    119119
    120 #scrollup3 {
     120#annonces-defilantes {
    121121        height: [(#CONFIG{escal/config/hauteurannoncedefil,210})]px;
    122122}
     
    128128/***********************/
    129129
    130 #scrollup2 {
     130#photos-defilantes {
    131131        height: [(#CONFIG{escal/config/largeurimagenoisettes,170})]px;
    132132  width: #CONFIG{escal/config/largeurimagenoisettes,170}px;
    133133  margin: auto;
    134134}
    135 .headline2 {
     135.une-photo-defilante {
     136        top: [(#CONFIG{escal/config/largeurimagenoisettes,170})]px;
     137  height: [(#CONFIG{escal/config/largeurimagenoisettes,170})]px;
     138}
     139/* noisette inc-sites_favoris */
     140/***********************/
     141
     142#sites-defilants {
     143        height: [(#CONFIG{escal/config/largeurimagenoisettes,170})]px;
     144  width: #CONFIG{escal/config/largeurimagenoisettes,170}px;
     145  margin: auto;
     146}
     147.un-site-defilant {
    136148        top: [(#CONFIG{escal/config/largeurimagenoisettes,170})]px;
    137149  height: [(#CONFIG{escal/config/largeurimagenoisettes,170})]px;
     
    324336
    325337/* orange */
    326 .annonce,.annoncedefil, .headline3, .calendar_mini_event, .spip_surligne {
     338.annonce,.annoncedefil, .une-annonce-defilante, .calendar_mini_event, .spip_surligne {
    327339        background-color: [(#CONFIG{escal/config/couleur10,#EC7942})];
    328340  color:  [(#CONFIG{escal/config/couleur10}|?{#[(#CONFIG{escal/config/couleur10}|couleur_extreme|couleur_inverser)],#FFFFFF})];
     
    429441  border-radius: [(#CONFIG{escal/config/arrondi5,10px})];
    430442}
    431 .annonce, .annoncedefil, .headline3 {
     443.annonce, .annoncedefil, .une-annonce-defilante {
    432444  border-radius: [(#CONFIG{escal/config/arrondi6,15px})];
    433445}
  • _squelettes_/escal/branche_V3/escal_fonctions.php

    r93495 r95190  
    643643}
    644644
    645 
     645// =======================================================================================================================================
     646// traitement json
     647// =======================================================================================================================================
     648
     649if (!function_exists('json_decode')) {
     650    function json_decode($content, $assoc=false) {
     651        require_once 'classes/JSON.php';
     652        if ($assoc) {
     653            $json = new Services_JSON(SERVICES_JSON_LOOSE_TYPE);
     654        }
     655        else {
     656            $json = new Services_JSON;
     657        }
     658        return $json->decode($content);
     659    }
     660}
     661 
     662if (!function_exists('json_encode')) {
     663    function json_encode($content) {
     664        require_once 'classes/JSON.php';
     665        $json = new Services_JSON;
     666        return $json->encode($content);
     667    }
     668}
    646669?>
  • _squelettes_/escal/branche_V3/inclusions/inc-actus.html

    r87910 r95190  
     1<script>
     2// Il faut instancier un objet Rotative pour assurer la rotation des actus
     3$(document).ready(
     4  function()
     5  {
     6    new Rotative
     7    (
     8      {
     9        container : "#actus-defilantes",
     10        element   : "div.une-actu-defilante",
     11        tempo     : [(#CONFIG{escal/config/tempoactus, 5})]
     12      }
     13    )
     14  }
     15) ;
     16</script>
     17
    118<BOUCLE_selection(ARTICLES){titre_mot=actus}{lang}{date_redac=0000-00-00 00:00:00}{doublons actus}>
    219</BOUCLE_selection>
     
    2542<div class="texte actus [(#CONFIG{escal/config/toggleactus}|=={oui}|oui)toggle]" >
    2643
    27  <div id="scrollup">
     44 <div id="actus-defilantes">
    2845  <BOUCLE_actus(ARTICLES){!doublons actus}{par num titre}>
    29   <div class="headline" >
     46  <div class="une-actu-defilante" >
    3047  <a href="[(#URL_ARTICLE|parametre_url{lang,#ENV{lang}})]">#TITRE</a>
    3148  <div class="intro">
  • _squelettes_/escal/branche_V3/inclusions/inc-annonce_defilant.html

    r89309 r95190  
    11[(#REM)
    2   D'après la noisette inc-annonce_defilant.html de J.-C. Villeneuve dans le
    3   squelette Escal v3.79.30.
     2  D'après la noisette inc-annonce_defilant.html de J.-C. Villeneuve dans le squelette Escal
    43
    54  Nom de la noisette : inc-annonce_defilant.html
     
    1514
    1615<BOUCLE_test(ARTICLES){titre_mot=annonce-defilant}{lang}>
     16  [(#REM) Rien à faire s'il n'y a pas d'article "annonce-defilant"]
    1717</BOUCLE_test>
    18  
    19 <div id="scrollup3">
     18  [(#REM) Traitement des articles "annonce-defilant"]
     19
     20
     21<script>
     22// Il faut instancier un objet Rotative pour assurer la rotation des articles
     23$(document).ready(
     24  function()
     25  {
     26    new Rotative
     27    (
     28      {
     29        container : "#annonces-defilantes",
     30        element   : "div.une-annonce-defilante",
     31        tempo     : [(#CONFIG{escal/config/tempoannoncedefil, 8})]
     32      }
     33    )
     34  }
     35) ;
     36</script>
     37
     38
     39<div id="annonces-defilantes">
    2040<!-- affichage par défaut selon le numéro du titre -->
    2141  <BOUCLE_annoncedefaut1(ARTICLES){si #CONFIG{escal/config/ordreannonces}|non}{titre_mot=annonce-defilant}{lang}{par num titre}{0,n}>
     
    3050<!-- affichage selon la date --> 
    3151  <BOUCLE_annonce3(ARTICLES){si #CONFIG{escal/config/ordreannonces}|=={date}|oui}{titre_mot=annonce-defilant}{lang}{par date}{0,n}>
    32     [(#INCLURE{fond=inclusions/inc-annonce_defilant_article}{id_article}{compteur=#COMPTEUR_BOUCLE}{total=#TOTAL_BOUCLE})]
     52  [(#INCLURE{fond=inclusions/inc-annonce_defilant_article}{id_article}{compteur=#COMPTEUR_BOUCLE}{total=#TOTAL_BOUCLE})]
    3353  </BOUCLE_annonce3> 
    3454
     
    3757    [(#INCLURE{fond=inclusions/inc-annonce_defilant_article}{id_article}{compteur=#COMPTEUR_BOUCLE}{total=#TOTAL_BOUCLE})]
    3858  </BOUCLE_annonce5>     
    39 
    4059
    4160<!-- affichage par hasard --> 
  • _squelettes_/escal/branche_V3/inclusions/inc-annonce_defilant_article.html

    r95150 r95190  
    1616
    1717<BOUCLE_inc_annonce_defilant_article(ARTICLES){id_article}>
    18   <div class="headline3" >
     18  <div class="une-annonce-defilante" >
    1919    <div class="annoncedefil">
    2020      [(#CONFIG{escal/config/affichecompteur}|=={non}|non)
  • _squelettes_/escal/branche_V3/inclusions/inc-head.html

    r90854 r95190  
    5757  <script src="#CHEMIN{scripts/bloc_depliant2.js}" type="text/javascript"></script>
    5858[(#REM) pour effet de rotation des blocs defilants ]
    59 <script src="#URL_PAGE{rotative_js}" type="text/javascript"></script>
     59<script src="#CHEMIN{scripts/Rotative.js}" type="text/javascript"></script>
    6060[(#REM) pour le menu sur mobiles ]
    6161<script src="#CHEMIN{scripts/modernizr.min.js}" type="text/javascript"></script>
  • _squelettes_/escal/branche_V3/inclusions/inc-perso.html

    r92590 r95190  
     1<script>
     2// Il faut instancier un objet Rotative pour assurer la rotation des actus
     3$(document).ready(
     4  function()
     5  {
     6    new Rotative
     7    (
     8      {
     9        container : "#articles-defilants",
     10        element   : "div.un-article-defilant",
     11        tempo     : [(#CONFIG{escal/config/tempoactus, 5})]
     12      }
     13    )
     14  }
     15) ;
     16</script>
     17
    118        <h1 class="cadre perso">
    219        [(#CONFIG{escal/config/titreperso}|oui)
     
    86103 
    87104  <B_perso4>
    88         <div id="scrollup5">
     105        <div id="articles-defilants">
    89106  <BOUCLE_perso4(ARTICLES){si #CONFIG{escal/config/choixperso}|=={listedefilante}|oui}{!doublons special}{lang}{tri #CONFIG{escal/config/ordreperso},#GET{defaut_tri}}>
    90   <div class="headline5" >
     107  <div class="un-article-defilant" >
    91108  <a href="[(#URL_ARTICLE|parametre_url{lang,#ENV{lang}})] [title="(#DESCRIPTIF|textebrut|entites_html)"]">#TITRE</a>
    92109  <div class="intro">
  • _squelettes_/escal/branche_V3/inclusions/inc-photos.html

    r92590 r95190  
     1<script>
     2// Il faut instancier un objet Rotative pour assurer la rotation des photos
     3$(document).ready(
     4  function()
     5  {
     6    new Rotative
     7    (
     8      {
     9        container : "#photos-defilantes",
     10        element   : "div.une-photo-defilante",
     11        tempo     : [(#CONFIG{escal/config/tempophotos, 8})]
     12      }
     13    )
     14  }
     15) ;
     16</script>
     17
    118
    219<!-- on selectionne les articles avec le mot-cle photo-une et on stocke dans doublons photos -->
     
    1835        <div class="texte photos [(#CONFIG{escal/config/togglephotos}|=={oui}|oui)toggle]">
    1936#SET{nombrephotos,#CONFIG{escal/config/nombrephotos,5}}
    20   <div id="scrollup2">
     37  <div id="photos-defilantes">
    2138
    2239      <BOUCLE_photo_une(DOCUMENTS){!doublons photos}{par hasard}{0,#GET{nombrephotos}}>
    23       <div class="headline2">
     40      <div class="une-photo-defilante">
    2441     
    2542<BOUCLE_titre_article(ARTICLES){id_document}{0,1}>
  • _squelettes_/escal/branche_V3/inclusions/inc-sites_favoris.html

    r95148 r95190  
     1<script>
     2// Il faut instancier un objet Rotative pour assurer la rotation des vignettes
     3$(document).ready(
     4  function()
     5  {
     6    new Rotative
     7    (
     8      {
     9        container : "#sites-defilants",
     10        element   : "div.un-site-defilant",
     11        tempo     : [(#CONFIG{escal/config/tempophotos, 8})]
     12      }
     13    )
     14  }
     15) ;
     16</script>
     17
    118        <h1 class="cadre sites-favoris">
    219        [(#CONFIG{escal/config/titresitesfav}|oui)
     
    1027        <div class="texte sites-favoris [(#CONFIG{escal/config/togglesitesfav}|=={oui}|oui)toggle]">
    1128#SET{nbrsitesfav,#CONFIG{escal/config/nombresitesfav,10}}
    12   <div id="scrollup4">
     29  <div id="sites-defilants">
    1330<!-- affichage si aucun site -->
    1431      <BOUCLE_sites_favoris0(SITES){titre_mot=favori}{0,1}>   
     
    1936<!-- affichage par défaut : par hasard -->
    2037      <BOUCLE_sites_favoris_defaut(SITES){si #CONFIG{escal/config/ordresitesfav}|non}{titre_mot=favori}{0,#GET{nbrsitesfav}}{par hasard}>
    21       <div class="headline4">
     38      <div class="un-site-defilant">
    2239        <a href="#URL_SITE" class="spip_out" [ title="Visiter (#NOM_SITE|couper{80}|attribut_html)"]>
    2340          <span class="titre-site">#NOM_SITE</span><br />
     
    2845<!-- affichage par hasard -->
    2946      <BOUCLE_sites_favoris1(SITES){si #CONFIG{escal/config/ordresitesfav}|=={hasard}|oui}{titre_mot=favori}{0,#GET{nbrsitesfav}}{par hasard}>
    30       <div class="headline4">
     47      <div class="un-site-defilant">
    3148        <a href="#URL_SITE" class="spip_out" [ title="Visiter (#NOM_SITE|couper{80}|attribut_html)"]>
    3249          <span class="titre-site">#NOM_SITE</span><br />
     
    3754<!-- affichage par date -->
    3855      <BOUCLE_sites_favoris2(SITES){si #CONFIG{escal/config/ordresitesfav}|=={date}|oui}{titre_mot=favori}{0,#GET{nbrsitesfav}}{par date}>
    39       <div class="headline4">
     56      <div class="un-site-defilant">
    4057        <a href="#URL_SITE" class="spip_out" [ title="Visiter (#NOM_SITE|couper{80}|attribut_html)"]>
    4158          <span class="titre-site">#NOM_SITE</span><br />
     
    4663<!-- affichage par date inverse -->     
    4764      <BOUCLE_sites_favoris3(SITES){si #CONFIG{escal/config/ordresitesfav}|=={dateinverse}|oui}{titre_mot=favori}{0,#GET{nbrsitesfav}}{par date}{inverse}>
    48       <div class="headline4">
     65      <div class="un-site-defilant">
    4966        <a href="#URL_SITE" class="spip_out" [ title="Visiter (#NOM_SITE|couper{80}|attribut_html)"]>
    5067          <span class="titre-site">#NOM_SITE</span><br />
  • _squelettes_/escal/branche_V3/paquet.xml

    r95150 r95190  
    22    prefix="escal"
    33    categorie="squelette"
    4     version="3.84.16"
     4    version="3.84.17"
    55    schema="1.0.7"
    66    etat="stable"
  • _squelettes_/escal/branche_V3/styles/general.css

    r95137 r95190  
    586586/* noisette inc-actus */
    587587/**********************/
    588 #scrollup {
     588#actus-defilantes {
    589589        position: relative;
    590590        overflow: hidden;
     
    592592        margin: 0 5px;
    593593}
    594 .headline {
     594.une-actu-defilante {
    595595        position: absolute;
    596596        font-size: 1.2rem;
    597597        font-weight: bold;
    598         top: 103px;
     598        top: 500px;
    599599}
    600600.intro {
    601601        font-size: 1rem;
    602602        font-weight: normal;
    603 }
    604 /* noisette inc-photos */
    605 /***********************/
    606 #scrollup2 {
    607         position: relative;
    608         overflow: hidden;
    609         margin: auto;
    610 }
    611 .headline2 {
    612         position: absolute;
    613         width: 100%;
    614         margin: auto;
    615         text-align: center;
    616603}
    617604/* noisette inc-documents_article */
     
    646633/* encart annonce defilant */
    647634/***************************/
    648 #scrollup3 {
     635#annonces-defilantes {
    649636        position: relative;
    650637        overflow: hidden;
     
    652639        margin-bottom: 20px;
    653640}
    654 .headline3 {
     641.une-annonce-defilante {
    655642        position: absolute;
    656643        width: 100%;
     644        top: 500px;
    657645}
    658646.annoncedefil {
     
    694682    margin-left: 10px
    695683}
     684/* noisette inc-photos */
     685/***********************/
     686#photos-defilantes {
     687        position: relative;
     688        overflow: hidden;
     689        margin: auto;
     690}
     691.une-photo-defilante{
     692        position: absolute;
     693        width: 100%;
     694        margin: auto;
     695        text-align: center;
     696        top: 500px;
     697}
    696698/* noisette inc-sites_favoris */
    697699/******************************/
    698 #scrollup4 {
     700#sites-defilants {
    699701        position: relative;
    700702        overflow: hidden;
    701         height: 140px;
    702703        margin: auto;
    703         width: 170px;
    704 }
    705 .headline4 {
     704}
     705.un-site-defilant {
    706706        position: absolute;
    707         top: 140px;
    708 }
    709 .headline4 img {
    710         width: 100%;
    711 }
    712 .headline4 a.spip_out {
     707        width: 100%;
     708        margin: auto;
     709        text-align: center;
     710        top: 500px;
     711}
     712.un-site-defilant img.spip_logos {
     713        float: none;
     714}
     715.un-site-defilant a.spip_out {
    713716        background: none;
    714717        padding: 0;
     
    716719/* noisette inc-perso */
    717720/**********************/
    718 #scrollup5 {
     721#articles-defilants {
    719722        position: relative;
    720723        overflow: hidden;
    721724        height: 100px;
    722725}
    723 .headline5 {
     726.un-article-defilant {
    724727        position: absolute;
    725728        font-size: 1.2rem;
    726729        font-weight: bold;
    727         top: 103px;
     730        top: 500px;
    728731}
    729732
Note: See TracChangeset for help on using the changeset viewer.