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

Last change on this file since 7139 was 7139, checked in by grum, 14 years ago

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