source: trunk/web/addons/job_monarch/lib/extjs/source/dd/StatusProxy.js @ 619

Last change on this file since 619 was 619, checked in by ramonb, 15 years ago

lib/:

  • added new AJAX dependancies: ExtJS, pChart, Lightbox2
File size: 5.2 KB
Line 
1/*
2 * Ext JS Library 2.2.1
3 * Copyright(c) 2006-2009, Ext JS, LLC.
4 * licensing@extjs.com
5 *
6 * http://extjs.com/license
7 */
8
9/**
10 * @class Ext.dd.StatusProxy
11 * A specialized drag proxy that supports a drop status icon, {@link Ext.Layer} styles and auto-repair.  This is the
12 * default drag proxy used by all Ext.dd components.
13 * @constructor
14 * @param {Object} config
15 */
16Ext.dd.StatusProxy = function(config){
17    Ext.apply(this, config);
18    this.id = this.id || Ext.id();
19    this.el = new Ext.Layer({
20        dh: {
21            id: this.id, tag: "div", cls: "x-dd-drag-proxy "+this.dropNotAllowed, children: [
22                {tag: "div", cls: "x-dd-drop-icon"},
23                {tag: "div", cls: "x-dd-drag-ghost"}
24            ]
25        }, 
26        shadow: !config || config.shadow !== false
27    });
28    this.ghost = Ext.get(this.el.dom.childNodes[1]);
29    this.dropStatus = this.dropNotAllowed;
30};
31
32Ext.dd.StatusProxy.prototype = {
33    /**
34     * @cfg {String} dropAllowed
35     * The CSS class to apply to the status element when drop is allowed (defaults to "x-dd-drop-ok").
36     */
37    dropAllowed : "x-dd-drop-ok",
38    /**
39     * @cfg {String} dropNotAllowed
40     * The CSS class to apply to the status element when drop is not allowed (defaults to "x-dd-drop-nodrop").
41     */
42    dropNotAllowed : "x-dd-drop-nodrop",
43
44    /**
45     * Updates the proxy's visual element to indicate the status of whether or not drop is allowed
46     * over the current target element.
47     * @param {String} cssClass The css class for the new drop status indicator image
48     */
49    setStatus : function(cssClass){
50        cssClass = cssClass || this.dropNotAllowed;
51        if(this.dropStatus != cssClass){
52            this.el.replaceClass(this.dropStatus, cssClass);
53            this.dropStatus = cssClass;
54        }
55    },
56
57    /**
58     * Resets the status indicator to the default dropNotAllowed value
59     * @param {Boolean} clearGhost True to also remove all content from the ghost, false to preserve it
60     */
61    reset : function(clearGhost){
62        this.el.dom.className = "x-dd-drag-proxy " + this.dropNotAllowed;
63        this.dropStatus = this.dropNotAllowed;
64        if(clearGhost){
65            this.ghost.update("");
66        }
67    },
68
69    /**
70     * Updates the contents of the ghost element
71     * @param {String/HTMLElement} html The html that will replace the current innerHTML of the ghost element, or a
72     * DOM node to append as the child of the ghost element (in which case the innerHTML will be cleared first).
73     */
74    update : function(html){
75        if(typeof html == "string"){
76            this.ghost.update(html);
77        }else{
78            this.ghost.update("");
79            html.style.margin = "0";
80            this.ghost.dom.appendChild(html);
81        }
82        var el = this.ghost.dom.firstChild; 
83        if(el){
84            Ext.fly(el).setStyle(Ext.isIE ? 'styleFloat' : 'cssFloat', 'none');
85        }
86    },
87
88    /**
89     * Returns the underlying proxy {@link Ext.Layer}
90     * @return {Ext.Layer} el
91    */
92    getEl : function(){
93        return this.el;
94    },
95
96    /**
97     * Returns the ghost element
98     * @return {Ext.Element} el
99     */
100    getGhost : function(){
101        return this.ghost;
102    },
103
104    /**
105     * Hides the proxy
106     * @param {Boolean} clear True to reset the status and clear the ghost contents, false to preserve them
107     */
108    hide : function(clear){
109        this.el.hide();
110        if(clear){
111            this.reset(true);
112        }
113    },
114
115    /**
116     * Stops the repair animation if it's currently running
117     */
118    stop : function(){
119        if(this.anim && this.anim.isAnimated && this.anim.isAnimated()){
120            this.anim.stop();
121        }
122    },
123
124    /**
125     * Displays this proxy
126     */
127    show : function(){
128        this.el.show();
129    },
130
131    /**
132     * Force the Layer to sync its shadow and shim positions to the element
133     */
134    sync : function(){
135        this.el.sync();
136    },
137
138    /**
139     * Causes the proxy to return to its position of origin via an animation.  Should be called after an
140     * invalid drop operation by the item being dragged.
141     * @param {Array} xy The XY position of the element ([x, y])
142     * @param {Function} callback The function to call after the repair is complete
143     * @param {Object} scope The scope in which to execute the callback
144     */
145    repair : function(xy, callback, scope){
146        this.callback = callback;
147        this.scope = scope;
148        if(xy && this.animRepair !== false){
149            this.el.addClass("x-dd-drag-repair");
150            this.el.hideUnders(true);
151            this.anim = this.el.shift({
152                duration: this.repairDuration || .5,
153                easing: 'easeOut',
154                xy: xy,
155                stopFx: true,
156                callback: this.afterRepair,
157                scope: this
158            });
159        }else{
160            this.afterRepair();
161        }
162    },
163
164    // private
165    afterRepair : function(){
166        this.hide(true);
167        if(typeof this.callback == "function"){
168            this.callback.call(this.scope || this);
169        }
170        this.callback = null;
171        this.scope = null;
172    }
173};
Note: See TracBrowser for help on using the repository browser.