r2789 - updated use of widgetBaseClass
Author: scottjehl
Date: Tue Jun 16 13:37:32 2009
New Revision: 2789
Modified:
branches/labs/selectmenu/ui.selectmenu.js
Log:
updated use of widgetBaseClass
Modified: branches/labs/selectmenu/ui.selectmenu.js
==============================================================================
--- branches/labs/selectmenu/ui.selectmenu.js (original)
+++ branches/labs/selectmenu/ui.selectmenu.js Tue Jun 16 13:37:32 2009
@@ -21,7 +21,7 @@
this._safemouseup = true;
//create menu button wrapper
- this.newelement = $('<a class="ui-selectmenu ui-widget ui-state-default
ui-corner-all" id="'+this.ids[0]+'" href="#" aria-haspopup="true"
aria-owns="'+this.ids[1]+'"></a>')
+ this.newelement = $('<a class="'+ this.widgetBaseClass +' ui-widget
ui-state-default ui-corner-all" id="'+this.ids[0]+'" href="#"
aria-haspopup="true" aria-owns="'+this.ids[1]+'"></a>')
.insertAfter(this.element);
//transfer tabindex
@@ -32,7 +32,7 @@
this.newelement.data('selectelement', this.element);
//menu icon
- this.selectmenuIcon = $('<span class="ui-selectmenu-icon
ui-icon"></span>')
+ this.selectmenuIcon = $('<span class="'+ this.widgetBaseClass +'-icon
ui-icon"></span>')
.prependTo(this.newelement)
.addClass( (o.style
== "popup")? 'ui-icon-triangle-2-n-s' : 'ui-icon-triangle-1-s' );
@@ -88,10 +88,10 @@
return ret;
})
.bind('mouseover focus', function(){
- $(this).addClass('ui-selectmenu-focus ui-state-hover');
+ $(this).addClass(self.widgetBaseClass+'-focus ui-state-hover');
})
.bind('mouseout blur', function(){
- $(this).removeClass('ui-selectmenu-focus ui-state-hover');
+ $(this).removeClass(self.widgetBaseClass+'-focus ui-state-hover');
});
//document click closes menu
@@ -107,7 +107,7 @@
//create menu portion, append to body
var cornerClass = (o.style == "dropdown")? " ui-corner-bottom" : "
ui-corner-all"
- this.list = $('<ul class="ui-selectmenu-menu ui-widget
ui-widget-content'+cornerClass+'" role="menu"
aria-labelledby="'+this.ids[0]+'"
id="'+this.ids[1]+'"></ul>').appendTo('body');
+ this.list = $('<ul class="' + self.widgetBaseClass + '-menu ui-widget
ui-widget-content'+cornerClass+'" role="menu"
aria-labelledby="'+this.ids[0]+'"
id="'+this.ids[1]+'"></ul>').appendTo('body');
//get selectmenu element option data
var s_options = this._selectOptions();
@@ -132,27 +132,27 @@
return false;
})
.bind('mouseover focus', function(){
-
$(this).parent().find('.ui-selectmenu-item-selected').addClass(activeClass);
-
$(this).parent().find('.ui-selectmenu-item-focus').removeClass('ui-selectmenu-item-focus
ui-state-hover');
-
$(this).removeClass('ui-state-active').addClass('ui-selectmenu-item-focus
ui-state-hover');
+ $(this).parent().find('.'+ self.widgetBaseClass
+ '-item-selected').addClass(activeClass);
+ $(this).parent().find('.'+ self.widgetBaseClass
+ '-item-focus').removeClass(self.widgetBaseClass+'-item-focus
ui-state-hover');
+ $(this).removeClass('ui-state-active').addClass(self.widgetBaseClass
+ '-item-focus ui-state-hover');
//if it's a popup menu, if the hovered item isn't selected, let the
mouseup event fire
- if(o.style == "popup" && !$(this).is('.ui-selectmenu-item-selected')){
+ if(o.style == "popup" && !$(this).is('.'+ self.widgetBaseClass
+ '-item-selected')){
self._safemouseup = true;
}
})
.bind('mouseout blur', function(){
- if($(this).is('.ui-selectmenu-item-selected')){
$(this).addClass(activeClass); }
- $(this).removeClass('ui-selectmenu-item-focus ui-state-hover');
+ if($(this).is('.'+ self.widgetBaseClass + '-item-selected')){
$(this).addClass(activeClass); }
+ $(this).removeClass(self.widgetBaseClass + '-item-focus
ui-state-hover');
});
//optgroup or not...
if(s_options[i].parentOptGroup){
- var optGroupName = 'ui-selectmenu-group-' +
s_options[i].parentOptGroup;
+ var optGroupName = self.widgetBaseClass + '-group-' +
s_options[i].parentOptGroup;
if(this.list.find('li.' + optGroupName).size()){
this.list.find('li.' + optGroupName + ':last ul').append(thisLi);
}
else{
- $('<li class="ui-selectmenu-group '+optGroupName+'"><span
class="ui-selectmenu-group-label">'+s_options[i].parentOptGroup+'</span><ul></ul></li>')
+ $('<li class="'+self.widgetBaseClass+'-group '+optGroupName+'"><span
class="'+self.widgetBaseClass+'-group-label">'+s_options[i].parentOptGroup+'</span><ul></ul></li>')
.appendTo(this.list)
.find('ul')
.append(thisLi);
@@ -170,13 +170,13 @@
for(var j in o.icons){
if(thisLi.is(o.icons[j].find)){
thisLi
- .data('optionClasses', s_options[i].classes + '
ui-selectmenu-hasIcon')
- .addClass('ui-selectmenu-hasIcon');
+ .data('optionClasses', s_options[i].classes + ' ' +
self.widgetBaseClass + '-hasIcon')
+ .addClass(self.widgetBaseClass + '-hasIcon');
var iconClass = o.icons[j].icon || "";
thisLi
.find('a:eq(0)')
- .prepend('<span class="ui-selectmenu-item-icon ui-icon '+iconClass
+ '"></span>');
+ .prepend('<span class="'+self.widgetBaseClass+'-item-icon
ui-icon '+iconClass + '"></span>');
}
}
}
@@ -206,7 +206,7 @@
if(o.maxHeight && o.maxHeight < this.list.height()){
this.list.height(o.maxHeight); }
//save reference to actionable li's (not group label li's)
- this._optionLis = this.list.find('li:not(.ui-selectmenu-group)');
+ this._optionLis = this.list.find('li:not(.'+ self.widgetBaseClass
+'-group)');
//transfer menu click to menu button
this.list
@@ -264,19 +264,19 @@
//selectmenu style
if(o.style == 'dropdown'){
this.newelement
- .addClass("ui-selectmenu-dropdown");
+ .addClass(self.widgetBaseClass+"-dropdown");
this.list
- .addClass("ui-selectmenu-menu-dropdown");
+ .addClass(self.widgetBaseClass+"-menu-dropdown");
}
else {
this.newelement
- .addClass("ui-selectmenu-popup");
+ .addClass(self.widgetBaseClass+"-popup");
this.list
- .addClass("ui-selectmenu-menu-popup");
+ .addClass(self.widgetBaseClass+"-menu-popup");
}
//append status span to button
- this.newelement.prepend('<span class="ui-selectmenu-status">'+
s_options[this._selectedIndex()].text +'</span>');
+ this.newelement.prepend('<span
class="'+self.widgetBaseClass+'-status">'+
s_options[this._selectedIndex()].text +'</span>');
//hide original selectmenu element
this.element.hide();
@@ -328,7 +328,7 @@
this._prevChar[0] = C;
},
_closeOthers: function(){
- $('.ui-selectmenu.ui-state-active').not(this.newelement).each(function(){
+ $('.'+ this.widgetBaseClass
+'.ui-state-active').not(this.newelement).each(function(){
$(this).data('selectelement').selectmenu('close');
})
},
@@ -337,26 +337,27 @@
return [this.element.attr('id') + '_' + 'button' + '_' + num,
this.element.attr('id') + '_' + 'menu' + '_' + num];
},
open: function(){
+ var self = this;
this._refreshPosition();
this._closeOthers();
this.newelement.addClass('ui-state-active');
this.list
.appendTo('body')
- .addClass('ui-selectmenu-open')
- .find('li:not(.ui-selectmenu-group):eq('+ this._selectedIndex() +')
a').focus();
+ .addClass(self.widgetBaseClass + '-open')
+ .find('li:not(.'+ self.widgetBaseClass +'-group):eq('+
this._selectedIndex() +') a').focus();
if(this.options.style == "dropdown"){
this.newelement.removeClass('ui-corner-all').addClass('ui-corner-top'); }
this._refreshPosition();
return this.element;
},
close: function(retainFocus){
this.newelement.removeClass('ui-state-active');
- this.list.removeClass('ui-selectmenu-open');
+ this.list.removeClass(this.widgetBaseClass+'-open');
if(this.options.style == "dropdown"){
this.newelement.removeClass('ui-corner-top').addClass('ui-corner-all'); }
if(retainFocus){this.newelement.focus();}
return this.element;
},
_toggle: function(retainFocus){
- if(this.list.is('.ui-selectmenu-open')){ this.close(retainFocus); }
+ if(this.list.is('.'+ this.widgetBaseClass +'-open')){
this.close(retainFocus); }
else { this.open(); }
},
_formatText: function(text){
@@ -391,7 +392,7 @@
return this._optionLis.eq(this._selectedIndex());
},
_focusedOptionLi: function(){
- return this.list.find('.ui-selectmenu-item-focus');
+ return this.list.find('.'+ this.widgetBaseClass +'-item-focus');
},
_moveSelection: function(amt){
var currIndex = parseInt(this._selectedOptionLi().data('index'), 10);
@@ -452,18 +453,18 @@
},
_refreshValue: function() {
var activeClass = (this.options.style == "popup") ? "
ui-state-active" : "";
-
this.list.find('.ui-selectmenu-item-selected').removeClass("ui-selectmenu-item-selected"+activeClass).find('a').attr('aria-selected', 'false');
-
this.list.find('li').not('li.ui-selectmenu-group').eq(this._selectedIndex()).addClass("ui-selectmenu-item-selected"+activeClass).find('a').attr('aria-selected', 'true');
+ this.list.find('.'+ this.widgetBaseClass
+'-item-selected').removeClass(this.widgetBaseClass
+ "-item-selected"+activeClass).find('a').attr('aria-selected', 'false');
+ this.list.find('li').not('li.' + this.widgetBaseClass
+ '-group').eq(this._selectedIndex()).addClass(this.widgetBaseClass
+ "-item-selected"+activeClass).find('a').attr('aria-selected', 'true');
//toggle any class brought in from option
var currentOptionClasses = this.newelement.data('optionClasses') ?
this.newelement.data('optionClasses') : "";
- var newOptionClasses =
this.list.find('li.ui-selectmenu-item-selected').data('optionClasses') ?
this.list.find('li.ui-selectmenu-item-selected').data('optionClasses') : "";
+ var newOptionClasses =
this.list.find('li.'+this.widgetBaseClass+'-item-selected').data('optionClasses') ?
this.list.find('li.'+this.widgetBaseClass+'-item-selected').data('optionClasses') : "";
this.newelement
.removeClass(currentOptionClasses)
.data('optionClasses', newOptionClasses)
.addClass( newOptionClasses )
- .find('.ui-selectmenu-status')
- .html(
this.list.find('li').not('li.ui-selectmenu-group').eq(this._selectedIndex()).find('a').html()
);
+ .find('.'+this.widgetBaseClass+'-status')
+ .html(
this.list.find('li').not('li.'+this.widgetBaseClass+'-group').eq(this._selectedIndex()).find('a').html()
);
},
_refreshPosition: function(){
//set left value
@@ -476,7 +477,7 @@
scrolledAmt -= $(this).outerHeight();
});
- if(this.newelement.is('.ui-selectmenu-popup')){
+ if(this.newelement.is('.'+this.widgetBaseClass+'-popup')){
menuTop+=scrolledAmt;
this.list.css('top', menuTop);
}