source: trunk/admin/themes/default/template/photos_add_direct.tpl @ 6629

Last change on this file since 6629 was 6629, checked in by plg, 14 years ago

merge r6628 from branch 2.1 to trunk

improvement: ability to hide setup warnings for upload. Warnings will
automatically come back at next user session.

File size: 9.9 KB
Line 
1{known_script id="jquery" src=$ROOT_URL|@cat:"themes/default/js/jquery.packed.js"}
2{known_script id="jquery.jgrowl" src=$ROOT_URL|@cat:"themes/default/js/plugins/jquery.jgrowl_minimized.js"}
3
4{if $upload_mode eq 'multiple'}
5<script type="text/javascript" src="{$uploadify_path}/swfobject.js"></script>
6<script type="text/javascript" src="{$uploadify_path}/jquery.uploadify.v2.1.0.min.js"></script>
7{/if}
8{html_head}
9<link rel="stylesheet" type="text/css" href="{$ROOT_URL}admin/themes/default/uploadify.jGrowl.css">
10{/html_head}
11
12{literal}
13<script type="text/javascript">
14jQuery(document).ready(function(){
15  function checkUploadStart() {
16    var nbErrors = 0;
17    $("#formErrors").hide();
18    $("#formErrors li").hide();
19
20    if ($("input[name=category_type]:checked").val() == "new" && $("input[name=category_name]").val() == "") {
21      $("#formErrors #emptyCategoryName").show();
22      nbErrors++;
23    }
24
25    var nbFiles = 0;
26    if ($("#uploadBoxes").size() == 1) {
27      $("input[name^=image_upload]").each(function() {
28        if ($(this).val() != "") {
29          nbFiles++;
30        }
31      });
32    }
33    else {
34      nbFiles = $(".uploadifyQueueItem").size();
35    }
36
37    if (nbFiles == 0) {
38      $("#formErrors #noPhoto").show();
39      nbErrors++;
40    }
41
42    if (nbErrors != 0) {
43      $("#formErrors").show();
44      return false;
45    }
46    else {
47      return true;
48    }
49
50  }
51
52  function humanReadableFileSize(bytes) {
53    var byteSize = Math.round(bytes / 1024 * 100) * .01;
54    var suffix = 'KB';
55
56    if (byteSize > 1000) {
57      byteSize = Math.round(byteSize *.001 * 100) * .01;
58      suffix = 'MB';
59    }
60
61    var sizeParts = byteSize.toString().split('.');
62    if (sizeParts.length > 1) {
63      byteSize = sizeParts[0] + '.' + sizeParts[1].substr(0,2);
64    }
65    else {
66      byteSize = sizeParts[0];
67    }
68
69    return byteSize+suffix;
70  }
71
72  if ($("select[name=category] option").length == 0) {
73    $('input[name=category_type][value=existing]').attr('disabled', true);
74    $('input[name=category_type]').attr('checked', false);
75    $('input[name=category_type][value=new]').attr('checked', true);
76  }
77
78  $("input[name=category_type]").click(function () {
79    $("[id^=category_type_]").hide();
80    $("#category_type_"+$(this).attr("value")).show();
81  });
82
83  $("#hideErrors").click(function() {
84    $("#formErrors").hide();
85    return false;
86  });
87
88{/literal}
89{if $upload_mode eq 'html'}
90{literal}
91  function addUploadBox() {
92    var uploadBox = '<p class="file"><input type="file" size="60" name="image_upload[]"></p>';
93    $(uploadBox).appendTo("#uploadBoxes");
94  }
95
96  addUploadBox();
97
98  $("#addUploadBox A").click(function () {
99    addUploadBox();
100  });
101
102  $("#uploadForm").submit(function() {
103    return checkUploadStart();
104  });
105{/literal}
106{elseif $upload_mode eq 'multiple'}
107
108var uploadify_path = '{$uploadify_path}';
109var upload_id = '{$upload_id}';
110var session_id = '{$session_id}';
111var pwg_token = '{$pwg_token}';
112var buttonText = 'Browse';
113var sizeLimit = {$upload_max_filesize};
114
115{literal}
116  jQuery("#uploadify").uploadify({
117    'uploader'       : uploadify_path + '/uploadify.swf',
118    'script'         : uploadify_path + '/uploadify.php',
119    'scriptData'     : {
120      'upload_id' : upload_id,
121      'session_id' : session_id,
122      'pwg_token' : pwg_token,
123    },
124    'cancelImg'      : uploadify_path + '/cancel.png',
125    'queueID'        : 'fileQueue',
126    'auto'           : false,
127    'displayData'    : 'speed',
128    'buttonText'     : buttonText,
129    'multi'          : true,
130    'fileDesc'       : 'Photo files (*.jpg,*.jpeg,*.png)',
131    'fileExt'        : '*.jpg;*.JPG;*.jpeg;*.JPEG;*.png;*.PNG',
132    'sizeLimit'      : sizeLimit,
133    'onAllComplete'  : function(event, data) {
134      if (data.errors) {
135        return false;
136      }
137      else {
138        $("input[name=submit_upload]").click();
139      }
140    },
141    onError: function (event, queueID ,fileObj, errorObj) {
142      var msg;
143
144      if (errorObj.type === "HTTP") {
145        if (errorObj.info === 404) {
146          alert('Could not find upload script.');
147          msg = 'Could not find upload script.';
148        }
149        else {
150          msg = errorObj.type+": "+errorObj.info;
151        }
152      }
153      else if (errorObj.type ==="File Size") {
154        msg = "File too big";
155        msg = msg + '<br>'+fileObj.name+': '+humanReadableFileSize(fileObj.size);
156        msg = msg + '<br>Limit: '+humanReadableFileSize(sizeLimit);
157      }
158      else {
159        msg = errorObj.type+": "+errorObj.info;
160      }
161
162      $.jGrowl(
163        '<p></p>'+msg,
164        {
165          theme:  'error',
166          header: 'ERROR',
167          sticky: true
168        }
169      );
170
171      $("#fileUploadgrowl" + queueID).fadeOut(
172        250,
173        function() {
174          $("#fileUploadgrowl" + queueID).remove()
175        }
176      );
177      return false;
178    },
179    onCancel: function (a, b, c, d) {
180      var msg = "Cancelled uploading: "+c.name;
181      $.jGrowl(
182        '<p></p>'+msg,
183        {
184          theme:  'warning',
185          header: 'Cancelled Upload',
186          life:   4000,
187          sticky: false
188        }
189      );
190    },
191    onClearQueue: function (a, b) {
192      var msg = "Cleared "+b.fileCount+" files from queue";
193      $.jGrowl(
194        '<p></p>'+msg,
195        {
196          theme:  'warning',
197          header: 'Cleared Queue',
198          life:   4000,
199          sticky: false
200        }
201      );
202    },
203    onComplete: function (a, b ,c, d, e) {
204      var size = Math.round(c.size/1024);
205      $.jGrowl(
206        '<p></p>'+c.name+' - '+size+'KB',
207        {
208          theme:  'success',
209          header: 'Upload Complete',
210          life:   4000,
211          sticky: false
212        }
213      );
214    }
215  });
216
217  $("input[type=button]").click(function() {
218    if (!checkUploadStart()) {
219      return false;
220    }
221
222    $("#uploadify").uploadifyUpload();
223  });
224
225{/literal}
226{/if}
227});
228</script>
229
230<div class="titrePage">
231  <h2>{'Upload Photos'|@translate}</h2>
232</div>
233
234<div id="photosAddContent">
235
236{if count($setup_errors) > 0}
237<div class="errors">
238  <ul>
239  {foreach from=$setup_errors item=error}
240    <li>{$error}</li>
241  {/foreach}
242  </ul>
243</div>
244{else}
245
246  {if count($setup_warnings) > 0}
247<div class="warnings">
248  <ul>
249    {foreach from=$setup_warnings item=warning}
250    <li>{$warning}</li>
251    {/foreach}
252  </ul>
253  <div class="hideButton" style="text-align:center"><a href="{$hide_warnings_link}">{'Hide'|@translate}</a></div>
254</div>
255  {/if}
256
257
258{if !empty($thumbnails)}
259<fieldset>
260  <legend>{'Uploaded Photos'|@translate}</legend>
261  <div>
262  {foreach from=$thumbnails item=thumbnail}
263    <a href="{$thumbnail.link}" class="externalLink">
264      <img src="{$thumbnail.src}" alt="{$thumbnail.file}" title="{$thumbnail.title}" class="thumbnail">
265    </a>
266  {/foreach}
267  </div>
268  <p id="batchLink"><a href="{$batch_link}">{$batch_label}</a></p>
269</fieldset>
270<p><a href="{$another_upload_link}">{'Add another set of photos'|@translate}</a></p>
271{else}
272
273<div id="formErrors" class="errors" style="display:none">
274  <ul>
275    <li id="emptyCategoryName">{'The name of a category should not be empty'|@translate}</li>
276    <li id="noPhoto">{'Select at least one picture'|@translate}</li>
277  </ul>
278  <div class="hideButton" style="text-align:center"><a href="#" id="hideErrors">{'Hide'|@translate}</a></div>
279</div>
280
281<form id="uploadForm" enctype="multipart/form-data" method="post" action="{$form_action}" class="properties">
282    <fieldset>
283      <legend>{'Drop into category'|@translate}</legend>
284      {if $upload_mode eq 'multiple'}
285      <input name="upload_id" value="{$upload_id}" type="hidden">
286      {/if}
287
288      <label><input type="radio" name="category_type" value="existing"> {'existing category'|@translate}</label>
289      <label><input type="radio" name="category_type" value="new" checked="checked"> {'create a new category'|@translate}</label>
290
291      <div id="category_type_existing" style="display:none" class="category_selection">
292        <select class="categoryDropDown" name="category">
293          {html_options options=$category_options selected=$category_options_selected}
294        </select>
295      </div>
296
297      <div id="category_type_new" class="category_selection">
298        <table>
299          <tr>
300            <td>{'Parent category'|@translate}</td>
301            <td>
302              <select class="categoryDropDown" name="category_parent">
303                <option value="0">------------</option>
304                {html_options options=$category_parent_options selected=$category_parent_options_selected}
305              </select>
306            </td>
307          </tr>
308          <tr>
309            <td>{'Category name'|@translate}</td>
310            <td>
311              <input type="text" name="category_name" value="{$F_CATEGORY_NAME}" style="width:400px">
312            </td>
313          </tr>
314        </table>
315      </div>
316    </fieldset>
317
318    <fieldset>
319      <legend>{'Who can see these photos?'|@translate}</legend>
320
321      <select name="level" size="1">
322        {html_options options=$level_options selected=$level_options_selected}
323      </select>
324    </fieldset>
325
326    <fieldset>
327      <legend>{'Select files'|@translate}</legend>
328
329{if $upload_mode eq 'html'}
330    <p><a href="{$switch_url}">{'... or switch to the multiple files form'|@translate}</a></p>
331
332      <p>{'JPEG files or ZIP archives with JPEG files inside please.'|@translate}</p>
333
334      <div id="uploadBoxes"></div>
335      <div id="addUploadBox">
336        <a href="javascript:">{'+ Add an upload box'|@translate}</a>
337      </div>
338   
339    </fieldset>
340
341    <p>
342      <input class="submit" type="submit" name="submit_upload" value="{'Upload'|@translate}" {$TAG_INPUT_ENABLED}>
343    </p>
344{elseif $upload_mode eq 'multiple'}
345    <p>
346      <input type="file" name="uploadify" id="uploadify">
347    </p>
348
349    <p><a href="{$switch_url}">{'... or switch to the old style form'|@translate}</a></p>
350
351    <div id="fileQueue"></div>
352
353    </fieldset>
354    <p>
355      <input class="submit" type="button" value="{'Upload'|@translate}">
356      <input type="submit" name="submit_upload" style="display:none">
357    </p>
358{/if}
359</form>
360{/if} {* empty($thumbnails) *}
361{/if} {* $setup_errors *}
362
363</div> <!-- photosAddContent -->
Note: See TracBrowser for help on using the repository browser.