Merge branch 'cleanmaster' into modules

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

@@ -4,11 +4,11 @@ $(function($){
 
     Dropzone.autoDiscover = false;
 
-    
-
     // Remove image on click
     $.imageUploadManager.initImageDropZone = function() {
+
         $.imageUploadManager.onClickDeleteImage();
+        $.imageUploadManager.sortImage();
 
         var imageDropzone = new Dropzone("#images-dropzone", {
             dictDefaultMessage : $('.btn-browse').html(),
@@ -65,6 +65,7 @@ $(function($){
                     data
                 );
                 $.imageUploadManager.onClickDeleteImage();
+                $.imageUploadManager.sortImage();
             });
     };
 
@@ -95,8 +96,61 @@ $(function($){
                 $(".image-manager .message").html(
                     data
                 );
+
+                /* refresh position */
+                $( "#js-sort-image").children('li').each(function(position, element) {
+                    $(element).find('.js-sorted-position').html(position + 1);
+                });
             });
             return false;
         });
     };
+
+    $.imageUploadManager.sortImage = function() {
+        $( "#js-sort-image" ).sortable({
+            placeholder: "ui-sortable-placeholder col-sm-6 col-md-3",
+            change: function( event, ui ) {
+                /* refresh position */
+                var pickedElement = ui.item;
+                var position = 0;
+                $( "#js-sort-image").children('li').each(function(k, element) {
+                    if($(element).data('sort-id') == pickedElement.data('sort-id')) {
+                        return true;
+                    }
+                    position++;
+                    if($(element).is('.ui-sortable-placeholder')) {
+                        pickedElement.find('.js-sorted-position').html(position);
+                    } else {
+                        $(element).find('.js-sorted-position').html(position);
+                    }
+                });
+            },
+            stop: function( event, ui ) {
+                /* update */
+                var newPosition = ui.item.find('.js-sorted-position').html();
+                var imageId = ui.item.data('sort-id');
+
+                $.ajax({
+                    type: "POST",
+                    url: imageReorder,
+                    data: {
+                        image_id: imageId,
+                        position: newPosition
+                    },
+                    statusCode: {
+                        404: function() {
+                            $(".image-manager .message").html(
+                                imageReorderErrorMessage
+                            );
+                        }
+                    }
+                }).done(function(data) {
+                    $(".image-manager .message").html(
+                        data
+                    );
+                });
+            }
+        });
+        $( "#js-sort-image" ).disableSelection();
+    };
 });

templates/backOffice/default/includes/document-upload-list-ajax.html

@@ -10,13 +10,14 @@ Parameters:
 
 {ifloop rel="document"}
     <table class="table table-striped table-condensed table-left-aligned">
-        {loop type="document" name="document" source="{$documentType}" order="manual-reverse" source_id="{$parentId}"}
+        {loop type="document" name="document" source="{$documentType}" order="manual" source_id="{$parentId}"}
             <tr>
                 <td>
                     <a href="{$DOCUMENT_PATH}" title="{$TITLE}" class="" target="_blank">{$TITLE}</a>
                 </td>
                 <td>
                     <div class="btn-group">
+                        <a class="image-update-btn btn btn-default btn-xs disabled js-sorted-position" href="#">{$POSITION}</a>
                         <a class="document-update-btn btn btn-default btn-xs" href="{url path="/admin/document/type/$documentType/$ID/update"}" data-error-message="{intl l='Please retry'}">
                             <span class="glyphicon glyphicon-edit"></span>
                         </a>

templates/backOffice/default/includes/image-upload-form.html

@@ -32,5 +32,7 @@ Parameters:
 <script>
     var imageDropZoneUrl = "{url path="/admin/image/type/$imageType/$parentId/save-ajax"}";
     var imageListUrl = "{url path="/admin/image/type/$imageType/$parentId/list-ajax"}";
+    var imageReorder = "{url path="/admin/image/type/$imageType/$parentId/update-position"}";
     var imageListErrorMessage = "{intl l='Can\'t load images, please refresh this page.'}";
+    var imageReorderErrorMessage = "{intl l='Can\'t reorder images, please refresh this page.'}";
 </script>

templates/backOffice/default/includes/image-upload-list-ajax.html

@@ -9,14 +9,15 @@ Parameters:
 *}
 
 {ifloop rel="image"}
-    <div class="row">
-        {loop type="image" name="image" source="{$imageType}" order="manual-reverse" source_id="{$parentId}" width="200" height="100" resize_mode="borders"}
-            <div class="col-sm-6 col-md-3" >
+    <ul id="js-sort-image" class="row list-unstyled">
+        {loop type="image" name="image" source="{$imageType}" order="manual" source_id="{$parentId}" width="200" height="100" resize_mode="borders"}
+            <li class="col-sm-6 col-md-3 ui-state-default" data-sort-id="{$ID}">
                 <a href="{url path="/admin/image/type/$imageType/$ID/update"}" alt="{intl l='Update this image'}" class="thumbnail">
                     <img src="{$IMAGE_URL}" alt="{$TITLE}">
                 </a>
 
                 <div class="btn-group" >
+                    <a class="image-update-btn btn btn-default btn-xs disabled js-sorted-position" href="#">{$POSITION}</a>
                     <a class="image-update-btn btn btn-default btn-xs" href="{url path="/admin/image/type/$imageType/$ID/update"}" data-error-message="{intl l='Please retry'}">
                         <span class="glyphicon glyphicon-edit"></span>
                     </a>
@@ -24,9 +25,9 @@ Parameters:
                         <span class="glyphicon glyphicon-trash"></span>
                     </a>
                 </div>
-            </div>
+            </li>
         {/loop}
-    </div>
+    </ul>
 {/ifloop}
 {elseloop rel="image"}
 <div class="alert alert-info">{intl l='There is no images attached to this %type.' type=$imageType}</div>

templates/backOffice/default/product-edit.html

@@ -144,6 +144,10 @@
         <script src="{$asset_url}"></script>
     {/javascripts}
 
+    {javascripts file='assets/js/jquery-ui-1.10.3.custom.min.js'}
+        <script src="{$asset_url}"></script>
+    {/javascripts}
+
 <script src="{url file='/tinymce/tinymce.min.js'}"></script>
 
 <script>