--- a/src/js/widgets/sliderWidget.js	Mon Nov 21 11:46:29 2011 +0100
+++ b/src/js/widgets/sliderWidget.js	Mon Nov 21 11:56:10 2011 +0100
@@ -1,96 +1,96 @@
-IriSP.SliderWidget = function(Popcorn, config, Serializer) { 
-  IriSP.Widget.call(this, Popcorn, config, Serializer);
-};
-
-IriSP.SliderWidget.prototype = new IriSP.Widget();
-
-IriSP.SliderWidget.prototype.draw = function() {
-  var self = this;
-
-  
-  this.selector.append("<div class='sliderBackground'></div>");
-  this.sliderBackground = this.selector.find(".sliderBackground");
-  
-  this.selector.append("<div class='sliderForeground'></div>");
-  this.sliderForeground = this.selector.find(".sliderForeground");
-  
-  this.selector.append(Mustache.to_html(IriSP.overlay_marker_template));
-  this.positionMarker = this.selector.find(".positionMarker");
-  this.positionMarker.css("height", "10px");
-  this.positionMarker.css("width", "10px");
-  this.positionMarker.css("top", "0%");
-  
-  // a special variable to stop methods from tinkering
-  // with the positionMarker when the user is dragging it
-  this.draggingOngoing = false;
-  
-  this.positionMarker.draggable({axis: "x", 
-  start: IriSP.wrap(this, this.positionMarkerDraggingStartedHandler),
-  stop: IriSP.wrap(this, this.positionMarkerDraggedHandler)});
-  
-  this.sliderBackground.click(function(event) { self.clickHandler.call(self, event); });
-  
-  this.selector.hover(IriSP.wrap(this, this.mouseOverHandler), IriSP.wrap(this, this.mouseOutHandler));
-  this._Popcorn.listen("timeupdate", IriSP.wrap(this, this.sliderUpdater));
-};
-
-/* updates the slider as time passes */
-IriSP.SliderWidget.prototype.sliderUpdater = function() {
-  if(this.draggingOngoing)
-    return;
-    
-  var time = this._Popcorn.currentTime();
-  
-  var duration = this._serializer.currentMedia().meta["dc:duration"] / 1000;
-  var percent = ((time / duration) * 100).toFixed(2);
-	this.sliderForeground.css("width", percent + "%");
-	this.positionMarker.css("left", percent + "%");
-  
-};
-
-IriSP.SliderWidget.prototype.clickHandler = function(event) {
-  /* this piece of code is a little bit convoluted - here's how it works :
-     we want to handle clicks on the progress bar and convert those to seeks in the media.
-     However, jquery only gives us a global position, and we want a number of pixels relative
-     to our container div, so we get the parent position, and compute an offset to this position,
-     and finally compute the progress ratio in the media.
-     Finally we multiply this ratio with the duration to get the correct time
-  */
-  
-  var parentOffset = this.sliderBackground.parent().offset();
-  var width = this.sliderBackground.width();
-  var relX = event.pageX - parentOffset.left;
-      
-  var duration = this._serializer.currentMedia().meta["dc:duration"] / 1000;
-  var newTime = ((relX / width) * duration).toFixed(2);
-	
-  this._Popcorn.currentTime(newTime);
-};
-
-/* handles mouse over the slider */
-IriSP.SliderWidget.prototype.mouseOverHandler = function(event) {  
-  this.sliderBackground.animate({"padding-top": "10px"}, 100);
-  this.sliderForeground.animate({"padding-top": "10px"}, 100);  
-};
-
-/* handles when the mouse leaves the slider */
-IriSP.SliderWidget.prototype.mouseOutHandler = function(event) {  
-  this.sliderBackground.animate({"padding-top": "5px"}, 50);
-  this.sliderForeground.animate({"padding-top": "5px"}, 50);  
-};
-
-// called when the user starts dragging the position indicator
-IriSP.SliderWidget.prototype.positionMarkerDraggingStartedHandler = function(event, ui) {   
-  this.draggingOngoing = true;
-};
-    
-IriSP.SliderWidget.prototype.positionMarkerDraggedHandler = function(event, ui) {  
-  var width = this.sliderBackground.width();
-  var duration = this._serializer.currentMedia().meta["dc:duration"] / 1000;
-  var newTime = ((ui.offset.left / width) * duration).toFixed(2);
-  
-  this._Popcorn.currentTime(newTime);
-  
-  this.draggingOngoing = false;
-};
-
+IriSP.SliderWidget = function(Popcorn, config, Serializer) {
+  IriSP.Widget.call(this, Popcorn, config, Serializer);
+};
+
+IriSP.SliderWidget.prototype = new IriSP.Widget();
+
+IriSP.SliderWidget.prototype.draw = function() {
+  var self = this;
+
+
+  this.selector.append("<div class='sliderBackground'></div>");
+  this.sliderBackground = this.selector.find(".sliderBackground");
+
+  this.selector.append("<div class='sliderForeground'></div>");
+  this.sliderForeground = this.selector.find(".sliderForeground");
+
+  this.selector.append(Mustache.to_html(IriSP.overlay_marker_template));
+  this.positionMarker = this.selector.find(".positionMarker");
+  this.positionMarker.css("height", "10px");
+  this.positionMarker.css("width", "10px");
+  this.positionMarker.css("top", "0%");
+
+  // a special variable to stop methods from tinkering
+  // with the positionMarker when the user is dragging it
+  this.draggingOngoing = false;
+
+  this.positionMarker.draggable({axis: "x",
+  start: IriSP.wrap(this, this.positionMarkerDraggingStartedHandler),
+  stop: IriSP.wrap(this, this.positionMarkerDraggedHandler)});
+
+  this.sliderBackground.click(function(event) { self.clickHandler.call(self, event); });
+
+  this.selector.hover(IriSP.wrap(this, this.mouseOverHandler), IriSP.wrap(this, this.mouseOutHandler));
+  this._Popcorn.listen("timeupdate", IriSP.wrap(this, this.sliderUpdater));
+};
+
+/* updates the slider as time passes */
+IriSP.SliderWidget.prototype.sliderUpdater = function() {
+  if(this.draggingOngoing)
+    return;
+
+  var time = this._Popcorn.currentTime();
+
+  var duration = this._serializer.currentMedia().meta["dc:duration"] / 1000;
+  var percent = ((time / duration) * 100).toFixed(2);
+	this.sliderForeground.css("width", percent + "%");
+	this.positionMarker.css("left", percent + "%");
+
+};
+
+IriSP.SliderWidget.prototype.clickHandler = function(event) {
+  /* this piece of code is a little bit convoluted - here's how it works :
+     we want to handle clicks on the progress bar and convert those to seeks in the media.
+     However, jquery only gives us a global position, and we want a number of pixels relative
+     to our container div, so we get the parent position, and compute an offset to this position,
+     and finally compute the progress ratio in the media.
+     Finally we multiply this ratio with the duration to get the correct time
+  */
+
+  var parentOffset = this.sliderBackground.parent().offset();
+  var width = this.sliderBackground.width();
+  var relX = event.pageX - parentOffset.left;
+
+  var duration = this._serializer.currentMedia().meta["dc:duration"] / 1000;
+  var newTime = ((relX / width) * duration).toFixed(2);
+
+  this._Popcorn.currentTime(newTime);
+};
+
+/* handles mouse over the slider */
+IriSP.SliderWidget.prototype.mouseOverHandler = function(event) {
+  this.sliderBackground.animate({"padding-top": "10px"}, 100);
+  this.sliderForeground.animate({"padding-top": "10px"}, 100);
+};
+
+/* handles when the mouse leaves the slider */
+IriSP.SliderWidget.prototype.mouseOutHandler = function(event) {
+  this.sliderBackground.animate({"padding-top": "5px"}, 50);
+  this.sliderForeground.animate({"padding-top": "5px"}, 50);
+};
+
+// called when the user starts dragging the position indicator
+IriSP.SliderWidget.prototype.positionMarkerDraggingStartedHandler = function(event, ui) {
+  this.draggingOngoing = true;
+};
+
+IriSP.SliderWidget.prototype.positionMarkerDraggedHandler = function(event, ui) {
+  var width = this.sliderBackground.width();
+  var duration = this._serializer.currentMedia().meta["dc:duration"] / 1000;
+  var newTime = ((ui.offset.left / width) * duration).toFixed(2);
+
+  this._Popcorn.currentTime(newTime);
+
+  this.draggingOngoing = false;
+};
+