search.html
1 <#assign items_time= [
2 { "code":"06:00", "name":"06h00"},
3 { "code":"09:00", "name":"09h00"},
4 { "code":"12:00", "name":"12h00"},
5 { "code":"15:00", "name":"15h00"},
6 { "code":"18:00", "name":"18h00"},
7 { "code":"21:00", "name":"21h00"}
8 ]>
9 <#assign items_minutes= [
10 { "code": "360", "name":"06h00"},
11 { "code": "540", "name":"09h00"},
12 { "code": "720", "name":"12h00"},
13 { "code": "900", "name":"15h00"},
14 { "code":"1080", "name":"18h00"},
15 { "code":"1260", "name":"21h00"}
16 ]>
17 <div class="row">
18 <div class="col-sm-12">
19 <div class="container">
20 <div class="row">
21 <@messages infos=infos errors=errors/>
22 <div class="col-xs-12">
23 <div class="formGroupContainer messageContainer" id="message-carto"></div>
24 </div>
25 <div class="col-xs-12">
26 <#if (results.values)?? >
27 <#list results.values as groupcommand>
28 <#if groupcommand.values?size gt 0>
29 <h3>#i18n{module.appointment.solrsearchapp.map}</h3>
30 <p><a href="jsp/site/Portal.jsp?page=appointmentsearch&view=search<#if category??>&category=${category}</#if>&nb_consecutive_slots=${nb_consecutive_slots!'1'}&role=${role!'none'}#rdv_liste">#i18n{module.appointment.solrsearchapp.displayAvailableSlots}</a></p><p class="visible-xs">#i18n{module.appointment.solrsearchapp.mapAvailableForBigScreen}</p>
31 <#else>
32 <h3 class="text-warning" style="margin-bottom: 30px;font-size:30px"><i class="fa fa-exclamation-triangle"></i> #i18n{module.appointment.solrsearchapp.noMoreAvailableSlots}</h3>
33 </#if>
34 </#list>
35 </#if>
36 </div>
37 </div>
38 <div class="row">
39 <div id="map_col" class="hidden-xs col-sm-12 col-md-12" style="position:relative; display:none;">
40 <div class="row">
41 <div id="map" class="col-xs-12">
42 <div class="leaflet-appointment-search" style="height:520px;"></div>
43 <a class="btn btn-primary btn-sm" id="tgSearchForm" href="#"><i class="fa fa-chevron-left hidden-xs hidden-sm"></i><i class="fa fa-angle-double-down hidden-md hidden-lg"></i><span class="hidden-xs hidden-sm"> #i18n{module.appointment.solrsearchapp.search}</span></a>
44 </div>
45 </div>
46 <div class="row text-center" id="occupancyRate">
47 <div class="col-xs-4">
48 <p style="margin: 5px 0px;">
49 <img src="js/plugins/leaflet/leaflet/images/marker_hole.png"/> : #i18n{module.appointment.solrsearchapp.lessThanSeventy}
50 </p>
51 </div>
52 <div class="col-xs-4">
53 <p style="margin: 5px 0px;">
54 <img src="js/plugins/leaflet/leaflet/images/marker_hole_yellow.png"/> : #i18n{module.appointment.solrsearchapp.lessThanNinety}
55 </p>
56 </div>
57 <div class="col-xs-4">
58 <p style="margin: 5px 0px;">
59 <img src="js/plugins/leaflet/leaflet/images/marker_hole_red.png"/> : #i18n{module.appointment.solrsearchapp.moreThanNinety}
60 </p>
61 </div>
62 </div>
63 </div>
64 <div class="col-xs-12 col-sm-12 col-md-4" id="searchForm">
65 <div class="form-horizontal">
66 <legend>#i18n{module.appointment.solrsearchapp.simpleSearch}</legend>
67 <div class="form-group">
68 <div class="col-xs-12">
69 <form method="post" action="jsp/site/Portal.jsp?page=appointmentsearch<#if category??>&category=${category}</#if>" style="display:inline-block">
70 <input name="to_date" value="${(.now?long + 7 * 86400000)?number_to_date?string("dd/MM/yyyy")}" type="hidden">
71 <button type="submit" class="btn btn-primary btn-sm" name="view_search">#i18n{module.appointment.solrsearchapp.sevenDays}</button>
72 </form>
73 <form method="post" action="jsp/site/Portal.jsp?page=appointmentsearch<#if category??>&category=${category}</#if>" style="display:inline-block">
74 <input name="to_date" value="${(.now?long + 14 * 86400000)?number_to_date?string("dd/MM/yyyy")}" type="hidden">
75 <button type="submit" class="btn btn-primary btn-sm" name="view_search">#i18n{module.appointment.solrsearchapp.fourteenDays}</button>
76 </form>
77 </div>
78 </div>
79 </div>
80 <fieldset>
81 <legend id="advanced_search_button">#i18n{module.appointment.solrsearchapp.advancedSearch} <i class="fa fa-cogs"></i></legend>
82 <form name="search" method="post" action="jsp/site/Portal.jsp?page=appointmentsearch<#if category??>&category=${category}</#if>">
83 <input name="page" value="appointmentsearch" type="hidden">
84 <input name="role" value="${role!'none'}" type="hidden">
85 <div id="advanced_search">
86 <div class="form-group">
87 <label>#i18n{module.appointment.solrsearchapp.dates}</label>
88 <div class="row" style="margin-bottom:3px;">
89 <div class="col-sm-6">
90 <label for="from_date" class="sr-only">#i18n{module.appointment.solrsearchapp.from}</label>
91 <div class="input-group">
92 <span class="input-group-addon">#i18n{module.appointment.solrsearchapp.from}</span>
93 <input class="form-control" id="from_date" name="from_date" type="text" value="${from_date!}" />
94 </div>
95 </div>
96 <div class="col-sm-6">
97 <@comboWithParams name="from_time" default_value=from_time! additionalParameters='class="form-control"' items=items_time />
98 </div>
99 </div>
100 <div class="row">
101 <div class="col-sm-6">
102 <label for="to_date" class="sr-only">
103 #i18n{module.appointment.solrsearchapp.to}
104 </label>
105 <div class="input-group">
106 <span class="input-group-addon">#i18n{module.appointment.solrsearchapp.to}</span>
107 <input class="form-control" id="to_date" name="to_date" type="text" value="${to_date!}" />
108 </div>
109 </div>
110 <div class="col-sm-6">
111 <@comboWithParams name="to_time" default_value=to_time! additionalParameters='class="form-control"' items=items_time />
112 </div>
113 </div>
114 </div>
115 <div class="form-group">
116 <label>#i18n{module.appointment.solrsearchapp.schedule}</label>
117 <div class="row">
118 <div class="col-sm-6">
119 <@comboWithParams name="from_day_minute" default_value=from_day_minute! additionalParameters='class="form-control"' items=items_minutes />
120 </div>
121 <div class="col-sm-6">
122 <@comboWithParams name="to_day_minute" default_value=to_day_minute! additionalParameters='class="form-control"' items=items_minutes />
123 </div>
124 </div>
125 </div>
126 <div class="form-group">
127 <label>#i18n{module.appointment.solrsearchapp.form.nbSlots.label}</label>
128 <div class="row">
129 <div class="col-sm-6">
130 <@input type='number' name="nb_consecutive_slots" min=1 value=nb_consecutive_slots!'1' />
131 </div>
132 </div>
133 </div>
134 <div class="form-group">
135 <label>
136 #i18n{module.appointment.solrsearchapp.daysOfTheWeek}
137 </label>
138 <div class="checkbox">
139 <div class="row">
140 <#if items_days_of_week??>
141 <#list items_days_of_week as item>
142 <#if item?size > 4>
143 <#if item?index == 0 || item?index == 4><div class="col-sm-6"></#if>
144 </#if>
145 <#if item.checked >
146 <label for="document_type" class="col-xs-12">
147 <input checked class="checkbox" type="checkbox" name="days_of_week" value="${item.code}" />
148 ${item.name}
149 </label>
150 <#else>
151 <label for="document_type" class="col-xs-12">
152 <input class="checkbox" type="checkbox" name="days_of_week" value="${item.code}" />
153 ${item.name}
154 </label>
155 </#if>
156 <#if item?size > 4>
157 <#if item?index == 3 || item?index == 6></div></#if>
158 </#if>
159 </#list>
160 </#if>
161 </div>
162 </div>
163 </div>
164 <div class="form-group">
165 <button type="submit" class="btn btn-primary btn-sm" name="action_search" value="#i18n{module.appointment.solrsearchapp.search}">
166 #i18n{module.appointment.solrsearchapp.search}
167 </button>
168 <button type="submit" class="btn btn-danger btn-sm" name="action_clear" value="#i18n{module.appointment.solrsearchapp.reset}">
169 #i18n{module.appointment.solrsearchapp.reset}
170 </button>
171 </div>
172 </div>
173 </form>
174 </fieldset>
175 </div>
176 </div>
177 <div class="row">
178 <div class="col-xs-12">
179 <#if (results.values)?? >
180 <#list results.values as groupcommand>
181 <#if groupcommand.values?size gt 0>
182 <h3 id="rdv_liste">#i18n{module.appointment.solrsearchapp.firstAvailableSlots}</h3>
183 <div class="nextAvailableAppointments">
184 <#list groupcommand.values as group>
185 <div>
186 <div><h4>${group.result.list[0].title?html}</h4></div>
187 <div>
188 <div>
189 <#if (group.result.list[0].appointmentslot_address_text)??>
190 <p><!-- #i18n{module.appointment.solrsearchapp.address} : -->${group.result.list[0].appointmentslot_address_text?html}</p>
191 </#if>
192 <p class="emphasize_default">#i18n{module.appointment.solrsearchapp.nextAvailableSlots} :</p>
193 <ul>
194 <#list group.result.list as slot>
195 <li>
196 <a title="${slot.date?datetime?string["dd MMMM yyyy HH:mm"]}" href="${slot.url}&nbPlacesToTake=${nb_consecutive_slots!'1'}"<#if slot_index = 0> id="link_${group.groupValue?json_string}_first_slot"</#if>>${slot.date?datetime?string["dd MMMM yyyy HH:mm"]}</a>
197 </li>
198 </#list>
199 </ul>
200 <p>${group.result.numFound - group.result.list?size} #i18n{module.appointment.solrsearchapp.otherAvailableSchedules}</p>
201 <!-- <p><span class="emphasize_default">#i18n{module.appointment.solrsearchapp.nbOfFreeSlots} :</span> ${freePlacesCount[group.groupValue]} (#i18n{module.appointment.solrsearchapp.occupancyRate} : ${((totalPlacesCount[group.groupValue] - freePlacesCount[group.groupValue]) / totalPlacesCount[group.groupValue])?string.percent})</p> -->
202 </div>
203 <div>
204 <a id="link_${group.groupValue?json_string}_full_calendar" class="btn btn-primary btn-sm" href="${group.result.list[0].url_form_string}&nbPlacesToTake=${nb_consecutive_slots!'1'}">#i18n{module.appointment.solrsearchapp.completeSchedule}</a>
205 </div>
206 </div>
207 </div>
208 </#list>
209 </div>
210 </#if>
211 </#list>
212 </#if>
213 </div>
214 </div>
215 </div>
216 </div>
217 </div>
218 <script src="js/jquery/plugins/ui/jquery-ui.min.js"></script>
219 <script src="js/jquery/plugins/ui/ui.datepicker-fr.js"></script>
220 <script>
221 $( "#from_date" ).datepicker({
222 regional: "fr",
223 changeMonth: true,
224 changeYear: true,
225 onClose: function( selectedDate ) {
226 $( "#to_date" ).datepicker( "option", "minDate", selectedDate );
227 }
228 }).datepicker( );
229 $( "#to_date" ).datepicker({
230 regional: "fr",
231 changeMonth: true,
232 changeYear: true,
233 onClose: function( selectedDate ) {
234 $( "#from_date" ).datepicker( "option", "maxDate", selectedDate );
235 }
236 });
237 <#assign comma=false>
238 window.lutece_appointment_solrsearchapp_points = [
239 <#if (results.values)??>
240 <#list results.values as groupcommand>
241 <#list groupcommand.values as group>
242 <#if (group.result.list[0].appointmentslot_geojson)??>
243 <#if comma>,<#else><#assign comma=true></#if>
244 {
245 "type": "appointment",
246 "code": "appointment",
247 "url_base": "${group.result.list[0].url_base_string?json_string}",
248 "id": "${group.result.list[0].uid_form_string?json_string}",
249 "geojson": ${group.result.list[0].appointmentslot_geojson}
250 }
251 </#if>
252 </#list>
253 </#list>
254 </#if>
255 ];
256 window.lutece_appointment_solrsearchapp_freePlaces = {
257 <#if (results.values)??>
258 <#list results.values as groupcommand>
259 <#list groupcommand.values as group>
260 "${group.groupValue?json_string}": {
261 "free": ${freePlacesCount[group.groupValue]},
262 "total": ${totalPlacesCount[group.groupValue]}
263 }<#if group_has_next>,</#if>
264 </#list>
265 </#list>
266 </#if>
267 }
268 $(document).ready(function() {
269 $("#map_col").show();
270 $("#searchForm").hide();
271 doDisplaySearchForm();
272 /*$("#advanced_search").hide();*/
273 $("#advanced_search_button").click(function () {
274 $("#advanced_search").toggle();
275 });
276 $("#tgSearchForm").click(function () {
277 doDisplaySearchForm();
278 return false;
279 });
280 function doDisplaySearchForm(){
281 var msgCarto = $('#cartomessage').html();
282 $('#message-carto').html( msgCarto );
283 $("#searchForm").toggle();
284 $("#map_col").toggleClass("col-md-8").toggleClass("col-md-12");
285 $("#tgSearchForm > i.hidden-xs").toggleClass("fa fa-chevron-left").toggleClass("fa fa-chevron-right");
286 $("#tgSearchForm > i.hidden-md").toggleClass("fa fa-angle-double-down").toggleClass("fa fa-angle-double-up");
287 $("#tgSearchForm > span.hidden-xs").toggleClass("hidden");
288 if ( typeof(map) != 'undefined' ) {
289 map.invalidateSize(true);
290 }
291 }
292 });
293 </script>