git.ithinksw.org / extjs.git / blobdiff
? search:
summary | shortlog | log | commit | commitdiff | tree
raw | inline | side by side
Upgrade to ExtJS 4.0.0 - Released 04/26/2011
[extjs.git] / docs / source / StatusProxy.html
diff --git a/docs/source/StatusProxy.html b/docs/source/StatusProxy.html
index 57bfc7e..cb8d83e 100644 (file)
--- a/docs/source/StatusProxy.html
+++ b/docs/source/StatusProxy.html
@@ -1,88 +1,81 @@
-<html>
-<head>
-  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />    
-  <title>The source code</title>
-    <link href="../resources/prettify/prettify.css" type="text/css" rel="stylesheet" />
-    <script type="text/javascript" src="../resources/prettify/prettify.js"></script>
-</head>
-<body  onload="prettyPrint();">
-    <pre class="prettyprint lang-js">/*!
- * Ext JS Library 3.3.0
- * Copyright(c) 2006-2010 Ext JS, Inc.
- * licensing@extjs.com
- * http://www.extjs.com/license
- */
-<div id="cls-Ext.dd.StatusProxy"></div>/**
- * @class Ext.dd.StatusProxy
+<!DOCTYPE html><html><head><title>Sencha Documentation Project</title><link rel="stylesheet" href="../reset.css" type="text/css"><link rel="stylesheet" href="../prettify.css" type="text/css"><link rel="stylesheet" href="../prettify_sa.css" type="text/css"><script type="text/javascript" src="../prettify.js"></script></head><body onload="prettyPrint()"><pre class="prettyprint"><pre><span id='Ext-dd.StatusProxy-method-constructor'><span id='Ext-dd.StatusProxy'>/**
+</span></span> * @class Ext.dd.StatusProxy
  * A specialized drag proxy that supports a drop status icon, {@link Ext.Layer} styles and auto-repair.  This is the
  * default drag proxy used by all Ext.dd components.
  * @constructor
  * @param {Object} config
  */
  * A specialized drag proxy that supports a drop status icon, {@link Ext.Layer} styles and auto-repair.  This is the
  * default drag proxy used by all Ext.dd components.
  * @constructor
  * @param {Object} config
  */
-Ext.dd.StatusProxy = function(config){
-    Ext.apply(this, config);
-    this.id = this.id || Ext.id();
-    this.el = new Ext.Layer({
-        dh: {
-            id: this.id, tag: "div", cls: "x-dd-drag-proxy "+this.dropNotAllowed, children: [
-                {tag: "div", cls: "x-dd-drop-icon"},
-                {tag: "div", cls: "x-dd-drag-ghost"}
-            ]
-        }, 
-        shadow: !config || config.shadow !== false
-    });
-    this.ghost = Ext.get(this.el.dom.childNodes[1]);
-    this.dropStatus = this.dropNotAllowed;
-};
+Ext.define('Ext.dd.StatusProxy', {
+    animRepair: false,
+
+    constructor: function(config){
+        Ext.apply(this, config);
+        this.id = this.id || Ext.id();
+        this.proxy = Ext.createWidget('component', {
+            floating: true,
+            id: this.id,
+            html: '&lt;div class=&quot;' + Ext.baseCSSPrefix + 'dd-drop-icon&quot;&gt;&lt;/div&gt;' +
+                  '&lt;div class=&quot;' + Ext.baseCSSPrefix + 'dd-drag-ghost&quot;&gt;&lt;/div&gt;',
+            cls: Ext.baseCSSPrefix + 'dd-drag-proxy ' + this.dropNotAllowed,
+            shadow: !config || config.shadow !== false,
+            renderTo: document.body
+        });
+
+        this.el = this.proxy.el;
+        this.el.show();
+        this.el.setVisibilityMode(Ext.core.Element.VISIBILITY);
+        this.el.hide();
 
 
-Ext.dd.StatusProxy.prototype = {
-    <div id="cfg-Ext.dd.StatusProxy-dropAllowed"></div>/**
-     * @cfg {String} dropAllowed
-     * The CSS class to apply to the status element when drop is allowed (defaults to "x-dd-drop-ok").
+        this.ghost = Ext.get(this.el.dom.childNodes[1]);
+        this.dropStatus = this.dropNotAllowed;
+    },
+<span id='Ext-dd.StatusProxy-cfg-dropAllowed'>    /**
+</span>     * @cfg {String} dropAllowed
+     * The CSS class to apply to the status element when drop is allowed (defaults to &quot;x-dd-drop-ok&quot;).
      */
      */
-    dropAllowed : "x-dd-drop-ok",
-    <div id="cfg-Ext.dd.StatusProxy-dropNotAllowed"></div>/**
-     * @cfg {String} dropNotAllowed
-     * The CSS class to apply to the status element when drop is not allowed (defaults to "x-dd-drop-nodrop").
+    dropAllowed : Ext.baseCSSPrefix + 'dd-drop-ok',
+<span id='Ext-dd.StatusProxy-cfg-dropNotAllowed'>    /**
+</span>     * @cfg {String} dropNotAllowed
+     * The CSS class to apply to the status element when drop is not allowed (defaults to &quot;x-dd-drop-nodrop&quot;).
      */
      */
-    dropNotAllowed : "x-dd-drop-nodrop",
+    dropNotAllowed : Ext.baseCSSPrefix + 'dd-drop-nodrop',
 
 
-    <div id="method-Ext.dd.StatusProxy-setStatus"></div>/**
-     * Updates the proxy's visual element to indicate the status of whether or not drop is allowed
+<span id='Ext-dd.StatusProxy-method-setStatus'>    /**
+</span>     * Updates the proxy's visual element to indicate the status of whether or not drop is allowed
      * over the current target element.
      * @param {String} cssClass The css class for the new drop status indicator image
      */
     setStatus : function(cssClass){
         cssClass = cssClass || this.dropNotAllowed;
         if(this.dropStatus != cssClass){
      * over the current target element.
      * @param {String} cssClass The css class for the new drop status indicator image
      */
     setStatus : function(cssClass){
         cssClass = cssClass || this.dropNotAllowed;
         if(this.dropStatus != cssClass){
-            this.el.replaceClass(this.dropStatus, cssClass);
+            this.el.replaceCls(this.dropStatus, cssClass);
             this.dropStatus = cssClass;
         }
     },
 
             this.dropStatus = cssClass;
         }
     },
 
-    <div id="method-Ext.dd.StatusProxy-reset"></div>/**
-     * Resets the status indicator to the default dropNotAllowed value
+<span id='Ext-dd.StatusProxy-method-reset'>    /**
+</span>     * Resets the status indicator to the default dropNotAllowed value
      * @param {Boolean} clearGhost True to also remove all content from the ghost, false to preserve it
      */
     reset : function(clearGhost){
      * @param {Boolean} clearGhost True to also remove all content from the ghost, false to preserve it
      */
     reset : function(clearGhost){
-        this.el.dom.className = "x-dd-drag-proxy " + this.dropNotAllowed;
+        this.el.dom.className = Ext.baseCSSPrefix + 'dd-drag-proxy ' + this.dropNotAllowed;
         this.dropStatus = this.dropNotAllowed;
         if(clearGhost){
         this.dropStatus = this.dropNotAllowed;
         if(clearGhost){
-            this.ghost.update("");
+            this.ghost.update(&quot;&quot;);
         }
     },
 
         }
     },
 
-    <div id="method-Ext.dd.StatusProxy-update"></div>/**
-     * Updates the contents of the ghost element
+<span id='Ext-dd.StatusProxy-method-update'>    /**
+</span>     * Updates the contents of the ghost element
      * @param {String/HTMLElement} html The html that will replace the current innerHTML of the ghost element, or a
      * DOM node to append as the child of the ghost element (in which case the innerHTML will be cleared first).
      */
     update : function(html){
      * @param {String/HTMLElement} html The html that will replace the current innerHTML of the ghost element, or a
      * DOM node to append as the child of the ghost element (in which case the innerHTML will be cleared first).
      */
     update : function(html){
-        if(typeof html == "string"){
+        if(typeof html == &quot;string&quot;){
             this.ghost.update(html);
         }else{
             this.ghost.update(html);
         }else{
-            this.ghost.update("");
-            html.style.margin = "0";
+            this.ghost.update(&quot;&quot;);
+            html.style.margin = &quot;0&quot;;
             this.ghost.dom.appendChild(html);
         }
         var el = this.ghost.dom.firstChild; 
             this.ghost.dom.appendChild(html);
         }
         var el = this.ghost.dom.firstChild; 
@@ -91,78 +84,82 @@ Ext.dd.StatusProxy.prototype = {
         }
     },
 
         }
     },
 
-    <div id="method-Ext.dd.StatusProxy-getEl"></div>/**
-     * Returns the underlying proxy {@link Ext.Layer}
+<span id='Ext-dd.StatusProxy-method-getEl'>    /**
+</span>     * Returns the underlying proxy {@link Ext.Layer}
      * @return {Ext.Layer} el
     */
     getEl : function(){
         return this.el;
     },
 
      * @return {Ext.Layer} el
     */
     getEl : function(){
         return this.el;
     },
 
-    <div id="method-Ext.dd.StatusProxy-getGhost"></div>/**
-     * Returns the ghost element
-     * @return {Ext.Element} el
+<span id='Ext-dd.StatusProxy-method-getGhost'>    /**
+</span>     * Returns the ghost element
+     * @return {Ext.core.Element} el
      */
     getGhost : function(){
         return this.ghost;
     },
 
      */
     getGhost : function(){
         return this.ghost;
     },
 
-    <div id="method-Ext.dd.StatusProxy-hide"></div>/**
-     * Hides the proxy
+<span id='Ext-dd.StatusProxy-method-hide'>    /**
+</span>     * Hides the proxy
      * @param {Boolean} clear True to reset the status and clear the ghost contents, false to preserve them
      */
      * @param {Boolean} clear True to reset the status and clear the ghost contents, false to preserve them
      */
-    hide : function(clear){
-        this.el.hide();
-        if(clear){
+    hide : function(clear) {
+        this.proxy.hide();
+        if (clear) {
             this.reset(true);
         }
     },
 
             this.reset(true);
         }
     },
 
-    <div id="method-Ext.dd.StatusProxy-stop"></div>/**
-     * Stops the repair animation if it's currently running
+<span id='Ext-dd.StatusProxy-method-stop'>    /**
+</span>     * Stops the repair animation if it's currently running
      */
     stop : function(){
      */
     stop : function(){
-        if(this.anim && this.anim.isAnimated && this.anim.isAnimated()){
+        if(this.anim &amp;&amp; this.anim.isAnimated &amp;&amp; this.anim.isAnimated()){
             this.anim.stop();
         }
     },
 
             this.anim.stop();
         }
     },
 
-    <div id="method-Ext.dd.StatusProxy-show"></div>/**
-     * Displays this proxy
+<span id='Ext-dd.StatusProxy-method-show'>    /**
+</span>     * Displays this proxy
      */
      */
-    show : function(){
-        this.el.show();
+    show : function() {
+        this.proxy.show();
+        this.proxy.toFront();
     },
 
     },
 
-    <div id="method-Ext.dd.StatusProxy-sync"></div>/**
-     * Force the Layer to sync its shadow and shim positions to the element
+<span id='Ext-dd.StatusProxy-method-sync'>    /**
+</span>     * Force the Layer to sync its shadow and shim positions to the element
      */
     sync : function(){
      */
     sync : function(){
-        this.el.sync();
+        this.proxy.el.sync();
     },
 
     },
 
-    <div id="method-Ext.dd.StatusProxy-repair"></div>/**
-     * Causes the proxy to return to its position of origin via an animation.  Should be called after an
+<span id='Ext-dd.StatusProxy-method-repair'>    /**
+</span>     * Causes the proxy to return to its position of origin via an animation.  Should be called after an
      * invalid drop operation by the item being dragged.
      * @param {Array} xy The XY position of the element ([x, y])
      * @param {Function} callback The function to call after the repair is complete.
      * invalid drop operation by the item being dragged.
      * @param {Array} xy The XY position of the element ([x, y])
      * @param {Function} callback The function to call after the repair is complete.
-     * @param {Object} scope The scope (<code>this</code> reference) in which the callback function is executed. Defaults to the browser window.
+     * @param {Object} scope The scope (&lt;code&gt;this&lt;/code&gt; reference) in which the callback function is executed. Defaults to the browser window.
      */
     repair : function(xy, callback, scope){
         this.callback = callback;
         this.scope = scope;
      */
     repair : function(xy, callback, scope){
         this.callback = callback;
         this.scope = scope;
-        if(xy && this.animRepair !== false){
-            this.el.addClass("x-dd-drag-repair");
+        if (xy &amp;&amp; this.animRepair !== false) {
+            this.el.addCls(Ext.baseCSSPrefix + 'dd-drag-repair');
             this.el.hideUnders(true);
             this.el.hideUnders(true);
-            this.anim = this.el.shift({
-                duration: this.repairDuration || .5,
-                easing: 'easeOut',
-                xy: xy,
-                stopFx: true,
+            this.anim = this.el.animate({
+                duration: this.repairDuration || 500,
+                easing: 'ease-out',
+                to: {
+                    x: xy[0],
+                    y: xy[1]
+                },
+                stopAnimation: true,
                 callback: this.afterRepair,
                 scope: this
             });
                 callback: this.afterRepair,
                 scope: this
             });
-        }else{
+        } else {
             this.afterRepair();
         }
     },
             this.afterRepair();
         }
     },
@@ -170,16 +167,14 @@ Ext.dd.StatusProxy.prototype = {
     // private
     afterRepair : function(){
         this.hide(true);
     // private
     afterRepair : function(){
         this.hide(true);
-        if(typeof this.callback == "function"){
+        if(typeof this.callback == &quot;function&quot;){
             this.callback.call(this.scope || this);
         }
         this.callback = null;
         this.scope = null;
     },
             this.callback.call(this.scope || this);
         }
         this.callback = null;
         this.scope = null;
     },
-    
+
     destroy: function(){
     destroy: function(){
-        Ext.destroy(this.ghost, this.el);    
+        Ext.destroy(this.ghost, this.proxy, this.el);
     }
     }
-};</pre>    
-</body>
-</html>
\ No newline at end of file
+});</pre></pre></body></html>
\ No newline at end of file
Mirror of ExtJS by Sencha Inc. <http://www.sencha.com/>.