五一刚回来, 感觉五一 太短了, 一下就过了, 不过这个五一玩的还可以, 和发小去抓黄鳝, 成绩还可以,忙了一晚上弄到5斤左右的黄鳝,太爽了, 好久没有这种感觉了,好了不说这个了, 说说window , 下面是window的初级版本,还有在上面加很多功能,呵呵先共享一些;

 

Easy.Window = Easy.extend(Easy.UI.Base, {
    height: "auto",
    width: 300,
    baseCls: "e-window",
    isRender: false,
    closeAction: 'close',
    tools: {},
    constructor: function (cfg) {
        Easy.apply(this, cfg);
        Easy.Window.superclass.constructor.call(this);
    },
    initComponent: function () {
        var me = this;
        me.tools.closeBtn = me.create({
            tag: 'img',
            cls: 'e-window-close',
            style: {
                height: 17,
                width: 28
            },
            src: me.BLANK_IMAGE_URL
        });
        var header = me.header = me.create({
            tag: 'td',
            cls: 'e-window-tc e-window-move',
            children: [{
                tag: 'em',
                cls: 'e-tool',
                children: [me.tools.closeBtn]
            }, {
                tag: 'div',
                cls: 'e-window-title' + (me.iconCls ? " e-icon "+me.iconCls : ""),
                html: me.title || " "
            }]
        });
        me.wrap = me.create({
            tag: 'div',
            cls: me.baseCls,
            style: {
                "z-index": 10000,
                width: me.width,
                height:me.height
            },
            children: {
                tag: 'table',
                cls: me.baseCls + "-wrap",
                style:"width:100%;height:100%;",
                children: [{
                    tag: 'tr',
                    children: [{
                        tag: 'td',
                        cls: 'e-window-tl'
                    }, header, {
                        tag: 'td',
                        cls: 'e-window-tr'
                    }]
                }, {
                    tag: 'tr',
                    children: [{
                        tag: 'td',
                        cls: 'e-window-cl'
                    }, {
                        tag: 'td',
                        cls: 'e-window-cc',
                        valign:'top',
                        html: me.html || ' '
                    }, {
                        tag: 'td',
                        cls: 'e-window-cr'
                    }]
                }, {
                    tag: 'tr',
                    children: [{
                        tag: 'td',
                        cls: 'e-window-bl'
                    }, {
                        tag: 'td',
                        cls: 'e-window-bc',
                        html: ' '
                    }, {
                        tag: 'td',
                        cls: 'e-window-br'
                    }]
                }]
            }
        });
    },
    initEvent: function () {
        var me = this;
        Easy.DOM.on(me.tools.closeBtn, "mouseover", Easy.delegate(me.toogleClass, me.tools.closeBtn, ["e-window-close-over"]));
        Easy.DOM.on(me.tools.closeBtn, "mouseout", Easy.delegate(me.toogleClass, me.tools.closeBtn, ["e-window-close-over"]));
        Easy.DOM.on(me.wrap, "mousemove", Easy.delegate(me.dragMove, me));
        Easy.DOM.on(me.tools.closeBtn, "click", Easy.delegate(me.closeClick, me))

        Easy.DOM.on(me.header, "mousedown", Easy.delegate(me.dragStart, me));

    },
    render: function (el) {
        if (!this.isRender) {
            Easy.DOM.render(this.wrap, Easy.getBody());
            this.isRender = true;
        }
    },

    hide: function () {
        Easy.DOM.setStyle(this.wrap, { display: 'none' });
    },
    close: function () {
        Easy.removeNode(this.wrap);
        this.isRender = false;
    },
    show: function () {
        var me = this;
        if (me.isRender) {
            Easy.DOM.setStyle(me.wrap, { display: 'block' });
        } else {
            me.render.call(me);
        }
    },
    closeClick: function () {
        this[this.closeAction]();
    },

    dragStart: function (p, e) {
        var me = this, b = Easy.getBody();
        me.draging = true;
        b.onselect = function () { return false; };        
        me.dd = {
            x: e.clientX - me.wrap.offsetLeft + b.scrollLeft,
            y: e.clientY - me.wrap.offsetTop + b.scrollTop
        }
    },
    dropStart: function () {
        var me = this;
        Easy.getBody().onselect = null;
        me.draging = false;
    },
    dragMove: function (p, e) {
        var me = this, b = Easy.getBody();
        if (me.draging) {
            var b = Easy.getBody(),

            x = e.clientX - me.dd.x + b.scrollLeft,
            y = e.clientY - me.dd.y + b.scrollTop;

            Easy.DOM.setXY(me.wrap, [x, y]);

        }

    }

}); 

 

演示如图:

 

作者: EasyJS Framework 发表于 2011-05-03 20:45 原文链接

关键字 easy.window 写了一个window 不过还没写全,只是一个结构
推荐.NET配套的通用数据层ORM框架：CYQ.Data 通用数据层框架