1 /**
  2  * @author Gillis Haasnoot <gillis.haasnoot@gmail.com>
  3  * @package Banana.Controls
  4  * @summary Slider
  5  */
  6 
  7 goog.provide('Banana.Controls.DataControls.Slider');
  8 
  9 /**
 10  * more info at http://docs.jquery.com/UI/Slider
 11  * 
 12  * TODO jquery plugin ready for more than 1 handle. banana control not yet
 13  */
 14 
 15 /** @namespace Banana.Controls.Slider */
 16 namespace('Banana.Controls').Slider = Banana.Controls.DataControl.extend(
 17 /** @lends Banana.Controls.Slider.prototype */
 18 {
 19 
 20 	/**
 21 	 * Creates a slider by using jquery ui slider. 
 22 	 * Note that this control is not ready for multiple handles. The jquery ui plugin actually is.
 23 	 * @constructs
 24 	 * @extends Banana.Controls.DataControl
 25 	 */
 26 	init : function()
 27 	{
 28 		this._super();
 29 		
 30 		this.addCssClass("BSlider");
 31 		
 32 		this.stepSize = 1;
 33 		this.min = 1;
 34 		this.max = 10;
 35 		this.orientation = 'horizontal';
 36 		
 37 		this.bind('slide',this.getProxy(function(e,v){
 38 			
 39 			this.setData(v.value,false,true);
 40 		}));
 41 	},
 42 	
 43 	/**
 44 	 * @param {int} data range 0 to 100. 100 is full progressbar.
 45 	 * @param {boolean} ignoreEvent
 46 	 * @param {boolean} ignoreDom
 47 	 * @return {this}
 48 	 * @override
 49 	 */
 50 	setData : function(data,ignoreEvent,ignoreDom)
 51 	{
 52 		this._super(data,ignoreEvent,ignoreDom);
 53 		
 54 		if (!ignoreDom)
 55 		{
 56 			this.updateElement();
 57 		}
 58 		
 59 		return this;
 60 	},
 61 	
 62 	/**
 63 	 * @override 
 64 	 * this function to add some jquery events which should be handled as dom event
 65 	 */
 66 	getDomEventTypes : function()
 67 	{
 68 		var events = this._super();
 69 		
 70 		events.push('create');
 71 		events.push('slide');
 72 		events.push('change');
 73 		events.push('slidestop');
 74 		events.push('slidestart');
 75 		
 76 		return events;
 77 	},
 78 	
 79 	/**
 80 	 * creates the element 
 81 	 */
 82 	updateElement : function()
 83 	{
 84 		if (!this.isRendered) return;
 85 		
 86 		var options = {};
 87 		options.step = this.stepSize;
 88 		options.min = this.min;
 89 		options.max = this.max;
 90 		
 91 		if (this.getData())
 92 		{
 93 			options.value = this.getData();
 94 		}
 95 		
 96 		jQuery('#'+this.getClientId()).slider(options);	
 97 	},
 98 	
 99 	/**
100 	 * @override
101 	 * Here we create the slider itself
102 	 */
103 	updateDisplay : function()
104 	{
105 		this.updateElement();
106 	},
107 
108 	/**
109 	 * @param {int} size
110 	 * @return {this
111 	 */
112 	setStepSize : function(size)
113 	{
114 		this.stepSize = size;
115 		return this;
116 	},
117 	
118 	/**
119 	 * @param {int} size
120 	 * @return {this}
121 	 */
122 	setMin : function(size)
123 	{
124 		this.min = size;
125 		return this;
126 	},
127 	
128 	/**
129 	 * @param {int} size
130 	 * @return {this}
131 	 */
132 	setMax : function(size)
133 	{
134 		this.max = size;
135 		return this;
136 	},
137 	
138 	/**
139 	 * @param {string} o horizontal or vert
140 	 * @return {this}
141 	 */
142 	setOrientation : function(or)
143 	{
144 		this.orientation = or;
145 		return this;
146 	}
147 });