source: extensions/lmt/templates/lmt_dialog_licence_choose.tpl @ 10974

Revision 10974, 8.6 KB checked in by grum, 9 years ago (diff)

feature:2150 - Compatibility with Piwigo 2.2

  • Property svn:executable set to *
Line 
1{combine_script id="jquery" path="themes/default/js/jquery.min.js"}
2{combine_script id="jquery.ui" path="themes/default/js/ui/minified/jquery.ui.core.min.js"}
3{combine_script id="jquery.ui.dialog" path="themes/default/js/ui/minified/jquery.ui.dialog.min.js"}
4
5{literal}
6<style type='text/css'>
7  #lmtRulesArea { border-top:1px solid; overflow:auto; margin-top:5px; }
8  img.pointer, span.pointer, div.pointer { cursor:pointer; }
9  li.valueItems {
10    -moz-border-radius:4px 4px 4px 4px;
11    border:1px solid #666666;
12    margin-bottom:5px;
13    padding:4px;
14  }
15  #iBDLMTLicenceList {
16    list-style:none;
17    margin:8px;
18    padding:0;
19  }
20  img.imgLicence { position:relative; top:3px; }
21</style>
22
23<script type="text/javascript">
24
25/**
26 * include this template in a page and use dialogChooseLMTBox.show({options}) to display
27 * the dialog box
28 *
29 */
30dialogChooseLMTBox = function()
31{
32  var licencesNfo=[
33  {/literal}
34  {foreach from=$datas.licencesList item=licence}
35    {ldelim} value:'{$licence.value}', name:'{$licence.name}' {rdelim},
36  {/foreach}
37  {literal}
38  ];
39
40  var dialogLMTOptions = {
41        id:'',
42        eventOk:null,
43        cBuilder:null,
44        licences:[],
45      };
46
47
48  /**
49   * initialize the dialog box
50   */
51  var initDialogBox = function()
52  {
53
54    $("#iDialogLMTChoose")
55    .dialog(
56      {
57        autoOpen: false,
58        resizable: false,
59        width:640,
60        height:250,
61        modal: true,
62        draggable:true,
63        dialogClass: 'gcBgTabSheet gcBorder',
64        title: '{/literal}{"lmt_choose_licence_type"|@translate}{literal}',
65        open: function(event, ui)
66        {
67        },
68        buttons:
69        {
70          '{/literal}{"lmt_ok"|@translate}{literal}':
71            function()
72            {
73              if(checkValidity())
74              {
75                if(dialogLMTOptions.cBuilder!=null)
76                {
77                  setCBuilderItem(dialogLMTOptions.id, dialogLMTOptions.licences);
78                }
79
80                if(dialogLMTOptions.eventOk!=null)
81                {
82                  dialogLMTOptions.eventOk(dialogLMTOptions.id, dialogLMTOptions.licences);
83                }
84
85                $(this).dialog('close');
86              }
87            },
88          '{/literal}{"lmt_cancel"|@translate}{literal}':
89            function()
90            {
91              $(this).dialog('close');
92            }
93        }
94      }
95    );
96
97    $('#iBDLMTAddLicence').bind('click', function () { addLicence(); } );
98
99  };
100
101
102  /**
103   * add the selected licence in list
104   */
105  var addLicence = function ()
106  {
107    value=$('#iBDLMTLicenceType').val();
108
109    if(!$('#iBDLMTLicenceType option[value='+value+']').attr('disabled'))
110    {
111      dialogLMTOptions.licences.push(value);
112      addLicenceItem(value);
113    }
114  };
115
116  /**
117   *
118   */
119  var addLicenceItem = function (value)
120  {
121    li=$("<li/>",
122          {
123            'class':'valueItems gcBgPage',
124            licence:value
125          }
126        ).append("<span><img class='imgLicence' src='./plugins/lmt/img/"+value.toLowerCase()+"_80x15.png'>&nbsp;"+getLicenceName(value)+"</span>")
127         .append($("<img/>",
128                    {
129                      {/literal}
130                      src:'{$themeconf.admin_icon_dir}/delete.png',
131                      'class':'button pointer',
132                      alt:'{"g003_delete"|@translate}',
133                      title:'{"g003_delete"|@translate}',
134                      {literal}
135                      css:{'float':'right'}
136                    }
137                  ).bind('click', function () { removeLicence(this); })
138                );
139
140    $('#iBDLMTLicenceList').append(li);
141    $('#iBDLMTLicenceType option[value='+value+']').attr('disabled', true);
142  }
143
144  /**
145   * remove the selected licence in list
146   */
147  var removeLicence = function (item)
148  {
149    value=$(item).parent().attr('licence');
150    index=dialogLMTOptions.licences.indexOf(value);
151
152    if(index>-1)
153    {
154      dialogLMTOptions.licences.splice(index,1);
155      $('#iBDLMTLicenceType option[value='+value+']').attr('disabled', false);
156      $(item).unbind().parent().remove();
157    }
158  };
159
160  /**
161   * returns the licence name
162   * @param String value : the licence value
163   * @return String : the licence name
164   */
165  var getLicenceName = function (value)
166  {
167    for(var i=0;i<licencesNfo.length;i++)
168    {
169      if(licencesNfo[i].value==value) return(licencesNfo[i].name);
170    }
171    return('');
172  }
173
174
175  /**
176   * check the validity of the condition
177   * return Boolean : true if OK, otherwise false
178   */
179  var checkValidity = function ()
180  {
181    $(".error").removeClass('error');
182    returned=true;
183
184    if(dialogLMTOptions.licences.length==0)
185    {
186      alert("{/literal}{'lmt_error_num_items'|@translate}{literal}");
187      returned=false;
188    }
189
190    return(returned);
191  }
192
193
194
195  /**
196   * the show() function display and manage a dialog box to choose
197   * a geographic area
198   *
199   * @param options : properties to manage the dialog box
200   *                  - licences : an array of string (licences)
201   *                  - id : a string to identify a DOM object ; this parameter
202   *                         is given to the callback when the OK button is pushed
203   *                  - eventOK : a callback function, with 2 parameters : id of
204   *                              the given DOM object and the bounds object
205   *                  - cBuilder : a criteriaBuilder object
206   *                               if set, the dialog box manage automaticaly
207   *                               the criteria builder interface
208   */
209  this.show = function (options)
210  {
211    showDialog(options);
212  }
213
214  /**
215   * private function used to show the dialog box
216   */
217  var showDialog = function(options)
218  {
219    if(options.licences!=null)
220    {
221      dialogLMTOptions.licences=options.licences;
222    }
223    else
224    {
225      dialogLMTOptions.licences=[];
226    }
227
228    if(options.id!=null)
229    {
230      dialogLMTOptions.id=options.id;
231    }
232    else
233    {
234      dialogLMTOptions.id='';
235    }
236
237    if(options.eventOk!=null)
238    {
239      dialogLMTOptions.eventOk=options.eventOk;
240    }
241
242    if(options.cBuilder!=null)
243    {
244      dialogLMTOptions.cBuilder=options.cBuilder;
245      dialogLMTOptions.cBuilder.doAction('setOptions',
246        {
247          onEdit:function (e) { editGA(e.data); },
248          onDelete:function (e) { deleteGA(e.data); },
249        }
250      );
251    }
252
253    $('#iBDLMTLicenceType option').attr('disabled', false);
254    $('#iBDLMTLicenceList img').unbind();
255    $('#iBDLMTLicenceList').html('');
256    for(var i=0;i<dialogLMTOptions.licences.length;i++)
257    {
258      addLicenceItem(dialogLMTOptions.licences[i]);
259    }
260
261    $("#iDialogLMTChoose").dialog('open');
262  };
263
264
265
266  /**
267   * manage the 'edit' button from criteria builder interface
268   * @param String itemId : the itemId
269   */
270  var editGA = function (itemId)
271  {
272    extraData=dialogLMTOptions.cBuilder.doAction('getExtraData', itemId);
273    showDialog(
274      {
275        id:itemId,
276        licences:extraData.param.licences
277      }
278    );
279  };
280
281  /**
282   * manage the 'delete' button from criteria builder interface
283   * @param String itemId : the itemId
284   */
285  var deleteGA = function (itemId)
286  {
287    dialogLMTOptions.cBuilder.doAction('delete', itemId);
288  };
289
290  /**
291   * set the content for the cBuilder item
292   */
293  var setCBuilderItem = function(id, licences)
294  {
295    var content="";
296
297    if(licences.length>1)
298    {
299      content="{/literal}{'lmt_search_pictures_with_licence_n'|@translate}{literal}";
300    }
301    else
302    {
303      content="{/literal}{'lmt_search_pictures_with_licence_1'|@translate}{literal}";
304    }
305
306    content+='<br><div style="font-style:italic;padding-left:15px;">';
307    for(var i=0;i<licences.length;i++)
308    {
309      content+="<img class='imgLicence' src='./plugins/lmt/img/"+licences[i].toLowerCase()+"_80x15.png'>&nbsp;"+getLicenceName(licences[i])+'<br>';
310    }
311    content+='</div>';
312
313    if(id=='')
314    {
315      //no id:add a new item in the list
316      dialogLMTOptions.cBuilder.doAction('add', content, criteriaBuilder.makeExtendedData('LMT', {licences:licences } ) );
317    }
318    else
319    {
320      // update item
321      dialogLMTOptions.cBuilder.doAction('edit', id,  content, criteriaBuilder.makeExtendedData('LMT', {licences:licences } ) );
322    }
323  };
324
325  initDialogBox();
326}
327
328
329</script>
330{/literal}
331
332<div id="iDialogLMTChoose" style='display:none;margin-top:5px;'>
333  {'lmt_licence_type'|@translate}&nbsp;
334  <select id='iBDLMTLicenceType'>
335    {foreach from=$datas.licencesList item=licence}
336      <option value='{$licence.value}'>{$licence.name}</option>
337    {/foreach}
338  </select>&nbsp;
339  <input type='button' value='{"lmt_add"|@translate}' id='iBDLMTAddLicence'>
340
341  <div id='lmtRulesArea'>
342    <ul id='iBDLMTLicenceList'>
343    </ul>
344  </div>
345</div>
346
347
Note: See TracBrowser for help on using the repository browser.