var GS = GS || {};

(function ($){
	GS.Slider = (function (){
		return {
		    sliderConstant: 9,
		    
			initialise: function ( input ){
				input = input instanceof jQuery ? input : $(input);
				
				if( input.hasClass('gs-taken-over') )
					return false;
				
				var isVertical = !!input.hasClass('gs-slider-vertical');
								
				var wrapperDiv = $( '<div class="gs-slider-wrapper">' 
				                    +   '<div class="gs-slider-bar"></div>' 
				                    +   '<div class="gs-slider-bar-handle"></div>'
				                    + '</div>');
//				wrapperDiv.css( isVertical ? 'height' : 'width', isVertical ? input.height() : input.width());

				input.before(wrapperDiv);
				if( isVertical )
					wrapperDiv.addClass('gs-slider-vertical');
				wrapperDiv.append(input);

				wrapperDiv.click(function (e){
				    var mround  = Math.round,
				        slider  = $(this).children('.gs-slider-bar'),
                        range	= $(this).children('input.gs-slider'),
                    	x		= e.pageX - $(this).offset().left,
                    	y		= e.pageY - $(this).offset().top,
                    	w		= $(this).width(),
						h		= $(this).height(),
                    	percent	= mround((isVertical ? y : x) * 100 / (isVertical ? h : w)),
                    	val		= mround((isVertical ? y : x) * range.attr('max') / (isVertical ? h : w));

					GS.MediaComponent.trackVideoScrubClick( val );
                    
                    slider.css( isVertical ? 'height' : 'width', ( isVertical ? (100-percent) : percent ) + '%');

                    range.attr('value', val);
                    range.change();
                    
                    // this dirty little hack forces WebKit based browsers to redraw after a click
                    GS.Slider.forceRedraw(slider);
				});
				
				input.addClass('gs-taken-over');
			},
			
			updateSlider: function ( input ){
			    input = input instanceof jQuery ? input : $(input);
			    var isVertical  = !!input.hasClass('gs-slider-vertical'),
			        sliderBar   = input.siblings('.gs-slider-bar'),
				    max         = input.attr('max'),
                    val         = input.attr('value');
                                
                sliderBar.css( isVertical ? 'height' : 'width', (100 * val / max) + "%" );
				// var sliderProp = isVertical ? 'height' : 'width';
				// var sliderVal = (100 * val / max) + "%";
				// sliderBar.animate({ sliderProp : sliderVal }, 2000, function(){});
			},
			
			forceRedraw: function (node){
			    node = node instanceof jQuery ? node : $(node);
				//console.log('redraw slider');
			    var oldTransform = node.css('-webkit-transform');
                node.css('-webkit-transform', 'scale(1)');
                node.css('-webkit-transform', oldTransform);
				// var n = document.createTextNode(' ');
				// node.appendChild(n);
				// node.find(n).remove();
			}
		};
	})();
})(jQuery);