source: spip-zone/_plugins_/rainette/trunk/demo/rainette.html @ 96102

Last change on this file since 96102 was 96102, checked in by eric@…, 4 years ago

Correction de la page de démo pour les infos et les conditions.
File size: 8.7 KB
Line 
1#CACHE{1800}
2<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML Basic 1.1//EN"
3        "http://www.w3.org/TR/xhtml-basic/xhtml-basic11.dtd">
4<html xml:lang="#LANG" lang="#LANG" xmlns="http://www.w3.org/1999/xhtml">
5<head>
6        <meta http-equiv='Content-Type' content='text/html; charset=#CHARSET' />
7        <title>Rainette - Demo</title>
8        <style type="text/css">
9                /* Layout Gala 24 */
10                html,body{margin:0;padding:0}
11                body{font: 76% arial,sans-serif}
12                p{margin:0 10px 10px}
13                a{display:block;color: #981793;padding:10px}
14                div#header h1{height:80px;line-height:80px;margin:0;
15                  padding-left:10px;background: #EEE;color: #79B30B}
16                div#content p{line-height:1.4}
17                div#navigation{background:#B9CAFF}
18                div#extra{background:#FF8539}
19                div#footer{background: #333;color: #FFF}
20                div#footer p{margin:0;padding:5px 10px}
21                div#wrapper{float:right;width:100%;margin-left:-200px}
22                div#content{margin-left:200px;}
23                div#navigation{float:left;width:200px}
24                div#extra{float:left;clear:left;width:200px}
25                div#footer{clear:both;width:100%}
26                /* Personnalisation pour la demo */
27                a.spip-admin-boutons {display: inline;}
28                div#header h1{color:#798F74}
29                div#content{padding-left:2em;padding-bottom:4em;}
30                div#extra{background:#fff;}
31                div#footer{padding:2em;}
32                .h2{text-align:center;border-bottom:2px solid #798F74;color:#798F74}
33                table{border:1px solid #000000;border-collapse:collapse;}
34                caption {background:#333;color:#eee;}
35                th {font-weight: bold;border-bottom:1px solid #000}
36                thead th {background: #DDD;}
37                th,td,caption {padding: 0.75em;border-right:1px solid #000;}
38                tbody tr:nth-child(even) th,
39                tbody tr:nth-child(even) td,
40                tbody tr.even th,
41                tbody tr.even td {background: #EEE;}
42                tbody tr td.erreur {background: #FBE3E4;}
43                tbody tr td.nonapi {background: #FFF6BF;}
44                .clearfix:after{content:"\0020";display:block;height:0;clear:both;visibility:hidden;overflow:hidden;}
45                div.clearfix{margin-bottom:30px; display: block; clear: both;}
46                div.notice{padding:1em;color: #514721;border:2px solid #FFD324;background-color:#FFF6BF;}
47                .menu{background-color:#fefefe;margin-bottom:2em;padding:0;}
48                .menu .h2{border:0;color:#000;}
49                .menu .menu-items{margin-bottom: 0;}
50                .menu-items {border-bottom:0 none;border-top: 1px solid #EEEEEE;list-style: none outside none;margin: 0 0 1.5em;padding: 0;}
51                .menu-items .item {border-bottom: 1px solid #EEEEEE;clear: both;list-style: square outside none;margin-left: 0;overflow: hidden;padding: 0.75em 0;}
52                .menu-items .item:hover {background-color: #EEEEEE;}
53                .menu-items .item a {text-decoration:none;padding:0 0 0 1em;}
54                .menu-items .item a:hover {text-decoration:underline;}
55                .menu-items .item .on {padding:0 0 0 1em;}
56        </style>
57        #INSERT_HEAD
58</head>
59
60#SET{service, #ENV{service, weather}}
61#SET{mode, #ENV{mode, conditions}}
62#SET{jeu, #ARRAY{
63                        'weather', 'FRXX0076',
64                        'owm', 'Paris,Fr',
65                        'wwo', 'Paris,France',
66                        'wunderground', 'Paris,France'}}
67#SET{lieu, #ENV{ville, #GET{jeu/#GET{service}}}}
68
69<body>
70        <div id="container">
71        <div id="header">
72                <h1>
73                        <img height="48" width="48" title="Plugin Rainette" alt="Plugin Rainette" src="#CHEMIN{rainette-64.png}"/>
74                        PLUGIN RAINETTE[ ((#PLUGIN{RAINETTE, version}))]
75                </h1>
76        </div>
77        <div id="wrapper">
78                <div id="content">
79                        <h2 class="h2">1.1 - UTILISATIONS DES INFORMATIONS METEO</h2>
80                        <a name="infos" href="#"></a>
81                        <div class="clearfix">
82                                <div class="clearfix">
83                                        <h3>Utilisation du mod&eacute;le <strong>rainette_infos</strong></h3>
84                                        [(#MODELE{rainette_infos,lieu=#GET{lieu},sous_modele=infos_ville, service=#GET{service}})]
85                                        [<div class="clearfix">
86                                                <h3>Affichage debug du tableau des informations</h3>
87                                                (#GET{lieu}|rainette_dbg_afficher_cache{infos, 0, #GET{service}})
88                                        </div>]
89                                </div>
90                                <div class="clearfix">
91                                        <h3>Utilisation de la balise <strong>RAINETTE_INFOS</strong></h3>
92                                        <ul>
93                                                <li>Ville observ&eacute;e:&nbsp;[<strong>(#RAINETTE_INFOS{#GET{lieu}, ville, #GET{service}})</strong>]</li>
94                                                <li>Longitude, appel sans filtre unit&eacute;:&nbsp;[<strong>(#RAINETTE_INFOS{#GET{lieu}, longitude, #GET{service}})</strong>]</li>
95                                                <li>Latitude, appel avec filtre unit&eacute;:&nbsp;[<strong>(#RAINETTE_INFOS{#GET{lieu}, latitude, #GET{service}}|rainette_afficher_unite{angle, -1, #GET{service}})</strong>]</li>
96                                                <li>Appel sans type d'info pr&eacute;cis&eacute;e, on renvoie le tableau s&eacute;rialis&eacute;:&nbsp;[<strong>(#RAINETTE_INFOS{#GET{lieu}, '', #GET{service}})</strong>]</li>
97                                                <li>Appel sans argument, on renvoie une chaine vide:&nbsp;[<strong>(#RAINETTE_INFOS)</strong>]</li>
98                                        </ul>
99                                </div>
100                        </div>
101
102                        <h2 class="h2">1.2 - UTILISATIONS DES CONDITIONS METEO</h2>
103                        <a name="conditions" href="#"></a>
104                        <div class="clearfix">
105                                <h3>Utilisation du mod&eacute;le <strong>rainette_conditions</strong></h3>
106                                [(#MODELE{rainette_conditions,lieu=#GET{lieu},sous_modele=conditions_tempsreel, service=#GET{service}})]
107                                [<div class="clearfix">
108                                        <h3>Affichage debug du tableau des conditions</h3>
109                                        (#GET{lieu}|rainette_dbg_afficher_cache{conditions, 0, #GET{service}})
110                                </div>]
111                        </div>
112
113
114                        <h2 class="h2">1.3 - UTILISATIONS DES PREVISIONS METEO</h2>
115                        <a name="previsions" href="#"></a>
116                        <div class="clearfix">
117<!--
118                                <div class="clearfix">
119                                        <h3>Utilisation du mod&eacute;le <strong>rainette_previsions</strong>, pour les jours &agrave; venir (jour=3, type=x_jours, sous-modele=previsions_24h)</h3>
120                                        [(#MODELE{rainette_previsions,code=#GET{lieu},type=x_jours,jour=5,sous_modele=previsions_24h, service=#GET{service}})]
121                                </div>
122                                <div class="clearfix">
123                                        <h3>Utilisation du mod&eacute;le <strong>rainette_previsions</strong>, pour le jour courant (jour=0, type=1_jour, sous-modele=previsions_12h)</h3>
124                                        <p>Avant 14h00 on affiche jour et nuit, apr&egrave;s 14h00 on affiche nuit et le lendemain matin</p>
125                                        [(#MODELE{rainette_previsions,code=#GET{lieu},type=1_jour,jour=0,sous_modele=previsions_12h, service=#GET{service}})]
126                                </div>
127                                <div class="clearfix">
128                                        <h3>Utilisation du mod&eacute;le <strong>rainette_previsions</strong>, pour le surlendemain (jour=2, type=1_jour, sous-modele=previsions_12h)</h3>
129                                        [(#MODELE{rainette_previsions,code=#GET{lieu},type=1_jour,jour=2,sous_modele=previsions_12h, service=#GET{service}})]
130                                </div>
131-->
132                        </div>
133
134                        <h2 class="h2">2.0 - COMPARAISON DES DONNEES DE CHAQUE SERVICE</h2>
135                        <a name="comparaison" href="#"></a>
136                        <p>
137                                L&eacute;gende du tableau :
138                                <ul>
139                                        <li><strong><del>API</del></strong>&nbsp;: indique que la donn&eacute;e ne fait pas partie des informations fournies par le service</li>
140                                        <li><strong>Indisponible</strong>&nbsp;: indique que la donn&eacute;e est fournie par le service mais indisponible pour le moment</li>
141                                </ul>
142                        </p>
143                        <div class="clearfix">
144                                #SET{donnees, #GET{mode}|rainette_dbg_comparer_services{#GET{jeu}, 0}}
145                                #INCLURE{fond=demo/inc-comparer_services,
146                                        jeu=#GET{jeu},
147                                        donnees=#GET{donnees},
148                                        mode=#GET{mode}}
149                        </div>
150                </div>
151        </div>
152
153        <div id="navigation">
154        </div>
155
156        <div id="extra">
157                <div class="menu" id="services">
158                        <h2 class="h2">M&eacute;t&eacute;o d'un service</h2>
159                        <p>Choisissez un service pour afficher les mod&egrave;les informations, conditions et pr&eacute;visions (1.1, 1.2, 1.3)</p>
160                        <ul class="menu-items">
161                        <BOUCLE_services(DATA) {source table, #GET{jeu}}>
162                                [<li class="item">
163                                (#SELF|parametre_url{service, #CLE}
164                                        |lien_ou_expose{
165                                                [(#VAL{rainette:titre_service_}|concat{#CLE}|_T)],
166                                                [(#GET{service}|=={#CLE})]})
167                                </li>]
168                        </BOUCLE_services>
169                        </ul>
170                </div>
171
172                <div class="menu" id="modes">
173                        <h2 class="h2">Comparaison des services</h2>
174                        <p>Choisissez un mode pour comparer les données fournies par chaque service (2.0)</p>
175                        <ul class="menu-items">
176                        <BOUCLE_modes(DATA) {source table, #LISTE{infos, conditions, previsions}}>
177                                [<li class="item">
178                                (#SELF|parametre_url{mode, #VALEUR}
179                                        |lien_ou_expose{
180                                                [(#VALEUR|ucfirst)],
181                                                [(#GET{mode}|=={#VALEUR})]})
182                                </li>]
183                        </BOUCLE_modes>
184                        </ul>
185                </div>
186
187                <div class="menu" id="configuration">
188                        <h2 class="h2">Configuration des services</h2>
189                        <p>Choisissez un service pour vous rendre sur sa page de configuration</p>
190                        <ul class="menu-items">
191                        <BOUCLE_configurations(DATA) {source table, #GET{jeu}}>
192                                [<li class="item">
193                                (#URL_ECRIRE{configurer_rainette}|parametre_url{service, #CLE}
194                                        |lien_ou_expose{
195                                                [(#VAL{rainette:titre_service_}|concat{#CLE}|_T)]})
196                                </li>]
197                        </BOUCLE_configurations>
198                        </ul>
199                </div>
200
201        </div>
202
203        <div id="footer">
204                <p>Pour appeler la page de demo:</p>
205                <ul>
206                        <li><strong>http://monsite/spip.php?page=demo/rainette</strong> (Paris par d&eacute;faut) ou</li>
207                        <li><strong>http://monsite/spip.php?page=demo/rainette&amp;ville=FRXXnnnn&amp;service=xxx</strong> pour pr&eacute;ciser la ville voire le service</li>
208                </ul>
209        </div>
210</div>
211</body>
212</html>
Note: See TracBrowser for help on using the repository browser.