-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
249 lines (229 loc) · 12 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
<!DOCTYPE html>
<!-- paulirish.com/2008/conditional-stylesheets-vs-css-hacks-answer-neither/ -->
<!--[if IE 8]> <html class="no-js lt-ie9" lang="en"> <![endif]-->
<!--[if gt IE 8]><!--> <html class="no-js" lang="en"> <!--<![endif]-->
<head>
<meta charset="utf-8" />
<meta property="og:site_name" content="Les Feux Verts" />
<meta property="og:url" content="http://lesfeuxverts.com/" />
<meta property="og:title" content="Les Feux Verts: Pour être des citoyens lumineux" />
<meta property="og:description" content="L'application Les Feux Verts vous permet d'aider la Ville de Québec à s'améliorer et à évoluer en y signalant des problèmes" />
<meta property="og:image" content="http://www.lesfeuxverts.com/assets/img/logo-les-feux-verts-facebook.png" />
<meta property="og:type" content="website" />
<meta property="og:locale" content="fr_CA" />
<meta property="fb:admins" content="653045027,876810130" />
<!-- Set the viewport width to device width for mobile -->
<meta name="viewport" content="width=device-width, minimum-scale=1.0, maximum-scale=1.0" />
<title>Les Feux Verts - Signalez-les !</title>
<!-- Included CSS Files (Uncompressed) -->
<!--
<link rel="stylesheet" href="stylesheets/foundation.css">
-->
<!-- Included CSS Files (Compressed) -->
<link rel="stylesheet" href="assets/css/foundation.css">
<link rel="stylesheet" href="assets/css/styles.css">
<link rel="stylesheet" href="assets/css/styles2.css">
<link href='http://fonts.googleapis.com/css?family=Sanchez&subset=latin,latin-ext' rel='stylesheet' type='text/css'>
<link href='http://fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,600italic,700italic,800italic,400,300,600,700,800' rel='stylesheet' type='text/css'>
<link rel="icon" href="favicon.ico" type="image/x-icon">
<link rel="shortcut icon" href="favicon.ico" type="image/x-icon">
<script>var latlng;</script>
<!-- Included JS Files (Compressed) -->
<script src="assets/js/foundation.min.js"></script>
<script src="assets/js/jquery-1.9.1.min.js"></script>
<!--
<script src="assets/js/modernizr.foundation.js"></script>
-->
<script src="assets/js/modernizr.custom.js"></script>
<script src="assets/js/jquery.pagescroller.lite.js"></script>
<script src="assets/js/jquery.foundation.reveal.js"></script>
<!-- Initialize JS Plugins -->
<script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?key=AIzaSyAIu5DIUBp5PURxPHxn1tVZXlXUfa-s8QY&libraries=places&sensor=true"></script>
<script src="assets/js/app.js"></script>
<script src="assets/js/app-map.js"></script>
<script src="assets/js/app-toggles.js"></script>
<script src="assets/js/upload.js"></script>
<script src="assets/js/raphael.js"></script>
<!-- Included JS Files (Uncompressed) -->
<!--
<script src="javascripts/jquery.js"></script>
<script src="javascripts/jquery.foundation.mediaQueryToggle.js"></script>
<script src="javascripts/jquery.foundation.forms.js"></script>
<script src="javascripts/jquery.event.move.js"></script>
<script src="javascripts/jquery.event.swipe.js"></script>
<script src="javascripts/jquery.foundation.magellan.js"></script>
-->
</head>
<body>
<div id="fb-root"></div>
<script>(function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) return;
js = d.createElement(s); js.id = id;
js.src = "//connect.facebook.net/fr_FR/all.js#xfbml=1";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
<header>
<div class="row">
<h1 id="logo" class="four columns centered"><img src="assets/img/logo.png" alt="Les Feux Verts"></h1>
<p id="description" class="ten centered clearfix hide-for-small">Participez à améliorer et à faire évoluer votre ville; signalez des problèmes à la Ville de Québec pour assurer une restauration et un suivi efficace.</p>
<nav>
<a class="tab active four">
<img src="assets/img/fiche-actif.png" />
<p>Faire une demande</p>
</a>
<a class='tab four'>
<img src="assets/img/recherche-actif.png" />
<p>Recherchez une demande</p>
</a>
</nav>
<div id="Arrow">
<object data="assets/img/triangle-pointeur.svg" type="image/svg+xml"></object>
</div>
</div>
</header>
<section id="container">
<section id="CreationSection" class="tab active">
<form method="POST" id="creation">
<section class="row">
<div class="ten columns centered">
<img src="assets/img/schema.png" alt="Schéma de l'utilisation" class="six columns hide-for-small">
<div class="six columns">
<fieldset>
<legend><h2>Entrez vos informations</h2></legend>
<input type="text" id="first_name" name="first_name" class="twelve centered-mobile" placeholder="Votre prénom">
<input type="text" id="last_name" name="last_name" class="twelve centered-mobile" placeholder="Votre nom">
<input type="text" id="email" name="email" class="twelve centered-mobile" placeholder="Votre courriel">
<input type="text" id="phone" name="phone" class="twelve centered-mobile" placeholder="Votre téléphone">
</fieldset>
<fieldset>
<legend><h2>Définir la demande</h2></legend>
<select id="servicesList" class="servicesList twelve clearfix" name="service_code"></select>
<div id="txtSuppInfos">
<div class="mask">
<div></div>
</div>
<p class="readMore"><a href="#">Lire la suite</a></p>
</div>
<textarea class="twelve clearfix" placeholder="Description et/ou commentaires"></textarea>
<p id="location">Utiliser ma localisation :<input type="checkbox" id="use-my-location" checked/></p>
<form id="form1" enctype="multipart/form-data" method="post">
<div class="row" style="margin: 0; padding: 25px 0 0 0;">
<label for="file">Vous avez une image de votre problème?</label>
<input type="file" name="file" id="file" onchange="fileSelected()"/>
</div>
<div id="fileName"></div>
<div id="fileSize"></div>
<div id="fileType"></div>
<div class="row" style="margin: 0 0 0 -3px; padding: 0">
<input type="button" class="button" onclick="uploadFile()" value="Envoyer votre photo" />
</div>
<div id="progressNumber"></div>
<img id="upload_picture" src="http://www.placehold.it/100x100"></img>
<p><img src="assets/img/loading.gif" id="UploadPictureLoader" style="width:30px;display:none"></p>
</form>
<p style="padding-top: 25px;">Utiliser ma localisation :<input type="checkbox" id="use-my-location" checked/></p>
<p>
<input type="text" id="address_string" class="twelve" name="address_string" placeholder="Adresse à chercher"/>
<!--<div class="button" onclick="PlaceAddressMarker()">Trouver</div>-->
<span id="AddressError">Adresse introuvable</span>
</p>
</fieldset>
<div class="row" style="margin: 0 0 0 -3px;">
<div onclick="greenlight.create_request();" class="button">Envoyer votre demande</div>
</div>
</div>
</div>
</section>
<div id="map_canvas"></div>
<div id="warnings_panel" style="width:100%;height:10%;text-align:center"></div>
</form>
</section>
<section id="ConsultationSection" class="tab" style="display:none">
<div class="row">
<p class="tip twelve">Trouvez une demande par</p>
<div class="three columns centered">
<h3 class="">Code de vérification</h3>
<input type="button" value="Recherche" id="submitRequestId" />
<input type="text" id="requestId" />
</div>
<p class="tip twelve columns">- ou -</p>
<div class="eight columns centered">
<div class="twelve">
<h3>Catégorie</h3>
<select class="servicesList" id="servicesList2" name="service_code">
<option value="0">- Sélectionner un service -</option>
</select>
</div>
<div class="twelve">
<div class="six column">
<h3>Date début</h3>
<input type="text" id="startDate" />
</div>
<div class="six column">
<h3>Date fin</h3>
<input type="text" id="endDate" />
</div>
<input type="button" value="Recherche" id="submitAdvancedSearch" />
</div>
<div class="twelve">
<select id="statesList">
<option value="0">- Sélectionner un état -</option>
<option value="open">Ouvert</option>
<option value="closed">Fermé</option>
</select>
</div>
</div>
<div class="eight columns centered">
<div id="resultStats" class="twelve">
<div id="errorMsg" class="twelve"></div>
</div>
<div id="requestsList" class="twelve" style="margin:0 auto;"></div>
</div>
</div>
</section>
</section>
<section id="stats">
<div class="row">
<div id="stats1"></div>
</div>
</section>
<footer>
<div class="row">
<div class="twelve">
<img src="assets/img/ironweb2.png" alt="Iron Web 2013">
</div>
<div class="twelve">
<p><span>Les Feux Verts</span> est une application sous license MIT créée dans le cadre du <a href="http://ironweb.org">Iron Web 2013</a> sous license MIT.</p>
<p>©L'équipe des Justiciers Verts, 2013.</p>
<br/>
<div class="fb-like" data-href="http://lesfeuxverts.com" data-send="false" data-layout="button_count" data-width="450" data-show-faces="true"></div>
<p>Suivez-nous sur <span><a target="_blank" href="http://www.facebook.com/LesFeuxVerts">Facebook</a></span> ;-)</p>
</div>
</div>
</footer>
<div class="reveal-modal large" id="addRequestSuccessMessage">
<h2>Votre demande a été envoyée avec succès!</h2>
<p>La ville de Québec vous remercie d'avoir allumé un feu pour lui signaler un problème.<br />Un suivi sera effectué auprès de vous par courriel dans les plus brefs délais.</p>
<p>Voici votre numéro de suivi pour votre demande : </p><br />
<p style="text-align:center" id="RequestToken"></p>
<a class="close-reveal-modal">×</a>
</div>
<div class="reveal-modal large" id="addRequestErrorMessage">
<h2>Une erreur est survenue</h2>
<p>Une erreur est survenue lors de l'enregistrement de votre demande.<br />Veuillez essayer de nouveau ou communiquer avec le support technique.</p>
<a class="close-reveal-modal">×</a>
</div>
<div class="reveal-modal large" id="formValidationErrorMessage">
<h2>Une erreur est survenue</h2>
<p>Les champs <b>Nom</b>, <b>Prénom</b> et <b>Courriel</b> sont obligatoires.</p>
<a class="close-reveal-modal">×</a>
</div>
<div class="reveal-modal large" id="advertising">
<h2 style="color: #F00;">Avertissement!</h2>
<p style="padding-top: 10px;">Ce site web a été conçu lors des activités de la compétition Iron Web dans le cadre de la conférence WAQ. Les demandes envoyées ne seront pas réellement envoyées. Cette application est seulement une démonstration.</p>
<a class="close-reveal-modal">×</a>
</div>
<script src="assets/js/stats.js"></script>
</body>
</html>