source: cpc/trunk/lobbyistes/crowdsourcing/index.php @ 1952

Last change on this file since 1952 was 1952, checked in by popeye, 11 years ago

Image num terminée à droite

File size: 19.3 KB
Line 
1<?php
2session_start();
3$_SESSION['token'] = sha1(str_shuffle(date("DMjG:i:sTY").mt_rand(100000, 200000)));
4?>
5<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
6<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" >
7  <head>
8    <title>Numérisons les lobbyistes de l'Assemblée nationale</title>
9    <meta name="description" content="" />
10    <meta name="keywords" content="" />
11    <meta name="robots" content="index, follow, all" />
12    <meta http-equiv="content-language" content="fr" />
13    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
14    <link rel="stylesheet" type="text/css" href="style/style.css" media="screen" title="default" />
15    <link rel="alternate stylesheet" type="text/css" href="style/fluid.css" media="screen" title="Fluide" />
16        <!--[if IE]><script language="javascript" type="text/javascript" src="javascript/excanvas.pack.js"></script><![endif]-->
17    <script type="text/javascript" src="javascript/jquery-1.4.2.js"></script>
18    <script type="text/javascript" src="javascript/jquery.scrollTo-min.js"></script>
19        <script type="text/javascript" src="javascript/jquery.flot.pie.pack.js"></script>
20    <link rel="shortcut icon" type="image/x-icon" href="favicon.ico" />
21  </head>
22  <body>
23    <div class="site">
24      <div class="haut">
25        <a href="http://www.regardscitoyens.org/"><img src="images/logo-regards-citoyens.png" alt="Regards Citoyens" /></a>
26        <a id="logo_ti" href="http://www.transparence-france.org/"><img src="images/logo-ti-france.png" alt="TI France" /></a>
27      </div>
28      <div class="corps">
29        <noscript>
30          <div class="noscript"><img src="images/error.png" alt="!"/> Cette interface est prévue pour fonctionner avec Javascript, vous devez donc l'activer pour pouvoir contribuer.</div>
31        </noscript>
32        <div class="instructions">
33        <h1>Numérisons les lobbyistes de l'Assemblée nationale</h1>
34                <p>Parce que l'influence du lobbying au sein des parlements, peu connue, suscite beaucoup de fantasmes, <a href="plus-d-infos.php">Transparence International France et Regards Citoyens s'associent</a> pour mieux connaître les lobbyistes de l'Assemblée nationale. Depuis 2007, plus de 15&nbsp;000 personnes ont été auditionnées dans le cadre de rapports parlementaires.<br /><strong>Pour mieux qualifier ces données, nous avons besoin de vous&nbsp;!</strong></p>
35
36<p>Pour nous aider à cartographier ces acteurs, il vous suffit de saisir, dans le formulaire ci-dessous, le nom de la personne, identifié dans un cadre rouge, son employeur ou l'organisme qu'elle représente, ainsi que sa fonction&nbsp;:</p>
37        </div>
38        <div class="infos">
39          <span class="titre_info slide_selected" id="stats">Statistiques</span>
40          <div class="slide" id="slide_stats" style="z-index: 10;">
41           
42          </div>
43          <span class="titre_info" id="averti">Etre averti</span>
44          <div class="slide" id="slide_averti">
45          <p>Une étude sera réalisée grace aux données recueillies.<br />Inscrivez votre email et nous vous avertiront de sa sortie :</p>
46          <form action="http://www.regardscitoyens.org/info-publication-etude-lobbyistes/" method="get">
47           <table>
48             <tr class="colore">
49               <th>Email</th>
50               <td>
51                 <input type="text" name="email" size="15" />
52               </td>
53             </tr>
54             <tr>
55               <th><input type="button" value="Etre averti" id="mail" /></th><td></td>
56             </tr>
57           </table>
58          </form>
59          </div>
60          <span class="titre_info" id="connexion">Connexion</span>
61          <div class="slide" id="slide_connexion">
62          <p>Inscription ou connexion : </p>
63          <form action="">
64           <table>
65             <tr class="colore">
66               <th>Nom/Pseudo</th>
67               <td>
68                 <input type="text" tabindex= "120" name="pseudo" size="15" />
69               </td>
70             </tr>
71             <tr>
72               <th>Mot de passe</th>
73               <td>
74                 <input type="password" tabindex= "130" name="pass" size="15" />
75               </td>
76             </tr>
77             <tr class="colore">
78               <th><input type="button" tabindex= "140" value="Connexion" id="connecter"/></th><td></td>
79               <input type="hidden" name="connexion_tocken" id="connexion_tocken_hidden" value=""/>
80             </tr>
81           </table>
82          </form>
83          </div>
84          <div style="clear: both;"></div>
85        </div>
86        <div style="height: 1px; clear: both; // hack ie8"></div>
87        <div class="lignes" id="lignes">
88        <div style="clear: both;"></div>
89        </div>
90       
91        <div id="form">
92                <img id="num_terminee" src="images/num_terminee.png" />
93      <form action="">
94<style>
95.contextuelle { color: grey; font-size: 0.8em; }
96th {vertical-align: top; padding-top: 4px;}
97</style>
98        <table>
99          <tr class="colore">
100            <th>Sexe</th>
101            <td class="champs">
102              <input type="radio" tabindex= "10" id="homme" value="homme" name="sexe" /> <label for="homme">Homme</label>
103              <input type="radio" tabindex= "20" id="femme" value="femme" name="sexe" /> <label for="femme">Femme</label>
104            </td>
105            <td class="suivant" title="en cas de doute passez à un autre nom sans enregistrer" rowspan="5" onclick="javascript:getLignes_rapport()"></td>
106          </tr>
107          <tr>
108            <th>Prénom et Nom</th><td class="champs"><input type="text" tabindex= "30" name="nom" value="" size="40" /><br/><span class="contextuelle">Merci de ne pas saisir le titre, le grade ou toute information qui ne soit pas le nom et le prénom.</span></td>
109          </tr>
110          <tr class="colore">
111            <th>Fonction</th><td class="champs"><input type="text" tabindex= "40" name="fonction" size="68" /><br/><span class="contextuelle">Si plusieurs fonctions, choisissez celle qui vous semble la plus importante.</span></td>
112          </tr>
113          <tr>
114            <th>Organisation / employeur</th><td class="champs"><input type="text" tabindex= "50" name="orga" size="68" /><br/><span class="contextuelle">Merci d'indiquer le nom complet et son éventuel acronyme.</span></td>
115          </tr>
116          <tr class="colore">
117            <th><input type="hidden" name="id_rapport" value="" /></th><td class="champs"><input type="button" tabindex= "60" value="Enregistrer" id="enregistrer" /> <span class="liens" style="font-size: 0.9em; color: #C1272D; font-weight: bold;">&nbsp;&nbsp;<a href="javascript:pas_audition()" tabindex= "70" onclick="javascript:if(!confirm('Etes vous sur ?')) return false;">Pas une personne / personne pas auditionnée</a> - <a href="javascript:aide();" tabindex= "80">signaler une erreur</a></span></td>
118          </tr>
119          <tr>
120            <th></th><td></td>
121          </tr>
122        </table>
123      </form>
124      </div>
125          <div class="aide">
126        <h1 style="margin-top:0;">Aide</h1>
127<ul>
128<li>Pour apparaitre dans <a href="top.php">le top</a>, vous pouvez vous inscrire en cliquant sur connexion en haut à droite. Une fois votre nom et votre mot de passe enregistrés pour la première fois, vous pouvez les réutiliser comme bon vous semble.</li>
129<li>Les noms peuvent parfois être mal repérés, incomplets ou avec des informations en trop, merci d'apporter alors votre correction dans le champ nom.</li>
130<li>Lorsque la personne auditionnée est un militaire, l'organisation à saisir est par exemple "Armée de terre française" ou "Armée de l'air française". Si aucun renseignement complémentaire n'est disponible sur le corps d'appartenance, vous pouvez entrer simplement "Armée française". Pensez bien par ailleurs à retirer le grade éventuellement inclu dans le champ nom et à remplir le champ fonction en conséquence.</li>
131<li>Lorsque l'application n'identifie pas une vraie personne, comme par exemple "France Télévisions" car France est également un prénom, utilisez le lien <strong>"Pas une personne / personne pas auditionnée"</strong> pour le signaler et passer à un autre nom.</li>
132<li>Certaines personnes identifiées n'ont en fait pas été auditionnées comme par exemple Mme YYY dans «&nbsp;M. XXX, directeur de cabinet de Mme YYY&nbsp;». Merci dans ce cas de cliquer sur le lien <strong>"Pas une personne / personne pas auditionnée"</strong> pour le signaler et passer à un autre nom.</li>
133<li>Lorsqu'une organisation est indiquée avec un nom complet ainsi qu'un acronyme, par exemple "Entreprise Untel International (EUI)", copiez toutes les informations disponibles dont le sigle entre parenthèses.</li>
134<li>Si la personne identifiée est déclarée représentante de plusieurs organisations avec différentes fonctions entrez simplement celle qui vous semble la plus pertinente, généralement la première.</li>
135<li>Si vous ne trouvez pas les informations souhaitées, vous pouvez aller regarder le rapport complet en cliquant sur le lien <strong>"rapport parlementaire"</strong> ou en <a href="#" id="googler" target="_blank">cherchant la personne identifiée sur un moteur de recherche</a>.</li>
136<li>Si seule l'organisation est indiquée mais pas la fonction vous pouvez indiquer "représentant", "adhérent" ou "membre" suivant les cas. Pour les cas où rien ne colle "N/A" ou "?" peut vous permettre de l'indiquer.</li>
137<li>Pour les représentants des exécutifs comme les membres d'un gouvernement, indiquez l'instituion ou le ministère et/ou le pays concerné.</li>
138<li>Lorsque l'organisation à laquelle appartient une personne n'est apparemment pas donnée, vous pouvez vérifier dans les lignes précédentes du rapport si elle n'est pas fournie plus tôt dans le texte.</li>
139<li>Si vous avez encore un doute, vous pouvez nous <a href="#" id="signaler">signaler une erreur éventuelle par email</a> ou cliquer sur la flèche à droite pour simplement passer à un autre nom.</li>
140<p><a href="javascript:aide();">Fermer l'aide</a></p>
141</ul>
142      </div>
143      </div>
144      <div class="bas"><span class="liens" style="font-size: 0.9em; color: #C1272D; font-weight: bold;"><a href="javascript:aide();">aide</a> - <a href="#" tabindex= "100" id="contact">nous contacter</a> - <a href="plus-d-infos.php" tabindex= "110">plus d'infos</a></span>
145            <?php 
146                if(isset($_GET['id'])) {
147                ?>
148                <input type="text" name="getid" size="12" /> <input type="button" id="id_manu" value="ok" />
149                <?php
150                }
151                ?></div>
152    </div>
153    <script type="text/javascript">
154    <!--
155    $(window).load(function () {
156      getPie();
157          getLignes_rapport();
158      slidingUp();
159      $("#contact").attr("href", "mailto:lobbyistes@regardscitoyens.org?subject=Contact");
160     });
161       
162    $("#enregistrer").bind("click", function(){
163      saveLobbyiste();
164    });
165       
166        $("#id_manu").bind("click", function(){
167          getLignes_rapport();
168    });
169   
170    $("#connecter").bind("click", function(){
171          contributeur();
172    });
173   
174    $("#mail").bind("click", function(){
175      this.form.submit();
176    });
177       
178    function getLignes_rapport(succes) {
179      clean();
180          var getid = "?id="+$("input[name='getid']").attr("value");
181      $.ajax({
182        url: "ajax/lignes_rapport.php"+getid,
183        async: false,
184        cache: false,
185        beforeSend: function(xhr) {xhr.setRequestHeader("If-Modified-Since","0");},
186        complete: function(){
187        if(succes) { $(".lignes").prepend('<div id="msg_succes" style="float:right; color: green; font-weight: bold;"> Merci pour votre contribution mais cette appli est désactivée !<\/div>'); }
188          nom = $(".nom").text();
189          $("input[name='sexe']").attr("checked", "");
190          $("input[name='nom']").attr("value", nom);
191          $("input[name='fonction']").attr("value", "");
192          $("input[name='orga']").attr("value", "");
193          $("#signaler").attr("href", "mailto:lobbyistes@regardscitoyens.org?subject=Erreur sur l'enregistrement n°"+$("#id_rapport").text());
194          $("#googler").attr("href", "http://www.google.fr/search?q="+nom);
195          $(".contenu").scrollTo("max", 300);
196        },
197        success: function(html){
198          if ($.browser.msie == true) {
199            obj = document.getElementById("lignes");
200            obj.innerHTML = html;
201                  } else {
202                    $(".lignes").text("");
203            $(".lignes").append(html);
204                  }
205        }
206      });
207    }
208   
209    if ($.browser.msie == true) { var statut = ""; }
210       
211        var intitule_connexion = "";
212        var form_connection = "";
213   
214    function saveLobbyiste() {
215      clean();
216      var id_rapport_num = $("#id_rapport").text();
217      var sexe = $("input:radio[name='sexe']:checked").val();
218      var nom = $("input[name='nom']").attr("value");
219      var fonction = $("input[name='fonction']").attr("value");
220      var orga = $("input[name='orga']").attr("value");
221      $.ajax({
222        url: "ajax/save.php?id_rapport="+id_rapport_num+"&sexe="+encodeURIComponent(sexe)+"&nom="+encodeURIComponent(nom)+"&fonction="+encodeURIComponent(fonction)+"&orga="+encodeURIComponent(orga)+"&token=<?php echo $_SESSION['token']; ?>",
223        async: false,
224        cache: false,
225        dataType: "json",
226        beforeSend: function() {
227                  $(".lignes").prepend('<div id="msg_succes" style="float:right; color: green; font-weight: bold;">veuillez patienter <img src="images/loading.gif" alt="..." /><\/div>');
228                },
229        complete: function(){
230          clean();
231          var erreur_manque = 0;
232            if(statut.sexe != 1) { $("#femme").parent().append(' <img src="images/mini_error.png" class="mini_error" alt="!!!" />'); erreur_manque++; }
233            if(statut.nom != 1) { $("input[name='nom']").parent().append(' <img src="images/mini_error.png" class="mini_error" alt="!!!" />'); erreur_manque++; }
234            if(statut.fonction != 1) { $("input[name='fonction']").parent().append(' <img src="images/mini_error.png" class="mini_error" alt="!!!" />'); erreur_manque++; }
235            if(statut.orga != 1) { $("input[name='orga']").parent().append(' <img src="images/mini_error.png" class="mini_error" alt="!!!" />'); erreur_manque++; }
236           
237          if(erreur_manque != 0) { $(".lignes").prepend('<div id="msg_erreur" style="float:right; color: red; font-weight: bold;"><img src="images/mini_error.png" class="mini_error" alt="!!!" /> Il manque des infos dans le formulaire<\/div>'); }
238         
239          var erreur_base = 0;
240            if(statut.id_rapport != 1) { erreur_base++; }
241            if(statut.existe != 1) { erreur_base++; }
242            if(statut.lobbyistes != 1) { erreur_base++; }
243            if(statut.rapports != 1) { erreur_base++; }
244          if((erreur_manque == 0) && (erreur_base != 0)) { $(".lignes").prepend('<div id="msg_erreur" style="float:right; color: red; font-weight: bold;"><img src="images/mini_error.png" class="mini_error" alt="!!!" /> Une erreur est survenue<\/div>'); }
245          if((erreur_manque == 0) && (erreur_base == 0)) { getLignes_rapport(true); }
246        },
247        success: function(json){
248                  statut = json;
249        }
250      });
251    }
252   
253    function pas_audition() {
254      desactive();
255        }
256   
257    var msg = "Une erreur est survenue";
258    var succes = 0;
259   
260    function contributeur() {
261      desactive();
262    }
263       
264    function desactive() {
265          clean();
266          $(".lignes").prepend('<div id="msg_erreur" style="float:right; color: red; font-weight: bold;"><img src="images/mini_error.png" class="mini_error" alt="!!!" /> Cette fonction est désactivée<\/div>');
267        }
268   
269    function clean(stats) {
270      $(".mini_error").remove();
271      $("#msg_erreur").remove();
272      $("#msg_succes").remove();
273          $("#homme").focus();
274    }
275   
276    function slidingUp() {
277      $(".titre_info").each(function() {
278        $(this).bind('click', function() {
279          $(".titre_info").css({'background-color' : '#fff', 'color' : '#000'});
280          $(this).css({'background-color' : '#C1272D', 'color' : '#fff'});
281          to_show = '#slide_'+$(this).attr("id");
282          $('.slide').css("z-index","0");
283          $(to_show).css("z-index","10");
284        });
285      });
286    }
287   
288    function slidingDown() {
289      $(".titre_info").each(function() {
290        $(this).unbind('click');
291      });
292    }
293   
294        function aide() {
295          if ($(".aide").is(":hidden")) {
296        $(".aide").slideDown("slow", function() { $(window).scrollTo("max", 300); });
297          }
298          else {
299            $(".aide").slideUp();
300          }
301        }
302       
303        var session_pseudo = "0";
304        var connexion = "";
305       
306        function getPie() {
307          $.ajax({
308        url: "ajax/stats.php",
309        async: true,
310        cache: false,
311        beforeSend: function() {
312                  $("#contributeurs").prepend('<span id="chargement" style="position: absolute; bottom:0; right:0;"><img src="images/loading.gif" alt="chargement" /><\/span>');
313                },
314        complete: function() {
315                  $("#chargement").remove();
316                  var fait = $("#fait").text();
317                  var a_faire = $("#a_faire").text();
318                  session_pseudo = $("#session_pseudo").text();
319                  connexion = $("#connexion").text();
320                  if((connexion != "Connexion") && (session_pseudo == 0)) { alert("Votre session a expiré. La page va être rechargée, merci de vous reconnecter afin que vos contributions vous soient bien attribuées"); window.location.replace("http://www.regardscitoyens.org/lobbyistes/");
321 }
322          $(function () {
323            $.plot($("#placeholder"), [
324              { label: "Fait",  data: +fait},
325              { label: "A faire",  data: +a_faire}
326                ],
327                {
328              pie: {
329                        show: true,
330                        pieStrokeLineWidth: 1,
331                        pieStrokeColor: '#FFF',
332                        //pieChartRadius: 100,                  // by default it calculated by
333                        //centerOffsetTop:30,
334                        //centerOffsetLeft:30,                  // if 'auto' and legend position is "nw" then centerOffsetLeft is equal a width of legend.
335                        showLabel: true,                                //use ".pieLabel div" to format looks of labels
336                        labelOffsetFactor: 4/6,                 // part of radius (default 5/6)
337                        //labelOffset: 0                        // offset in pixels if > 0 then labelOffsetFactor is ignored
338                        labelBackgroundOpacity: 0.55,   // default is 0.85
339                        labelFormatter: function(serie){// default formatter is "serie.label"
340                          //return serie.label;
341                          //return serie.data;
342                          return serie.label+'<br/>'+Math.round(10*serie.percent)/10+'%';
343                        }
344                  },
345                  legend: {
346                        show: false,
347                        position: "ne",
348                        backgroundOpacity: 0
349                  }
350                })
351          });
352        },
353        success: function(html){
354          if ($.browser.msie == true) {
355            obj = document.getElementById("slide_stats");
356            obj.innerHTML = html;
357                  } else {
358                    $("#slide_stats").text("");
359            $("#slide_stats").append(html);
360                  }
361        }
362      });
363       
364        }
365
366    // Google
367
368  var _gaq = _gaq || [];
369  _gaq.push(['_setAccount', 'UA-10423931-1']);
370  _gaq.push(['_trackPageview']);
371
372  (function() {
373    var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
374    ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
375    var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
376  })();
377
378    //-->
379    </script>
380  </body>
381</html>
Note: See TracBrowser for help on using the repository browser.