Changeset 2189

Show
Ignore:
Timestamp:
09/03/2007 07:42:04 AM
Author:
tof
Message:

TSlider: Use Css classes instead of inline style to render the slider

Files:

Legend:

Unmodified
Added
Removed
Modified
Copied
Moved
  • branches/3.2-dev/demos/quickstart/protected/pages/Controls/Samples/TSlider/Home.page

    r2188 r2189  
    44 
    55<p>Horizontal slider, with image handle, Javascript 'onSlide' handler, ServerSide 'onSliderChanged' handler and autopostback=true</p> 
    6 <com:TSlider id="hSlider" AutoPostBack="true" HandleType="Image" Axis="Horizontal" Enabled="true" Width="200px" Minimum="0" Maximum="100" OnSliderChanged="sliderChanged"> 
     6<com:TSlider id="hSlider" AutoPostBack="true" Handle.CssClass="handle-image" Direction="Horizontal" Enabled="true" MinValue="0" MaxValue="100" OnSliderChanged="sliderChanged"> 
    77        <prop:ClientSide.onSlide> 
    88                $('hslidervalue').innerHTML = value; 
     
    1414Vertical slider, cursor handle, no auto postback, no event handler 
    1515</p> 
    16 <com:TSlider id="vSlider" HandleType="Cursor" Axis="Vertical" Enabled="true" Height="200px"  /> 
     16<com:TSlider id="vSlider" Direction="Vertical" Enabled="true" Height="200px" Values="(0,1,2,3,4,5)" MinValue="2" /> 
    1717 <com:TButton onclick="testsubmit" text="Submit"/> 
     18 
     19<br/> 
     20<com:TSlider /> 
    1821<p> 
    1922Results :<br/> 
  • branches/3.2-dev/framework/Web/Javascripts/source/prado/slider/slider.js

    r2188 r2189  
    66                this.onChange=options.onChange; 
    77                options.onChange=this.change.bind(this); 
     8                 
     9                this.onSlide=options.onSlide; 
     10                options.onSlide=this.slide.bind(this); 
     11                 
    812                this.hiddenField=$(this.options.ID+'_1'); 
    913                new Control.Slider(options.ID+'_handle',options.ID, options); 
     
    1317        }, 
    1418         
     19        round : function (v) 
     20        { 
     21                // round the value with specified decimals 
     22                var d=Math.pow(10,this.options['decimals']); 
     23                // Round 
     24                return (Math.round(v*d)/d); 
     25        }, 
     26         
    1527        change : function (v) 
    1628        { 
     29                v=this.round(v); 
    1730                this.hiddenField.value=v; 
    1831                if (this.onChange) 
     
    2437                        Event.fireEvent(this.hiddenField, "change"); 
    2538                } 
     39        }, 
     40         
     41        slide : function (v) 
     42        { 
     43                v=this.round(v); 
     44                if (this.onSlide) 
     45                { 
     46                        this.onSlide(v); 
     47                } 
    2648        } 
    2749}); 
  • branches/3.2-dev/framework/Web/UI/WebControls/TSlider.php

    • Property svn:keywords set to Id
    r2188 r2189  
    1515 * 
    1616 * TODO: Class Documentation 
    17  *  
     17 * 
    1818 * Quick ex : 
    19  *  
     19 * 
    2020 * <com:TSlider id="hSlider" AutoPostBack="true" HandleType="Image" Axis="Horizontal" Enabled="true" Width="200px" Minimum="0" Maximum="100" OnSliderChanged="sliderChanged"> 
    2121 *      <prop:ClientSide.onSlide> 
     
    2424 * </com:TSlider> 
    2525 * Value  : <span id="hslidervalue"><%=$this->slider->value%></span> 
    26  *  
     26 * 
    2727 * Properties : 
    2828 * AutoPostBack=true ==> postback occured if slider changes. 
     
    3636 * Minimum & Maximum => min & max values 
    3737 * Values ==> Allowed values (default = all values between Minimum and Maximum) 
    38  *  
     38 * 
    3939 * Handle.* ==> Properties for handle (widht, height, color for Cursor, Width, Height, ImageUrl for Image) 
    40  *  
     40 * 
     41 * CssClass => Track Css Class. Defaults to 'slider'. The classname is appended with -horitontal or -vertical depending on the Direction. 
    4142 * Events : 
    4243 * ClientSide.onSlide : JS code to be executed when cursor is slided 
    4344 * ClientSide.onChange : JS code to be executed when the value has changed 
    4445 * onSliderChanged : Serverside Event raised on postback when value has changed. 
    45  *  
    46  *  
     46 * 
     47 * 
    4748 * @author Christophe Boulain <Christophe.Boulain@gmail.com> 
    4849 * @version $Id$ 
     
    6162         */ 
    6263        private $_handleClass; 
    63          
     64        /** 
     65         * @var boolean Wether the data has changed during postback 
     66         */ 
    6467        private $_dataChanged=false; 
     68        /** 
     69         * @var TSliderClientScript Clients side javascripts 
     70         */ 
    6571        private $_clientScript=null; 
    66          
    67         public function getAxis()  
    68         {  
    69                 return $this->getViewState('axis'); 
    70         } 
    71          
    72         public function setAxis($v)  
    73         { 
    74                 $this->setViewState('axis', TPropertyValue::ensureEnum($v,TSliderAxisType)); 
    75         } 
    76  
    77         public function getIncrement()  
    78         {  
    79                 return $this->getViewState('increment',1); 
    80         } 
    81         public function setIncrement($v)  
    82         {  
    83                 $this->setViewState('increment', TPropertyValue::ensureInteger($v),1); 
    84         } 
    85  
    86         public function getMaximum()  
    87         {  
    88                 return $this->getViewState('maximum',100); 
    89         } 
    90          
    91         public function setMaximum($v)  
    92         {  
    93                 $this->setViewState('maximum', TPropertyValue::ensureInteger($v),100); 
    94         } 
    95  
    96         public function getMinimum()  
    97         {  
    98                 return $this->getViewState('minimum',0); 
    99         } 
    100          
    101         public function setMinimum($v)  
    102         {  
    103                 $this->setViewState('minimum', TPropertyValue::ensureInteger($v),0); 
    104         } 
    105  
    106         public function getAlignX()  
    107         {  
    108                 return $this->getViewState('alignx'); 
    109         } 
    110          
    111         public function setAlignX($v)  
    112         {  
    113                 $this->setViewState('alignx', $v); 
    114         } 
    115  
    116         public function getAlignY()  
    117         {  
    118                 return $this->getViewState('aligny'); 
    119         } 
    120          
    121         public function setAlignY($v)  
    122         {  
    123                 $this->setViewState('aligny', $v); 
    124         } 
    125  
    126         public function getValue()  
    127         {  
    128                 return $this->getViewState('value',0); 
    129         } 
    130          
    131         public function setValue($v)  
    132         {  
    133                 $this->setViewState('value', TPropertyValue::ensureFloat($v),0); 
    134         } 
    135  
    136         public function getValues()  
    137         {  
    138                 return $this->getViewState('values'); 
    139         } 
    140          
    141         public function setValues($v)  
    142         {  
    143                 $this->setViewState('values', TPropertyValue::ensureArray($v)); 
    144         } 
    145  
     72 
     73        /** 
     74         * @return TSliderDirection Direction of slider (Horizontal or Vertical) 
     75         */ 
     76        public function getDirection() 
     77        { 
     78                return $this->getViewState('Direction', TSliderDirection::Horizontal); 
     79        } 
     80 
     81        /** 
     82         * @param TSliderDirection Direction of slider (Horizontal or Vertical) 
     83         */ 
     84        public function setDirection($value) 
     85        { 
     86                $this->setViewState('Direction', TPropertyValue::ensureEnum($value,TSliderDirection)); 
     87        } 
     88 
     89        /** 
     90         * @return string URL for the CSS file including all relevant CSS class definitions. Defaults to ''. 
     91         */ 
     92        public function getCssUrl() 
     93        { 
     94                return $this->getViewState('CssUrl',''); 
     95        } 
     96 
     97        /** 
     98         * @param string URL for the CSS file including all relevant CSS class definitions. 
     99         */ 
     100        public function setCssUrl($value) 
     101        { 
     102                $this->setViewState('CssUrl',TPropertyValue::ensureString($value),''); 
     103        } 
     104 
     105        /** 
     106         * @return string CssClass for an horizontal track of the slider control. Defaults to 'hslider' 
     107         */ 
     108        public function getHorizontalCssClass () 
     109        { 
     110                return $this->getViewState('HorizontalCssClass', 'hslider'); 
     111        } 
     112 
     113        /** 
     114         * @param string CssClass for an horizontal track of the slider control. Defaults to 'hslider' 
     115         */ 
     116        public function setHorizontalCssClass ($value) 
     117        { 
     118                $this->setViewState('HorizontalCssClass', $value, 'hslider'); 
     119        } 
     120 
     121        /** 
     122         * @return string CssClass for a vertical track of the slider control. Defaults to 'slider' 
     123         */ 
     124        public function getVerticalCssClass () 
     125        { 
     126                return $this->getViewState('VerticalCssClass', 'vslider'); 
     127        } 
     128 
     129        /** 
     130         * @param string CssClass for a vertical track of the slider control. Defaults to 'vslider' 
     131         */ 
     132        public function setVerticalCssClass ($value) 
     133        { 
     134                $this->setViewState('VerticalCssClass', $value, 'vslider'); 
     135        } 
     136 
     137        /** 
     138         * @return int Maximum value for the slider 
     139         */ 
     140        public function getMaxValue() 
     141        { 
     142                return $this->getViewState('MaxValue',100); 
     143        } 
     144 
     145        /** 
     146         * @param int Maximum value for slider 
     147         */ 
     148        public function setMaxValue($value) 
     149        { 
     150                $value=TPropertyValue::ensureInteger($value); 
     151                // Should I ensure the values are the same than the allowed values ? 
     152                /* 
     153                if (($values=$this->getValues())!==null && $value != max($values)) $value=max($values); 
     154                */ 
     155                $this->setViewState('MaxValue', $value,100); 
     156        } 
     157 
     158        /** 
     159         * @return int Minimum value for slider 
     160         */ 
     161        public function getMinValue() 
     162        { 
     163                return $this->getViewState('MinValue',0); 
     164        } 
     165 
     166        /** 
     167         * @param int Minimum value for slider 
     168         */ 
     169        public function setMinValue($value) 
     170        { 
     171                $value=TPropertyValue::ensureInteger($value); 
     172                // Should I ensure the values are the same than the allowed values ? 
     173                /* 
     174                if (($values=$this->getValues())!==null && $value != min($values)) $value=min($values); 
     175                */ 
     176                $this->setViewState('MinValue', $value,0); 
     177        } 
     178 
     179        /** 
     180         * @return float current value of slider 
     181         */ 
     182        public function getValue() 
     183        { 
     184                return $this->getViewState('Value',0); 
     185        } 
     186 
     187        /** 
     188         * @param float current value of slider 
     189         */ 
     190        public function setValue($value) 
     191        { 
     192                $this->setViewState('Value', TPropertyValue::ensureFloat($value),0); 
     193        } 
     194 
     195        /** 
     196         * @return array list of allowed values the slider can take 
     197         */ 
     198        public function getValues() 
     199        { 
     200                return $this->getViewState('Values', null); 
     201        } 
     202 
     203        /** 
     204         * @param array list of allowed values the slider can take 
     205         */ 
     206        public function setValues($value) 
     207        { 
     208                $value=TPropertyValue::ensureArray($value); 
     209                $this->setViewState('Values', $value, null); 
     210                // Should I ensure Min/MaxValue are correct ??? 
     211                /*  
     212                if ($this->getMinValue() < min($value)) $this->setMinValue(min($value)); 
     213                if ($this->getMaxValue() > max($value)) $this->setMaxValue(max($value)); 
     214                */  
     215        } 
     216 
     217        /** 
     218         * @return int number of decimals for the value. Defaults to 0 
     219         */ 
     220        public function getDecimals() 
     221        { 
     222                return $this->getViewState("Decimals", 0); 
     223        } 
     224 
     225        /** 
     226         * @param int number of decimas for the value. Defaults to 0. 
     227         */ 
     228        public function setDecimals($value) 
     229        { 
     230                $this->setViewState ('Decimals', TPropertyValue::ensureInteger($value), 0); 
     231        } 
     232 
     233        /** 
     234         * This method will return the handle control. 
     235         * @return TSliderHandle the control for the slider's handle (must inherit from TSliderHandle} 
     236         */ 
    146237        public function getHandle () 
    147238        { 
    148239                if ($this->_handle==null) 
    149240                { 
    150                         if (($type=$this->getHandleType()) != TSliderHandleType::Custom)  
    151                                 $class='TSliderHandle'.$type; 
    152                         else 
    153                                 $class=$this->getHandleClass(); 
    154                         $this->_handle=prado::createComponent($class, $this); 
     241                        $this->_handle=prado::createComponent($this->getHandleClass(), $this); 
    155242                        if (!$this->_handle instanceof TSliderHandle) 
    156243                        { 
     
    160247                return $this->_handle; 
    161248        } 
    162          
    163         public function getHandleType () 
    164         { 
    165                 return $this->getViewState('handleType', TSliderHandleType::Cursor); 
    166         } 
    167          
    168         public function setHandleType ($value) 
    169         { 
    170                 $this->setViewState ('handleType', TPropertyValue::ensureEnum($value, TSliderHandleType)); 
    171         } 
    172          
     249 
     250 
     251        /** 
     252         * @return string Custom handle class. Defaults to TSliderHandle; 
     253         */ 
    173254        public function getHandleClass () 
    174255        { 
    175                 return $this->_handleClass?$this->_handleClass:TSliderHandleCursor; 
    176         } 
    177          
     256                return $this->_handleClass?$this->_handleClass:TSliderHandle; 
     257        } 
     258 
     259        /** 
     260         * Set custom handle class. This class must exists, and be an instance of TSliderHandle 
     261         * 
     262         * @param string Custom Handle Class 
     263         */ 
    178264        public function setHandleClass ($value) 
    179265        { 
     
    187273                } 
    188274        } 
    189          
     275 
    190276        /** 
    191277         * @return boolean a value indicating whether an automatic postback to the server 
    192      * will occur whenever the user modifies the text in the TTextBox control and 
    193      * then tabs out of the component. Defaults to false. 
     278         * will occur whenever the user modifies the slider value. Defaults to false. 
    194279         */ 
    195280        public function getAutoPostBack() 
     
    201286         * Sets the value indicating if postback automatically. 
    202287         * An automatic postback to the server will occur whenever the user 
    203          * modifies the text in the TTextBox control and then tabs out of the component
     288         * modifies the slider value
    204289         * @param boolean the value indicating if postback automatically 
    205290         */ 
     
    208293                $this->setViewState('AutoPostBack',TPropertyValue::ensureBoolean($value),false); 
    209294        } 
    210          
    211          
    212         /** 
    213          * Creates a style object to be used by the control. 
    214          * This method override parent implementation to provide some default values to slider style 
    215          * @return TStyle the default style created for TSlider 
    216          */ 
    217         protected function createStyle () 
    218         { 
    219                 $style=new TStyle(); 
    220                 $style->setWidth($this->Axis == 'Vertical'?'5px':'100px'); 
    221                 $style->setHeight($this->Axis == 'Vertical'?'100px':'5px'); 
    222                 $style->setBackColor('rgb(170,170,170)'); 
    223                 $style->setStyleField('padding', '0'); 
    224                 $style->setStyleField('margin', '0'); 
    225                 return $style; 
    226         } 
    227          
    228  
    229          
     295 
     296 
    230297        /** 
    231298         * Gets the name of the javascript class responsible for performing postback for this control. 
     
    248315                return $this->_dataChanged; 
    249316        } 
    250          
     317 
    251318        /** 
    252319         * Raises postdata changed event. 
     
    260327                $this->onSliderChanged(null); 
    261328        } 
    262          
     329 
    263330        /** 
    264331         * Raises <b>OnSliderChanged</b> event. 
     
    271338        public function onSliderChanged($param) 
    272339        { 
    273                 $this->raiseEvent('OnSliderChanged',$this,$param); 
    274         } 
    275          
     340                if ($this->getDataChanged()) $this->raiseEvent('OnSliderChanged',$this,$param); 
     341        } 
     342 
    276343        /** 
    277344         * Loads user input data. 
     
    290357                } 
    291358                else 
    292                        return false; 
    293         } 
    294          
     359                return false; 
     360        } 
     361 
    295362        /** 
    296363         * Gets the TSliderClientScript to set the TSlider event handlers. 
     
    307374        { 
    308375                if(is_null($this->_clientScript)) 
    309                        $this->_clientScript = $this->createClientScript(); 
     376                $this->_clientScript = $this->createClientScript(); 
    310377                return $this->_clientScript; 
    311378        } 
    312379 
    313380        /** 
    314          * @return TDatePickerClientScript javascript validator event options. 
     381         * @return TSliderClientScript javascript event options. 
    315382         */ 
    316383        protected function createClientScript() 
     
    318385                return new TSliderClientScript; 
    319386        } 
    320          
     387 
    321388        public function getTagName () 
    322389        { 
    323390                return "div"; 
    324391        } 
    325          
     392 
    326393        /** 
    327394         * Renders body content. 
    328395         * This method renders the handle of slider 
    329          * This method overrides parent implementation  
     396         * This method overrides parent implementation 
    330397         * @param THtmlWriter writer 
    331398         */ 
     
    334401                // Render the handle 
    335402                $this->getHandle()->render ($writer); 
    336                  
    337         } 
    338          
    339         /** 
    340          * Add the differents style properties to slider track, and register the client scripts. 
     403 
     404        } 
     405 
     406        /** 
     407         * Add the specified css classes to the track 
    341408         * @param THtmlWriter writer 
    342409         */ 
    343410        protected function addAttributesToRender($writer) 
    344411        { 
     412 
     413                $writer->addAttribute('id',$this->getClientID()); 
     414                $class=($this->getDirection()==TSliderDirection::Horizontal)?$this->getHorizontalCssClass():$this->getVerticalCssClass(); 
     415                $writer->addAttribute('class', $class); 
    345416                parent::addAttributesToRender($writer); 
    346                 $writer->addAttribute('id',$this->getClientID()); 
    347                 // If style has not been rendered yet, do it. 
    348                 if (! $this->getHasStyle()) $this->getStyle()->addAttributesToRender($writer); 
    349         }        
    350          
     417        } 
     418 
     419        /** 
     420         * Registers CSS and JS. 
     421         * This method is invoked right before the control rendering, if the control is visible. 
     422         * @param mixed event parameter 
     423         */ 
    351424        public function onPreRender ($param) 
    352425        { 
    353426                parent::onPreRender($param); 
     427                $this->registerStyleSheet(); 
    354428                $this->registerSliderClientScript(); 
    355                  
    356         } 
    357          
     429 
     430        } 
     431 
     432        /** 
     433         * Registers the CSS relevant to the TSlider. 
     434         * It will register the CSS file specified by {@link getCssUrl CssUrl}. 
     435         * If that is not set, it will use the default CSS. 
     436         */ 
     437        protected function registerStyleSheet() 
     438        { 
     439                if(($url=$this->getCssUrl())==='') 
     440                $url=$this->getApplication()->getAssetManager()->publishFilePath(dirname(__FILE__).DIRECTORY_SEPARATOR.'assets'.DIRECTORY_SEPARATOR.'TSlider.css'); 
     441                $this->getPage()->getClientScript()->registerStyleSheetFile($url,$url); 
     442        } 
     443 
    358444        /** 
    359445         * Registers the javascript code to initialize the slider. 
     
    370456                $cs->registerPostBackControl($this->getClientClassName(),$this->getSliderOptions()); 
    371457        } 
    372          
     458 
    373459        /** 
    374460         * Get javascript sliderr options. 
     
    381467                $options['EventTarget'] = $this->getUniqueID(); 
    382468                $options['AutoPostBack'] = $this->getAutoPostBack(); 
    383                  
     469 
    384470                // Slider Control options 
    385                 $options['axis'] = strtolower($this->getAxis()); 
    386                 $options['increment'] = $this->getIncrement(); 
    387                 $options['step'] = $this->getIncrement(); 
    388                 $options['alignX'] = $this->getAlignX(); 
    389                 $options['alignY'] = $this->getAlignY(); 
    390                 $options['maximum'] = $this->getMaximum(); 
    391                 $options['minimum'] = $this->getMinimum(); 
    392                 $options['range'] = 'javascript:$R('.$this->getMinimum().",".$this->getMaximum().")"; 
     471                $options['axis'] = strtolower($this->getDirection()); 
     472                $options['maximum'] = $this->getMaxValue(); 
     473                $options['minimum'] = $this->getMinValue(); 
     474                $options['range'] = 'javascript:$R('.$this->getMinValue().",".$this->getMaxValue().")"; 
    393475                $options['sliderValue'] = $this->getValue(); 
    394                 $options['disabled'] = !$this->getEnabled();  
     476                $options['disabled'] = !$this->getEnabled(); 
    395477                if (($values=$this->getValues())) 
    396                        $options['values'] = TJavascript::Encode($values,false); 
    397                  
    398                                         
     478                $options['values'] = TJavascript::Encode($values,false); 
     479                $options['decimals'] = $this->getDecimals(); 
     480                         
    399481                if(!is_null($this->_clientScript)) 
    400                         $options = array_merge($options, 
    401                                 $this->_clientScript->getOptions()->toArray()); 
     482                        $options = array_merge($options,$this->_clientScript->getOptions()->toArray()); 
    402483                return $options; 
    403484        } 
     
    410491 * can be modified through the {@link TSlider:: getClientSide ClientSide} 
    411492 * property of a slider. 
    412  *  
     493 * 
    413494 * The current value of the slider can be get in the 'value' js variable 
    414  *  
     495 * 
    415496 * The <tt>OnMove</tt> event is raised when the slider moves 
    416497 * The <tt>OnChange</tt> event is raised when the slider value is changed (or at the end of a move) 
     
    440521                return $this->getOption('onChange'); 
    441522        } 
    442          
    443       /* Javascript code to execute when the slider moves. 
     523 
     524      /* Javascript code to execute when the slider moves. 
    444525         * @param string javascript code 
    445526         */ 
     
    460541 
    461542 
    462 class TSliderAxisType extends TEnumerable 
     543/** 
     544 * TSliderDirection class. 
     545 *  
     546 * TSliderDirection defines the enumerable type for the possible direction that can be used in a {@link TSlider} 
     547 *  
     548 * The following enumerable values are defined : 
     549 * - Horizontal : Horizontal slider 
     550 * - Vertical : Vertical slider 
     551 *  
     552 * @author Christophe Boulain <Christophe.Boulain@gmail.com> 
     553 * @version $Id$ 
     554 * @package System.Web.UI.WebControls 
     555 * @since 3.1.1 
     556 */ 
     557class TSliderDirection extends TEnumerable 
    463558{ 
    464559        const Horizontal='Horizontal'; 
     
    466561} 
    467562 
    468 class TSliderHandleType extends TEnumerable 
    469 { 
    470         const Image='Image'; 
    471         const Cursor='Cursor'; 
    472         const Custom='Custom'; 
    473 } 
    474563 
    475564/** 
    476  * TSliderHandle abstract class 
     565 * TSliderHandle class 
     566 * 
     567 * TSliderHandle is responsible of rendering the 'handle' control on a {@link TSlider} 
     568 * Users can override this class to personalize the handle. 
     569 * Default class renders a 'div' tag, and apply the css class provided by {@link setCssClass CssClass} property. 
    477570 *  
    478  * Base class for slider handles. All custom handles must derive from this class. 
    479  * 
     571 * Two css classes are provided by default :  
     572 * - handle : render a simple red cursor 
     573 * - handle-image : render an image as handle 
     574 *  
     575 * @author Christophe Boulain <Christophe.Boulain@gmail.com> 
     576 * @version $Id$ 
     577 * @package System.Web.UI.WebControls 
     578 * @since 3.1.1 
    480579 */ 
    481 abstract class TSliderHandle extends TWebControl 
     580class TSliderHandle extends TWebControl 
    482581{ 
    483582        private $_track; 
    484          
     583 
    485584        public function __construct ($track) 
    486585        { 
    487586                if ($track instanceof TSlider) 
    488587                { 
    489                         $this->_track=$track;   
     588                        $this->_track=$track; 
    490589                } else { 
    491590                        throw new TInvalidDataTypeException ('slider_track_class_invalid', get_class($this)); 
    492591                } 
    493592        } 
    494          
     593 
    495594        public function getTrack() { 
    496595                return $this->_track; 
    497596        } 
    498          
     597 
    499598        public function getTagName() 
    500599        { 
    501600                return 'div'; 
    502601        } 
    503          
    504         public function setWidth($v) 
    505         { 
    506                 parent::setWidth(TPropertyValue::ensureInteger($v).'px'); 
    507         } 
    508          
    509         public function setHeight($v) 
    510         { 
    511                 parent::setHeight(TPropertyValue::ensureInteger($v).'px'); 
    512         } 
    513          
    514          
    515         public function getRelativeX()  
    516         {  
    517                 return $this->getStyle()->getStyleField('left'); 
    518         } 
    519          
    520         public function setRelativeX($v)  
    521         {  
    522                 $this->getStyle()->setStyleField('left', TPropertyValue::ensureInteger($v)."px"); 
    523         } 
    524  
    525         public function getRelativeY()  
    526         {  
    527                 return $this->getStyle()->getStyleField('top'); 
    528         } 
    529          
    530         public function setRelativeY($v)  
    531         {  
    532                 $this->getStyle()->setStyleField('top', TPropertyValue::ensureInteger($v)."px"); 
    533         } 
    534          
     602 
     603        /** 
     604         * @return string CssClass for the handle of the slider control. Defaults to 'handle' 
     605         */ 
     606        public function getCssClass () 
     607        { 
     608                $class=parent::getCssClass(); 
     609                return ($class=='')?'handle':$class; 
     610        } 
     611 
    535612        public function addAttributesToRender($writer) 
    536613        { 
    537614                parent::addAttributesToRender($writer); 
    538615                $writer->addAttribute('id', $this->getTrack()->getClientID()."_handle"); 
    539                 if (! $this->getHasStyle()) $this->getStyle()->addAttributesToRender($writer); 
    540         } 
    541          
    542          
     616                $writer->addAttribute('class', $this->getCssClass()); 
     617        } 
     618 
     619 
    543620} 
    544621 
    545 /** 
    546  * TSliderHandleCursor class 
    547  *  
    548  * Draw a simple block cursor as a handle. 
    549  * Cursor size can be set with {@link setWidth Width} and {@link setHeight Height} properties. 
    550  * Its color can be set with {@link setColor Color} property 
    551  * 
    552  */ 
    553 class TSliderHandleCursor extends TSliderHandle 
    554 { 
    555          
    556         public function getColor () 
    557         { 
    558                 return $this->getStyle()->getBackColor(); 
    559         } 
    560          
    561         public function setColor ($value) 
    562         { 
    563                 $this->getStyle()->setBackColor($value); 
    564         } 
    565          
    566         /** 
    567          * Creates a style object to be used by the control. 
    568          * This method override parent implementation to provide some default values to handle style 
    569          * @return TStyle the default style created for TSlider 
    570          */ 
    571         protected function createStyle () 
    572         { 
    573                 $style=new TStyle(); 
    574                 $style->setWidth($this->getTrack()->getAxis()==TSliderAxisType::Horizontal?'5px':'10px'); 
    575                 $style->setHeight($this->getTrack()->getAxis()==TSliderAxisType::Horizontal?'10px':'5px'); 
    576                 $style->setBackColor('rgb(255,0,0)'); 
    577                 /* cursor: ew-resize & ns-resize don't work in IE... stay with the 'move' cursor for now */ 
    578                 // $style->setStyleField('cursor',$this->getTrack()->getEnabled()?TSliderAxisType::Horizontal?'ew-resize':'ns-resize':'not-allowed'); 
    579                 $style->setStyleField('cursor',$this->getTrack()->getEnabled()?'move':'not-allowed'); 
    580                 return $style; 
    581         } 
    582          
    583 } 
    584  
    585 /** 
    586  * TSliderHandleImage class 
    587  *  
    588  * Use an image for the slider handle. 
    589  * Handle size sould be set to the image size with {@link setWidth Width} and {@link setHeight Height} properties. 
    590  * {@link SetImageUrl ImageUrl} property set the url of the image 
    591  *  
    592  * TODO Handle DisabledImageUrl 
    593  * 
    594  */ 
    595 class TSliderHandleImage extends TSliderHandle 
    596 { 
    597         const DEFAULTIMAGE='TSliderHandle.png'; 
    598         const DEFAULTIMAGEWIDTH='14'; 
    599         const DEFAULTIMAGEHEIGHT='16'; 
    600          
    601         public function getImageUrl () 
    602         { 
    603                 return $this->getViewState('hImageUrl', $this->publishFilePath(dirname(__FILE__).DIRECTORY_SEPARATOR.'assets'.DIRECTORY_SEPARATOR.self::DEFAULTIMAGE, __CLASS__)); 
    604         } 
    605          
    606         public function setImageUrl ($value) 
    607         { 
    608                 $this->setViewState('hImageUrl', $value); 
    609         } 
    610          
    611         protected function createStyle () 
    612         { 
    613                 $style=new TStyle(); 
    614                 // Our default image is 14x15px 
    615                 $style->setWidth(self::DEFAULTIMAGEWIDTH.'px'); 
    616                 $style->setHeight(self::DEFAULTIMAGEHEIGHT.'px'); 
    617                 // Default relative position 
    618                 if ($this->getTrack()->getAxis()==TSliderAxisType::Horizontal) 
    619                         $style->setStyleField('top', ceil((intval($this->getTrack()->getHeight()-self::DEFAULTIMAGEHEIGHT))/2).'px'); 
    620                 else  
    621                         $style->setStyleField('left', ceil((intval($this->getTrack()->getWidth()-self::DEFAULTIMAGEWIDTH))/2).'px'); 
    622                 $style->setStyleField('cursor',$this->getTrack()->getEnabled()?'move':'not-allowed'); 
    623                 $style->setStyleField('background-image', 'url('.$this->getImageUrl().')'); 
    624                 $style->setStyleField('background-repeat', 'no-repeat'); 
    625                 return $style; 
    626         } 
    627          
    628         public function renderContents ($writer) 
    629         { 
    630         /*      $writer->addAttribute('style', 'float: left'); 
    631                 $writer->addAttribute('alt', ''); 
    632                 $writer->addAttribute('src', $this->getImageUrl()); 
    633                 $writer->renderBeginTag('img'); 
    634                 $writer->renderEndTag();*/ 
    635         } 
    636 } 
    637622 
    638623?>