merge

2 files changed, 50 insertions, 0 deletions

diff --git a/assets/js/sample-editor.js b/assets/js/sample-editor.js
index 10f5a08..7ae2bca 100644
--- a/assets/js/sample-editor.js
+++ b/assets/js/sample-editor.js
@@ -2,6 +2,9 @@ var SampleEditor = SampleEditor || {};
 
 (function($) {
 	SampleEditor = function() {
+		this.player = null;
+		
+		
 		this.initialize = function() {
 			var $clip_line = $('.js-clip-line');
 			
@@ -11,6 +14,48 @@ var SampleEditor = SampleEditor || {};
 				scroll: false,
 				containment: $clip_line.parents('.progress-bar')
 			});
+			
+			$clip_line.on('drag', this.on_clip_drag_stop);
+			
+			
+			this.player = new OP.Player($('#single-video-lets-see-if-we-can-get-this-to-work').get(0));
+		};
+		
+		
+		// percentage_progress
+		//
+		// Get a percentage value from a clip-line that represents its 
+		// position within the progress bar.
+		//
+		this.percentage_progress = function($el) {
+			var container = $el.parents('.progress-bar');
+			var position_in_pixels = $el.css('left');
+			
+			var percentage = (position_in_pixels / container.width()) * 100;
+			
+			return percentage;
+		};
+		
+		
+		// seek_point
+		//
+		// Example:
+		// sample_editor.seek_point({
+		// 	$el: $('.clip-line'),
+		// 	video_length: 586
+		// });
+		//
+		this.seek_point = function(options) {
+			var options = options || {};
+			
+			var progress = this.percentage_progress(options.$el);
+			
+			return (progress * options.video_length) / 100;
+		};
+		
+		
+		this.on_clip_drag_stop = function(e, ui) {
+			
 		};
 		
 		
diff --git a/index.html b/index.html
index 46d7c11..2e7b8dc 100644
--- a/index.html
+++ b/index.html
@@ -32,6 +32,11 @@
 				</div>
 			</div>
 		</div>
+
+
+		<div class="video">
+			<iframe src="http://cdn.embedly.com/widgets/media.html?schema=youtube&type=text%2Fhtml&html=http://www.youtube.com/embed/q3wHLCW4hbg" width="500" height="281" scrolling="no" frameborder="0" allowfullscreen id="single-video-lets-see-if-we-can-get-this-to-work"></iframe>
+		</div>
 	</div>