| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138 | <!DOCTYPE html><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>  <style type="text/css">    .highlight { display: block; background-color: #ddd; }  </style>  <script type="text/javascript">    function highlight() {      document.getElementById(location.hash.replace(/#/, "")).className = "highlight";    }  </script></head><body onload="prettyPrint(); highlight();">  <pre class="prettyprint lang-js"><span id='Ext-fx-target-Component'>/**</span> * @class Ext.fx.target.Component *  * This class represents a animation target for a {@link Ext.Component}. In general this class will not be * created directly, the {@link Ext.Component} will be passed to the animation and * and the appropriate target will be created. */Ext.define('Ext.fx.target.Component', {    /* Begin Definitions */       extend: 'Ext.fx.target.Target',        /* End Definitions */    type: 'component',    // Methods to call to retrieve unspecified "from" values from a target Component    getPropMethod: {        top: function() {            return this.getPosition(true)[1];        },        left: function() {            return this.getPosition(true)[0];        },        x: function() {            return this.getPosition()[0];        },        y: function() {            return this.getPosition()[1];        },        height: function() {            return this.getHeight();        },        width: function() {            return this.getWidth();        },        opacity: function() {            return this.el.getStyle('opacity');        }    },    compMethod: {        top: 'setPosition',        left: 'setPosition',        x: 'setPagePosition',        y: 'setPagePosition',        height: 'setSize',        width: 'setSize',        opacity: 'setOpacity'    },    // Read the named attribute from the target Component. Use the defined getter for the attribute    getAttr: function(attr, val) {        return [[this.target, val !== undefined ? val : this.getPropMethod[attr].call(this.target)]];    },    setAttr: function(targetData, isFirstFrame, isLastFrame) {        var me = this,            target = me.target,            ln = targetData.length,            attrs, attr, o, i, j, meth, targets, left, top, w, h;        for (i = 0; i < ln; i++) {            attrs = targetData[i].attrs;            for (attr in attrs) {                targets = attrs[attr].length;                meth = {                    setPosition: {},                    setPagePosition: {},                    setSize: {},                    setOpacity: {}                };                for (j = 0; j < targets; j++) {                    o = attrs[attr][j];                    // We REALLY want a single function call, so push these down to merge them: eg                    // meth.setPagePosition.target = <targetComponent>                    // meth.setPagePosition['x'] = 100                    // meth.setPagePosition['y'] = 100                    meth[me.compMethod[attr]].target = o[0];                    meth[me.compMethod[attr]][attr] = o[1];                }                if (meth.setPosition.target) {                    o = meth.setPosition;                    left = (o.left === undefined) ? undefined : parseFloat(o.left);                    top = (o.top === undefined) ? undefined : parseFloat(o.top);                    o.target.setPosition(left, top);                }                if (meth.setPagePosition.target) {                    o = meth.setPagePosition;                    o.target.setPagePosition(o.x, o.y);                }                if (meth.setSize.target) {                    o = meth.setSize;                    // Dimensions not being animated MUST NOT be autosized. They must remain at current value.                    w = (o.width === undefined) ? o.target.getWidth() : parseFloat(o.width);                    h = (o.height === undefined) ? o.target.getHeight() : parseFloat(o.height);                    // Only set the size of the Component on the last frame, or if the animation was                    // configured with dynamic: true.                    // In other cases, we just set the target element size.                    // This will result in either clipping if animating a reduction in size, or the revealing of                    // the inner elements of the Component if animating an increase in size.                    // Component's animate function initially resizes to the larger size before resizing the                    // outer element to clip the contents.                    if (isLastFrame || me.dynamic) {                        o.target.setSize(w, h);                    } else {                        o.target.el.setSize(w, h);                    }                }                if (meth.setOpacity.target) {                    o = meth.setOpacity;                    o.target.el.setStyle('opacity', o.opacity);                }            }        }    }});</pre></body></html>
 |