[FIXED-713] ext.slider (error) to be corrected in ext-all.js/ext-all-debug.js

[jvandemerwe]

Ext version tested:

• Ext 3.2 rev Beta

Adapter used:

• jquery
  [ ]prototype

css used:

• only default ext-all.css
  [ ]custom css (include details)

Browser versions tested against:

• Opera 10
• IE8
• FF3 (firebug 1.3.0.10 installed)
• Safari 4

Operating System:

• Windows 7
  [ ]WinXP Pro

Description:

• When openening my application with the user extension ext.ux.youtubeplayer and ext.ux.youtubeplayercontrol, the sliders were not working anymore. After modifying the slider to the modified code in 3.2 (was running in 3.1), a few problems occured, shown in firebug and my application didn't run at all.

Test Case:

See this URL : http://www.enovision.net/mistube/bug (not working version)
See this URL : http://www.enovision.net/mistube/working (repaired version)


Steps to reproduce the problem:

• use the http://www.enovision.net/mistube/bug

The result that was expected:

• use the http://www.enovision.net/mistube/working

The result that occurs instead:

• doesn't start the application at all
• shows in firebug: thumb.addClass is not a function

Screenshot or Video:

• [ ]____________

Debugging already done:

• found some errors in ext-all-debug.js (see code below)

  onDisable: function(){
        Ext.slider.MultiSlider.superclass.onDisable.call(this);
        
        for (var i=0; i < this.thumbs.length; i++) {
            var thumb = this.thumbs[i];
            
            thumb.addClass(this.disabledClass);   
            
            if(Ext.isIE){
                //IE breaks when using overflow visible and opacity other than 1.
                //Create a place holder for the thumb and display it.
                var xy = thumb.getXY();
                thumb.hide();
                
                this.innerEl.addClass(this.disabledClass).dom.disabled = true;
                
                if (!this.thumbHolder) {
                    this.thumbHolder = this.endEl.createChild({cls: 'x-slider-thumb ' + this.disabledClass});
                }
                
                this.thumbHolder.show().setXY(xy);
            }
        }
    },

    //private
    onEnable: function(){
        Ext.slider.MultiSlider.superclass.onEnable.call(this);
        
        for (var i=0; i < this.thumbs.length; i++) {
            var thumb = this.thumbs[i];
            
            thumb.removeClass(this.disabledClass);  

            if(Ext.isIE){
                this.innerEl.removeClass(this.disabledClass).dom.disabled = false;
                
                if (this.thumbHolder) this.thumbHolder.hide();
                
                thumb.show();
                this.syncThumb();
            }
        }
    },

Possible fix:

• see code (see code below)

   //private
    onDisable: function(){
        Ext.slider.MultiSlider.superclass.onDisable.call(this);
        
        for (var i=0; i < this.thumbs.length; i++) {
            var thumb = this.thumbs[i];
            
            thumb.el.addClass(this.disabledClass);                          //repaired by JJvdM
            
            if(Ext.isIE){
                //IE breaks when using overflow visible and opacity other than 1.
                //Create a place holder for the thumb and display it.
                var xy = thumb.getXY(); 
                thumb.el.hide(); //jjvdm,
                
                this.innerEl.addClass(this.disabledClass).dom.disabled = true;
                
                if (!this.thumbHolder) {
                    this.thumbHolder = this.endEl.createChild({cls: 'x-slider-thumb ' + this.disabledClass});
                }
                
                this.thumbHolder.show().setXY(xy);
            }
        }
    },

    //private
    onEnable: function(){
        Ext.slider.MultiSlider.superclass.onEnable.call(this);
        
        for (var i=0; i < this.thumbs.length; i++) {
            var thumb = this.thumbs[i];
            
            thumb.el.removeClass(this.disabledClass);  //repaired by JJvdM

            if(Ext.isIE){
                this.innerEl.removeClass(this.disabledClass).dom.disabled = false;
                
                if (this.thumbHolder) this.thumbHolder.hide();
                
                thumb.el.show();
                this.syncThumb(); //repaired by JJvdM
            }
        }
    },

[Jamie Avins]

Welcome to the bug forum, can you please follow our bug guidelines:

http://www.extjs.com/forum/showthread.php?t=71015

Really need some more context here and a test case would be great.

[jvandemerwe]

I have modified my correction of some bugs in relation to the slider. Thank you for helping me to show how to do this in the future. I hope it is better now.

[Jamie Avins]

Much better now, thanks. I have opened a ticket and one of us will look at it shortly.

[edspencer]

This should now be fixed as of svn 6291