source: plugins_spip/terraeco_infographie/trunk/infographie.html @ 8042

Last change on this file since 8042 was 8042, checked in by kent1, 6 years ago

On ajoute jquery.mobile.custom.js pour gérer les swipe sur tablette

File size: 9.4 KB
Line 
1<BOUCLE_principale(INFOGRAPHIES) {id_infographie}>
2<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
3[(#REM) Cf.: http://paulirish.com/2008/conditional-stylesheets-vs-css-hacks-answer-neither/
4]<!--[if lt IE 7 ]> <html dir="#LANG_DIR" lang="#LANG" xmlns="http://www.w3.org/1999/xhtml" xml:lang="#LANG" class="[(#LANG_DIR)][ (#LANG)] no-js ie ie6"> <![endif]-->
5<!--[if IE 7 ]> <html dir="#LANG_DIR" lang="#LANG" xmlns="http://www.w3.org/1999/xhtml" xml:lang="#LANG" class="[(#LANG_DIR)][ (#LANG)] no-js ie ie7"> <![endif]-->
6<!--[if IE 8 ]> <html dir="#LANG_DIR" lang="#LANG" xmlns="http://www.w3.org/1999/xhtml" xml:lang="#LANG" class="[(#LANG_DIR)][ (#LANG)] no-js ie ie8"> <![endif]-->
7<!--[if IE 9 ]> <html dir="#LANG_DIR" lang="#LANG" xmlns="http://www.w3.org/1999/xhtml" xml:lang="#LANG" class="[(#LANG_DIR)][ (#LANG)] no-js ie ie9"> <![endif]-->
8<!--[if (gt IE 9)|!(IE)]><!--> <html dir="#LANG_DIR" lang="#LANG" xmlns="http://www.w3.org/1999/xhtml" xml:lang="#LANG" class="[(#LANG_DIR)][ (#LANG)] no-js"> <!--<![endif]-->
9<head>
10<script type='text/javascript'>/*<![CDATA[*/(function(H){H.className=H.className.replace(/\bno-js\b/,'js')})(document.documentElement);/*]]>*/</script>
11<title>[(#TITRE|couper{80}|textebrut) - ][(#NOM_SITE_SPIP|textebrut)]</title>
12[<meta name="description" content="(#INTRODUCTION{150}|attribut_html)" />]
13[<link rel="canonical" href="(#URL_INFOGRAPHIE|url_absolue)" />]
14[<link rel="stylesheet" href="(#CHEMIN{css/reset.css}|direction_css)" type="text/css" />]
15<link href='http://fonts.googleapis.com/css?family=Lato:300,700' rel='stylesheet' type='text/css'>
16[<link rel="stylesheet" href="(#CHEMIN{css/infographie.css}|direction_css)" type="text/css" />]
17<style type="text/css">
18        path.area.perspective1_haute,path.area.perspective2_haute{
19                fill: url( #gradient_perspective1 );
20        }
21</style>
22[<script type="text/javascript" src="(#CHEMIN{javascript/d3.min.js})"></script>]
23#INSERT_HEAD
24[<script type="text/javascript" src="(#CHEMIN{javascript/jquery.mousewheel.js})"></script>]
25[<script type="text/javascript" src="(#CHEMIN{javascript/jquery.mobile.custom.js})"></script>]
26<BOUCLE_donnees(INFOGRAPHIES_DATAS){id_infographies_data=#ENV{donnees}}>
27[<script type="text/javascript" src="(#PRODUIRE{fond=infographie_lang.js,id_infographies_data=#ENV{donnees},lang=#ENV{lang}})"></script>]
28<script type="text/javascript">
29[(#SET{image_demain,[(#CHEMIN{images/demain_[(#CSS_CLASS)_[(#ENV{lang})].png]}|sinon{[(#CHEMIN{images/demain_[(#CSS_CLASS).png]})]}|balise_img)]})][
30(#SET{image_naissance,[(#CHEMIN{images/naissance_[(#CSS_CLASS)_[(#ENV{lang})].png]}|sinon{[(#CHEMIN{images/naissance_[(#CSS_CLASS).png]})]}|balise_img)]})][
31(#SET{image_depart,[(#CHEMIN{images/depart_[(#CSS_CLASS).png]}|balise_img)]})][
32(#SET{image_aujd,[(#CHEMIN{images/aujourdhui_[(#CSS_CLASS)_[(#ENV{lang})].png]}|sinon{[(#CHEMIN{images/aujourdhui_[(#CSS_CLASS).png]})]}|balise_img)]})
33]       var container_id='graph1',infobox_class='infobox',jeu_donnees = #ENV{donnees,1},
34                draw_perspectives_1_fichiers = ['#CHEMIN{csv/perspective_temp_rcp85_original.csv}','#CHEMIN{csv/perspective_temp_rcp26_original.csv}'],
35                draw_perspectives_2_fichiers = ['#CHEMIN{csv/perspective_co2_rcp85_original.csv}','#CHEMIN{csv/perspective_co2_rcp3_original.csv}'],
36                image_demain = {url:"[(#GET{image_demain}|extraire_attribut{src})]",width:[(#GET{image_demain}|extraire_attribut{width})],height:[(#GET{image_demain}|extraire_attribut{height})]},
37                image_naissance = {url:"[(#GET{image_naissance}|extraire_attribut{src})]",width:[(#GET{image_naissance}|extraire_attribut{width})],height:[(#GET{image_naissance}|extraire_attribut{height})]},
38                image_depart = {url:"[(#GET{image_depart}|extraire_attribut{src})]",width:[(#GET{image_depart}|extraire_attribut{width})],height:[(#GET{image_depart}|extraire_attribut{height})]},
39                image_aujd = {url:"[(#GET{image_aujd}|extraire_attribut{src})]",width:[(#GET{image_aujd}|extraire_attribut{width})],height:[(#GET{image_aujd}|extraire_attribut{height})]},
40                date_origine = date_actuelle = [(#ENV{naissance,#GET{naissance_min}}|<{#GET{naissance_min}}|?{#GET{naissance_min},#ENV{naissance}}|intval)],
41                date_naissance = [(#ENV{naissance}|intval)],
42                date_aujourdhui = [(#ENV{date}|annee)];
43</script>
44[<script type="text/javascript" src="(#CHEMIN{javascript/infographie.js})"></script>]
45</BOUCLE_donnees>
46<script type="text/javascript">
47        jQuery(document).ready(function(){
48                jQuery('a.spip_out').click(function(){
49                        jQuery(this).attr('target','_blank');
50                });
51        });
52</script>
53</head>
54
55<body class="pas_surlignable page_infographie">
56<div class="page">
57       
58        <div class="main infographie[ (#INFO_CSS_CLASS{infographies_data,#ENV{donnees}})]">
59                <div class="wrapper hfeed">
60                <div class="content hentry" id="content">
61                        <div class="cartouche">
62                                <h1 class="#EDIT{titre} surlignable">[(#LOGO_ARTICLE_RUBRIQUE|image_reduire{40,*}) ]#TITRE</h1>
63                        </div>
64                        <div class="menu_top">
65                                <a href="[(#SELF|parametre_url{naissance,''}|parametre_url{donnees,''})]" title="<:terraeco:title_lien_home|attribut_html:>" class="lien_home"></a>
66                                <a href="http://www.terraeco.net" title="<:terraeco:title_lien_terraeco|attribut_html:>" class="spip_out lien_terraeco"></a>
67                                <a href="[(#VAL{http://www.twitter.com/share}|parametre_url{text,[(#TITRE|replace{'<br />',' '}|strip_tags)]}|parametre_url{url,[(#URL_INFOGRAPHIE|url_absolue)]})]" title="<:terraeco:title_lien_twitter|attribut_html:>" class="spip_out lien_twitter"></a>
68                                <a href="[(#VAL{http://www.facebook.com/sharer/sharer.php}|parametre_url{t,[(#TITRE|replace{'<br />',' '}|strip_tags)]}|parametre_url{u,[(#URL_INFOGRAPHIE|url_absolue)]})]" title="<:terraeco:title_lien_facebook|attribut_html:>" class="spip_out lien_facebook"></a>
69                        </div>
70                        <BOUCLE_si_pas_naissance(CONDITION){si #ENV{naissance}|non|ou{#ENV{naissance}|<{1900}}|ou{#ENV{naissance}|>{2010}}|oui}>
71                        <div class="formulaire_spip[(#ENV{naissance}|strlen|et{#ENV{naissance}|<{1900}|ou{#ENV{naissance}|>{2010}}}|oui)erreur #SET{erreur_naissance,oui}]">
72                                <form  action="[(#SELF)]" method="get">
73                                        [(#SELF|form_hidden)]
74                                        <div class="champ">
75                                                <label for="naissance"><:terraeco:label_naissance:></label>
76                                                [(#GET{erreur_naissance}|=={oui}|oui)<span class="message_erreur"><:terraeco:erreur_naissance{naissance=#ENV{naissance}}:></span>]
77                                                <input type="text" class="texte" id="naissance" name="naissance" maxlength="4" size="4" value="#ENV{naissance,''}" />
78                                        </div>
79                                        <div class="boutons">
80                                                <input type="submit" class="submit" id="submit" value="OK" />
81                                        </div>
82                                </form>
83                        </div>
84                        </BOUCLE_si_pas_naissance>
85                        </B_si_pas_naissance>
86                        <BOUCLE_si_naissance_1951(CONDITION){si#ENV{naissance}|<{1951}|et{#ENV{donnees}|ou{#ENV{avt_naissance}}|non}|oui}>
87                        <div class="formulaire_spip">
88                                <form  action="[(#SELF)]" method="get">
89                                        [(#SELF|form_hidden)]
90                                        <input type="hidden" name="avt_naissance" value="oui" />
91                                        <div class="champ">#SET{nb,#ENV{naissance}|moins{1951}|replace{'-',''}}
92                                        [<p>(#GET{nb}|singulier_ou_pluriel{terraeco:texte_1951_singulier,terraeco:texte_1951})</p>]
93                                        </div>
94                                        <div class="boutons">
95                                                <input type="submit" class="submit" id="submit" value="OK" />
96                                        </div>
97                                </form>
98                        </div>
99                        </BOUCLE_si_naissance_1951>
100                        </B_si_naissance_1951>
101                        <BOUCLE_jeu_selectionne(INFOGRAPHIES_DATAS){id_infographies_data=#ENV{donnees}}>
102                        <div class="infographie[ (#CSS_CLASS)]">
103                                <div class="description_donnees">
104                                        [<h3 class="#EDIT{titre}">(#TITRE)</h3>][
105                                        <div class="texte[ (#EDIT{texte})]">
106                                                (#TEXTE)
107                                        </div>][
108                                        <div class="credits[ (#EDIT{credits})]">
109                                                (#CREDITS)
110                                        </div>]
111                                </div>
112                                <B_infographies_logo>
113                                <div class="infographies_logo">
114                                <BOUCLE_infographies_logo(INFOGRAPHIES_DATAS spip_infographies_datas_liens){objet=infographie}{id_objet=#ID_INFOGRAPHIE}>
115                                <a href="[(#SELF|parametre_url{donnees,#ID_INFOGRAPHIES_DATA})]" title="[(#TITRE|attribut_html)]"[(#ID_INFOGRAPHIES_DATA|=={#ENV{donnees}}|oui)class="on"]>[(#ID_INFOGRAPHIES_DATA|=={#ENV{donnees}}|?{[(#LOGO_INFOGRAPHIES_DATA_SURVOL|image_reduire{100,100})],[(#LOGO_INFOGRAPHIES_DATA|image_reduire{100,100})]})</a>]
116                                </BOUCLE_infographies_logo>
117                                </div>
118                                </B_infographies_logo>
119                                <BOUCLE_naissance_min(INFOGRAPHIES_DONNEES){id_infographies_data}{par axe_x}{0,1}>
120                                #SET{naissance_min,#AXE_X}
121                                </BOUCLE_naissance_min>
122                                <div id="graph1" class="aGraph" style="position:relative;width:100%;height:500px"></div>
123                                <script type="text/javascript">
124                                        jQuery(document).ready(function(){
125                                                climat_load_datas("[(#PRODUIRE{fond=infographies_data.json,id_infographies_data=#ID_INFOGRAPHIES_DATA,lang=#ENV{lang}})]");
126                                        });
127                                </script>
128                        </div>
129                        [<div class="logo_terraeco">
130                                <a href="http://www.terraeco.net" class="spip_out" target="_blank">(#CHEMIN{images/logo_terraeco_normal.jpg}|image_reduire{100,20})</a>
131                        </div>]
132                        </BOUCLE_jeu_selectionne>
133                        </B_jeu_selectionne>
134                        <B_jeux>
135                        <div class="texte">#TEXTE</div>
136                        <div class="liste_infographies">
137                        <BOUCLE_jeux(INFOGRAPHIES_DATAS spip_infographies_datas_liens){objet=infographie}{id_objet=#ID_INFOGRAPHIE}>
138                        <a href="[(#SELF|parametre_url{donnees,#ID_INFOGRAPHIES_DATA})]">[(#LOGO_INFOGRAPHIES_DATA|image_reduire{250,250})]</a>
139                        </BOUCLE_jeux>
140                        </div>
141                        </B_jeux>
142                        <//B_jeu_selectionne>
143                        <//B_si_naissance_1951>
144                        <//B_si_pas_naissance>
145                </div>
146                </div>
147        </div>
148        [(#ENV{donnees}|non)[<footer class="footer clearfix #EDIT{credits}">
149                (#CREDITS|image_reduire{100,100})
150        </footer>]]
151</div>
152</body>
153</html>
154</BOUCLE_principale>
Note: See TracBrowser for help on using the repository browser.