1 | {known_script id="jquery.ui" src=$ROOT_URL|@cat:"themes/default/js/ui/packed/ui.core.packed.js"} |
---|
2 | {known_script id="jquery.ui.dialog" src=$ROOT_URL|@cat:"themes/default/js/ui/packed/ui.dialog.packed.js"} |
---|
3 | {known_script id="jquery.ui.datepicker" src=$ROOT_URL|@cat:"themes/default/js/ui/packed/ui.datepicker.packed.js"} |
---|
4 | |
---|
5 | {assign var="datepicker_language" value="themes/default/js/ui/i18n/ui.datepicker-"|@cat:$lang_info.code|@cat:".js"} |
---|
6 | {if "PHPWG_ROOT_PATH"|@constant|@cat:$datepicker_language|@file_exists} |
---|
7 | {known_script id="jquery.ui.datepicker-$lang_info.code" src=$ROOT_URL|@cat:$datepicker_language} |
---|
8 | {/if} |
---|
9 | {html_head} |
---|
10 | <link rel="stylesheet" type="text/css" href="{$ROOT_URL}themes/default/js/ui/theme/ui.datepicker.css"> |
---|
11 | {/html_head} |
---|
12 | |
---|
13 | {literal} |
---|
14 | <style type='text/css'> |
---|
15 | #ui-datepicker-div { |
---|
16 | z-index:1500; |
---|
17 | display:none; |
---|
18 | } |
---|
19 | </style> |
---|
20 | |
---|
21 | <script type="text/javascript"> |
---|
22 | /** |
---|
23 | * include this template in a page and use dialogChooseASEDateBox.show({options}) to display |
---|
24 | * the dialog box |
---|
25 | * |
---|
26 | */ |
---|
27 | dialogChooseASEDateBox = function() |
---|
28 | { |
---|
29 | var dialogOptions = { |
---|
30 | id:'', |
---|
31 | eventOk:null, |
---|
32 | cBuilder:null, |
---|
33 | |
---|
34 | values: { |
---|
35 | dateType:'c', //c:creation, a:available |
---|
36 | from:'', |
---|
37 | to:'', |
---|
38 | searchType:'bt' |
---|
39 | }, |
---|
40 | }; |
---|
41 | |
---|
42 | /** |
---|
43 | * initialize the dialog box |
---|
44 | */ |
---|
45 | var initDialogBox = function() |
---|
46 | { |
---|
47 | $("#iDialogASEDateChoose") |
---|
48 | .dialog( |
---|
49 | { |
---|
50 | autoOpen: false, |
---|
51 | resizable: false, |
---|
52 | width:550, |
---|
53 | height:200, |
---|
54 | modal: true, |
---|
55 | draggable:true, |
---|
56 | dialogClass: 'gcBgTabSheet gcBorder', |
---|
57 | title: '{/literal}{"ase_choose_date"|@translate}{literal}', |
---|
58 | open: function(event, ui) |
---|
59 | { |
---|
60 | }, |
---|
61 | buttons: |
---|
62 | { |
---|
63 | '{/literal}{"ase_ok"|@translate}{literal}': |
---|
64 | function() |
---|
65 | { |
---|
66 | if(checkValidity()) |
---|
67 | { |
---|
68 | dialogOptions.values.dateType=$('[name=fASEDateDateType]:checked').val(); |
---|
69 | dialogOptions.values.from=$('#iASEDateFrom').val(); |
---|
70 | dialogOptions.values.to=$('#iASEDateTo').val(); |
---|
71 | dialogOptions.values.searchType=$('#iASEDateSearchType').val(); |
---|
72 | |
---|
73 | switch(dialogOptions.values.searchType) |
---|
74 | { |
---|
75 | case 'gt': |
---|
76 | case 'eq': |
---|
77 | dialogOptions.values.to=''; |
---|
78 | break; |
---|
79 | case 'lt': |
---|
80 | dialogOptions.values.from=''; |
---|
81 | break; |
---|
82 | } |
---|
83 | |
---|
84 | if(dialogOptions.cBuilder!=null) |
---|
85 | { |
---|
86 | setCBuilderItem(dialogOptions.id, dialogOptions.values); |
---|
87 | } |
---|
88 | |
---|
89 | if(dialogOptions.eventOk!=null) |
---|
90 | { |
---|
91 | dialogOptions.eventOk(dialogOptions.id, dialogOptions.values); |
---|
92 | } |
---|
93 | $(this).dialog('close'); |
---|
94 | } |
---|
95 | }, |
---|
96 | '{/literal}{"ase_cancel"|@translate}{literal}': |
---|
97 | function() |
---|
98 | { |
---|
99 | $(this).dialog('close'); |
---|
100 | } |
---|
101 | } |
---|
102 | } |
---|
103 | ); |
---|
104 | |
---|
105 | $("#iASEDateFrom").datepicker({dateFormat:'yy-mm-dd'}); |
---|
106 | $('#iASEDateTo').datepicker({dateFormat:'yy-mm-dd'}); |
---|
107 | $('#iASEDateSearchType').bind('change', changeSearchType); |
---|
108 | } |
---|
109 | |
---|
110 | |
---|
111 | /** |
---|
112 | * called when the search type is changed |
---|
113 | */ |
---|
114 | var changeSearchType = function () |
---|
115 | { |
---|
116 | switch($('#iASEDateSearchType').val()) |
---|
117 | { |
---|
118 | case 'bt': |
---|
119 | $("#iASEDateFromRow").show(); |
---|
120 | $("#iASEDateToRow").show(); |
---|
121 | break; |
---|
122 | case 'gt': |
---|
123 | case 'eq': |
---|
124 | $("#iASEDateFromRow").show(); |
---|
125 | $("#iASEDateToRow").hide(); |
---|
126 | break; |
---|
127 | case 'lt': |
---|
128 | $("#iASEDateFromRow").hide(); |
---|
129 | $("#iASEDateToRow").show(); |
---|
130 | break; |
---|
131 | } |
---|
132 | }; |
---|
133 | |
---|
134 | |
---|
135 | var isDate = function (s) |
---|
136 | { |
---|
137 | re=/\d{2,4}-\d\d-\d\d/i; |
---|
138 | return((re.exec(s)!=null)); |
---|
139 | } |
---|
140 | |
---|
141 | /** |
---|
142 | * check the validity of the condition |
---|
143 | * return Boolean : true if OK, otherwise false |
---|
144 | */ |
---|
145 | var checkValidity = function () |
---|
146 | { |
---|
147 | $(".error").removeClass('error'); |
---|
148 | returned=true; |
---|
149 | |
---|
150 | switch($('#iASEDateSearchType').val()) |
---|
151 | { |
---|
152 | case 'bt': |
---|
153 | if(!isDate($("#iASEDateFrom").val() )) |
---|
154 | { |
---|
155 | $("#iASEDateFrom").addClass('error'); |
---|
156 | returned=false; |
---|
157 | alert("{/literal}{'ase_error_date_from'|@translate}{literal}"); |
---|
158 | } |
---|
159 | if(!isDate($("#iASEDateTo").val() )) |
---|
160 | { |
---|
161 | $("#iASEDateTo").addClass('error'); |
---|
162 | returned=false; |
---|
163 | alert("{/literal}{'ase_error_date_to'|@translate}{literal}"); |
---|
164 | } |
---|
165 | if(returned && $("#iASEDateFrom").val() > $("#iASEDateTo").val()) |
---|
166 | { |
---|
167 | $("#iASEDateTo, #iASEDateFrom").addClass('error'); |
---|
168 | returned=false; |
---|
169 | alert("{/literal}{'ase_error_period'|@translate}{literal}"); |
---|
170 | } |
---|
171 | break; |
---|
172 | case 'gt': |
---|
173 | if(!isDate($("#iASEDateFrom").val() )) |
---|
174 | { |
---|
175 | $("#iASEDateFrom").addClass('error'); |
---|
176 | alert("{/literal}{'ase_error_date'|@translate}{literal}"); |
---|
177 | returned=false; |
---|
178 | } |
---|
179 | break; |
---|
180 | case 'lt': |
---|
181 | if(!isDate($("#iASEDateTo").val() )) |
---|
182 | { |
---|
183 | $("#iASEDateTo").addClass('error'); |
---|
184 | alert("{/literal}{'ase_error_date'|@translate}{literal}"); |
---|
185 | returned=false; |
---|
186 | } |
---|
187 | break; |
---|
188 | } |
---|
189 | |
---|
190 | return(returned); |
---|
191 | } |
---|
192 | |
---|
193 | |
---|
194 | /** |
---|
195 | * the show() function display and manage a dialog box to choose categories |
---|
196 | * and the kind of test to apply |
---|
197 | * |
---|
198 | * @param options : properties to manage the dialog box |
---|
199 | * - id : a string to identify a DOM object ; this parameter |
---|
200 | * is given to the callback when the OK button is pushed |
---|
201 | * - values : an object with 3 properties |
---|
202 | * - dateType : 'c' for creation or 'a' for available |
---|
203 | * - from : |
---|
204 | * - to : |
---|
205 | * - eventOK : a callback function, with 2 parameters : id of |
---|
206 | * the given DOM object and values parameted |
---|
207 | * - cBuilder : a criteriaBuilder object |
---|
208 | * if set, the dialog box manage automaticaly |
---|
209 | * the criteria builder interface |
---|
210 | */ |
---|
211 | this.show = function (options) |
---|
212 | { |
---|
213 | showDialog(options); |
---|
214 | } |
---|
215 | |
---|
216 | /** |
---|
217 | * private function used to show the dialog box |
---|
218 | */ |
---|
219 | var showDialog = function(options) |
---|
220 | { |
---|
221 | if(options.id!=null) |
---|
222 | { |
---|
223 | dialogOptions.id=options.id; |
---|
224 | } |
---|
225 | else |
---|
226 | { |
---|
227 | dialogOptions.id=''; |
---|
228 | } |
---|
229 | |
---|
230 | if(options.eventOk!=null) |
---|
231 | { |
---|
232 | dialogOptions.eventOk=options.eventOk; |
---|
233 | } |
---|
234 | |
---|
235 | if(options.cBuilder!=null) |
---|
236 | { |
---|
237 | dialogOptions.cBuilder=options.cBuilder; |
---|
238 | dialogOptions.cBuilder.doAction('setOptions', |
---|
239 | { |
---|
240 | onEdit:function (e) { editCB(e.data); }, |
---|
241 | onDelete:function (e) { deleteCB(e.data); }, |
---|
242 | } |
---|
243 | ); |
---|
244 | } |
---|
245 | |
---|
246 | if(options.values!=null) |
---|
247 | { |
---|
248 | dialogOptions.values=jQuery.extend(dialogOptions.values, options.values); |
---|
249 | } |
---|
250 | else |
---|
251 | { |
---|
252 | dialogOptions.values.dateType='c'; |
---|
253 | dialogOptions.values.from=''; |
---|
254 | dialogOptions.values.to=''; |
---|
255 | dialogOptions.values.searchType='bt'; |
---|
256 | } |
---|
257 | |
---|
258 | if(dialogOptions.values.dateType=='c') |
---|
259 | { |
---|
260 | $('#iASEDateDateTypeC').get(0).checked=true; |
---|
261 | } |
---|
262 | else |
---|
263 | { |
---|
264 | $('#iASEDateDateTypeA').get(0).checked=true; |
---|
265 | } |
---|
266 | $('#iASEDateFrom').val(dialogOptions.values.from); |
---|
267 | $('#iASEDateTo').val(dialogOptions.values.to); |
---|
268 | $('#iASEDateSearchType').val(dialogOptions.values.searchType); |
---|
269 | |
---|
270 | changeSearchType(); |
---|
271 | |
---|
272 | $("#iDialogASEDateChoose").dialog('open'); |
---|
273 | } |
---|
274 | |
---|
275 | |
---|
276 | |
---|
277 | /** |
---|
278 | * manage the 'edit' button from criteria builder interface |
---|
279 | * @param String itemId : the itemId |
---|
280 | */ |
---|
281 | var editCB = function (itemId) |
---|
282 | { |
---|
283 | extraData=dialogOptions.cBuilder.doAction('getExtraData', itemId); |
---|
284 | showDialog( |
---|
285 | { |
---|
286 | id:itemId, |
---|
287 | values: |
---|
288 | { |
---|
289 | dateType:extraData.param.dateType, |
---|
290 | from:extraData.param.from, |
---|
291 | to:extraData.param.from, |
---|
292 | searchType:extraData.param.searchType |
---|
293 | }, |
---|
294 | } |
---|
295 | ); |
---|
296 | } |
---|
297 | |
---|
298 | /** |
---|
299 | * manage the 'delete' button from criteria builder interface |
---|
300 | * @param String itemId : the itemId |
---|
301 | */ |
---|
302 | var deleteCB = function (itemId) |
---|
303 | { |
---|
304 | dialogOptions.cBuilder.doAction('delete', itemId); |
---|
305 | } |
---|
306 | |
---|
307 | /** |
---|
308 | * set the content for the cBuilder item |
---|
309 | */ |
---|
310 | var setCBuilderItem = function(id) |
---|
311 | { |
---|
312 | var content="<div>{/literal}{'ase_the_date'|@translate}{literal} "; |
---|
313 | |
---|
314 | if(dialogOptions.values.dateType=='c') |
---|
315 | { |
---|
316 | content+="{/literal}{'ase_image_shot'|@translate}{literal} "; |
---|
317 | } |
---|
318 | else |
---|
319 | { |
---|
320 | content+="{/literal}{'ase_image_availability'|@translate}{literal} "; |
---|
321 | } |
---|
322 | |
---|
323 | switch(dialogOptions.values.searchType) |
---|
324 | { |
---|
325 | case 'eq': |
---|
326 | content+="{/literal}{'ase_is_equal_to'|@translate}{literal} <span style='font-style:italic;'>"+dialogOptions.values.from+'</span>'; |
---|
327 | break; |
---|
328 | case 'bt': |
---|
329 | content+="{/literal}{'ase_is_between'|@translate}{literal} <span style='font-style:italic;'>"+dialogOptions.values.from+"</span> {/literal}{'ase_is_between_and'|@translate}{literal} <span style='font-style:italic;'>"+dialogOptions.values.to+"</span>"; |
---|
330 | break; |
---|
331 | case 'gt': |
---|
332 | content+="{/literal}{'ase_is_greater_or_equal'|@translate}{literal} <span style='font-style:italic;'>"+dialogOptions.values.from+"</span>"; |
---|
333 | break; |
---|
334 | case 'lt': |
---|
335 | content+="{/literal}{'ase_is_less_or_equal'|@translate}{literal} <span style='font-style:italic;'>"+dialogOptions.values.to+"</span>"; |
---|
336 | break; |
---|
337 | } |
---|
338 | content+="</div>"; |
---|
339 | |
---|
340 | |
---|
341 | if(id=='') |
---|
342 | { |
---|
343 | //no id:add a new item in the list |
---|
344 | dialogOptions.cBuilder.doAction( |
---|
345 | 'add', |
---|
346 | content, |
---|
347 | criteriaBuilder.makeExtendedData( |
---|
348 | 'ASEDate', |
---|
349 | { |
---|
350 | dateType:dialogOptions.values.dateType, |
---|
351 | searchType:dialogOptions.values.searchType, |
---|
352 | from:dialogOptions.values.from, |
---|
353 | to:dialogOptions.values.to |
---|
354 | } |
---|
355 | ) |
---|
356 | ); |
---|
357 | } |
---|
358 | else |
---|
359 | { |
---|
360 | // update item |
---|
361 | dialogOptions.cBuilder.doAction( |
---|
362 | 'edit', |
---|
363 | id, |
---|
364 | content, |
---|
365 | criteriaBuilder.makeExtendedData( |
---|
366 | 'ASEDate', |
---|
367 | { |
---|
368 | dateType:dialogOptions.values.dateType, |
---|
369 | searchType:dialogOptions.values.searchType, |
---|
370 | from:dialogOptions.values.from, |
---|
371 | to:dialogOptions.values.to |
---|
372 | } |
---|
373 | ) |
---|
374 | ); |
---|
375 | } |
---|
376 | } |
---|
377 | |
---|
378 | initDialogBox(); |
---|
379 | } |
---|
380 | |
---|
381 | |
---|
382 | </script> |
---|
383 | {/literal} |
---|
384 | |
---|
385 | <div id="iDialogASEDateChoose" style='display:none;'> |
---|
386 | |
---|
387 | <table class="formtable"> |
---|
388 | <tr> |
---|
389 | <td>{'ase_search_on_date'|@translate}</td> |
---|
390 | <td> |
---|
391 | <label><input type="radio" id="iASEDateDateTypeC" name='fASEDateDateType' value='c' > {'ase_image_shot'|@translate}</label><br> |
---|
392 | <label><input type="radio" id="iASEDateDateTypeA" name='fASEDateDateType' value='a' > {'ase_image_availability'|@translate}</label> |
---|
393 | </td> |
---|
394 | </tr> |
---|
395 | |
---|
396 | |
---|
397 | <tr> |
---|
398 | <td>{'ase_the_date'|@translate}</td> |
---|
399 | <td> |
---|
400 | <select id="iASEDateSearchType"> |
---|
401 | <option value="eq">{'ase_is_equal_to'|@translate} ...</option> |
---|
402 | <option value="bt">{'ase_is_between'|@translate} ... {'ase_is_between_and'|@translate} ...</option> |
---|
403 | <option value="gt">{'ase_is_greater_or_equal'|@translate} ... </option> |
---|
404 | <option value="lt">{'ase_is_less_or_equal'|@translate} ... </option> |
---|
405 | </select> |
---|
406 | </td> |
---|
407 | </tr> |
---|
408 | |
---|
409 | |
---|
410 | <tr id="iASEDateFromRow"> |
---|
411 | <td> </td> |
---|
412 | <td> |
---|
413 | <input type="text" id="iASEDateFrom"> |
---|
414 | </td> |
---|
415 | </tr> |
---|
416 | |
---|
417 | <tr id="iASEDateToRow"> |
---|
418 | <td> </td> |
---|
419 | <td> |
---|
420 | <input type="text" id="iASEDateTo"> |
---|
421 | </td> |
---|
422 | </tr> |
---|
423 | |
---|
424 | |
---|
425 | </table> |
---|
426 | |
---|
427 | </div> |
---|
428 | |
---|
429 | |
---|