From 5e553e4c4142814ce7cb1e572e50a65176c1936d Mon Sep 17 00:00:00 2001
From: Julien Coutinho <you@example.com>
Date: Wed, 10 Jun 2015 13:57:03 +0200
Subject: [PATCH] Allow to sort collections using drag and drop

File added : sortable behavior
Define the behavior "sortable" that is applied on the childViewContainer of
the view on which is added the behavior "sortable" if the
childViewContainer is defined or it is applied to the element itself otherwise.

File Modified : Actions' list view and screens' list view
Add the behavior "sortable" on the view of the actions and the screens.
---
 .../behaviors/workspace/actions/sortable.js   | 51 +++++++++++++++++++
 .../app/scripts/views/filmstrip/screens.js    | 18 +++++--
 .../app/scripts/views/workspace/actions.js    | 10 ++++
 3 files changed, 76 insertions(+), 3 deletions(-)
 create mode 100644 dahu/core/app/scripts/behaviors/workspace/actions/sortable.js

diff --git a/dahu/core/app/scripts/behaviors/workspace/actions/sortable.js b/dahu/core/app/scripts/behaviors/workspace/actions/sortable.js
new file mode 100644
index 0000000..d57a429
--- /dev/null
+++ b/dahu/core/app/scripts/behaviors/workspace/actions/sortable.js
@@ -0,0 +1,51 @@
+/**
+ * Created by coutinju on 6/14/15.
+ */
+
+define([
+    'backbone.marionette'
+], function(
+    Marionette
+) {
+    /**
+     * Sortable behavior for composite views.
+     */
+    return Marionette.Behavior.extend({
+        /*
+         * When the view is empty this.view.$childViewContainer is undefined.
+         * We need to check if the behavior is defined because it might be
+         * the first childView to be added in the childViewContainer.
+         */
+        onChildviewDomRefresh: function() {
+            // Either childViewContainer is defined or not
+            var list = this.view.$childViewContainer || this.$el;
+
+            if(list.attr("sortable"))
+                return;
+
+            var collection = this.view.collection;
+
+            // Make the list sortable
+            list.sortable({
+                update: function(event, ui) {
+                    // Get an attached model
+                    var model = collection.get(ui.item.data('backbone-cid'));
+
+                    // On the quiet remove it from the collection
+                    collection.remove(model, {silent:true});
+
+                     //And sneakily add it to the necessary index
+                    collection.add(model, {at:ui.item.index(), silent:true});
+                }
+            });
+        },
+
+        onAddChild: function(view) {
+            /*
+             * We add as attribute the cid attribute of backbone to identify
+             * each view when the user drags and drops it.
+             */
+            view.$el.attr('data-backbone-cid', view.model.cid);
+        }
+    });
+});
\ No newline at end of file
diff --git a/dahu/core/app/scripts/views/filmstrip/screens.js b/dahu/core/app/scripts/views/filmstrip/screens.js
index eeb6373..0b7361c 100644
--- a/dahu/core/app/scripts/views/filmstrip/screens.js
+++ b/dahu/core/app/scripts/views/filmstrip/screens.js
@@ -6,11 +6,17 @@ define([
     'handlebars',
     'backbone.marionette',
     // views
-    'views/filmstrip/screen'
+    'views/filmstrip/screen',
+    // behaviors
+    'behaviors/workspace/actions/sortable'
 ], function(
-    Handlebars, Marionette,
+    Handlebars,
+    Marionette,
     // views
-    FilmstripScreenView){
+    FilmstripScreenView,
+    // behaviors
+    SortableBehavior
+) {
 
     /**
      * Filmstrip screen view
@@ -27,6 +33,12 @@ define([
             this.collection = this.screencast.model.get('screens');
         },
 
+        behaviors: {
+            SortableBehavior: {
+                behaviorClass: SortableBehavior
+            }
+        },
+
         /**
          * Redefinition of methods to take into consideration the new parameter
          * item in getItemView, that we redefined in FilmStripScreenView.
diff --git a/dahu/core/app/scripts/views/workspace/actions.js b/dahu/core/app/scripts/views/workspace/actions.js
index 288ecce..f64f50c 100644
--- a/dahu/core/app/scripts/views/workspace/actions.js
+++ b/dahu/core/app/scripts/views/workspace/actions.js
@@ -17,6 +17,8 @@ define([
     'views/workspace/actions/action',
     // templates
     'text!templates/views/workspace/actions.html',
+    // behaviors
+    'behaviors/workspace/actions/sortable',
     //modules
     'modules/utils/exceptions'
 ], function(
@@ -34,6 +36,8 @@ define([
     ActionView,
     // templates
     actionsTemplate,
+    // behaviors
+    SortableBehavior,
     //modules
     Exceptions
 ) {
@@ -64,6 +68,12 @@ define([
 
         },
 
+        behaviors: {
+            SortableBehavior: {
+                behaviorClass: SortableBehavior
+            }
+        },
+
         onAddChild: function(viewInstance) {
             this.scrollOnAction(viewInstance);
         },