| 16 | | * TODO: Class Documentation |
| 17 | | * |
| 18 | | * Quick ex : |
| 19 | | * |
| 20 | | * <com:TSlider id="hSlider" AutoPostBack="true" HandleType="Image" Axis="Horizontal" Enabled="true" Width="200px" Minimum="0" Maximum="100" OnSliderChanged="sliderChanged"> |
| 21 | | * <prop:ClientSide.onSlide> |
| 22 | | * $('hslidervalue').innerHTML = value; |
| 23 | | * </prop:ClientSide.onSlide> |
| 24 | | * </com:TSlider> |
| 25 | | * Value : <span id="hslidervalue"><%=$this->slider->value%></span> |
| 26 | | * |
| 27 | | * Properties : |
| 28 | | * AutoPostBack=true ==> postback occured if slider changes. |
| 29 | | * HandleType ==> "Cursor" or "Image" or "Custom" |
| 30 | | * "Cursor" : display a simple cursor as handle on the track (see TSliderHandleCursor) |
| 31 | | * "Image" : display an image as handle on the track (see TSliderHandleImage) |
| 32 | | * "Custom" : Use a custom control as handle (extends from TSliderHandle, and specify with HandleClass Property) |
| 33 | | * Axis ==> Horizontal or Vertical |
| 34 | | * Width ==> Width of track |
| 35 | | * Height ==> Height of track |
| 36 | | * Minimum & Maximum => min & max values |
| 37 | | * Values ==> Allowed values (default = all values between Minimum and Maximum) |
| 38 | | * |
| 39 | | * Handle.* ==> Properties for handle (widht, height, color for Cursor, Width, Height, ImageUrl for Image) |
| 40 | | * |
| 41 | | * CssClass => Track Css Class. Defaults to 'slider'. The classname is appended with -horitontal or -vertical depending on the Direction. |
| 42 | | * Events : |
| 43 | | * ClientSide.onSlide : JS code to be executed when cursor is slided |
| 44 | | * ClientSide.onChange : JS code to be executed when the value has changed |
| 45 | | * onSliderChanged : Serverside Event raised on postback when value has changed. |
| 46 | | * |
| | 16 | * TSlider displays a slider for numeric input purpose. A slider consists of a 'track', |
| | 17 | * which define the range of possible value, and a 'handle' which can slide on the track, to select |
| | 18 | * a value in the range. The track can be either Horizontal or Vertical, depending of the {@link SetDirection Direction} |
| | 19 | * property. By default, it's horizontal. |
| | 20 | * |
| | 21 | * The range boundaries is defined by {@link SetMinValue MinValue} and {@link SetMaxValue MaxValue} properties. |
| | 22 | * The default range is from 0 to 100. |
| | 23 | * The {@link SetStepSize StepSize} property can be used to define the <b>step</b> between 2 values inside the range. |
| | 24 | * Notice that this step will be recomputed if there is more than 200 values between the range boundaries. |
| | 25 | * You can also provide the allowed values by setting the {@link SetValues Values} array. |
| | 26 | * |
| | 27 | * The handle sub-properties can be accessed by {@link GetHandle Handle} property. You can also provide your own control |
| | 28 | * for the handle, using {@link SetHandleClass HandleClass} property. Note that this class must be a subclass of |
| | 29 | * {@link TSliderHandle} |
| | 30 | * |
| | 31 | * The TSlider control can be easily customized using CssClasses. You can provide your own css file, using the |
| | 32 | * {@link SetCssUrl CssUrl} property. |
| | 33 | * The css class for TSlider can be set by the {@link setCssClass CssClass} property. Defaults values are "hslider" for |
| | 34 | * an Horizontal slider, or "vslider" for a Vertical one. |
| | 35 | * The css class for the Handle can be set by the <b>Handle.CssClass</b> subproperty. Defaults is "handle", which just |
| | 36 | * draw a red block as a cursor. 'handle-image' css class is also provided for your convenience, which display an image |
| | 37 | * as the handle. |
| | 38 | * |
| | 39 | * If {@link SetAutoPostBack AutoPostBack} property is true, postback is sent as soon as the value changed. |
| | 40 | * |
| | 41 | * TSlider raises the {@link onValueChanged} event when the value of the slider has changed during postback. |
| | 42 | * |
| | 43 | * You can also attach ClientSide javascript events handler to the slider : |
| | 44 | * - ClientSide.onSlide is called when the handle is slided on the track. You can get the current value in the <b>value</b> |
| | 45 | * javascript variable. You can use this event to update on client side a label with the current value |
| | 46 | * - ClientSide.onChange is called when the slider value has changed (at the end of a move). |
