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); },