source: extensions/GMaps/admin/gmaps_category_maps.tpl @ 7309

Last change on this file since 7309 was 7309, checked in by grum, 13 years ago

some files forgotten on the previous commit

File size: 15.9 KB
Line 
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.sortable" src=$ROOT_URL|@cat:"themes/default/js/ui/packed/ui.sortable.packed.js"}
3{known_script id="jquery.ui.dialog" src=$ROOT_URL|@cat:"themes/default/js/ui/packed/ui.dialog.packed.js"}
4{known_script id="gpc.ui.iconSelector" src=$ROOT_URL|@cat:"plugins/GrumPluginClasses/js/ui.iconSelector.packed.js"}
5{known_script id="gpc.ui.categorySelector" src=$ROOT_URL|@cat:"plugins/GrumPluginClasses/js/ui.categorySelector.packed.js"}
6{known_script id="maps.google.com/api" src="http://maps.google.com/maps/api/js?sensor=false"}
7
8{literal}
9
10<script type="text/javascript">
11
12
13  function assocManager ()
14  {
15    var properties = {
16      id:'',
17    }
18
19
20    /**
21     * initialize the page
22     */
23    this.init = function ()
24    {
25
26      $('#iDialogEdit')
27        .dialog(
28          {
29            autoOpen:false,
30            width:800,
31            height:480,
32            modal: true,
33            dialogClass: 'gcBgTabSheet gcBorder',
34            title: '{/literal}{"gmaps_manage_assoc"|@translate}{literal}',
35            open: function () {
36                $('#iBDAssocCatId').categorySelector('listMaxHeight', $('#iDialogEdit').height()-$('#iBDAssocCatId').position().top-$('#iBDAssocCatId').height());
37              },
38
39            buttons:
40              {
41                '{/literal}{"gmaps_ok"|@translate}{literal}':
42                  function()
43                  {
44                    if(checkValidity()) doUpdate();
45                  },
46                '{/literal}{"gmaps_cancel"|@translate}{literal}':
47                  function()
48                  {
49                    $('#iDialogEdit').dialog("close");
50                  }
51              }
52          }
53        );
54
55      $('#iBDAssocCatId').categorySelector(
56        {
57          listMaxWidth:600,
58          listMaxHeight:500,
59          displayStatus:true,
60          levelIndent:20,
61          userMode:'admin',
62          load: function (event) { $(this).categorySelector('expand', ':all+0'); }
63        }
64      );
65
66      $('#iBDAssocIcon').iconSelector(
67        {
68          images:[
69          {/literal}
70            {foreach from=$datas.icons item=icon name=list}
71              "plugins/GMaps/img/{$icon.file}"
72              {if !$smarty.foreach.list.last},{/if}
73            {/foreach}
74          {literal}
75          ],
76          cellWidth:42,
77          cellHeight:28
78        }
79      );
80
81      $('#iBDAssocMarker').iconSelector(
82        {
83          images:[
84          {/literal}
85            {foreach from=$datas.markers item=marker name=list}
86              "plugins/GMaps/img/{$marker.file}"
87              {if !$smarty.foreach.list.last},{/if}
88            {/foreach}
89          {literal}
90          ],
91          cellWidth:32,
92          cellHeight:40,
93          numCols:13,
94          numRows:4
95        }
96      );
97
98      $('#iBDAssocMapId').bind('change', changeMapDisplayType);
99      $('[name=fBDAssocKmlFile]').bind('change', changeKmlFileSource);
100
101      loadList();
102    }
103
104
105    /**
106     * called when the source of kml file changed
107     */
108    var changeKmlFileSource = function ()
109    {
110      switch($('[name=fBDAssocKmlFile]:checked').val())
111      {
112        case 'N':
113          $('#iBDAssocKmlFileId').css('display', 'none');
114          $('#iBDAssocKmlFileUrl').css('display', 'none');
115          $('#iBDKmlWarning').css('display', 'none');
116          break;
117        case 'S':
118          $('#iBDAssocKmlFileId').css('display', 'block');
119          $('#iBDAssocKmlFileUrl').css('display', 'none');
120          $('#iBDKmlWarning').css('display', 'block');
121          break;
122        case 'U':
123          $('#iBDAssocKmlFileId').css('display', 'none');
124          $('#iBDAssocKmlFileUrl').css('display', 'block');
125          $('#iBDKmlWarning').css('display', 'block');
126          break;
127      }
128    }
129
130    /**
131     * called when the map is changed
132     * refresh the icon list
133     */
134    var changeMapDisplayType = function ()
135    {
136      switch($('#iBDAssocMapId option:selected').attr('dtype'))
137      {
138        case 'IC':
139        case 'IP':
140          $('#iBDAssocIconRow').show();
141          break;
142        case 'MP':
143          $('#iBDAssocIconRow').hide();
144          break;
145      }
146    }
147
148
149    /**
150     * manage the tabsheet
151     *
152     * @param String tabsheet : id of the tabsheet to display
153     */
154    this.displayTab = function (tabsheet)
155    {
156      switch(tabsheet)
157      {
158        case 'integration':
159          $('#iTabIntegration').css('display', 'block');
160          $('#iTabAssoc').css('display', 'none');
161          break;
162        case 'assoc':
163          $('#iTabIntegration').css('display', 'none');
164          $('#iTabAssoc').css('display', 'block');
165          break;
166      }
167    }
168
169
170    /**
171     * open the dialog box to edit the association properties
172     *
173     * @param String id : if set to '' => open dialogbox in 'add' mode
174     *                    otherwise edit the given association
175     */
176    this.editAssoc = function (id)
177    {
178      properties.id=id;
179      updateDialog('');
180      this.displayTab('assoc');
181      // >> because li items don't have id... :-(
182      $('#itab2 li').removeClass('selected_tab').addClass('normal_tab');
183      $('#itab2 li:first').addClass('selected_tab');
184      // <<
185
186      $('#iDialogEdit')
187        .bind('dialogopen', function ()
188          {
189            if(properties.id!='')
190            {
191              displayProcessing(true);
192
193              $.ajax(
194                {
195                  type: "POST",
196                  url: "{/literal}{$datas.urlRequest}{literal}",
197                  async: true,
198                  data: { ajaxfct:"admin.assoc.getAssoc", id:properties.id },
199                  success:
200                    function(msg)
201                    {
202                      updateDialog(msg);
203                      displayProcessing(false);
204                    }
205                }
206              );
207            }
208          }
209        )
210        .dialog("open");
211    }
212
213    /**
214     * delete an association
215     *
216     * @param String id : id of the association to delete
217     */
218    this.deleteAssoc = function (id)
219    {
220      $('#iDialogDelete')
221        .html("<br>{/literal}{'gmaps_pleaseConfirmDeletingAssoc'|@translate}{literal}")
222        .dialog(
223          {
224            autoOpen:true,
225            modal: true,
226            dialogClass: 'gcBgTabSheet gcBorder',
227            title: '{/literal}{"gmaps_deleteAssoc"|@translate}{literal}',
228            buttons:
229              {
230                '{/literal}{"gmaps_delete"|@translate}{literal}':
231                  function()
232                  {
233                    $(this).html("<br><img src='./plugins/GrumPluginClasses/icons/processing.gif'>");
234                    $.ajax(
235                      {
236                        type: "POST",
237                        url: "{/literal}{$datas.urlRequest}{literal}",
238                        async: true,
239                        data: { ajaxfct:"admin.assoc.deleteAssoc", id:id },
240                        success:
241                          function(msg)
242                          {
243                            $('#iDialogDelete').dialog("destroy");
244                            loadList();
245                          }
246                      }
247                    );
248                  },
249                '{/literal}{"gmaps_cancel"|@translate}{literal}':
250                  function()
251                  {
252                    $('#iDialogDelete').dialog("destroy");
253                  }
254              }
255          }
256        );
257    }
258
259    /**
260     * update values of the dialog box
261     *
262     * @param String items : json string ; if empty assume to reset all fields
263     *                       with blank
264     */
265    var updateDialog = function (items)
266    {
267      if(items=='')
268      {
269        $('#iBDAssocCatId').categorySelector('value', ':first');
270        $('#iBDAssocMapId').val($('#iBDAssocMapId option:first').val());
271        $('#iBDAssocApplySubCat').val('y');
272        $('#iBDAssocKmlNone').attr('checked', true);
273        $('#iBDAssocKmlFileId').val($('#iBDAssocKmlFileId option:first').val());
274        $('#iBDAssocKmlFileUrl').val('');
275        $('#iBDAssocIcon, #iBDAssocMarker').iconSelector('value', ':first');
276        $('#iBDAssocTitle').val('');
277      }
278      else
279      {
280        tmp=$.parseJSON(items);
281
282        $('#iBDAssocCatId').categorySelector('value', tmp.categoryId).categorySelector('expand', tmp.categoryId+'+');
283        $('#iBDAssocMapId').val(tmp.mapId);
284        $('#iBDAssocApplySubCat').val(tmp.applySubCat);
285        if(tmp.kmlFileId>0)
286        {
287          $('#iBDAssocKmlSelect').attr('checked', true);
288        }
289        else if(tmp.kmlFileUrl!='')
290        {
291          $('#iBDAssocKmlUrl').attr('checked', true);
292        }
293        else
294        {
295          $('#iBDAssocKmlNone').attr('checked', true);
296        }
297        $('#iBDAssocKmlFileId').val(tmp.kmlFileId);
298        $('#iBDAssocKmlFileUrl').val(tmp.kmlFileUrl);
299        $('#iBDAssocIcon').iconSelector('value', 'plugins/GMaps/img/'+tmp.icon);
300        $('#iBDAssocMarker').iconSelector('value', 'plugins/GMaps/img/'+tmp.marker);
301        $('#iBDAssocTitle').val(tmp.title);
302      }
303
304      changeMapDisplayType();
305      changeKmlFileSource();
306    }
307
308    /**
309     * reload the assocation list
310     */
311    var loadList = function ()
312    {
313      $('#iListAssoc').html("<br>{/literal}{'gmaps_loading'|@translate}{literal}<br><img src='./plugins/GrumPluginClasses/icons/processing.gif'>");
314
315      $.ajax(
316        {
317          type: "POST",
318          url: "{/literal}{$datas.urlRequest}{literal}",
319          async: true,
320          data: { ajaxfct:"admin.assoc.getList" },
321          success:
322            function(msg)
323            {
324              $("#iListAssoc").html(msg);
325            }
326        }
327      );
328    }
329
330
331    /**
332     * check for the validity of the map settings
333     */
334    var checkValidity = function ()
335    {
336      $('.error').removeClass('error');
337      ok=true;
338/*
339      if(checkIdValidity($('#iBDMapId').val())==false)
340      {
341        $('#iBDMapId').addClass('error');
342        alert('{/literal}{"gmaps_invalidId"|@translate}{literal}');
343        ok=false;
344      }
345*/
346      return(ok);
347    }
348
349    /**
350     * send assoc update to the server, and close the dialog box if everything
351     * is ok
352     */
353    var doUpdate = function ()
354    {
355      displayProcessing(true);
356
357      // build datas
358      datas = {
359        categoryId:$('#iBDAssocCatId').categorySelector('value'),
360        mapId:$('#iBDAssocMapId').val(),
361        applySubCat:$('#iBDAssocApplySubCat').val(),
362        kmlFileId:($('#iBDAssocKmlSelect').attr('checked'))?$('#iBDAssocKmlFileId').val():0,
363        kmlFileUrl:($('#iBDAssocKmlSelect').attr('checked'))?'':$('#iBDAssocKmlFileUrl').val(),
364        icon:$('#iBDAssocIcon').iconSelector('value'),
365        marker:$('#iBDAssocMarker').iconSelector('value'),
366        title:$('#iBDAssocTitle').val(),
367      }
368
369      $.ajax(
370        {
371          type: "POST",
372          url: "{/literal}{$datas.urlRequest}{literal}",
373          async: true,
374          data: { ajaxfct:"admin.assoc.setAssoc", id:properties.id, datas:datas },
375          success:
376            function(msg)
377            {
378              displayProcessing(false);
379
380              if(msg.match(/^[0-9]+$/i)!=null)
381              {
382                // result Ok ! => close the dialog box and reload the list
383                $('#iDialogEdit').dialog("close");
384                loadList();
385              }
386              else
387              {
388                returned=msg.split('!');
389                if(returned[0]!='') $('#'+returned[0]).addClass('error');
390                alert(returned[1]);
391              }
392            }
393        }
394      );
395    }
396
397    /**
398     * display or hide the processing flower
399     */
400    var displayProcessing = function (visible)
401    {
402      if(visible)
403      {
404        $('#iBDProcessing').css("display", "block");
405      }
406      else
407      {
408        $('#iBDProcessing').css("display", "none");
409      }
410    }
411
412    this.init();
413  }
414
415
416</script>
417
418{/literal}
419
420
421
422<h2>{'gmaps_associate_category_maps'|@translate}</h2>
423
424
425<div class='addMap'>
426  <a onclick="am.editAssoc('');">{'gmaps_add_a_new_association'|@translate}</a>
427</div>
428
429
430<table id='iHeaderListMaps' class="littlefont">
431  <tr>
432    <th>{'gmaps_category'|@translate}</th>
433    <th style="width:90px;">{'gmaps_apply_subcat'|@translate}</th>
434    <th style="width:150px;">{'gmaps_mapType'|@translate}</th>
435    <th style="width:350px;">{'gmaps_map'|@translate}</th>
436    <th style="width:220px;">{'gmaps_map_associate_kmlfile'|@translate}</th>
437    <th width="40px">&nbsp;</th>
438  </tr>
439</table>
440
441
442
443<div id='iListAssoc' class="{$themeconf.name}">
444</div>
445<div id="iListAssocNb"></div>
446
447<div id="iDialogDelete">
448</div>
449
450<div id="iDialogEdit">
451  <div id='iBDProcessing' style="display:none;position:absolute;width:100%;height:100%;background:#000000;opacity:0.75">
452      <img src="plugins/GrumPluginClasses/icons/processing.gif" style="margin-top:100px;">
453  </div>
454
455  {$mapTabsheet}
456  <form>
457
458    <div id='iTabsContainer' style='height:100px;'>
459
460
461      <div id='iTabAssoc' style='display:none;'>
462        <table class="formtable">
463          <tr>
464            <td>{'gmaps_map'|@translate}</td>
465            <td>
466              <select id='iBDAssocMapId'>
467                  {foreach from=$datas.maps key=group item=mapGroup}
468                    <optgroup label="{'gmaps_displayTypeShort'|cat:$group|@translate}">
469                    {foreach from=$mapGroup item=map}
470                      <option value='{$map.id}' dtype='{$group}'>{$map.name}</option>
471                    {/foreach}
472                    </optgroup>
473                  {/foreach}
474              </select>
475            </td>
476          </tr>
477
478          <tr>
479            <td>{'gmaps_category'|@translate}</td>
480            <td>
481              <div id='iBDAssocCatId'></div>
482            </td>
483          </tr>
484
485          <tr>
486            <td>{'gmaps_apply_subcat'|@translate}</td>
487            <td>
488              <select id='iBDAssocApplySubCat'>
489                <option value='y'>{'gmaps_y'|@translate}</option>
490                <option value='n'>{'gmaps_n'|@translate}</option>
491              </select>
492            </td>
493          </tr>
494
495        </table>
496      </div>
497
498
499      <div id='iTabIntegration' style='display:none;'>
500        <table class='formtable'>
501
502          <tr id='iBDAssocTitleRow'>
503            <td>{'gmaps_map_title'|@translate}</td>
504            <td>
505              <input type="text" id='iBDAssocTitle' value='{$datas.title}' maxlength='200' size='55'>
506            </td>
507          </tr>
508
509          <tr id='iBDAssocIconRow'>
510            <td>{'gmaps_map_icon'|@translate}</td>
511            <td>
512              <div id='iBDAssocIcon'></div>
513              <p id='iBDKmlIconWarning' class='helps' style="width:520px;padding-right:20px;">{'gmaps_icon_info'|@translate}</p>
514            </td>
515          </tr>
516
517
518          <tr>
519            <td>{'gmaps_map_marker'|@translate}</td>
520            <td>
521              <div id='iBDAssocMarker'></div>
522            </td>
523          </tr>
524
525
526          <tr>
527            <td>{'gmaps_map_associate_kmlfile'|@translate}</td>
528            <td>
529              <label><input type="radio" id='iBDAssocKmlNone' name="fBDAssocKmlFile" value="N">&nbsp;{'gmaps_kml_file_none'|@translate}</label><br>
530              <label><input type="radio" id='iBDAssocKmlSelect' name="fBDAssocKmlFile" value="S">&nbsp;{'gmaps_kml_file_selected'|@translate}</label><br>
531              <select style="margin-left:20px;margin-bottom:10px;"  id="iBDAssocKmlFileId">
532                {foreach from=$datas.kmlFiles item=file}
533                  <option value='{$file.id}'>{$file.name}</option>
534                {/foreach}
535              </select>
536
537              <label><input type="radio" id='iBDAssocKmlUrl' name="fBDAssocKmlFile" value="U">&nbsp;{'gmaps_kml_file_url'|@translate}</label><br>
538              <input style="margin-left:20px;" type="text" id="iBDAssocKmlFileUrl" maxlength='255' size='55' value=""><br>
539              <p id='iBDKmlWarning' class='helps' style="width:520px;padding-right:20px;">{'gmaps_kml_file_access'|@translate}</p>
540
541            </td>
542          </tr>
543
544
545        </table>
546      </div>
547
548    </div>
549
550  </form>
551</div>
552
553
554
555
556
557{literal}
558<script type="text/javascript">
559  var am=new assocManager();
560</script>
561{/literal}
562
Note: See TracBrowser for help on using the repository browser.