render.windowpane.js

一个ajax富客户端的ajax类库

/**
 * Component rendering peer: WindowPane
 */
EchoAppRender.WindowPaneSync = Core.extend(EchoRender.ComponentSync, {

    $static: {
        DEFAULT_TITLE_BACKGROUND: "#abcdef",
        DEFAULT_TITLE_INSETS: "5px 10px",
        ADJUSTMENT_OPACITY: 0.75,
        
        adjustOpacity: false
    },
    
    $load: function() {
        EchoRender.registerPeer("WindowPane", this);
    },

    _processBorderMouseMoveRef: null,
    _processBorderMouseUpRef: null,
    _processTitleBarMouseMoveRef: null,
    _processTitleBarMouseUpRef: null,

    $construct: function() {
        this._processBorderMouseMoveRef = Core.method(this, this._processBorderMouseMove);
        this._processBorderMouseUpRef = Core.method(this, this._processBorderMouseUp);
        this._processTitleBarMouseMoveRef = Core.method(this, this._processTitleBarMouseMove);
        this._processTitleBarMouseUpRef = Core.method(this, this._processTitleBarMouseUp);
    },

    _loadPositionAndSize: function() {
        var positionX = this.component.render("positionX");
        var positionY = this.component.render("positionY");
        this._userWindowX = this._windowX = positionX == null ? null : EchoAppRender.Extent.toPixels(positionX, true); 
        this._userWindowY = this._windowY = positionY == null ? null : EchoAppRender.Extent.toPixels(positionY, false);
        this._userWindowWidth = this._windowWidth = EchoAppRender.Extent.toPixels(
                this.component.render("width", EchoApp.WindowPane.DEFAULT_WIDTH), true);
        this._userWindowHeight = this._windowHeight = EchoAppRender.Extent.toPixels(
                this.component.render("height", EchoApp.WindowPane.DEFAULT_HEIGHT), false);
    },

    _loadContainerSize: function() {
        //FIXME. the "parentnode.parentnode" business needs to go.
        this._containerSize = new WebCore.Measure.Bounds(this._windowPaneDivElement.parentNode.parentNode);
    },
    
    _processBorderMouseDown: function(e) {
        if (!this.client.verifyInput(this.component)) {
            return;
        }
    
        // Prevent selections.
        WebCore.dragInProgress = true;
        WebCore.DOM.preventEventDefault(e);
    
        this._loadContainerSize();
        this._dragInitX = this._windowX;
        this._dragInitY = this._windowY;
        this._dragInitWidth = this._windowWidth;
        this._dragInitHeight = this._windowHeight;
        this._dragOriginX = e.clientX;
        this._dragOriginY = e.clientY;
    
        switch (e.target) {
        case this._borderDivElements[0]: this._resizeX = -1; this._resizeY = -1; break;
        case this._borderDivElements[1]: this._resizeX =  0; this._resizeY = -1; break;
        case this._borderDivElements[2]: this._resizeX =  1; this._resizeY = -1; break;
        case this._borderDivElements[3]: this._resizeX = -1; this._resizeY =  0; break;
        case this._borderDivElements[4]: this._resizeX =  1; this._resizeY =  0; break;
        case this._borderDivElements[5]: this._resizeX = -1; this._resizeY =  1; break;
        case this._borderDivElements[6]: this._resizeX =  0; this._resizeY =  1; break;
        case this._borderDivElements[7]: this._resizeX =  1; this._resizeY =  1; break;
        }
        
        var bodyElement = document.getElementsByTagName("body")[0];
    
        WebCore.EventProcessor.add(bodyElement, "mousemove", this._processBorderMouseMoveRef, true);
        WebCore.EventProcessor.add(bodyElement, "mouseup", this._processBorderMouseUpRef, true);
    
        // Reduce opacity.   
        if (EchoAppRender.WindowPaneSync.adjustOpacity) {
            this._windowPaneDivElement.style.opacity = EchoAppRender.WindowPaneSync.ADJUSTMENT_OPACITY;
        }
    },
    
    _processBorderMouseMove: function(e) {
        var x, y, width, height;
        
        if (this._resizeX == -1) {
            width = this._dragInitWidth - (e.clientX - this._dragOriginX);
            x = this._dragInitX + this._dragInitWidth - width;
        } else if (this._resizeX ==1 ) {
            width = this._dragInitWidth + e.clientX - this._dragOriginX;
        }
        if (this._resizeY == -1) {
            height = this._dragInitHeight - (e.clientY - this._dragOriginY);
            y = this._dragInitY + this._dragInitHeight - height;
        } else if (this._resizeY ==1) {
            height = this._dragInitHeight + e.clientY - this._dragOriginY;
        }
        
        this.setPosition(x, y, width, height);
    },

    _processBorderMouseUp: function(e) {
        WebCore.DOM.preventEventDefault(e);
        
        WebCore.dragInProgress = false;
    
        // Set opaque.
        this._windowPaneDivElement.style.opacity = 1;
    
        this._removeBorderListeners();
        
        this.component.set("positionX", this._windowX);
        this.component.set("positionY", this._windowY);
        this.component.set("width", this._windowWidth);
        this.component.set("height", this._windowHeight);
        
        this._userWindowX = this._windowX;
        this._userWindowY = this._windowY;
        this._userWindowWidth = this._windowWidth;
        this._userWindowHeight = this._windowHeight;
        
        WebCore.VirtualPosition.redraw(this._contentDivElement);
        WebCore.VirtualPosition.redraw(this._maskDivElement);
        EchoRender.notifyResize(this.component);
    },
    
    _processKeyDown: function(e) {
        switch (e.keyCode) {
        case 27:
            this.component.doWindowClosing();
            WebCore.DOM.preventEventDefault(e);
            return false;
        }
        return true;
    },

    _processKeyPress: function(e) {
        switch (e.keyCode) {
        case 27:
            WebCore.DOM.preventEventDefault(e);
            return false;
        }
        return true;
    },
    
    _processCloseClick: function(e) { 
        if (!this.client.verifyInput(this.component)) {
            return;
        }
        this.component.doWindowClosing();
    },
    
    _processFocusClick: function(e) { 
        if (!this.client.verifyInput(this.component)) {
            return;
        }
        this.component.parent.peer.raise(this.component);
        return true;
    },
    
    _processTitleBarMouseDown: function(e) {
        if (!this.client.verifyInput(this.component)) {
            return;
        }
    
        // Raise window.
        this.component.parent.peer.raise(this.component);
        
        // Prevent selections.
        WebCore.dragInProgress = true;
        WebCore.DOM.preventEventDefault(e);
    
        this._loadContainerSize();
        this._dragInitX = this._windowX;
        this._dragInitY = this._windowY;
        this._dragOriginX = e.clientX;
        this._dragOriginY = e.clientY;
    
        // Reduce opacity.   
        if (EchoAppRender.WindowPaneSync.adjustOpacity) {
            this._windowPaneDivElement.style.opacity = EchoAppRender.WindowPaneSync.ADJUSTMENT_OPACITY;
        }
        
        var bodyElement = document.getElementsByTagName("body")[0];
        WebCore.EventProcessor.add(bodyElement, "mousemove", this._processTitleBarMouseMoveRef, true);
        WebCore.EventProcessor.add(bodyElement, "mouseup", this._processTitleBarMouseUpRef, true);
    },
    
    _processTitleBarMouseMove: function(e) {
        var x = this._dragInitX + e.clientX - this._dragOriginX;
        var y = this._dragInitY + e.clientY - this._dragOriginY;
        this.setPosition(x, y);
    },
    
    _processTitleBarMouseUp: function(e) {
        WebCore.dragInProgress = false;
    
        // Set opaque.
        this._windowPaneDivElement.style.opacity = 1;
        
        this._removeTitleBarListeners();
        this.component.set("positionX", this._windowX);
        this.component.set("positionY", this._windowY);
    
        this._userWindowX = this._windowX;
        this._userWindowY = this._windowY;
    },
    
    setPosition: function(x, y, width, height) {
        if (width != null) {
            if (this._maximumWidth && width > this._maximumWidth) {
                if (x != null) {
                    x += (width - this._maximumWidth);
                }
                width = this._maximumWidth;
            }
            if (width < this._minimumWidth) {
                if (x != null) {
                    x += (width - this._minimumWidth);
                }
                width = this._minimumWidth;
            }
            this._windowWidth = width;
        }
        
        if (height != null) {
            if (this._maximumHeight && height > this._maximumHeight) {
                if (y != null) {
                    y += (height - this._maximumHeight);
                }
                height = this._maximumHeight;
            }
            if (height < this._minimumHeight) {
                if (y != null) {
                    y += (height - this._minimumHeight);
                }
                height = this._minimumHeight;
            }
            this._windowHeight = height;
        }
    
        if (x != null) {
            if (this._containerSize.width > 0 && x > this._containerSize.width - this._windowWidth) {
                x = this._containerSize.width - this._windowWidth;
            }
            if (x < 0) {
                x = 0;
            }
            this._windowX = x;
        }