source: extensions/GMaps/admin/gmaps_kmlfiles.tpl @ 10551

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

bug:2148 - compatibility with piwigo 2.2
bug:2062 - compatibility with IE7
  • Property svn:executable set to *
File size: 9.2 KB
Line 
1{combine_script  id="jquery.ui" path="themes/default/js/ui/minified/jquery.ui.core.min.js"}
2{combine_script  id="jquery.ui.sortable" path="themes/default/js/ui/minified/jquery.ui.sortable.min.js"}
3{combine_script  id="jquery.ui.dialog" path="themes/default/js/ui/minified/jquery.ui.dialog.min.js"}
4
5{literal}
6
7<script type="text/javascript">
8
9
10  function kmlFileManager ()
11  {
12    var properties = {
13      id:'',
14    }
15
16
17    /**
18     * initialize the page
19     */
20    this.init = function ()
21    {
22
23      $('#iDialogEdit')
24        .dialog(
25          {
26            autoOpen:false,
27            width:800,
28            height:150,
29            modal: true,
30            dialogClass: 'gcBgTabSheet gcBorder',
31            title: '{/literal}{"gmaps_kml_file_management"|@translate}{literal}',
32            buttons:
33              {
34                '{/literal}{"gmaps_ok"|@translate}{literal}':
35                  function()
36                  {
37                    if(checkValidity()) doUpdate();
38                  },
39                '{/literal}{"gmaps_cancel"|@translate}{literal}':
40                  function()
41                  {
42                    $('#iDialogEdit').dialog("close");
43                  }
44              }
45          }
46        );
47
48      loadList();
49    }
50
51
52    /**
53     * open the dialog box to edit the kml file properties
54     *
55     * @param String id : if set to '' => open dialogbox in 'add' mode
56     *                    otherwise edit the given kml file
57     */
58    this.editKmlFile = function (id)
59    {
60      properties.id=id;
61      updateDialog('');
62
63      $('#iErrorMsg').css('display', 'none');
64
65      $('#iDialogEdit')
66        .bind('dialogopen', function ()
67          {
68            if(properties.id!='')
69            {
70              displayProcessing(true);
71
72              $.ajax(
73                {
74                  type: "POST",
75                  url: "{/literal}{$datas.urlRequest}{literal}",
76                  async: true,
77                  data: { ajaxfct:"admin.kmlFiles.getFile", id:properties.id },
78                  success:
79                    function(msg)
80                    {
81                      updateDialog(msg);
82                      displayProcessing(false);
83                    }
84                }
85              );
86            }
87          }
88        )
89        .dialog("open");
90    }
91
92    /**
93     * delete a kml file
94     *
95     * @param String id : id of the kml file to delete
96     */
97    this.deleteKmlFile = function (id)
98    {
99      $('#iErrorMsg').css('display', 'none');
100
101      $('#iDialogDelete')
102        .html('<br>{/literal}{"gmaps_pleaseConfirmKml_1"|@translate}<br><br>{"gmaps_pleaseConfirmKml_2"|@translate}{literal}')
103        .dialog(
104          {
105            autoOpen:true,
106            modal: true,
107            dialogClass: 'gcBgTabSheet gcBorder',
108            title: '{/literal}{"gmaps_deleteKml"|@translate}{literal}',
109            buttons:
110              {
111                '{/literal}{"gmaps_delete"|@translate}{literal}':
112                  function()
113                  {
114                    $(this).html("<br><img src='./plugins/GrumPluginClasses/icons/processing.gif'>");
115                    $.ajax(
116                      {
117                        type: "POST",
118                        url: "{/literal}{$datas.urlRequest}{literal}",
119                        async: true,
120                        data: { ajaxfct:"admin.kmlFiles.deleteFile", id:id },
121                        success:
122                          function(msg)
123                          {
124                            $('#iDialogDelete').dialog("destroy");
125                            loadList();
126                          }
127                      }
128                    );
129                  },
130                '{/literal}{"gmaps_cancel"|@translate}{literal}':
131                  function()
132                  {
133                    $('#iDialogDelete').dialog("destroy");
134                  }
135              }
136          }
137        );
138    }
139
140    /**
141     * update values of the dialog box
142     *
143     * @param String items : json string ; if empty assume to reset all fields
144     *                       with blank
145     */
146    var updateDialog = function (items)
147    {
148      if(items=='')
149      {
150        $('#iBDKmlId').val('');
151        $('#iBDKmlName').val('');
152        $('#iBDKmlCurrentFile').html('').css('display', 'none');
153      }
154      else
155      {
156        tmp=$.parseJSON(items);
157
158        $('#iBDKmlId').val(tmp.id);
159        $('#iBDKmlName').val(tmp.name);
160        $('#iBDKmlCurrentFile').html(tmp.file+' ('+tmp.fileSizeUnits+', '+tmp.fileDate+')').css('display', 'block');
161
162        properties.id=tmp.id;
163      }
164      $('#iBDKmlFile').val('');
165    }
166
167    /**
168     * reload the assocation list
169     */
170    var loadList = function ()
171    {
172      $('#iListKml').html("<br>{/literal}{'gmaps_loading'|@translate}{literal}<br><img src='./plugins/GrumPluginClasses/icons/processing.gif'>");
173
174      $.ajax(
175        {
176          type: "POST",
177          url: "{/literal}{$datas.urlRequest}{literal}",
178          async: true,
179          data: { ajaxfct:"admin.kmlFiles.getList" },
180          success:
181            function(msg)
182            {
183              $("#iListKml").html(msg);
184            }
185        }
186      );
187    }
188
189
190    /**
191     * check for the validity of the map settings
192     */
193    var checkValidity = function ()
194    {
195      $('.error').removeClass('error');
196      ok=true;
197
198      if($('#iBDKmlId').val()=='' && $('#iBDKmlFile').val()=='')
199      {
200        $('#iBDKmlFile').addClass('error');
201        alert('{/literal}{"gmaps_file_required"|@translate}{literal}');
202        ok=false;
203      }
204
205      re=/.*(\.kml|\.kmz)$/i;
206      if($('#iBDKmlFile').val()!='' && re.exec($('#iBDKmlFile').val())==null)
207      {
208        $('#iBDKmlFile').addClass('error');
209        alert('{/literal}{"gmaps_file_is_not_kml_kmz"|@translate}{literal}');
210        ok=false;
211      }
212
213      return(ok);
214    }
215
216    /**
217     * send assoc update to the server, and close the dialog box if everything
218     * is ok
219     */
220    var doUpdate = function ()
221    {
222      displayProcessing(true);
223
224      if($('#iBDKmlFile').val()!='')
225      {
226        /*
227         * because it's not possible to upload file through ajax, using the
228         * standard FORM method
229         */
230
231        $('#iBDKmlForm').get(0).submit();
232      }
233      else
234      {
235        // there is only the name to change, use an ajax call
236        $.ajax(
237          {
238            type: "POST",
239            url: "{/literal}{$datas.urlRequest}{literal}",
240            async: true,
241            data: { ajaxfct:"admin.kmlFiles.setFile", id:properties.id, name:$('#iBDKmlName').val() },
242            success:
243              function(msg)
244              {
245                displayProcessing(false);
246
247                if(msg.match(/^[0-9]+$/i)!=null)
248                {
249                  // result Ok ! => close the dialog box and reload the list
250                  $('#iDialogEdit').dialog("close");
251                  loadList();
252                }
253                else
254                {
255                  returned=msg.split('!');
256                  if(returned[0]!='') $('#'+returned[0]).addClass('error');
257                  alert(returned[1]);
258                }
259              }
260          }
261        );
262      }
263
264    }
265
266    /**
267     * display or hide the processing flower
268     */
269    var displayProcessing = function (visible)
270    {
271      if(visible)
272      {
273        $('#iBDProcessing').css("display", "block");
274      }
275      else
276      {
277        $('#iBDProcessing').css("display", "none");
278      }
279    }
280
281    this.init();
282  }
283
284
285</script>
286
287{/literal}
288
289
290
291<h2>{'gmaps_kml_files_management'|@translate}</h2>
292
293
294<div class='addMap'>
295  <a onclick="km.editKmlFile('');">{'gmaps_add_a_new_kmlFile'|@translate}</a>
296</div>
297
298
299<table id='iHeaderListMaps' class="littlefont">
300  <tr>
301    <th>{'gmaps_name'|@translate}</th>
302    <th style="width:300px;">{'gmaps_file'|@translate}</th>
303    <th style="width:180px;">{'gmaps_date'|@translate}</th>
304    <th style="width:90px;">{'gmaps_file_size'|@translate}</th>
305    <th style="width:90px;">{'gmaps_nb_assoc'|@translate}</th>
306    <th width="40px">&nbsp;</th>
307
308  </tr>
309</table>
310
311
312
313<div id='iListKml' class="{$themeconf.name}">
314</div>
315<div id="iListKmlNb"></div>
316
317<div id="iDialogDelete">
318</div>
319
320<div id="iDialogEdit">
321  <div id='iBDProcessing' style="display:none;position:absolute;width:100%;height:100%;background:#000000;opacity:0.75">
322      <img src="plugins/GrumPluginClasses/icons/processing.gif" style="margin-top:100px;">
323  </div>
324
325  <form id='iBDKmlForm' action="{$datas.urlRequest}" method="POST" enctype="multipart/form-data">
326
327    <table class="formtable">
328      <tr>
329        <td>{'gmaps_name'|@translate}</td>
330        <td>
331          <input type='hidden' id='iBDKmlId' name ="id" value=''>
332          <input type='hidden' id='iBDKmlAjaxFct' name="ajaxfct" value='admin.kmlFiles.setFile'>
333          <input type='text' id='iBDKmlName' name='name' value='' maxlength=255 size=60>
334        </td>
335      </tr>
336
337      <tr id='iBDKmlFileInputRow'>
338        <td>{'gmaps_file'|@translate}</td>
339        <td>
340          <div id='iBDKmlCurrentFile' name='iBDKmlCurrentFile' class='gcBorderInput gcBgInput gcTextInput' style='display:block;margin-bottom:2px;padding:2px;'></div>
341          <input type='file' size=60 id='iBDKmlFile' name="file" value='' accept='kml'>
342        </td>
343      </tr>
344
345    </table>
346
347  </form>
348</div>
349
350
351
352
353
354{literal}
355<script type="text/javascript">
356  var km=new kmlFileManager();
357</script>
358{/literal}
359
Note: See TracBrowser for help on using the repository browser.