Changeset 5736 for trunk/admin/themes/default/template/photos_add_direct.tpl

Timestamp:

Apr 9, 2010, 4:04:51 PM (14 years ago)

Author:

plg

Message:

bug 1555: UploadForm, before starting upload (html/multiple modes), check if
the category is correctly set and if there is at least 1 photo selected.

File:

• trunk/admin/themes/default/template/photos_add_direct.tpl (modified) (8 diffs)

trunk/admin/themes/default/template/photos_add_direct.tpl

@@ -1 +1 @@
 {known_script id="jquery" src=$ROOT_URL|@cat:"themes/default/js/jquery.packed.js"}
 
+{if $upload_mode eq 'multiple'}
+<script type="text/javascript" src="{$uploadify_path}/swfobject.js"></script>
+<script type="text/javascript" src="{$uploadify_path}/jquery.uploadify.v2.1.0.min.js"></script>
+{/if}
+
 {literal}
-<script>
-$(document).ready(function(){
+<script type="text/javascript">
+jQuery(document).ready(function(){
+  function checkUploadStart() {
+    var nbErrors = 0;
+    $("#formErrors li").hide();
+
+    if ($("input[name=category_type]:checked").val() == "new" && $("input[name=category_name]").val() == "") {
+      $("#formErrors #emptyCategoryName").show();
+      nbErrors++;
+    }
+
+    var nbFiles = 0;
+    if ($("uploadBoxes").size() == 1) {
+      $("input[name^=image_upload]").each(function() {
+        if ($(this).val() != "") {
+          nbFiles++;
+        }
+      });
+    }
+    else {
+      nbFiles = $(".uploadifyQueueItem").size();
+    }
+
+    if (nbFiles == 0) {
+      $("#formErrors #noPhoto").show();
+      nbErrors++;
+    }
+
+    if (nbErrors != 0) {
+      $("#formErrors").show();
+      return false;
+    }
+    else {
+      return true;
+    }
+
+  }
 
   $("input[name=category_type]").click(function () {
@@ -9 +49 @@
     $("#category_type_"+$(this).attr("value")).show();
   });
-});
-</script>
+
+  $("#hideErrors").click(function() {
+    $("#formErrors").hide();
+    return false;
+  });
+
 {/literal}
-
 {if $upload_mode eq 'html'}
 {literal}
-<script type="text/javascript">
-$(document).ready(function(){
   function addUploadBox() {
     var uploadBox = '<p class="file"><input type="file" size="60" name="image_upload[]" /></p>';
@@ -27 +68 @@
     addUploadBox();
   });
-});
-</script>
+
+  $("#uploadForm").submit(function() {
+    return checkUploadStart();
+  });
 {/literal}
-
 {elseif $upload_mode eq 'multiple'}
-<script type="text/javascript" src="{$uploadify_path}/swfobject.js"></script>
-<script type="text/javascript" src="{$uploadify_path}/jquery.uploadify.v2.1.0.min.js"></script>
-
-<script type="text/javascript">
+
 var uploadify_path = '{$uploadify_path}';
 var upload_id = '{$upload_id}';
@@ -43 +82 @@
 
 {literal}
-jQuery(document).ready(function() {
   jQuery("#uploadify").uploadify({
     'uploader'       : uploadify_path + '/uploadify.swf',
@@ -58 +96 @@
     'buttonText'     : buttonText,
     'multi'          : true,
+    'fileDesc'       : 'Photo files (*.jpg,*.jpeg)',
+    'fileExt'        : '*.jpg;*.JPG;*.jpeg;*.JPEG',
     'onAllComplete'  : function(event, data) {
       if (data.errors) {
@@ -67 +107 @@
     }
   });
+
+  $("input[type=button]").click(function() {
+    if (!checkUploadStart()) {
+      return false;
+    }
+
+    $("#uploadify").uploadifyUpload();
+  });
+
+{/literal}
+{/if}
 });
-{/literal}
 </script>
-{/if}
 
 <div class="titrePage">
@@ -102 +151 @@
 {/if}
 
+<div id="formErrors" class="errors" style="display:none">
+  <ul>
+    <li id="emptyCategoryName">{'The name of a category should not be empty'|@translate}</li>
+    <li id="noPhoto">{'Select at least one picture'|@translate}</li>
+  </ul>
+  <div class="hideButton" style="text-align:center"><a href="#" id="hideErrors">{'Hide'|@translate}</a></div>
+</div>
 
 <form id="uploadForm" enctype="multipart/form-data" method="post" action="{$F_ACTION}" class="properties">
@@ -180 +236 @@
     </fieldset>
     <p>
-      <input class="submit" type="button" value="{'Upload'|@translate}" onclick="javascript:jQuery('#uploadify').uploadifyUpload()"/>
+      <input class="submit" type="button" value="{'Upload'|@translate}"/>
       <input type="submit" name="submit_upload" style="display:none"/>
     </p>