source: extensions/instagram2piwigo/admin/template/import.list_photos.tpl @ 19711

Last change on this file since 19711 was 19711, checked in by mistic100, 11 years ago

now fetch the good data
File size: 13.3 KB
Line 
1{include file='include/colorbox.inc.tpl'}
2{include file='include/add_album.inc.tpl'}
3{combine_script id='jquery.ajaxmanager' load='footer' path='themes/default/js/plugins/jquery.ajaxmanager.js'}
4{combine_script id='jquery.jgrowl' load='footer' require='jquery' path='themes/default/js/plugins/jquery.jgrowl_minimized.js'}
5{combine_css path="admin/themes/default/uploadify.jGrowl.css"}
6
7{footer_script require='jquery.ajaxmanager,jquery.jgrowl'}
8/* global vars */
9var nb_thumbs_page = {$nb_thumbs_page};
10var nb_thumbs_set = {$nb_thumbs_set};
11var all_elements = [{if !empty($all_elements)}{','|@implode:$all_elements}{/if}];
12
13var errorHead   = '{'ERROR'|@translate|@escape:'javascript'}';
14var errorMsg    = '{'an error happened'|@translate|@escape:'javascript'}';
15var successHead = '{'Success'|@translate|@escape:'javascript'}';
16var selectedMessage_pattern = "{'%d of %d photos selected'|@translate}";
17var selectedMessage_none = "{'No photo selected, %d photos in current set'|@translate}";
18var selectedMessage_all = "{'All %d photos are selected'|@translate}";
19var applyOnDetails_pattern = "{'on the %d selected photos'|@translate}";
20
21var import_done = 0;
22var import_selected = 0;
23var queuedManager = jQuery.manageAjax.create('queued', {ldelim}
24  queue: true, 
25  maxRequests: 1
26});
27
28{literal}
29/* Shift-click: select all photos between the click and the shift+click */
30jQuery(document).ready(function() {
31  var last_clicked=0;
32  var last_clickedstatus=true;
33  jQuery.fn.enableShiftClick = function() {
34    var inputs = [];
35    var count=0;
36    var This=$(this);
37    this.find('input[type=checkbox]').each(function() {
38      var pos=count;
39      inputs[count++]=this;
40      $(this).bind("shclick", function (dummy,event) {
41        if (event.shiftKey) {
42          var first = last_clicked;
43          var last = pos;
44          if (first > last) {
45            first=pos;
46            last=last_clicked;
47          }
48
49          for (var i=first; i<=last;i++) {
50            input = $(inputs[i]);
51            $(input).attr('checked', last_clickedstatus);
52            if (last_clickedstatus)
53            {
54              $(input).siblings("span.wrap2").addClass("thumbSelected");
55            }
56            else
57            {
58              $(input).siblings("span.wrap2").removeClass("thumbSelected");
59            }
60          }
61        }
62        else {
63          last_clicked = pos;
64          last_clickedstatus = this.checked;
65        }
66        return true;
67      });
68      $(this).click(function(event) {console.log(event.shiftKey);$(this).triggerHandler("shclick",event)});
69    });
70  }
71});
72
73/* sprintf */
74function str_repeat(i, m) {
75    for (var o = []; m > 0; o[--m] = i);
76    return o.join('');
77}
78
79function sprintf() {
80  var i = 0, a, f = arguments[i++], o = [], m, p, c, x, s = '';
81  while (f) {
82    if (m = /^[^\x25]+/.exec(f)) {
83      o.push(m[0]);
84    }
85    else if (m = /^\x25{2}/.exec(f)) {
86      o.push('%');
87    }
88    else if (m = /^\x25(?:(\d+)\$)?(\+)?(0|'[^$])?(-)?(\d+)?(?:\.(\d+))?([b-fosuxX])/.exec(f)) {
89      if (((a = arguments[m[1] || i++]) == null) || (a == undefined)) {
90        throw('Too few arguments.');
91      }
92      if (/[^s]/.test(m[7]) && (typeof(a) != 'number')) {
93        throw('Expecting number but found ' + typeof(a));
94      }
95      switch (m[7]) {
96        case 'b': a = a.toString(2); break;
97        case 'c': a = String.fromCharCode(a); break;
98        case 'd': a = parseInt(a); break;
99        case 'e': a = m[6] ? a.toExponential(m[6]) : a.toExponential(); break;
100        case 'f': a = m[6] ? parseFloat(a).toFixed(m[6]) : parseFloat(a); break;
101        case 'o': a = a.toString(8); break;
102        case 's': a = ((a = String(a)) && m[6] ? a.substring(0, m[6]) : a); break;
103        case 'u': a = Math.abs(a); break;
104        case 'x': a = a.toString(16); break;
105        case 'X': a = a.toString(16).toUpperCase(); break;
106      }
107      a = (/[def]/.test(m[7]) && m[2] && a >= 0 ? '+'+ a : a);
108      c = m[3] ? m[3] == '0' ? '0' : m[3].charAt(1) : ' ';
109      x = m[5] - String(a).length - s.length;
110      p = m[5] ? str_repeat(c, x) : '';
111      o.push(s + (m[4] ? a + p : p + a));
112    }
113    else {
114      throw('Huh ?!');
115    }
116    f = f.substring(m[0].length);
117  }
118  return o.join('');
119}
120
121/* update displaying */
122function checkPermitAction() {
123  var nbSelected = 0;
124  if ($("input[name=setSelected]").is(':checked')) {
125    nbSelected = nb_thumbs_set;
126  } else {
127    $(".thumbnails input[type=checkbox]").each(function() {
128      if ($(this).is(':checked')) nbSelected++;
129    });
130  }
131
132  if (nbSelected == 0) {
133    $("#beginImport").hide();
134  } else {
135    $("#beginImport").show();
136  }
137
138  $("#applyOnDetails").text(
139    sprintf(
140      applyOnDetails_pattern,
141      nbSelected
142    )
143  );
144
145  // display the number of currently selected photos in the "Selection" fieldset
146  if (nbSelected == 0) {
147    $("#selectedMessage").text(
148      sprintf(
149        selectedMessage_none,
150        nb_thumbs_set
151      )
152    );
153  } else if (nbSelected == nb_thumbs_set) {
154    $("#selectedMessage").text(
155      sprintf(
156        selectedMessage_all,
157        nb_thumbs_set
158      )
159    );
160  } else {
161    $("#selectedMessage").text(
162      sprintf(
163        selectedMessage_pattern,
164        nbSelected,
165        nb_thumbs_set
166      )
167    );
168  }
169}
170
171/* import queue */
172function performImport(photo, album, fills) {
173  queuedManager.add({
174    type: 'GET',
175    dataType: 'json',
176    url: 'ws.php',
177    data: { method: 'pwg.images.addInstagram', id: photo, category: album, fills: fills, format: 'json' },
178    success: function(data) {
179      if (data['stat'] == 'ok') {
180        jQuery.jGrowl(data['result'], { theme: 'success', header: successHead, life: 4000, sticky: false });
181        jQuery("#photo-"+photo).fadeOut(function(){ $(this).remove(); });
182      } else {
183        jQuery.jGrowl(data['result'], { theme: 'error', header: errorHead, sticky: true });
184      }
185     
186      import_done++;
187      $("#progress").html(import_done +"/"+ import_selected);
188     
189      if (import_done == import_selected) {
190        $("#import_form").append('<input type="hidden" name="done" value="' + import_done + '">');
191        $("#import_form").submit();
192      }
193    },
194    error: function(data) {
195      jQuery.jGrowl(errorMsg, { theme: 'error', header: errorHead, sticky: true });
196    }
197  });
198}
199
200
201$(document).ready(function() {
202  checkPermitAction();
203  $("a.preview-box").colorbox({
204    initialWidth:306,
205    initialHeight:306
206  });
207  $('ul.thumbnails').enableShiftClick();
208
209  /* tiptip */
210  $('img.thumbnail').tipTip({
211    'delay' : 0,
212    'fadeIn' : 200,
213    'fadeOut' : 200
214  });
215
216  /* thumbnail click */
217  $(".wrap1 label").click(function (event) {
218    $("input[name=setSelected]").attr('checked', false);
219
220    var wrap2 = $(this).children(".wrap2");
221    var checkbox = $(this).children("input[type=checkbox]");
222
223    checkbox.triggerHandler("shclick",event);
224
225    if ($(checkbox).is(':checked')) {
226      $(wrap2).addClass("thumbSelected");
227    }
228    else {
229      $(wrap2).removeClass('thumbSelected');
230    }
231
232    checkPermitAction();
233  });
234
235  /* select all */
236  $("#selectAll").click(function () {
237    $("input[name=setSelected]").attr('checked', false);
238   
239    $(".thumbnails label").each(function() {
240      var wrap2 = $(this).children(".wrap2");
241      var checkbox = $(this).children("input[type=checkbox]");
242
243      $(checkbox).attr('checked', true);
244      $(wrap2).addClass("thumbSelected");
245    });
246   
247    checkPermitAction();
248    return false;
249  });
250
251  /* select none */
252  $("#selectNone").click(function () {
253    $("input[name=setSelected]").attr('checked', false);
254   
255    $(".thumbnails label").each(function() {
256      var wrap2 = $(this).children(".wrap2");
257      var checkbox = $(this).children("input[type=checkbox]");
258
259      $(checkbox).attr('checked', false);
260      $(wrap2).removeClass("thumbSelected");
261    });
262   
263    checkPermitAction();
264    return false;
265  });
266
267  /* select invert */
268  $("#selectInvert").click(function () {
269    $("input[name=setSelected]").attr('checked', false);
270   
271    $(".thumbnails label").each(function() {
272      var wrap2 = $(this).children(".wrap2");
273      var checkbox = $(this).children("input[type=checkbox]");
274
275      $(checkbox).attr('checked', !$(checkbox).is(':checked'));
276
277      if ($(checkbox).is(':checked')) {
278        $(wrap2).addClass("thumbSelected");
279      } else {
280        $(wrap2).removeClass('thumbSelected');
281      }
282    });
283   
284    checkPermitAction();
285    return false;
286  });
287 
288  /* select set */
289  $("#selectSet").click(function () {
290    $("input[name=setSelected]").attr('checked', true);
291   
292    $(".thumbnails label").each(function() {
293      var wrap2 = $(this).children(".wrap2");
294      var checkbox = $(this).children("input[type=checkbox]");
295
296      $(checkbox).attr('checked', true);
297      $(wrap2).addClass("thumbSelected");
298    });
299   
300    checkPermitAction();
301    return false;
302  });
303 
304  /* begin import */
305  jQuery('#beginImport').click(function() {
306    $("#loader_import").fadeIn();
307    var album = $("#albumSelect option:selected").val();
308   
309    var fills = '';
310    $("input[name^='fill_']:checked").each(function() {
311      fills+= $(this).attr("name") +',';
312    });
313   
314    if (jQuery('input[name="setSelected"]').attr('checked')) {
315      import_selected = all_elements.length;
316      $("#progress").html("0/"+ import_selected);
317     
318      for (var i in all_elements) {
319        performImport(all_elements[i], album, fills);
320      }
321                } else {
322      import_selected = $("input[name='selection[]']:checked").length;
323      $("#progress").html("0/"+ import_selected);
324     
325                        jQuery("input[name='selection[]']:checked").each(function() {
326        performImport(jQuery(this).attr('value'), album, fills);
327      });
328    }
329   
330    return false;
331  });
332 
333  /* pagination loader */
334  jQuery('#navigation a').click(function() {
335    $("#loader_display").fadeIn();
336  });
337});
338{/literal}
339{/footer_script}
340
341{html_head}
342<style type="text/css">
343.thumbnails .wrap2 {ldelim} width:128px; height:128px; }
344.thumbnail {ldelim} width:100px; }
345</style>
346{/html_head}
347
348
349<div id="batchManagerGlobal">
350<form action="{$F_ACTION}" method="post" id="import_form">
351
352  <fieldset>
353    <legend>{'Selection'|@translate}</legend>
354
355  {if !empty($thumbnails)}
356    <p id="checkActions">
357      {'Select:'|@translate}
358    {if $nb_thumbs_set > $nb_thumbs_page}
359      <a href="#" id="selectAll">{'The whole page'|@translate}</a>,
360      <a href="#" id="selectSet">{'The whole set'|@translate}</a>,
361    {else}
362      <a href="#" id="selectAll">{'All'|@translate}</a>,
363    {/if}
364      <a href="#" id="selectNone">{'None'|@translate}</a>,
365      <a href="#" id="selectInvert">{'Invert'|@translate}</a>
366
367      <span id="selectedMessage"></span>
368      <input type="checkbox" name="setSelected" style="display:none">
369      <span id="loader_display" style="display:none;"><img src="admin/themes/default/images/ajax-loader.gif"> <i>{'Processing...'|@translate}</i></span>
370    </p>
371
372    <ul class="thumbnails">
373      {foreach from=$thumbnails item=thumbnail}
374                        <li id="photo-{$thumbnail.id}">
375                                <span class="wrap1">
376                                        <label>
377                                                <span class="wrap2">
378                                                <div class="actions"><a href="{$thumbnail.src}" class="preview-box">{'Zoom'|@translate}</a> &middot; <a href="{$thumbnail.url}" target="_blank" title="{'Open Instagram page in a new tab'|@translate}">Open</a></div>
379                                                        <span>
380                                                                <img src="{$thumbnail.thumb}" alt="{$thumbnail.title}" title="{$thumbnail.title|@escape:'html'}" class="thumbnail">
381                                                        </span>
382                                                </span>
383                                                <input type="checkbox" name="selection[]" value="{$thumbnail.id}">
384                                        </label>
385                                </span>
386                        </li>
387      {/foreach}
388    </ul>
389   
390   
391    <div style="clear:both;" id="navigation">
392    {if !empty($navbar) }
393      <div style="float:left">
394      {include file='navigation_bar.tpl'|@get_extent:'navbar'}
395      </div>
396    {/if}
397   
398      <div style="float:right;margin-top:10px;">{'display'|@translate}
399        <a href="{$U_DISPLAY}&amp;display=20">20</a>
400        &middot; <a href="{$U_DISPLAY}&amp;display=50">50</a>
401        &middot; <a href="{$U_DISPLAY}&amp;display=100">100</a>
402        &middot; <a href="{$U_DISPLAY}&amp;display=all">{'all'|@translate}</a>
403        {'photos per page'|@translate}
404      </div>
405    </div>
406
407  {else}
408    <div>{'No photo in the current set.'|@translate}</div>
409  {/if}
410  </fieldset>
411 
412  <fieldset>
413    <legend>{'Import options'|@translate}</legend>
414
415    <p>
416      <label for="albumSelect"><b>{'Album'|@translate}:</b></label>
417      <select style="width:400px" name="associate" id="albumSelect" size="1">
418        {html_options options=$category_parent_options}
419      </select>
420      {'... or '|@translate}<a href="#" class="addAlbumOpen" title="{'create a new album'|@translate}">{'create a new album'|@translate}</a>
421    </p>
422   
423    <p>
424      <b>{'Fill these fields from Instagram datas'|@translate}:</b>
425      <label><input type="checkbox" name="fill_name" checked="checked"> {'Photo name'|@translate}</label>
426      <label><input type="checkbox" name="fill_author" checked="checked"> {'Author'|@translate}</label>
427      <label><input type="checkbox" name="fill_tags" checked="checked"> {'Tags'|@translate}</label>
428      <label><input type="checkbox" name="fill_taken" checked="checked"> {'Creation date'|@translate}</label>
429    </p>
430
431    <p>
432      <input type="hidden" name="album" value="{$album}">
433      <input type="submit" name="import_set" id="beginImport" value="{'Begin transfer'|@translate}" style="display:none;">
434      <span id="loader_import" style="display:none;"><img src="admin/themes/default/images/ajax-loader.gif"> <i>{'Processing...'|@translate}</i> <span id="progress"></span></span>
435    </p>
436  </fieldset>
437</form>
438</div>
Note: See TracBrowser for help on using the repository browser.