Initialise drag handles on sample add

When a new sample is added, initialise the drag handles so they are
draggable.

Also remove initial sample from markup.

2 files changed, 24 insertions, 21 deletions

diff --git a/assets/js/views/sample-editor.js b/assets/js/views/sample-editor.js
index bb06b01..74dc04d 100644
--- a/assets/js/views/sample-editor.js
+++ b/assets/js/views/sample-editor.js
@@ -2,25 +2,10 @@ ClipPlay.Views.SampleEditor = Marionette.CollectionView.extend({
 	itemView: ClipPlay.Views.Sample,
 	
 	initialize: function() {
-		this.initialize_clip_drag_handles();
 		this.initialize_player();
 	},
 	
 	
-	initialize_clip_drag_handles: function() {
-		var $clip_line = $('.js-clip-line');
-		
-		$clip_line.draggable({
-			axis: 'x',
-			handle: '.js-drag-handle',
-			scroll: false,
-			containment: $clip_line.parents('.progress-bar')
-		});
-		
-		$clip_line.on('drag', this.on_clip_drag_stop);
-	},
-	
-	
 	// this will soon be obsolete
 	initialize_player: function() {
 		this.player = new OP.Player($('#single-video-lets-see-if-we-can-get-this-to-work').get(0));
@@ -33,10 +18,5 @@ ClipPlay.Views.SampleEditor = Marionette.CollectionView.extend({
 			el: $('#add-sample'),
 			collection: this.collection
 		});
-	},
-	
-	
-	on_clip_drag_stop: function(e, ui) {
-		
 	}
 });
\ No newline at end of file
diff --git a/assets/js/views/sample.js b/assets/js/views/sample.js
index 96f42b7..9f57c06 100644
--- a/assets/js/views/sample.js
+++ b/assets/js/views/sample.js
@@ -1,3 +1,26 @@
 ClipPlay.Views.Sample = Marionette.ItemView.extend({
-	template: '#sample-view-template'
+	template: '#sample-view-template',
+	
+	onRender: function() {
+		this.initialize_clip_drag_handles();
+	},
+	
+	
+	initialize_clip_drag_handles: function() {
+		var $clip_line = this.$('.js-clip-line');
+		
+		$clip_line.draggable({
+			axis: 'x',
+			handle: '.js-drag-handle',
+			scroll: false,
+			containment: $clip_line.parents('.progress-bar')
+		});
+		
+		$clip_line.on('dragstop', this.on_clip_drag_stop);
+	},
+	
+	
+	on_clip_drag_stop: function(e, ui) {
+		console.log('booyakacha');
+	}
 });
\ No newline at end of file