You are viewing a plain text version of this content. The canonical link for it is here.
Posted to xap-commits@incubator.apache.org by mt...@apache.org on 2007/03/23 19:39:38 UTC
svn commit: r521880 - in /incubator/xap/trunk/codebase/src/xap/bridges:
basic/AbstractWidgetBridge.js xap/LabelBridge.js
Author: mturyn
Date: Fri Mar 23 12:39:37 2007
New Revision: 521880
URL: http://svn.apache.org/viewvc?view=rev&rev=521880
Log:
Added style/node mapping mechanism for the nodes in the widget controlled by the bridge. This puts class application on a much firmer and extensible basis, and also simplifies the code for LabelBridge and any future bridges which will need to style more than one node.
Take the case of a Label: we'll need to style the root dom node with style xapLabel, and the "Contents" node with the style xapLabelContents.
The map is an object that looks like:
map = { "":<the root dom node> , "Contents":<the contents node> } ,
so that the style concat("xapButton",label) is used on map[label].
The map is also used with all explicit classes set with the "class" attribute, as well as the one implicit to each tag.
Also: altered setClassAttribute() s.t. old classes are removed completely, save for the implicit root dom node class (e.g. "xapLabel") before the new explicit ones are applied.
Modified:
incubator/xap/trunk/codebase/src/xap/bridges/basic/AbstractWidgetBridge.js
incubator/xap/trunk/codebase/src/xap/bridges/xap/LabelBridge.js
Modified: incubator/xap/trunk/codebase/src/xap/bridges/basic/AbstractWidgetBridge.js
URL: http://svn.apache.org/viewvc/incubator/xap/trunk/codebase/src/xap/bridges/basic/AbstractWidgetBridge.js?view=diff&rev=521880&r1=521879&r2=521880
==============================================================================
--- incubator/xap/trunk/codebase/src/xap/bridges/basic/AbstractWidgetBridge.js (original)
+++ incubator/xap/trunk/codebase/src/xap/bridges/basic/AbstractWidgetBridge.js Fri Mar 23 12:39:37 2007
@@ -123,7 +123,7 @@
// class "aSpecialClass" will add the
// classes "myTagMouseOVer" and "aSpecialClassMouseOver"
this.setStyleClassNames( new Array(0) );
- if (this.getRootDomNode() && this.getCssStyleName()){
+ if (this.getCssStyleName()){
// This is the base style class for this tag,
// e.g. "xapRadioButton":
this.setClassAttribute( this.getCssStyleName() ) ;
@@ -140,6 +140,17 @@
xap.taghandling.AbstractTagImpl.prototype.init.call( this );
}
+/**
+ * The map that [add|remove]Class will use to
+ * find html dom nodes to style:
+**/
+xap.bridges.basic.AbstractWidgetBridge.prototype.getStylingNodesMap = function(){
+ if( ! this._stylingNodeMap ){
+ this._stylingNodeMap = {"": this.getRootDomNode()} ;
+ }
+ return this._stylingNodeMap ;
+}
+
xap.bridges.basic.AbstractWidgetBridge.prototype.unload = function() {
var rootNode = this.getRootDomNode();
if (rootNode){
@@ -313,31 +324,41 @@
return "xap" + nodeName.substring(0,1).toUpperCase() + nodeName.substring(1);
}
+
+xap.bridges.basic.AbstractWidgetBridge.prototype.addStyleState = function( pStateName){
+ var nodeMap = this.getStylingNodesMap() ;
+ // Assume root dom node is included in the map as nodeMap[""]---legal,
+ // surprisingly:
+ for(var nodeLabel in nodeMap){
+ this._addStyleStateToOneNode( pStateName, nodeMap[nodeLabel], nodeLabel );
+ }
+}
+
+xap.bridges.basic.AbstractWidgetBridge.prototype.removeStyleState = function( pStateName){
+ var nodeMap = this.getStylingNodesMap() ;
+ // Assume root dom node is included in the map as nodeMap[""]---legal.
+ for(var nodeLabel in nodeMap){
+ this._removeStyleStateFromOneNode( pStateName, nodeMap[nodeLabel], nodeLabel );
+ }
+}
+
+
/**
* @param nodeName{string} If given, turns a class name like
* "xapFooMouseOver" into "xapFooHeaderMouseOver":
*
**/
-xap.bridges.basic.AbstractWidgetBridge.prototype.addStyleState = function( pStateName, pNode,pNodeLabel ){
- var node = pNode ;
- if( !pNode ){
- node = this.getRootDomNode() ;
- }
-
- var nodeLabel = pNodeLabel ;
- if( !pNodeLabel ){
- nodeLabel = "" ;
- }
+xap.bridges.basic.AbstractWidgetBridge.prototype._addStyleStateToOneNode = function( pStateName, pNode,pNodeLabel ){
var classNameStubs = this.getStyleClassNames() ;
- if (this.getRootDomNode() && classNameStubs){
+ if (classNameStubs){
for( var ii=0; ii<classNameStubs.length; ++ii){
// For example:
// "xapButton" + "Contents"+"MouseOver"
// or
// "xapButton" + ""+"MouseOver"
dojo.html.addClass(
- node,
- classNameStubs[ii]+nodeLabel + pStateName);
+ pNode,
+ classNameStubs[ii]+pNodeLabel + pStateName);
}
}
}
@@ -347,25 +368,19 @@
* "xapFooMouseOver" into "xapFooHeaderMouseOver":
*
**/
-xap.bridges.basic.AbstractWidgetBridge.prototype.removeStyleState = function( pStateName, pNode,pNodeLabel ){
- var node = pNode ;
- if( !pNode ){
- node = this.getRootDomNode() ;
- }
- var nodeName = pNodeLabel ;
- if( !pNodeLabel ){
- nodeLabel = "" ;
- }
+xap.bridges.basic.AbstractWidgetBridge.prototype._removeStyleStateFromOneNode = function( pStateName, pNode,pNodeLabel ){
var classNameStubs = this.getStyleClassNames() ;
- if (this.getRootDomNode() && classNameStubs){
+ if (classNameStubs){
for( var ii=0; ii<classNameStubs.length; ++ii){
// For example:
// "xapButton" + "Contents"+"MouseOver"
+ // ---the class to apply to a button's "Contents" node on mouse-over
// or
// "xapButton" + ""+"MouseOver"
+ // ---the class to apply to a button's "root dom node"
dojo.html.removeClass(
- node,
- classNameStubs[ii]+nodeLabel + pStateName);
+ pNode,
+ classNameStubs[ii]+pNodeLabel + pStateName);
}
}
}
@@ -862,13 +877,12 @@
var classStr = pClassStr.replace(/^\s+|\s+$/,"").replace(/\s+/," ") ;
var arrClassStr = classStr.split(" ") ;
this.setStyleClassNames(Array.concat(this.getStyleClassNames(), arrClassStr)) ;
- var rootNode = this.getRootDomNode() ;
- if( rootNode ){
- // Add in the new styles---assumes the old ones
- // already have been:
- // TODO: Check this assumption:
+
+ var nodeMap = this.getStylingNodesMap() ;
+ for(var nodeLabel in nodeMap){
for( var idx=0; idx<arrClassStr.length ; ++idx){
- dojo.html.addClass(rootNode,arrClassStr[idx]);
+ // For example: aButton.contentsNode myStyleContents
+ dojo.html.addClass(nodeMap[nodeLabel],arrClassStr[idx]+nodeLabel);
}
}
}
@@ -879,8 +893,14 @@
* we're really adding it to the base class:
*
**/
-xap.bridges.basic.AbstractWidgetBridge.prototype.setClassAttribute
- = xap.bridges.basic.AbstractWidgetBridge.prototype.addClassAttribute ;
+xap.bridges.basic.AbstractWidgetBridge.prototype.setClassAttribute = function( pClassStr ){
+ this.removeAllStyleClasses() ;
+ // Implicit class for this widget, e.g. "xapButton", ...
+ this.addClassAttribute( this.getCssStyleName() );
+ // ...overlayed with the explicit classes:
+ this.addClassAttribute( pClassStr ) ;
+}
+
/**
* The style states allowed to be concatenated
@@ -910,18 +930,51 @@
}
}
this.setStyleClassNames(oClasses) ;
- // Now actually remove the style from the html dom node:
- var rootNode = this.getRootDomNode() ;
+ // Now actually remove the style from the relevant html dom nodes:
+ var nodeMap = this.getStylingNodesMap() ;
var possibleStates=this.getAllowedStyleStates() ;
- if( rootNode){
+ // Assume root dom node is included in the map as nodeMap[""]---legal,
+ // surprisingly:
+ for(var nodeLabel in nodeMap){
for( var ii=0; ii<possibleStates.length; ++possibleStates){
dojo.html.removeClass(
- rootNode,
- classStr + possibleStates[ii]
+ nodeMap[nodeLabel],
+ classStr +nodeLabel + possibleStates[ii]
);
}
}
}
+
+/**
+ * Removes all style class from our list of them, and from the dom node:
+ * This is much more efficient than applying the <code>removeStyleClass</code>
+ * methods on all classes, since that's O(n), making that O(n^2); this is O(n):
+**/
+xap.bridges.basic.AbstractWidgetBridge.prototype.removeAllStyleClasses = function( ){
+ var iClasses = this.getStyleClassNames() ;
+ // First remove the style from the relevant html dom nodes:
+ var nodeMap = this.getStylingNodesMap() ;
+ var possibleStates=this.getAllowedStyleStates() ;
+ // Assume root dom node is included in the map as nodeMap[""]---legal,
+ // surprisingly:
+ for(var nodeLabel in nodeMap){
+ for(var jj=0; jj<iClasses.length; ++jj){
+ for( var ii=0; ii<possibleStates.length; ++ii){
+ dojo.html.removeClass(
+ nodeMap[nodeLabel],
+ iClasses[jj] +nodeLabel + possibleStates[ii]
+ );
+ }
+ }
+ }
+
+ this.setStyleClassNames([]) ;
+
+}
+
+
+
+
xap.bridges.basic.AbstractWidgetBridge.prototype._requestFocus = function(){
Modified: incubator/xap/trunk/codebase/src/xap/bridges/xap/LabelBridge.js
URL: http://svn.apache.org/viewvc/incubator/xap/trunk/codebase/src/xap/bridges/xap/LabelBridge.js?view=diff&rev=521880&r1=521879&r2=521880
==============================================================================
--- incubator/xap/trunk/codebase/src/xap/bridges/xap/LabelBridge.js (original)
+++ incubator/xap/trunk/codebase/src/xap/bridges/xap/LabelBridge.js Fri Mar 23 12:39:37 2007
@@ -30,7 +30,7 @@
xap.bridges.xap.LabelBridge.prototype.init = function() {
xap.bridges.basic.AbstractWidgetBridge.prototype.init.call(this);
- var innerContent = this.getPeer().getLabelContents();
+// var innerContent = this.getPeer().getLabelContents();
}
xap.bridges.xap.LabelBridge.prototype.obtainPeer = function() {
@@ -42,21 +42,24 @@
}
-xap.bridges.xap.LabelBridge.prototype.getContentNodeLabel = function( ) {
- return "Contents";
+//xap.bridges.xap.LabelBridge.prototype.getContentNodeLabel = function( ) {
+// return "Contents";
+//}
+
+/**
+ * The map that [add|remove]Class will use to
+ * find html dom nodes to style:
+**/
+xap.bridges.xap.LabelBridge.prototype.getStylingNodesMap = function(){
+ if( ! this._stylingNodeMap ){
+ this._stylingNodeMap = {"": this.getRootDomNode(),
+ "Contents": this.getPeer().getLabelContents()
+ } ;
+ }
+ return this._stylingNodeMap ;
}
-xap.bridges.xap.LabelBridge.prototype.addStyleState = function(stateName){
- xap.bridges.xap.LabelBridge.superclass.addStyleState.call(this,stateName);
- var innerContent = this.getPeer().getLabelContents();
- xap.bridges.xap.LabelBridge.superclass.addStyleState.call(this,stateName,innerContent,this.getContentNodeLabel());
-}
-xap.bridges.xap.LabelBridge.prototype.removeStyleState = function(stateName){
- xap.bridges.basic.AbstractWidgetBridge.prototype.removeStyleState.call(this,stateName);
- var innerContent = this.getPeer().getLabelContents();
- xap.bridges.basic.AbstractWidgetBridge.prototype.removeStyleState.call(this,stateName,innerContent,this.getContentNodeLabel());
-}
xap.bridges.xap.LabelBridge.prototype.getNewAllowedAttributes = function() {
return ["horizontalAlignment", "verticalAlignment", "autoWrap", "image",