Merge branch 'remove-sample'

3 files changed, 29 insertions, 6 deletions

diff --git a/assets/css/application.css b/assets/css/application.css
index 1c6d241..1dcfc0b 100644
--- a/assets/css/application.css
+++ b/assets/css/application.css
@@ -168,8 +168,8 @@ header {
 
 
 .button.red{
-	background-color: #887c7c;
-	border-color: #887c7c;
+	background-color: #882222;
+	border-color: #882222;
 	color: #eee;
 	text-shadow: 0px 1px 2px rgba(0,0,0,0.9);
     -webkit-box-shadow:  0px 4px 1px 0px rgba(92, 5, 5, 1);
diff --git a/assets/js/views/sample-editor.js b/assets/js/views/sample-editor.js
index 6accd89..088e588 100644
--- a/assets/js/views/sample-editor.js
+++ b/assets/js/views/sample-editor.js
@@ -1,5 +1,10 @@
 ClipPlay.Views.SampleEditor = Marionette.CollectionView.extend({
 	itemView: ClipPlay.Views.Sample,
+	itemViewOptions: function(model, index) {
+		return {
+			collection: this.collection
+		};
+	},
 	
 	onRender: function() {
 		// Initialize view for adding new samples
diff --git a/assets/js/views/sample.js b/assets/js/views/sample.js
index c728e47..5b10a0b 100644
--- a/assets/js/views/sample.js
+++ b/assets/js/views/sample.js
@@ -11,7 +11,9 @@ ClipPlay.Views.Sample = Marionette.ItemView.extend({
         this.$('.js-keyboard-key').val(this.model.get('key'));
 	},
 
-    initialize: function(){
+    initialize: function(options){
+        this.collection = options.collection;
+        
         this.listenTo(this.model, 'change:key', this.key_bind);
         this.key_bind();
     },
@@ -26,7 +28,8 @@ ClipPlay.Views.Sample = Marionette.ItemView.extend({
 			var schema = data.provider_name.toLowerCase();
 			var iframe_src= BASE_IFRAME +"?schema="+schema+"&type=text%2Fhtml&html="+src;
 			var iframe = $('<iframe/>', {
-				src: iframe_src
+				src: iframe_src,
+				id: 'video-sample-' + that.model.cid
 			});
 			$('#video').append(iframe[0]);
 			var player = new OP.Player(iframe[0]);
@@ -81,6 +84,21 @@ ClipPlay.Views.Sample = Marionette.ItemView.extend({
     },
 
     remove_sample: function(){
-        console.log('removed sample');
-    }
+        this.collection.remove(this.model);
+        
+        var $iframe_video = $('#video-sample-' + this.model.cid);
+        $iframe_video.fadeOut(400, function() {
+        	$iframe_video.remove();
+        });
+    },
+
+	close: function() {
+		var that = this;
+		this.$el.animate({
+			height: 0,
+			opacity: 0
+		}, 500, function() {
+			Marionette.View.prototype.close.call(that, arguments);
+		});
+	}
 });