render.windowpane.js

一个ajax富客户端的ajax类库

                this._borderDivElements[7].style.position = "absolute";
                this._borderDivElements[7].style.right = "0px";
                this._borderDivElements[7].style.bottom = "0px";
                this._borderDivElements[7].style.width = this._borderInsets.right + "px";
                this._borderDivElements[7].style.height = this._borderInsets.bottom + "px";
                if (border.color != null) {
                    this._borderDivElements[7].style.backgroundColor = border.color;
                }
                if (resizable) {
                    this._borderDivElements[7].style.cursor = "se-resize";
                }
                if (border.bottomRight) {
                    EchoAppRender.FillImage.render(border.bottomRight, this._borderDivElements[7], fillImageFlags);
                }
                this._windowPaneDivElement.appendChild(this._borderDivElements[7]);
            }
        }
        
        // Render Title Bar
        
        this._titleBarDivElement = document.createElement("div");
        this._titleBarDivElement.style.position = "absolute";
        this._titleBarDivElement.style.zIndex = 3;
        
        var icon = this.component.render("icon");
        if (icon) {
            var titleIconDivElement = document.createElement("div");
            titleIconDivElement.style[WebCore.Environment.CSS_FLOAT] = "left";
            EchoAppRender.Insets.render(this.component.render("iconInsets"), titleIconDivElement, "padding");
            this._titleBarDivElement.appendChild(titleIconDivElement);
            
            var imgElement = document.createElement("img");
            EchoAppRender.ImageReference.renderImg(icon, imgElement);
            titleIconDivElement.appendChild(imgElement);
        }
    
        var title = this.component.render("title");
        if (title) {
            var titleTextDivElement = document.createElement("div");
            if (icon) {
                titleTextDivElement.style[WebCore.Environment.CSS_FLOAT] = "left";
            }
            titleTextDivElement.style.whiteSpace = "nowrap";
            EchoAppRender.Font.render(this.component.render("titleFont"), titleTextDivElement);
            EchoAppRender.Insets.render(this.component.render("titleInsets", 
                    EchoAppRender.WindowPaneSync.DEFAULT_TITLE_INSETS), titleTextDivElement, "padding");
            titleTextDivElement.appendChild(document.createTextNode(title));
            this._titleBarDivElement.appendChild(titleTextDivElement);
        }
        
        var titleBarHeight = this.component.render("titleHeight");
        if (titleBarHeight) {
            this._titleBarHeight = EchoAppRender.Extent.toPixels(titleBarHeight);
        } else {
            var titleMeasure = new WebCore.Measure.Bounds(this._titleBarDivElement);
            if (titleMeasure.height) {
                this._titleBarHeight = titleMeasure.height;
            } else {
                this._titleBarHeight = EchoAppRender.Extent.toPixels(EchoApp.WindowPane.DEFAULT_TITLE_HEIGHT);
            }
        }
    
        this._titleBarDivElement.style.top = this._contentInsets.top + "px";
        this._titleBarDivElement.style.left = this._contentInsets.left + "px";
        this._titleBarDivElement.style.width = (this._windowWidth - this._contentInsets.left - this._contentInsets.right) + "px";
        this._titleBarDivElement.style.height = this._titleBarHeight + "px";
        this._titleBarDivElement.style.overflow = "hidden";
        if (movable) {
            this._titleBarDivElement.style.cursor = "move";
        }
    
        EchoAppRender.Color.render(this.component.render("titleForeground"), this._titleBarDivElement, "color");
    
        var titleBackground = this.component.render("titleBackground");
        var titleBackgroundImage = this.component.render("titleBackgroundImage");
    
        if (titleBackground) {
            this._titleBarDivElement.style.backgroundColor = titleBackground;
        }
        if (titleBackgroundImage) {
            EchoAppRender.FillImage.render(titleBackgroundImage, this._titleBarDivElement);
        }
    
        if (!titleBackground && !titleBackgroundImage) {
            this._titleBarDivElement.style.backgroundColor = EchoAppRender.WindowPaneSync.DEFAULT_TITLE_BACKGROUND;
        }
        
        // Close Button
      
        if (closable) {
            this._closeDivElement = document.createElement("div");
            this._closeDivElement.style.position = "absolute";
            this._closeDivElement.style.right = "0px";
            this._closeDivElement.style.top = "0px";
            this._closeDivElement.style.cursor = "pointer";
            EchoAppRender.Insets.render(this.component.render("closeIconInsets", 
                    EchoApp.WindowPane.DEFAULT_CLOSE_ICON_INSETS), this._closeDivElement, "padding");
            var closeIcon = this.component.render("closeIcon", this.client.getResourceUrl("Echo", "resource/WindowPaneClose.gif")); 
            if (closeIcon) {
                var imgElement = document.createElement("img");
                EchoAppRender.ImageReference.renderImg(closeIcon, imgElement);
                this._closeDivElement.appendChild(imgElement);
            } else {
                this._closeDivElement.appendChild(document.createTextNode("[X]"));
            }
            this._titleBarDivElement.appendChild(this._closeDivElement);
        }
        
        this._windowPaneDivElement.appendChild(this._titleBarDivElement);
        
        // Render Content Area
        
        this._contentDivElement = document.createElement("div");
        
        this._contentDivElement.style.position = "absolute";
        this._contentDivElement.style.zIndex = 2;
        this._contentDivElement.style.overflow = "auto";
        
        EchoAppRender.Color.render(this.component.render("background", EchoApp.WindowPane.DEFAULT_BACKGROUND),
                this._contentDivElement, "backgroundColor");
        EchoAppRender.Color.render(this.component.render("foreground", EchoApp.WindowPane.DEFAULT_FOREGROUND),
                this._contentDivElement, "color");
    
        this._contentDivElement.style.top = (this._contentInsets.top + this._titleBarHeight) + "px";
        this._contentDivElement.style.left = this._contentInsets.left + "px";
        this._contentDivElement.style.right = this._contentInsets.right + "px";
        this._contentDivElement.style.bottom = this._contentInsets.bottom + "px";
        
        this._windowPaneDivElement.appendChild(this._contentDivElement);
    
        var componentCount = this.component.getComponentCount();
        if (componentCount == 1) {
            this.renderAddChild(update, this.component.getComponent(0), this._contentDivElement);
        } else if (componentCount > 1) {
            throw new Error("Too many children: " + componentCount);
        }
    
        // Render Internet Explorer 6-specific windowed control-blocking IFRAME.
        if (WebCore.Environment.QUIRK_IE_SELECT_Z_INDEX) {
            // Render Select Field Masking Transparent IFRAME.
            this._maskDivElement = document.createElement("div");
            this._maskDivElement.style.cssText 
                    = "filter:alpha(opacity=0);z-index:1;position:absolute;left:0,right:0,top:0,bottom:0,borderWidth: 0;";
            var maskIFrameElement = document.createElement("iframe");
            maskIFrameElement.style.cssText = "width:100%;height:100%;";
            
            var blankUrl = this.client.getResourceUrl("Echo", "resource/Blank.html");
            if (blankUrl) {
                maskIFrameElement.src = blankUrl;
            }
            
            this._maskDivElement.appendChild(maskIFrameElement);
            this._windowPaneDivElement.appendChild(this._maskDivElement);
        }
    
        parentElement.appendChild(this._windowPaneDivElement);
        
        // Register event listeners.
        
        WebCore.EventProcessor.add(this._windowPaneDivElement, "click", 
                Core.method(this, this._processFocusClick), true);
        
        if (closable) {
            WebCore.EventProcessor.add(this._windowPaneDivElement, "keydown", 
                    Core.method(this, this._processKeyDown), false);
            WebCore.EventProcessor.add(this._windowPaneDivElement, "keypress", 
                    Core.method(this, this._processKeyPress), false);
            WebCore.EventProcessor.add(this._closeDivElement, "click", 
                    Core.method(this, this._processCloseClick), false);
        }
        if (movable) {
            WebCore.EventProcessor.add(this._titleBarDivElement, "mousedown", 
                    Core.method(this, this._processTitleBarMouseDown), true);
        }
        if (resizable) {
            for (var i = 0; i < this._borderDivElements.length; ++i) {
                WebCore.EventProcessor.add(this._borderDivElements[i], "mousedown", 
                        Core.method(this, this._processBorderMouseDown), true);
            }
        }
    },
    
    renderAddChild: function(update, child, parentElement) {
        if (child.pane) {
            this._contentDivElement.style.padding = "0";
        } else {
            EchoAppRender.Insets.render(this.component.render("insets"), this._contentDivElement, "padding");
        }
        EchoRender.renderComponentAdd(update, child, parentElement);
    },
    
    renderDispose: function(update) { 
        for (var i = 0; i < this._borderDivElements.length; ++i) {
            WebCore.EventProcessor.removeAll(this._borderDivElements[i]);
            this._borderDivElements[i] = null;
        }
    
        WebCore.EventProcessor.removeAll(this._titleBarDivElement);
        this._titleBarDivElement = null;
        
        if (this._closeDivElement) {
            WebCore.EventProcessor.removeAll(this._closeDivElement);
            this._closeDivElement = null;
        }
        
        this._contentDivElement = null;
    
        WebCore.EventProcessor.removeAll(this._windowPaneDivElement);
        this._windowPaneDivElement = null;
        this._maskDivElement = null;
    },
    
    renderDisplay: function() {
        this._loadContainerSize();
        
        // Center window if user x/y coordinates are not specified.
        if (this._userWindowX == null) {
            this._userWindowX = parseInt((this._containerSize.width - this._windowWidth) / 2);
        }
        if (this._userWindowY == null) {
            this._userWindowY = parseInt((this._containerSize.height - this._windowHeight) / 2); 
        }
            
        this.setPosition(this._userWindowX, this._userWindowY, this._userWindowWidth, this._userWindowHeight);
        WebCore.VirtualPosition.redraw(this._contentDivElement);
        WebCore.VirtualPosition.redraw(this._maskDivElement);
    },
    
    renderFocus: function() {
        WebCore.DOM.focusElement(this._windowPaneDivElement);
    },

    renderUpdate: function(update) {
        if (update.hasAddedChildren() || update.hasRemovedChildren()) {
            // Children added/removed: full render.
        } else if (update.isUpdatedPropertySetIn({ positionX: true, positionY: true, width: true, height: true })) {
            // Only x/y/width/height properties changed: reset window position/size.
            this._loadPositionAndSize();
            this.setPosition(this._userWindowX, this._userWindowY, this._userWindowWidth, this._userWindowHeight);
            return;
        }

        var element = this._windowPaneDivElement;
        var containerElement = element.parentNode;
        EchoRender.renderComponentDispose(update, update.parent);
        containerElement.removeChild(element);
        this.renderAdd(update, containerElement);
        return true;
    }
});