Working : Upload image : set product image form loaded via ajax, fix category, folder, content

templates/admin/default/assets/js/image-upload.js

@@ -1,9 +1,10 @@
 $(function($){
     // Manage picture upload
-    var pictureUploadManager = {};
+    $.imageUploadManager = {};
 
     Dropzone.autoDiscover = false;
-
+    // Remove image on click
+    $.imageUploadManager.initImageDropZone = function() {
         var imageDropzone = new Dropzone("#images-dropzone", {
             dictDefaultMessage : $('.btn-browse').html(),
             uploadMultiple: false,
@@ -13,11 +14,13 @@ $(function($){
         imageDropzone.on("success", function(file) {
             $(".image-manager .dz-file-preview").remove();
             imageDropzone.removeFile(file);
-        pictureUploadManager.updateImageListAjax();
+            $.imageUploadManager.updateImageListAjax();
+            $.imageUploadManager.onClickDeleteImage();
         });
+    };
 
     // Update picture list via AJAX call
-    pictureUploadManager.updateImageListAjax = function() {
+    $.imageUploadManager.updateImageListAjax = function() {
         var $imageListArea = $(".image-manager .existing-image");
         $imageListArea.html('<div class="loading" ></div>');
         $.ajax({
@@ -38,7 +41,7 @@ $(function($){
     };
 
     // Remove image on click
-    pictureUploadManager.onClickDeleteImage = function() {
+    $.imageUploadManager.onClickDeleteImage = function() {
         $('.image-manager .image-delete-btn').on('click', function (e) {
             e.preventDefault();
             var $this = $(this);
@@ -67,5 +70,5 @@ $(function($){
             return false;
         });
     };
-    pictureUploadManager.onClickDeleteImage();
+    $.imageUploadManager.onClickDeleteImage();
 });

templates/admin/default/category-edit.html

@@ -326,6 +326,7 @@
 	 });
 
 $(function() {
+    $.imageUploadManager.initImageDropZone();
 
     $('.use_default_rewriten_url').click(function(ev) {
     	alert("Not functionnal");

templates/admin/default/content-edit.html

@@ -295,8 +295,8 @@ form_content    = {$smarty.capture.delete_content_dialog nofilter}
     {/javascripts}
 
     <script>
-
         $(function() {
+            $.imageUploadManager.initImageDropZone();
 
             $('.use_default_rewriten_url').click(function(ev) {
                 alert("Not functionnal");

templates/admin/default/folder-edit.html

@@ -295,6 +295,7 @@
     {/javascripts}
     <script>
         $(function() {
+            $.imageUploadManager.initImageDropZone();
 
             $('.use_default_rewriten_url').click(function(ev) {
                 alert("Not functionnal");

templates/admin/default/product-edit.html

@@ -65,7 +65,8 @@
 		                    <li>
                                 <a href="#images"
                                    data-toggle="tab"
-                                   data-href="{url path="/admin/image/type/product/{$product_id}/form-ajax"}">
+                                   data-href="{url path="/admin/image/type/product/{$product_id}/form-ajax"}"
+                                   data-callback="$.imageUploadManager.initImageDropZone">
                                     {intl l="Images"}
                                 </a>
                             </li>
@@ -115,6 +116,12 @@
 
 {block name="javascript-initialization"}
 
+    {javascripts file='assets/js/dropzone.js'}
+        <script src="{$asset_url}"></script>
+    {/javascripts}
+    {javascripts file='assets/js/image-upload.js'}
+        <script src="{$asset_url}"></script>
+    {/javascripts}
     {javascripts file='assets/js/bootstrap-editable/bootstrap-editable.js'}
         <script src="{$asset_url}"></script>
     {/javascripts}
@@ -144,8 +151,10 @@ $(function() {
 
             // Atomatic ajax tab load, if data-href is defined.
             $('.nav-tabs a[data-href]').on('shown.bs.tab', function(ev) {
-        var zis = $(this);
+                var $this = $(this);
-        $(zis.attr('href')).load(zis.data('href'));
+                $($this.attr('href')).load($this.data('href'), function(ev) {
+                    eval($this.data('callback') + '();');
+                });
             });
 
             // Load active tab
@@ -237,6 +246,4 @@ $(function() {
             });
         });
     </script>
-
-
 {/block}