Attachment #194716 for bug #344598

Some Eclipse Foundation services are deprecated, or will be soon. Please ensure you've read this important communication.




    // Overwritten:
    renderBorder : function( changes ) {
      var value = this.__borderObject;
      if( value && value.getStyle() === "rounded" ) {
        this._styleGfxBorder( value.getWidths(), value.getColor(), value.getRadii() );
          this._styleGfxBorder( value.getWidths(), value.getColor(), value.getRadii() );
        } else {
          value.render( this );
        }
      } else {
        if( this._gfxBorderEnabled ) {
          this._styleGfxBorder( null, null, null );
          this._innerStyle.border = "";
        }
        this.base( arguments, changes );
      }
      // RAP: Fix for Bug 301709
      this._usesComplexBorder = this._computeUsesComplexBorder();
    },

    _styleGfxBorder : function( width, color, radii ) {
      // NOTE: widgets with no dimensions of their own wont work together 
      //       with a gfxBorder (accepted bug)
      this.setGfxProperty( "borderWidths", width );
      var max = 0;
      if( width ) {
        for( var i = 0; i < width.length; i++ ) {

      } else {
        renderRadii = radii;
      }
      this.setGfxProperty( "borderWidths", width ); 
      this.setGfxProperty( "borderMaxWidth", max );
      this.setGfxProperty( "borderColor", color );
      this.setGfxProperty( "borderRadii", renderRadii );
      this.setGfxProperty( "borderLayouted", null ); // the last rendered gfx-border
      this._handleGfxBorder();
    },


    },

    getGfxProperty : function( key ) {
      var value = this._gfxProperties !== null ? this._gfxProperties[ key ] : null;
                  ? this._gfxProperties[ key ] 
                  : null;
      return typeof value != "undefined" ? value : null;       
    },
    
    //overwritten:
    _computeUsesComplexBorder : function() {
      var result = this._gfxBorderEnabled && this.getGfxProperty( "borderMaxWidth" ) > 0 ;
      if( !result ) {
        result = this.base( arguments );
      }
      return result;
    },

    ///////////////////
    // internals - main

      var toggle = ( this._gfxBorderEnabled != useBorder );
      if( toggle ) {
        if( useBorder ) {
          this.addEventListener( "changeBorder", 
                                 this._gfxOnBorderChanged, 
                                 this );
          this._gfxBorderEnabled = true;
        } else {
          this.removeStyleProperty( "padding" );
          this.removeEventListener( "changeBorder",
                                    this._gfxOnBorderChanged,
                                    this );
          this._gfxBorderEnabled = false;
        }
        this._handleGfxBackground();
        this._handleGfxStatus(); // TODO [tb] : implicitly in handleGfxBackground?
        if( !useBorder ) {
          this._handleTargetNode();
        }
      }
      // if gfxBorder is not used, canvas can still ready for background
      if( ( toggle || useBorder ) && this._isCanvasReady() ) {
        this._renderGfxBorder();
        if( !useBorder || !this._willBeLayouted() ) {
          // TODO [tb] : refactor conditions, "!useBorder" is only for padding
          this._layoutBackgroundShape();
          if( this._gfxShadowEnabled ) {
            this._layoutShadowShape();
          }
        }
      } 
      } else if( toggle && !useBorder && this._innerStyle ) {
        this._handleFlushListener();
        this._setSimulatedPadding();
      }
    },

    _handleGfxBackground : function() {

      }
      if( ( toggle || useBackground ) && this._isCanvasReady() ) {
        this._renderGfxBackground();
      } else if( !useBackground && this._gfxData && this._gfxData.backgroundInsert ) {
                 && this._gfxData 
                 && this._gfxData.backgroundInsert ) 
      {
        this._prepareBackgroundShape(); 
      }
    },

      var hasShadow = this.getGfxProperty( "shadow" ) != null;
      this._gfxShadowEnabled = hasShadow;
      this._handleGfxStatus();
      this._handleFlushListener();
      if( this._isCanvasReady() ) {
        this._renderGfxShadow();
      } else if( !this._gfxShadowEnabled && this._gfxData && this._gfxData.shadowInsert ) {

    },

    _handleGfxStatus : function() {
      var useGfx =  this._gfxBorderEnabled || this._gfxBackgroundEnabled || this._gfxShadowEnabled;
      if( useGfx != this._gfxEnabled ) { 
                   || this._gfxShadowEnabled;
      if( useGfx != this._gfxEnabled ) {
        if( useGfx ) {
          this.addEventListener( "changeElement", this._gfxOnElementChanged, this );
                                 this._gfxOnElementChanged,
                                 this );
          this._gfxEnabled = true;
        } else {
          this.removeEventListener( "changeElement", this._gfxOnElementChanged, this );
                                 this._gfxOnElementChanged,
                                 this );
          this._gfxEnabled = false;
        }
        this._handleFlushListener();
      }
    },


          }
        }
        this.prepareEnhancedBorder();
        // TODO [tb] : redundand in some cases:
        this.addToQueue( "width" );
        this.addToQueue( "height" );
        if( outline ) {
          this.setStyleProperty( "outline", outline );
        }

    
    _appendCanvas : function() {
      var parentNode = this.getElement();
      var gfxNode = org.eclipse.rwt.GraphicsUtil.getCanvasNode( this._gfxCanvas );
        = org.eclipse.rwt.GraphicsUtil.getCanvasNode( this._gfxCanvas );
      if( gfxNode != null ) {
        parentNode.insertBefore( gfxNode, parentNode.firstChild );
      }

    },

    _removeCanvas : function() {
      var gfxNode = org.eclipse.rwt.GraphicsUtil.getCanvasNode( this._gfxCanvas );
        = org.eclipse.rwt.GraphicsUtil.getCanvasNode( this._gfxCanvas );
      if( gfxNode != null ) {
        gfxNode.parentNode.removeChild( gfxNode );
        this._gfxCanvasAppended = false;

      var util = org.eclipse.rwt.GraphicsUtil;
      var backgroundShape = this._gfxData.backgroundShape;
      if( this._gfxBackgroundEnabled ) {
        var usePath = this._gfxBorderEnabled;
        if( backgroundShape === undefined ) {
          this._gfxData.backgroundShape = util.createShape( "roundrect" );
        } else {
          if( usePath && backgroundShape === this._gfxData.rectShape ) {
            if( this._gfxData.backgroundInsert ) {
              util.removeFromCanvas( this._gfxCanvas, backgroundShape );
              this._gfxData.backgroundInsert = false;
            }
            delete this._gfxData.rectShape;
            this._gfxData.backgroundShape = this._createBackgroundShape( usePath );
          } else if( !usePath && backgroundShape === this._gfxData.pathElement ) {
            if( this._gfxData.backgroundInsert ) {
              util.removeFromCanvas( this._gfxCanvas, backgroundShape );
              this._gfxData.backgroundInsert = false;
            }
            delete this._gfxData.pathElement;
            this._gfxData.backgroundShape = this._createBackgroundShape( usePath );
          }
        }
        if( !this._gfxData.backgroundInsert ) {
          var shape = this._gfxData.backgroundShape;

      }
    },

    _createBackgroundShape : function( usePath ) {
      var shape = null;
      var util = org.eclipse.rwt.GraphicsUtil;
      if( usePath ) {
        shape = util.createShape( "roundrect" );
        this._gfxData.pathElement = shape;
      } else {
        var shape = util.createShape( "rect" );
        util.setRectBounds( shape, "0%", "0%", "100%", "100%" );
        this._gfxData.rectShape = shape;
      }
      return shape;
    },


    /////////////////////////
    // internals - background


    _renderGfxBorder : function() {
      this._style.borderWidth = 0;
      var inner = this._innerStyle;
      inner.borderWidth = 0; // TODO [tb] : useless?
      this._prepareBackgroundShape();
      var shape = this._gfxData.backgroundShape;
      var width = this.getGfxProperty( "borderMaxWidth" );

      org.eclipse.rwt.GraphicsUtil.setStroke( shape, color, width );
    },

    _layoutBackgroundShape : function() {
      var rectDimension = [ this.getBoxWidth(), this.getBoxHeight() ];
      var oldDimension = this.getGfxProperty( "borderLayouted" );
      var changedX = !oldDimension || ( rectDimension[ 0 ] !== oldDimension[ 0 ] );
      var changedY = !oldDimension || ( rectDimension[ 1 ] !== oldDimension[ 1 ] );
      var changedY
        = !oldDimension || ( rectDimension[ 1 ] !== oldDimension[ 1 ] );
      if( changedX || changedY ) {
        this.setGfxProperty( "borderLayouted", rectDimension );
        this._handleTargetNode();
        var rectDimension = [ this.getBoxWidth(), this.getBoxHeight() ]; // TODO [tb] : useless?
        // TODO [tb] : refactor from here
        var rectWidth;
        var rectHeight;
        var left;
        var top;
        var radii;
        if( this._gfxBorderEnabled ) {
          radii = this.getGfxProperty( "borderRadii" );
          var borderWidth = this.getGfxProperty( "borderWidths" );
          var maxWidth = this.getGfxProperty( "borderMaxWidth" );
          var borderTop = 0;
          var borderRight = 0;

            borderBottom = ( borderWidth[ 2 ] == 0 ? -maxWidth - 1 : maxWidth );
            borderLeft = ( borderWidth[ 3 ] == 0 ? -maxWidth - 1: maxWidth );
          }
          rectWidth = rectDimension[ 0 ] - ( borderLeft * 0.5 + borderRight * 0.5 );
          rectHeight = rectDimension[ 1 ] - ( borderTop * 0.5 + borderBottom * 0.5 );
          left = borderLeft * 0.5;
          top = borderTop * 0.5;
        } else {
          // TODO [tb] : write tests for this case
          left = 0
          top = 0;
          rectWidth = rectDimension[ 0 ] - this._cachedBorderLeft - this._cachedBorderRight;
          rectHeight = rectDimension[ 1 ] - this._cachedBorderTop - this._cachedBorderBottom;
          radii = [ 0, 0, 0, 0 ];
        }
        //a few safeguards:
        rectWidth = Math.max( 0, rectWidth );
        rectHeight = Math.max( 0, rectHeight );
        var shape = this._gfxData.backgroundShape;
        var util = org.eclipse.rwt.GraphicsUtil;
        util.setRoundRectLayout( shape, left, top, rectWidth, rectHeight, radii );
      }
    },

    _handleTargetNode : function() {
      if( this._innerStyle ) {
        if( this._gfxBorderEnabled ) {
          var rect = this.getGfxProperty( "borderLayouted" );
          var width = this.getGfxProperty( "borderWidths" );
          var style = this._innerStyle;
          style.top = width[ 0 ] + "px";
          style.left = width[ 3 ] + "px";
          style.width = Math.max( 0, rect[ 0 ] - width[ 3 ] - width[ 1 ] ) + "px";
          style.height = Math.max( 0, rect[ 1 ] - width[ 0 ] - width[ 2 ] ) + "px";
        } else if( !this._gfxEnabled ) {
          this._innerStyle.left = "0px";
          this._innerStyle.top = "0px";
          if( qx.core.Variant.isSet( "qx.client", "mshtml" ) ) {
            this._innerStyle.width = "";
            this._innerStyle.height = "";
            this.addToQueue( "width" );
            this.addToQueue( "height" );
          } else {
            this._innerStyle.width = "100%";
            this._innerStyle.height = "100%";
          }
        }
      }
    },

    _handleFlushListener : function( value ) {
      var enhanced = this._innerStyle || this._gfxEnabled;
      this._layoutTargetNode = enhanced && !this._gfxBorderEnabled;
      if( this._gfxEnabled) {
        this.addEventListener( "flush", this._gfxOnFlush, this );
      } else {
        this.removeEventListener( "flush", this._gfxOnFlush, this );      

        util.setBlur( shape, shadow[ 3 ] );
        util.setFillColor( shape, shadow[ 5 ] );
        util.setOpacity( shape, shadow[ 6 ] );
        this._layoutShadowShape();
      }
    },
    
    _layoutShadowShape : function() {
      var util = org.eclipse.rwt.GraphicsUtil;
      var rect = [ this.getBoxWidth(), this.getBoxHeight() ];
      var shape = this._gfxData.shadowShape;

    },
    
    _willBeLayouted : function() {
      return this._jobQueue != undefined || !qx.lang.Object.isEmpty( this._layoutChanges );
             || !qx.lang.Object.isEmpty( this._layoutChanges );
    },

    // called after the element of the widget has been set

      }
    },

    //called if the GfxBorder object has been replaced
    _gfxOnBorderChanged : function( event ) {
      var border = event.getValue();
      if ( !( border && border.getStyle() === "rounded" ) ) {
        this._styleGfxBorder( null, null, null );
      }
    },

    _onCanvasAppear : function() {
      if( this._gfxCanvasAppended ) { 
        org.eclipse.rwt.GraphicsUtil.handleAppear( this._gfxCanvas );

      if ( changes.paddingRight || changes.paddingBottom ) {
        this.setGfxProperty( "borderLayouted", null ); 
      }
      if( this._gfxBackgroundEnabled ) { // gfxBorder implicitly enables gfx-background
        this._layoutBackgroundShape();
      }
      if( this._gfxShadowEnabled ) {
        this._layoutShadowShape();
      }
    }
        

Lines 28-35 Link Here

(-)js/org/eclipse/rwt/VML.js (-2 / +2 lines)
28	result.type = "vmlCanvas";	28	result.type = "vmlCanvas";
29	var node = document.createElement( "div" );	29	var node = document.createElement( "div" );
30	node.style.position = "absolute"	30	node.style.position = "absolute"
31	node.style.width = "100px";	31	node.style.width = "10px";
32	node.style.height = "100px";	32	node.style.height = "10px";
33	node.style.top = "0";	33	node.style.top = "0";
34	node.style.left = "0";	34	node.style.left = "0";
35	node.style.fontSize = "0";	35	node.style.fontSize = "0";




      borderWidths[ 2 ] = borderBottom.getWidthBottom();
      borderStyles[ 2 ] = borderBottom.getStyleBottom();
      borderColors[ 2 ] = borderBottom.getColorBottom();
      result.border = new org.eclipse.rwt.Border( borderWidths, borderStyles, borderColors );
        result.border = new org.eclipse.rwt.Border( 0, "rounded", "black", 0 );
      } else {
        result.border = new org.eclipse.rwt.Border( borderWidths, borderStyles, borderColors );
      }
      return result;
    }
  },

      borderWidths[ 2 ] = borderBottom.getWidthBottom();
      borderStyles[ 2 ] = borderBottom.getStyleBottom();
      borderColors[ 2 ] = borderBottom.getColorBottom();
      result.border = new org.eclipse.rwt.Border( borderWidths, borderStyles, borderColors );
        result.border = new org.eclipse.rwt.Border( 0, "rounded", "black", 0 );
      } else {
        result.border = new org.eclipse.rwt.Border( borderWidths, borderStyles, borderColors );
      }
      return result;
    }
  },

Lines 209-218 Link Here

(-)js/org/eclipse/swt/theme/ThemeStore.js (-4 / +1 lines)
209	if( style === "solid" \|\| style === "none" \|\| style === null ) {	209	if( style === "solid" \|\| style === "none" \|\| style === null ) {
210	var radiiKey = this._getCssValue( element, states, "border-radius", theme );	210	var radiiKey = this._getCssValue( element, states, "border-radius", theme );
211	var radii = this._values.boxdims[ radiiKey ];	211	var radii = this._values.boxdims[ radiiKey ];
212	if( radii == null ) {	212	if( radii != null && ( radii.join( "" ) !== "0000" ) ) {
213	radii = [ 0, 0, 0, 0 ];
214	}
215	if( radii != null ) {
216	var roundedBorderKey = key + "#" + radiiKey;	213	var roundedBorderKey = key + "#" + radiiKey;
217	var roundedBorder = this._values.borders[ roundedBorderKey ];	214	var roundedBorder = this._values.borders[ roundedBorderKey ];
218	if( !roundedBorder ) {	215	if( !roundedBorder ) {




    },

    prepareEnhancedBorder : function() {
      if( !this._innerStyle ) {
        this._targetNode = document.createElement( "div" );
        this._innerStyle = this._targetNode.style;
        this._layoutTargetNode = true;
        if( qx.core.Variant.isSet( "qx.client", "mshtml" ) ) {
          this.addToQueue( "width" );
          this.addToQueue( "height" );
        } else {
          this._innerStyle.width = "100%";
          this._innerStyle.height = "100%";
      this._innerStyle.position = "absolute";
      for( var i in this._styleProperties ) {
        switch( i ) {
          case "zIndex":
          case "filter":
          case "opacity":
          case "MozOpacity":
          case "display":
          case "cursor":
          break;
          default:
            this._innerStyle[i] = this._styleProperties[i];
            this._style[i] = "";
        }
        this._innerStyle.position = "absolute";
        for( var i in this._styleProperties ) {
          switch( i ) {
            case "zIndex":
            case "filter":
            case "opacity":
            case "MozOpacity":
            case "display":
            case "cursor":
            break;
            default:
              this._innerStyle[i] = this._styleProperties[i];
              this._style[i] = "";
          }
        }
        // [if] Fix for bug 279800: Some focused widgets look strange in webkit
        this._style.outline = "none";
        this._applyContainerOverflow( this.getContainerOverflow() );
        for( var i in this._htmlProperties ) {
          switch( i ) {
            case "unselectable":
              this._targetNode.unselectable = this._htmlProperties[ i ];
          }
        }
        while( this._element.firstChild ) {
          this._targetNode.appendChild( this._element.firstChild );
        }
        this._element.appendChild( this._targetNode );
        if( this.isInDom() ) {
          // TODO [tb] : check if this works for ProgressBar
          this._afterRemoveDom(); 
          this._afterInsertDom(); 
        }
      }
      while( this._element.firstChild ) {
        this._targetNode.appendChild( this._element.firstChild );
      }
      this._element.appendChild( this._targetNode );
      if( this.isInDom() ) {
        // TODO [tb] : check if this works for ProgressBar
        this._afterRemoveDom(); 
        this._afterInsertDom(); 
      }
    },


Lines 348-355 Link Here

(-)js/qx/ui/form/TextField.js (-2 / +2 lines)
348	inp.addEventListener("input", this.__oninput, false);	348	inp.addEventListener("input", this.__oninput, false);
349	}	349	}
350		350
351	// Append to real element	351	// TODO [tb] : write test:
352	value.appendChild(inp);	352	this._getTargetNode().appendChild( inp );
353	}	353	}
354	},	354	},
355		355




    <script src="./js/org/eclipse/rwt/test/tests/ComboTest.js" type="text/javascript"></script>
    <script src="./js/org/eclipse/rwt/test/tests/EventHandlerTest.js" type="text/javascript"></script>
    <script src="./js/org/eclipse/rwt/test/tests/AsyncKeyEventUtilTest.js" type="text/javascript"></script>
    <script src="./js/org/eclipse/rwt/test/tests/DNDTest.js" type="text/javascript"></script>
    <script src="./js/org/eclipse/rwt/test/tests/MobileWebkitSupportTest.js" type="text/javascript"></script>
    <script src="./js/org/eclipse/rwt/test/tests/IFrameTest.js" type="text/javascript"></script>
    <script src="./js/org/eclipse/rwt/test/tests/TableTest.js" type="text/javascript"></script>
<!---
    <script src="./js/org/eclipse/rwt/test/tests/DNDTest.js" type="text/javascript"></script>
    <script src="./js/org/eclipse/rwt/test/tests/TreeItemTest.js" type="text/javascript"></script>
    <script src="./js/org/eclipse/rwt/test/tests/TreeRowTest.js" type="text/javascript"></script>
    <script src="./js/org/eclipse/rwt/test/tests/TreeTest.js" type="text/javascript"></script>
--->
    <script src="./js/org/eclipse/rwt/test/tests/AnimationTest.js" type="text/javascript"></script>
    <script src="./js/org/eclipse/rwt/test/tests/GCTest.js" type="text/javascript"></script>
    <script src="./js/org/eclipse/rwt/test/tests/GCCanvasTest.js" type="text/javascript"></script>




      assertTrue( widget.getElement() !== widget._getTargetNode() );
      assertEquals( [ 1, 1, 1, 1 ], this.getFakePadding( widget ) );
      assertEquals( [ 1, 1, 1, 1 ], this.getBorderCache( widget ) );
      widget.setBorder( new org.eclipse.rwt.Border( 0, "rounded", "black", 0 ) );
      testUtil.flush();      
      assertEquals ( [ 0, 0, 0, 0 ], this.getFakePadding( widget ) );
      assertEquals ( [ 0, 0, 0, 0 ], this.getBorderCache( widget ) );
      widget.setBorder( new org.eclipse.rwt.Border( [ 4, 0, 3, 0 ], "rounded", "black", 0 ) );
      testUtil.flush();      
      assertEquals ( [ 4, 0, 3, 0 ], this.getFakePadding( widget ) );      
      assertEquals ( [ 4, 0, 3, 0 ], this.getBorderCache( widget ) );      
      widget.setBackgroundGradient( this.gradient );
      widget.setBorder( null );
      testUtil.flush();
      // NOTE: since the layouting for targetNode is queued in the first flush, a second is needed
      testUtil.flush(); 
      assertEquals ( [ 0, 0, 0, 0 ], this.getBorderCache( widget ) );      
      assertEquals ( [ 0, 0, 0, 0 ], this.getFakePadding( widget ) );
      widget.destroy();

          testUtil.flush();
          assertTrue( this.widgetContainsCanvas( widget ) );
          widget.setBorder( null );
          testUtil.flush();
          assertFalse( this.widgetContainsCanvas( widget ) );
          widget.setWidth( 400 );
          testUtil.flush();

      var result = new org.eclipse.swt.widgets.Shell();
      result.addToDocument();
      result.setBackgroundColor( null );
      result.setBackgroundGradient( null );
      result.setBorder( null );
      result.setShadow( null );
      result.open();
      qx.ui.core.Widget.flushGlobalQueues();

    },

    usesGfxBorder : function( widget ) {      
      return widget._gfxBorderEnabled && this.widgetContainsCanvas( widget );
             && this.widgetContainsCanvas( widget )
             && widget._gfxData.backgroundShape == widget._gfxData.pathElement; 
    },

    usesGfxBackground : function( widget ) {

Return to bug 344598

Lines 991-1001 Link Here

(-)js/org/eclipse/swt/theme/AppearancesBase.js (-10 / +2 lines)
991	borderWidths[ 2 ] = borderBottom.getWidthBottom();	991	borderWidths[ 2 ] = borderBottom.getWidthBottom();
992	borderStyles[ 2 ] = borderBottom.getStyleBottom();	992	borderStyles[ 2 ] = borderBottom.getStyleBottom();
993	borderColors[ 2 ] = borderBottom.getColorBottom();	993	borderColors[ 2 ] = borderBottom.getColorBottom();
994	if( borderWidths[ 2 ] == 0 ) {	994	result.border = new org.eclipse.rwt.Border( borderWidths, borderStyles, borderColors );
995	result.border = new org.eclipse.rwt.Border( 0, "rounded", "black", 0 );
996	} else {
997	result.border = new org.eclipse.rwt.Border( borderWidths, borderStyles, borderColors );
998	}
999	return result;	995	return result;
1000	}	996	}
1001	},	997	},
Lines 1335-1345 Link Here
1335	borderWidths[ 2 ] = borderBottom.getWidthBottom();	1331	borderWidths[ 2 ] = borderBottom.getWidthBottom();
1336	borderStyles[ 2 ] = borderBottom.getStyleBottom();	1332	borderStyles[ 2 ] = borderBottom.getStyleBottom();
1337	borderColors[ 2 ] = borderBottom.getColorBottom();	1333	borderColors[ 2 ] = borderBottom.getColorBottom();
1338	if( borderWidths[ 2 ] == 0 ) {	1334	result.border = new org.eclipse.rwt.Border( borderWidths, borderStyles, borderColors );
1339	result.border = new org.eclipse.rwt.Border( 0, "rounded", "black", 0 );
1340	} else {
1341	result.border = new org.eclipse.rwt.Border( borderWidths, borderStyles, borderColors );
1342	}
1343	return result;	1335	return result;
1344	}	1336	}
1345	},	1337	},

Lines 3778-3825 Link Here

(-)js/qx/ui/core/Widget.js (-40 / +42 lines)
3778	},	3778	},
3779		3779
3780	prepareEnhancedBorder : function() {	3780	prepareEnhancedBorder : function() {
3781	this._targetNode = document.createElement( "div" );	3781	if( !this._innerStyle ) {
3782	this._innerStyle = this._targetNode.style;	3782	this._targetNode = document.createElement( "div" );
3783	this._layoutTargetNode = true;	3783	this._innerStyle = this._targetNode.style;
3784	if( qx.core.Variant.isSet( "qx.client", "mshtml" ) ) {	3784	this._layoutTargetNode = true;
3785	this.addToQueue( "width" );	3785	if( qx.core.Variant.isSet( "qx.client", "mshtml" ) ) {
3786	this.addToQueue( "height" );	3786	this.addToQueue( "width" );
3787	} else {	3787	this.addToQueue( "height" );
3788	this._innerStyle.width = "100%";	3788	} else {
3789	this._innerStyle.height = "100%";	3789	this._innerStyle.width = "100%";
3790	}	3790	this._innerStyle.height = "100%";
3791	this._innerStyle.position = "absolute";
3792	for( var i in this._styleProperties ) {
3793	switch( i ) {
3794	case "zIndex":
3795	case "filter":
3796	case "opacity":
3797	case "MozOpacity":
3798	case "display":
3799	case "cursor":
3800	break;
3801	default:
3802	this._innerStyle[i] = this._styleProperties[i];
3803	this._style[i] = "";
3804	}	3791	}
3805	}	3792	this._innerStyle.position = "absolute";
3806	// [if] Fix for bug 279800: Some focused widgets look strange in webkit	3793	for( var i in this._styleProperties ) {
3807	this._style.outline = "none";	3794	switch( i ) {
3808	this._applyContainerOverflow( this.getContainerOverflow() );	3795	case "zIndex":
3809	for( var i in this._htmlProperties ) {	3796	case "filter":
3810	switch( i ) {	3797	case "opacity":
3811	case "unselectable":	3798	case "MozOpacity":
3812	this._targetNode.unselectable = this._htmlProperties[ i ];	3799	case "display":
		3800	case "cursor":
		3801	break;
		3802	default:
		3803	this._innerStyle[i] = this._styleProperties[i];
		3804	this._style[i] = "";
		3805	}
		3806	}
		3807	// [if] Fix for bug 279800: Some focused widgets look strange in webkit
		3808	this._style.outline = "none";
		3809	this._applyContainerOverflow( this.getContainerOverflow() );
		3810	for( var i in this._htmlProperties ) {
		3811	switch( i ) {
		3812	case "unselectable":
		3813	this._targetNode.unselectable = this._htmlProperties[ i ];
		3814	}
		3815	}
		3816	while( this._element.firstChild ) {
		3817	this._targetNode.appendChild( this._element.firstChild );
		3818	}
		3819	this._element.appendChild( this._targetNode );
		3820	if( this.isInDom() ) {
		3821	// TODO [tb] : check if this works for ProgressBar
		3822	this._afterRemoveDom();
		3823	this._afterInsertDom();
3813	}	3824	}
3814	}
3815	while( this._element.firstChild ) {
3816	this._targetNode.appendChild( this._element.firstChild );
3817	}
3818	this._element.appendChild( this._targetNode );
3819	if( this.isInDom() ) {
3820	// TODO [tb] : check if this works for ProgressBar
3821	this._afterRemoveDom();
3822	this._afterInsertDom();
3823	}	3825	}
3824	},	3826	},
3825		3827

Lines 139-155 Link Here

(-)js/org/eclipse/rwt/test/tests/GraphicsMixinTest.js (-5 / +8 lines)
139	assertTrue( widget.getElement() !== widget._getTargetNode() );	139	assertTrue( widget.getElement() !== widget._getTargetNode() );
140	assertEquals( [ 1, 1, 1, 1 ], this.getFakePadding( widget ) );	140	assertEquals( [ 1, 1, 1, 1 ], this.getFakePadding( widget ) );
141	assertEquals( [ 1, 1, 1, 1 ], this.getBorderCache( widget ) );	141	assertEquals( [ 1, 1, 1, 1 ], this.getBorderCache( widget ) );
142	widget._applyBorder( new org.eclipse.rwt.Border( 0, "rounded", "black", 0 ) );	142	widget.setBorder( new org.eclipse.rwt.Border( 0, "rounded", "black", 0 ) );
143	testUtil.flush();	143	testUtil.flush();
144	assertEquals ( [ 0, 0, 0, 0 ], this.getFakePadding( widget ) );	144	assertEquals ( [ 0, 0, 0, 0 ], this.getFakePadding( widget ) );
145	assertEquals ( [ 0, 0, 0, 0 ], this.getBorderCache( widget ) );	145	assertEquals ( [ 0, 0, 0, 0 ], this.getBorderCache( widget ) );
146	widget._applyBorder( new org.eclipse.rwt.Border( [ 4, 0, 3, 0 ], "rounded", "black", 0 ) );	146	widget.setBorder( new org.eclipse.rwt.Border( [ 4, 0, 3, 0 ], "rounded", "black", 0 ) );
147	testUtil.flush();	147	testUtil.flush();
148	assertEquals ( [ 4, 0, 3, 0 ], this.getFakePadding( widget ) );	148	assertEquals ( [ 4, 0, 3, 0 ], this.getFakePadding( widget ) );
149	assertEquals ( [ 4, 0, 3, 0 ], this.getBorderCache( widget ) );	149	assertEquals ( [ 4, 0, 3, 0 ], this.getBorderCache( widget ) );
150	widget.setBackgroundGradient( this.gradient );	150	widget.setBackgroundGradient( this.gradient );
151	widget.setBorder( null );	151	widget.setBorder( null );
152	testUtil.flush();	152	testUtil.flush();
		153	// NOTE: since the layouting for targetNode is queued in the first flush, a second is needed
		154	testUtil.flush();
153	assertEquals ( [ 0, 0, 0, 0 ], this.getBorderCache( widget ) );	155	assertEquals ( [ 0, 0, 0, 0 ], this.getBorderCache( widget ) );
154	assertEquals ( [ 0, 0, 0, 0 ], this.getFakePadding( widget ) );	156	assertEquals ( [ 0, 0, 0, 0 ], this.getFakePadding( widget ) );
155	widget.destroy();	157	widget.destroy();
Lines 720-725 Link Here
720	testUtil.flush();	722	testUtil.flush();
721	assertTrue( this.widgetContainsCanvas( widget ) );	723	assertTrue( this.widgetContainsCanvas( widget ) );
722	widget.setBorder( null );	724	widget.setBorder( null );
		725	testUtil.flush();
723	assertFalse( this.widgetContainsCanvas( widget ) );	726	assertFalse( this.widgetContainsCanvas( widget ) );
724	widget.setWidth( 400 );	727	widget.setWidth( 400 );
725	testUtil.flush();	728	testUtil.flush();
Lines 754-759 Link Here
754	var result = new org.eclipse.swt.widgets.Shell();	757	var result = new org.eclipse.swt.widgets.Shell();
755	result.addToDocument();	758	result.addToDocument();
756	result.setBackgroundColor( null );	759	result.setBackgroundColor( null );
		760	result.setBackgroundGradient( null );
		761	result.setBorder( null );
757	result.setShadow( null );	762	result.setShadow( null );
758	result.open();	763	result.open();
759	qx.ui.core.Widget.flushGlobalQueues();	764	qx.ui.core.Widget.flushGlobalQueues();
Lines 773-781 Link Here
773	},	778	},
774		779
775	usesGfxBorder : function( widget ) {	780	usesGfxBorder : function( widget ) {
776	return widget._gfxBorderEnabled	781	return widget._gfxBorderEnabled && this.widgetContainsCanvas( widget );
777	&& this.widgetContainsCanvas( widget )
778	&& widget._gfxData.backgroundShape == widget._gfxData.pathElement;
779	},	782	},
780		783
781	usesGfxBackground : function( widget ) {	784	usesGfxBackground : function( widget ) {

Lines 103-128 Link Here

(-)js/org/eclipse/rwt/GraphicsMixin.js (-156 / +89 lines)
103	// Overwritten:	103	// Overwritten:
104	renderBorder : function( changes ) {	104	renderBorder : function( changes ) {
105	var value = this.__borderObject;	105	var value = this.__borderObject;
106	if( value ) {	106	if( value && value.getStyle() === "rounded" ) {
107	if( value.getStyle() === "rounded" ) {	107	this._styleGfxBorder( value.getWidths(), value.getColor(), value.getRadii() );
108	this._styleGfxBorder( value.getWidths(), value.getColor(), value.getRadii() );
109	} else {
110	value.render( this );
111	}
112	} else {	108	} else {
113	this._style.border = "";	109	if( this._gfxBorderEnabled ) {
114	if( this._innerStyle ) {	110	this._styleGfxBorder( null, null, null );
115	this._innerStyle.border = "";
116	}	111	}
		112	this.base( arguments, changes );
117	}	113	}
118	// RAP: Fix for Bug 301709
119	this._usesComplexBorder = this._computeUsesComplexBorder();
120	},	114	},
121		115
122	_styleGfxBorder : function( width, color, radii ) {	116	_styleGfxBorder : function( width, color, radii ) {
123	// NOTE: widgets with no dimensions of their own wont work together	117	// NOTE: widgets with no dimensions of their own wont work together
124	// with a gfxBorder (accepted bug)	118	// with a gfxBorder (accepted bug)
125	this.setGfxProperty( "borderWidths", width );
126	var max = 0;	119	var max = 0;
127	if( width ) {	120	if( width ) {
128	for( var i = 0; i < width.length; i++ ) {	121	for( var i = 0; i < width.length; i++ ) {
Lines 143-152 Link Here
143	} else {	136	} else {
144	renderRadii = radii;	137	renderRadii = radii;
145	}	138	}
		139	this.setGfxProperty( "borderWidths", width );
146	this.setGfxProperty( "borderMaxWidth", max );	140	this.setGfxProperty( "borderMaxWidth", max );
147	this.setGfxProperty( "borderColor", color );	141	this.setGfxProperty( "borderColor", color );
148	this.setGfxProperty( "borderRadii", renderRadii );	142	this.setGfxProperty( "borderRadii", renderRadii );
149	this.setGfxProperty( "borderLayouted", null ); // use GfxBorder to chcek	143	this.setGfxProperty( "borderLayouted", null ); // the last rendered gfx-border
150	this._handleGfxBorder();	144	this._handleGfxBorder();
151	},	145	},
152		146
Lines 158-177 Link Here
158	},	152	},
159		153
160	getGfxProperty : function( key ) {	154	getGfxProperty : function( key ) {
161	var value = this._gfxProperties !== null	155	var value = this._gfxProperties !== null ? this._gfxProperties[ key ] : null;
162	? this._gfxProperties[ key ]
163	: null;
164	return typeof value != "undefined" ? value : null;	156	return typeof value != "undefined" ? value : null;
165	},	157	},
166
167	//overwritten:
168	_computeUsesComplexBorder : function() {
169	var result = this._gfxBorderEnabled && this.getGfxProperty( "borderMaxWidth" ) > 0 ;
170	if( !result ) {
171	result = this.base( arguments );
172	}
173	return result;
174	},
175		158
176	///////////////////	159	///////////////////
177	// internals - main	160	// internals - main
Lines 183-217 Link Here
183	var toggle = ( this._gfxBorderEnabled != useBorder );	166	var toggle = ( this._gfxBorderEnabled != useBorder );
184	if( toggle ) {	167	if( toggle ) {
185	if( useBorder ) {	168	if( useBorder ) {
186	this.addEventListener( "changeBorder",
187	this._gfxOnBorderChanged,
188	this );
189	this._gfxBorderEnabled = true;	169	this._gfxBorderEnabled = true;
190	} else {	170	} else {
191	this.removeStyleProperty( "padding" );	171	this.removeStyleProperty( "padding" );
192	this.removeEventListener( "changeBorder",
193	this._gfxOnBorderChanged,
194	this );
195	this._gfxBorderEnabled = false;	172	this._gfxBorderEnabled = false;
196	}	173	}
197	this._handleGfxBackground();	174	this._handleGfxBackground();
198	this._handleGfxStatus();	175	this._handleGfxStatus(); // TODO [tb] : implicitly in handleGfxBackground?
		176	if( !useBorder ) {
		177	this._handleTargetNode();
		178	}
199	}	179	}
200	// if gfxBorder is not used, canvas can still ready for background	180	// if gfxBorder is not used, canvas can still ready for background
201	if( ( toggle \|\| useBorder ) && this._isCanvasReady() ) {	181	if( ( toggle \|\| useBorder ) && this._isCanvasReady() ) {
202	this._renderGfxBorder();	182	this._renderGfxBorder();
203	if( !useBorder \|\| !this._willBeLayouted() ) {	183	if( !useBorder \|\| !this._willBeLayouted() ) {
204	// TODO [tb] : refactor conditions, "!useBorder" is only for padding	184	// TODO [tb] : refactor conditions, "!useBorder" is only for padding
205	this._layoutGfxBorder();	185	this._layoutBackgroundShape();
206	if( this._gfxShadowEnabled ) {	186	if( this._gfxShadowEnabled ) {
207	this._layoutGfxShadow();	187	this._layoutShadowShape();
208	}	188	}
209	}	189	}
210	this._handleFlushListener();	190	}
211	} else if( toggle && !useBorder && this._innerStyle ) {
212	this._handleFlushListener();
213	this._setSimulatedPadding();
214	}
215	},	191	},
216		192
217	_handleGfxBackground : function() {	193	_handleGfxBackground : function() {
Lines 249-258 Link Here
249	}	225	}
250	if( ( toggle \|\| useBackground ) && this._isCanvasReady() ) {	226	if( ( toggle \|\| useBackground ) && this._isCanvasReady() ) {
251	this._renderGfxBackground();	227	this._renderGfxBackground();
252	} else if( !useBackground	228	} else if( !useBackground && this._gfxData && this._gfxData.backgroundInsert ) {
253	&& this._gfxData
254	&& this._gfxData.backgroundInsert )
255	{
256	this._prepareBackgroundShape();	229	this._prepareBackgroundShape();
257	}	230	}
258	},	231	},
Lines 261-267 Link Here
261	var hasShadow = this.getGfxProperty( "shadow" ) != null;	234	var hasShadow = this.getGfxProperty( "shadow" ) != null;
262	this._gfxShadowEnabled = hasShadow;	235	this._gfxShadowEnabled = hasShadow;
263	this._handleGfxStatus();	236	this._handleGfxStatus();
264	this._handleFlushListener();
265	if( this._isCanvasReady() ) {	237	if( this._isCanvasReady() ) {
266	this._renderGfxShadow();	238	this._renderGfxShadow();
267	} else if( !this._gfxShadowEnabled && this._gfxData && this._gfxData.shadowInsert ) {	239	} else if( !this._gfxShadowEnabled && this._gfxData && this._gfxData.shadowInsert ) {
Lines 270-290 Link Here
270	},	242	},
271		243
272	_handleGfxStatus : function() {	244	_handleGfxStatus : function() {
273	var useGfx = this._gfxBorderEnabled	245	var useGfx = this._gfxBorderEnabled \|\| this._gfxBackgroundEnabled \|\| this._gfxShadowEnabled;
274	\|\| this._gfxBackgroundEnabled	246	if( useGfx != this._gfxEnabled ) {
275	\|\| this._gfxShadowEnabled;
276	if( useGfx != this._gfxEnabled ) {
277	if( useGfx ) {	247	if( useGfx ) {
278	this.addEventListener( "changeElement",	248	this.addEventListener( "changeElement", this._gfxOnElementChanged, this );
279	this._gfxOnElementChanged,
280	this );
281	this._gfxEnabled = true;	249	this._gfxEnabled = true;
282	} else {	250	} else {
283	this.removeEventListener( "changeElement",	251	this.removeEventListener( "changeElement", this._gfxOnElementChanged, this );
284	this._gfxOnElementChanged,
285	this );
286	this._gfxEnabled = false;	252	this._gfxEnabled = false;
287	}	253	}
		254	this._handleFlushListener();
288	}	255	}
289	},	256	},
290		257
Lines 328-333 Link Here
328	}	295	}
329	}	296	}
330	this.prepareEnhancedBorder();	297	this.prepareEnhancedBorder();
		298	// TODO [tb] : redundand in some cases:
		299	this.addToQueue( "width" );
		300	this.addToQueue( "height" );
331	if( outline ) {	301	if( outline ) {
332	this.setStyleProperty( "outline", outline );	302	this.setStyleProperty( "outline", outline );
333	}	303	}
Lines 341-348 Link Here
341		311
342	_appendCanvas : function() {	312	_appendCanvas : function() {
343	var parentNode = this.getElement();	313	var parentNode = this.getElement();
344	var gfxNode	314	var gfxNode = org.eclipse.rwt.GraphicsUtil.getCanvasNode( this._gfxCanvas );
345	= org.eclipse.rwt.GraphicsUtil.getCanvasNode( this._gfxCanvas );
346	if( gfxNode != null ) {	315	if( gfxNode != null ) {
347	parentNode.insertBefore( gfxNode, parentNode.firstChild );	316	parentNode.insertBefore( gfxNode, parentNode.firstChild );
348	}	317	}
Lines 354-361 Link Here
354	},	323	},
355		324
356	_removeCanvas : function() {	325	_removeCanvas : function() {
357	var gfxNode	326	var gfxNode = org.eclipse.rwt.GraphicsUtil.getCanvasNode( this._gfxCanvas );
358	= org.eclipse.rwt.GraphicsUtil.getCanvasNode( this._gfxCanvas );
359	if( gfxNode != null ) {	327	if( gfxNode != null ) {
360	gfxNode.parentNode.removeChild( gfxNode );	328	gfxNode.parentNode.removeChild( gfxNode );
361	this._gfxCanvasAppended = false;	329	this._gfxCanvasAppended = false;
Lines 370-394 Link Here
370	var util = org.eclipse.rwt.GraphicsUtil;	338	var util = org.eclipse.rwt.GraphicsUtil;
371	var backgroundShape = this._gfxData.backgroundShape;	339	var backgroundShape = this._gfxData.backgroundShape;
372	if( this._gfxBackgroundEnabled ) {	340	if( this._gfxBackgroundEnabled ) {
373	var usePath = this._gfxBorderEnabled;
374	if( backgroundShape === undefined ) {	341	if( backgroundShape === undefined ) {
375	this._gfxData.backgroundShape = this._createBackgroundShape( usePath );	342	this._gfxData.backgroundShape = util.createShape( "roundrect" );
376	} else {
377	if( usePath && backgroundShape === this._gfxData.rectShape ) {
378	if( this._gfxData.backgroundInsert ) {
379	util.removeFromCanvas( this._gfxCanvas, backgroundShape );
380	this._gfxData.backgroundInsert = false;
381	}
382	delete this._gfxData.rectShape;
383	this._gfxData.backgroundShape = this._createBackgroundShape( usePath );
384	} else if( !usePath && backgroundShape === this._gfxData.pathElement ) {
385	if( this._gfxData.backgroundInsert ) {
386	util.removeFromCanvas( this._gfxCanvas, backgroundShape );
387	this._gfxData.backgroundInsert = false;
388	}
389	delete this._gfxData.pathElement;
390	this._gfxData.backgroundShape = this._createBackgroundShape( usePath );
391	}
392	}	343	}
393	if( !this._gfxData.backgroundInsert ) {	344	if( !this._gfxData.backgroundInsert ) {
394	var shape = this._gfxData.backgroundShape;	345	var shape = this._gfxData.backgroundShape;
Lines 401-421 Link Here
401	}	352	}
402	},	353	},
403		354
404	_createBackgroundShape : function( usePath ) {
405	var shape = null;
406	var util = org.eclipse.rwt.GraphicsUtil;
407	if( usePath ) {
408	shape = util.createShape( "roundrect" );
409	this._gfxData.pathElement = shape;
410	} else {
411	var shape = util.createShape( "rect" );
412	util.setRectBounds( shape, "0%", "0%", "100%", "100%" );
413	this._gfxData.rectShape = shape;
414	}
415	return shape;
416	},
417
418
419	/////////////////////////	355	/////////////////////////
420	// internals - background	356	// internals - background
421		357
Lines 444-450 Link Here
444	_renderGfxBorder : function() {	380	_renderGfxBorder : function() {
445	this._style.borderWidth = 0;	381	this._style.borderWidth = 0;
446	var inner = this._innerStyle;	382	var inner = this._innerStyle;
447	inner.borderWidth = 0;	383	inner.borderWidth = 0; // TODO [tb] : useless?
448	this._prepareBackgroundShape();	384	this._prepareBackgroundShape();
449	var shape = this._gfxData.backgroundShape;	385	var shape = this._gfxData.backgroundShape;
450	var width = this.getGfxProperty( "borderMaxWidth" );	386	var width = this.getGfxProperty( "borderMaxWidth" );
Lines 452-471 Link Here
452	org.eclipse.rwt.GraphicsUtil.setStroke( shape, color, width );	388	org.eclipse.rwt.GraphicsUtil.setStroke( shape, color, width );
453	},	389	},
454		390
455	_layoutGfxBorder : function() {	391	_layoutBackgroundShape : function() {
456	var rectDimension = [ this.getBoxWidth(), this.getBoxHeight() ];	392	var rectDimension = [ this.getBoxWidth(), this.getBoxHeight() ];
457	var oldDimension = this.getGfxProperty( "borderLayouted" );	393	var oldDimension = this.getGfxProperty( "borderLayouted" );
458	var changedX	394	var changedX = !oldDimension \|\| ( rectDimension[ 0 ] !== oldDimension[ 0 ] );
459	= !oldDimension \|\| ( rectDimension[ 0 ] !== oldDimension[ 0 ] );	395	var changedY = !oldDimension \|\| ( rectDimension[ 1 ] !== oldDimension[ 1 ] );
460	var changedY
461	= !oldDimension \|\| ( rectDimension[ 1 ] !== oldDimension[ 1 ] );
462	if( changedX \|\| changedY ) {	396	if( changedX \|\| changedY ) {
463	this.setGfxProperty( "borderLayouted", rectDimension );	397	this.setGfxProperty( "borderLayouted", rectDimension );
464	this._setSimulatedPadding();	398	this._handleTargetNode();
465	var rectDimension = [ this.getBoxWidth(), this.getBoxHeight() ];	399	var rectDimension = [ this.getBoxWidth(), this.getBoxHeight() ]; // TODO [tb] : useless?
466	var radii = this.getGfxProperty( "borderRadii" );	400	// TODO [tb] : refactor from here
467	var borderWidth = this.getGfxProperty( "borderWidths" );	401	var rectWidth;
468	if( borderWidth != null && radii != null ) {	402	var rectHeight;
		403	var left;
		404	var top;
		405	var radii;
		406	if( this._gfxBorderEnabled ) {
		407	radii = this.getGfxProperty( "borderRadii" );
		408	var borderWidth = this.getGfxProperty( "borderWidths" );
469	var maxWidth = this.getGfxProperty( "borderMaxWidth" );	409	var maxWidth = this.getGfxProperty( "borderMaxWidth" );
470	var borderTop = 0;	410	var borderTop = 0;
471	var borderRight = 0;	411	var borderRight = 0;
Lines 481-527 Link Here
481	borderBottom = ( borderWidth[ 2 ] == 0 ? -maxWidth - 1 : maxWidth );	421	borderBottom = ( borderWidth[ 2 ] == 0 ? -maxWidth - 1 : maxWidth );
482	borderLeft = ( borderWidth[ 3 ] == 0 ? -maxWidth - 1: maxWidth );	422	borderLeft = ( borderWidth[ 3 ] == 0 ? -maxWidth - 1: maxWidth );
483	}	423	}
484	var rectWidth =	424	rectWidth = rectDimension[ 0 ] - ( borderLeft * 0.5 + borderRight * 0.5 );
485	rectDimension[ 0 ] - ( borderLeft * 0.5 + borderRight * 0.5 );	425	rectHeight = rectDimension[ 1 ] - ( borderTop * 0.5 + borderBottom * 0.5 );
486	var rectHeight =	426	left = borderLeft * 0.5;
487	rectDimension[ 1 ] - ( borderTop * 0.5 + borderBottom * 0.5 );	427	top = borderTop * 0.5;
488	var left = borderLeft * 0.5;	428	} else {
489	var top = borderTop * 0.5;	429	// TODO [tb] : write tests for this case
490	//a few safeguards:	430	left = 0
491	rectWidth = Math.max( 0, rectWidth );	431	top = 0;
492	rectHeight = Math.max( 0, rectHeight );	432	rectWidth = rectDimension[ 0 ] - this._cachedBorderLeft - this._cachedBorderRight;
493	var shape = this._gfxData.pathElement;	433	rectHeight = rectDimension[ 1 ] - this._cachedBorderTop - this._cachedBorderBottom;
494	org.eclipse.rwt.GraphicsUtil.setRoundRectLayout( shape,	434	radii = [ 0, 0, 0, 0 ];
495	left,	435	}
496	top,	436	//a few safeguards:
497	rectWidth,	437	rectWidth = Math.max( 0, rectWidth );
498	rectHeight,	438	rectHeight = Math.max( 0, rectHeight );
499	radii );	439	var shape = this._gfxData.backgroundShape;
500	}	440	var util = org.eclipse.rwt.GraphicsUtil;
		441	util.setRoundRectLayout( shape, left, top, rectWidth, rectHeight, radii );
501	}	442	}
502	},	443	},
503		444
504	_setSimulatedPadding : function() {	445	_handleTargetNode : function() {
505	var isMshtml = qx.core.Variant.isSet( "qx.client", "mshtml" );	446	if( this._innerStyle ) {
506	var width = this.getGfxProperty( "borderWidths" );	447	if( this._gfxBorderEnabled ) {
507	if( width ) {	448	var rect = this.getGfxProperty( "borderLayouted" );
508	var rect = this.getGfxProperty( "borderLayouted" );	449	var width = this.getGfxProperty( "borderWidths" );
509	var style = this._innerStyle;	450	var style = this._innerStyle;
510	style.top = width[ 0 ] + "px";	451	style.top = width[ 0 ] + "px";
511	style.left = width[ 3 ] + "px";	452	style.left = width[ 3 ] + "px";
512	style.width = Math.max( 0, rect[ 0 ] - width[ 3 ] - width[ 1 ] ) + "px";	453	style.width = Math.max( 0, rect[ 0 ] - width[ 3 ] - width[ 1 ] ) + "px";
513	style.height = Math.max( 0, rect[ 1 ] - width[ 0 ] - width[ 2 ] ) + "px";	454	style.height = Math.max( 0, rect[ 1 ] - width[ 0 ] - width[ 2 ] ) + "px";
514	} else {	455	} else if( !this._gfxEnabled ) {
515	this._innerStyle.left = "0px";	456	this._innerStyle.left = "0px";
516	this._innerStyle.top = "0px";	457	this._innerStyle.top = "0px";
517	if( isMshtml ) {	458	if( qx.core.Variant.isSet( "qx.client", "mshtml" ) ) {
518	this._innerStyle.width = "";	459	this._innerStyle.width = "";
519	this._innerStyle.height = "";	460	this._innerStyle.height = "";
520	this.addToQueue( "width" );	461	this.addToQueue( "width" );
521	this.addToQueue( "height" );	462	this.addToQueue( "height" );
522	} else {	463	} else {
523	this._innerStyle.width = "100%";	464	this._innerStyle.width = "100%";
524	this._innerStyle.height = "100%";	465	this._innerStyle.height = "100%";
		466	}
525	}	467	}
526	}	468	}
527	},	469	},
Lines 529-535 Link Here
529	_handleFlushListener : function( value ) {	471	_handleFlushListener : function( value ) {
530	var enhanced = this._innerStyle \|\| this._gfxEnabled;	472	var enhanced = this._innerStyle \|\| this._gfxEnabled;
531	this._layoutTargetNode = enhanced && !this._gfxBorderEnabled;	473	this._layoutTargetNode = enhanced && !this._gfxBorderEnabled;
532	if( this._gfxBorderEnabled \|\| this._gfxShadowEnabled ) {	474	if( this._gfxEnabled) {
533	this.addEventListener( "flush", this._gfxOnFlush, this );	475	this.addEventListener( "flush", this._gfxOnFlush, this );
534	} else {	476	} else {
535	this.removeEventListener( "flush", this._gfxOnFlush, this );	477	this.removeEventListener( "flush", this._gfxOnFlush, this );
Lines 581-591 Link Here
581	util.setBlur( shape, shadow[ 3 ] );	523	util.setBlur( shape, shadow[ 3 ] );
582	util.setFillColor( shape, shadow[ 5 ] );	524	util.setFillColor( shape, shadow[ 5 ] );
583	util.setOpacity( shape, shadow[ 6 ] );	525	util.setOpacity( shape, shadow[ 6 ] );
584	this._layoutGfxShadow();	526	this._layoutShadowShape();
585	}	527	}
586	},	528	},
587		529
588	_layoutGfxShadow : function() {	530	_layoutShadowShape : function() {
589	var util = org.eclipse.rwt.GraphicsUtil;	531	var util = org.eclipse.rwt.GraphicsUtil;
590	var rect = [ this.getBoxWidth(), this.getBoxHeight() ];	532	var rect = [ this.getBoxWidth(), this.getBoxHeight() ];
591	var shape = this._gfxData.shadowShape;	533	var shape = this._gfxData.shadowShape;
Lines 625-632 Link Here
625	},	567	},
626		568
627	_willBeLayouted : function() {	569	_willBeLayouted : function() {
628	return typeof this._jobQueue != "undefined"	570	return this._jobQueue != undefined \|\| !qx.lang.Object.isEmpty( this._layoutChanges );
629	\|\| !qx.lang.Object.isEmpty( this._layoutChanges );
630	},	571	},
631		572
632	// called after the element of the widget has been set	573	// called after the element of the widget has been set
Lines 645-658 Link Here
645	}	586	}
646	},	587	},
647		588
648	//called if the GfxBorder object has been replaced
649	_gfxOnBorderChanged : function( event ) {
650	var border = event.getValue();
651	if ( !( border && border.getStyle() === "rounded" ) ) {
652	this._styleGfxBorder( null, null, null );
653	}
654	},
655
656	_onCanvasAppear : function() {	589	_onCanvasAppear : function() {
657	if( this._gfxCanvasAppended ) {	590	if( this._gfxCanvasAppended ) {
658	org.eclipse.rwt.GraphicsUtil.handleAppear( this._gfxCanvas );	591	org.eclipse.rwt.GraphicsUtil.handleAppear( this._gfxCanvas );
Lines 665-675 Link Here
665	if ( changes.paddingRight \|\| changes.paddingBottom ) {	598	if ( changes.paddingRight \|\| changes.paddingBottom ) {
666	this.setGfxProperty( "borderLayouted", null );	599	this.setGfxProperty( "borderLayouted", null );
667	}	600	}
668	if( this._gfxBorderEnabled ) {	601	if( this._gfxBackgroundEnabled ) { // gfxBorder implicitly enables gfx-background
669	this._layoutGfxBorder();	602	this._layoutBackgroundShape();
670	}	603	}
671	if( this._gfxShadowEnabled ) {	604	if( this._gfxShadowEnabled ) {
672	this._layoutGfxShadow();	605	this._layoutShadowShape();
673	}	606	}
674	}	607	}
675		608

Lines 30-42 Link Here

(-)index.html (-1 / +3 lines)
30	<script src="./js/org/eclipse/rwt/test/tests/ComboTest.js" type="text/javascript"></script>	30	<script src="./js/org/eclipse/rwt/test/tests/ComboTest.js" type="text/javascript"></script>
31	<script src="./js/org/eclipse/rwt/test/tests/EventHandlerTest.js" type="text/javascript"></script>	31	<script src="./js/org/eclipse/rwt/test/tests/EventHandlerTest.js" type="text/javascript"></script>
32	<script src="./js/org/eclipse/rwt/test/tests/AsyncKeyEventUtilTest.js" type="text/javascript"></script>	32	<script src="./js/org/eclipse/rwt/test/tests/AsyncKeyEventUtilTest.js" type="text/javascript"></script>
33	<script src="./js/org/eclipse/rwt/test/tests/DNDTest.js" type="text/javascript"></script>
34	<script src="./js/org/eclipse/rwt/test/tests/MobileWebkitSupportTest.js" type="text/javascript"></script>	33	<script src="./js/org/eclipse/rwt/test/tests/MobileWebkitSupportTest.js" type="text/javascript"></script>
35	<script src="./js/org/eclipse/rwt/test/tests/IFrameTest.js" type="text/javascript"></script>	34	<script src="./js/org/eclipse/rwt/test/tests/IFrameTest.js" type="text/javascript"></script>
36	<script src="./js/org/eclipse/rwt/test/tests/TableTest.js" type="text/javascript"></script>	35	<script src="./js/org/eclipse/rwt/test/tests/TableTest.js" type="text/javascript"></script>
		36	<!---
		37	<script src="./js/org/eclipse/rwt/test/tests/DNDTest.js" type="text/javascript"></script>
37	<script src="./js/org/eclipse/rwt/test/tests/TreeItemTest.js" type="text/javascript"></script>	38	<script src="./js/org/eclipse/rwt/test/tests/TreeItemTest.js" type="text/javascript"></script>
38	<script src="./js/org/eclipse/rwt/test/tests/TreeRowTest.js" type="text/javascript"></script>	39	<script src="./js/org/eclipse/rwt/test/tests/TreeRowTest.js" type="text/javascript"></script>
39	<script src="./js/org/eclipse/rwt/test/tests/TreeTest.js" type="text/javascript"></script>	40	<script src="./js/org/eclipse/rwt/test/tests/TreeTest.js" type="text/javascript"></script>
		41	--->
40	<script src="./js/org/eclipse/rwt/test/tests/AnimationTest.js" type="text/javascript"></script>	42	<script src="./js/org/eclipse/rwt/test/tests/AnimationTest.js" type="text/javascript"></script>
41	<script src="./js/org/eclipse/rwt/test/tests/GCTest.js" type="text/javascript"></script>	43	<script src="./js/org/eclipse/rwt/test/tests/GCTest.js" type="text/javascript"></script>
42	<script src="./js/org/eclipse/rwt/test/tests/GCCanvasTest.js" type="text/javascript"></script>	44	<script src="./js/org/eclipse/rwt/test/tests/GCCanvasTest.js" type="text/javascript"></script>