/*!

 *

 * Released under the MIT license.

 */

//>>label: Slider

//>>group: Widgets

//>>description: Displays a flexible slider with ranges and accessibility via keyboard.

//>>css.structure: ../../themes/base/core.css

//>>css.structure: ../../themes/base/slider.css

//>>css.theme: ../../themes/base/theme.css

( function( factory ) {

	"use strict";

	if ( typeof define === "function" && define.amd ) {

		// AMD. Register as an anonymous module.

		define( [

			"jquery",

			"./mouse",

		], factory );

	} else {

		// Browser globals

		factory( jQuery );

	}

} )( function( $ ) {

"use strict";

return $.widget( "ui.slider", $.ui.mouse, {

	widgetEventPrefix: "slide",

	options: {

		animate: false,

		classes: {

			"ui-slider": "ui-corner-all",

			"ui-slider-handle": "ui-corner-all",

			// Note: ui-widget-header isn't the most fittingly semantic framework class for this

			// element, but worked best visually with a variety of themes

			"ui-slider-range": "ui-corner-all ui-widget-header"

		},

		distance: 0,

		max: 100,

		min: 0,

		orientation: "horizontal",

		range: false,

		step: 1,

		value: 0,

		values: null,

		// Callbacks

		change: null,

		slide: null,

		start: null,

		stop: null

	},

	// Number of pages in a slider

	// (how many times can you page up/down to go through the whole range)

	numPages: 5,

	_create: function() {

		this._keySliding = false;

		this._mouseSliding = false;

		this._animateOff = true;

		this._handleIndex = null;

		this._detectOrientation();

		this._mouseInit();

		this._calculateNewMax();

		this._addClass( "ui-slider ui-slider-" + this.orientation,

			"ui-widget ui-widget-content" );

		this._refresh();

		this._animateOff = false;

	},

	_refresh: function() {

		this._createRange();

		this._createHandles();

		this._setupEvents();

		this._refreshValue();

	},

	_createHandles: function() {

		var i, handleCount,

			options = this.options,

			existingHandles = this.element.find( ".ui-slider-handle" ),

			handle = "<span tabindex='0'></span>",

			handles = [];

		handleCount = ( options.values && options.values.length ) || 1;

		if ( existingHandles.length > handleCount ) {

			existingHandles.slice( handleCount ).remove();

			existingHandles = existingHandles.slice( 0, handleCount );

		}

		for ( i = existingHandles.length; i < handleCount; i++ ) {

			handles.push( handle );

		}

		this.handles = existingHandles.add( $( handles.join( "" ) ).appendTo( this.element ) );

		this._addClass( this.handles, "ui-slider-handle", "ui-state-default" );

		this.handle = this.handles.eq( 0 );

		this.handles.each( function( i ) {

			$( this )

				.data( "ui-slider-handle-index", i )

				.attr( "tabIndex", 0 );

		} );

	},

	_createRange: function() {

		var options = this.options;

		if ( options.range ) {

			if ( options.range === true ) {

				if ( !options.values ) {

					options.values = [ this._valueMin(), this._valueMin() ];

				} else if ( options.values.length && options.values.length !== 2 ) {

					options.values = [ options.values[ 0 ], options.values[ 0 ] ];

				} else if ( Array.isArray( options.values ) ) {

					options.values = options.values.slice( 0 );

				}

			}

			if ( !this.range || !this.range.length ) {

				this.range = $( "<div>" )

					.appendTo( this.element );

				this._addClass( this.range, "ui-slider-range" );

			} else {

				this._removeClass( this.range, "ui-slider-range-min ui-slider-range-max" );

				// Handle range switching from true to min/max

				this.range.css( {

					"left": "",

					"bottom": ""

				} );

			}

			if ( options.range === "min" || options.range === "max" ) {

				this._addClass( this.range, "ui-slider-range-" + options.range );

			}

		} else {

			if ( this.range ) {

				this.range.remove();

			}

			this.range = null;

		}

	},

	_setupEvents: function() {

		this._off( this.handles );

		this._on( this.handles, this._handleEvents );

		this._hoverable( this.handles );

		this._focusable( this.handles );

	},

	_destroy: function() {

		this.handles.remove();

		if ( this.range ) {

			this.range.remove();

		}

		this._mouseDestroy();

	},

	_mouseCapture: function( event ) {

		var position, normValue, distance, closestHandle, index, allowed, offset, mouseOverHandle,

			that = this,

			o = this.options;

		if ( o.disabled ) {

			return false;

		}

		this.elementSize = {

			width: this.element.outerWidth(),

			height: this.element.outerHeight()

		};

		this.elementOffset = this.element.offset();

		position = { x: event.pageX, y: event.pageY };

		normValue = this._normValueFromMouse( position );

		distance = this._valueMax() - this._valueMin() + 1;

		this.handles.each( function( i ) {

			var thisDistance = Math.abs( normValue - that.values( i ) );

			if ( ( distance > thisDistance ) ||

				( distance === thisDistance &&

					( i === that._lastChangedValue || that.values( i ) === o.min ) ) ) {

				distance = thisDistance;

				closestHandle = $( this );

				index = i;

			}

		} );

		allowed = this._start( event, index );

		if ( allowed === false ) {

			return false;

		}

		this._mouseSliding = true;

		this._handleIndex = index;

		this._addClass( closestHandle, null, "ui-state-active" );

		closestHandle.trigger( "focus" );

		offset = closestHandle.offset();

		mouseOverHandle = !$( event.target ).parents().addBack().is( ".ui-slider-handle" );

		this._clickOffset = mouseOverHandle ? { left: 0, top: 0 } : {

			left: event.pageX - offset.left - ( closestHandle.width() / 2 ),

			top: event.pageY - offset.top -

				( closestHandle.height() / 2 ) -

				( parseInt( closestHandle.css( "borderTopWidth" ), 10 ) || 0 ) -

				( parseInt( closestHandle.css( "borderBottomWidth" ), 10 ) || 0 ) +

				( parseInt( closestHandle.css( "marginTop" ), 10 ) || 0 )

		};

		if ( !this.handles.hasClass( "ui-state-hover" ) ) {

			this._slide( event, index, normValue );

		}

		this._animateOff = true;

		return true;

	},

	_mouseStart: function() {

		return true;

	},

	_mouseDrag: function( event ) {

		var position = { x: event.pageX, y: event.pageY },

			normValue = this._normValueFromMouse( position );

		this._slide( event, this._handleIndex, normValue );

		return false;

	},

	_mouseStop: function( event ) {

		this._removeClass( this.handles, null, "ui-state-active" );

		this._mouseSliding = false;

		this._stop( event, this._handleIndex );

		this._change( event, this._handleIndex );

		this._handleIndex = null;

		this._clickOffset = null;

		this._animateOff = false;

		return false;

	},

	_detectOrientation: function() {

		this.orientation = ( this.options.orientation === "vertical" ) ? "vertical" : "horizontal";

	},

	_normValueFromMouse: function( position ) {

		var pixelTotal,

			pixelMouse,

			percentMouse,

			valueTotal,

			valueMouse;

		if ( this.orientation === "horizontal" ) {

			pixelTotal = this.elementSize.width;

			pixelMouse = position.x - this.elementOffset.left -

				( this._clickOffset ? this._clickOffset.left : 0 );

		} else {

			pixelTotal = this.elementSize.height;

			pixelMouse = position.y - this.elementOffset.top -

				( this._clickOffset ? this._clickOffset.top : 0 );

		}

		percentMouse = ( pixelMouse / pixelTotal );

		if ( percentMouse > 1 ) {

			percentMouse = 1;

		}

		if ( percentMouse < 0 ) {

			percentMouse = 0;

		}

		if ( this.orientation === "vertical" ) {

			percentMouse = 1 - percentMouse;

		}

		valueTotal = this._valueMax() - this._valueMin();

		valueMouse = this._valueMin() + percentMouse * valueTotal;

		return this._trimAlignValue( valueMouse );

	},

	_uiHash: function( index, value, values ) {

		var uiHash = {

			handle: this.handles[ index ],

			handleIndex: index,

			value: value !== undefined ? value : this.value()

		};

		if ( this._hasMultipleValues() ) {

			uiHash.value = value !== undefined ? value : this.values( index );

			uiHash.values = values || this.values();

		}

		return uiHash;

	},

	_hasMultipleValues: function() {

		return this.options.values && this.options.values.length;

	},

	_start: function( event, index ) {

		return this._trigger( "start", event, this._uiHash( index ) );

	},

	_slide: function( event, index, newVal ) {

		var allowed, otherVal,

			currentValue = this.value(),

			newValues = this.values();

		if ( this._hasMultipleValues() ) {

			otherVal = this.values( index ? 0 : 1 );

			currentValue = this.values( index );

			if ( this.options.values.length === 2 && this.options.range === true ) {

				newVal =  index === 0 ? Math.min( otherVal, newVal ) : Math.max( otherVal, newVal );

			}

			newValues[ index ] = newVal;

		}

		if ( newVal === currentValue ) {

			return;