extjs-rails 4.1.0.alpha1

data/app/assets/javascripts/extjs-rails/src/picker/Time.js

@@ -0,0 +1,165 @@
+/**
+ * A time picker which provides a list of times from which to choose. This is used by the Ext.form.field.Time
+ * class to allow browsing and selection of valid times, but could also be used with other components.
+ *
+ * By default, all times starting at midnight and incrementing every 15 minutes will be presented. This list of
+ * available times can be controlled using the {@link #minValue}, {@link #maxValue}, and {@link #increment}
+ * configuration properties. The format of the times presented in the list can be customized with the {@link #format}
+ * config.
+ *
+ * To handle when the user selects a time from the list, you can subscribe to the {@link #selectionchange} event.
+ *
+ *     @example
+ *     Ext.create('Ext.picker.Time', {
+ *        width: 60,
+ *        minValue: Ext.Date.parse('04:30:00 AM', 'h:i:s A'),
+ *        maxValue: Ext.Date.parse('08:00:00 AM', 'h:i:s A'),
+ *        renderTo: Ext.getBody()
+ *     });
+ */
+Ext.define('Ext.picker.Time', {
+    extend: 'Ext.view.BoundList',
+    alias: 'widget.timepicker',
+    requires: ['Ext.data.Store', 'Ext.Date'],
+
+    /**
+     * @cfg {Date} minValue
+     * The minimum time to be shown in the list of times. This must be a Date object (only the time fields will be
+     * used); no parsing of String values will be done.
+     */
+
+    /**
+     * @cfg {Date} maxValue
+     * The maximum time to be shown in the list of times. This must be a Date object (only the time fields will be
+     * used); no parsing of String values will be done.
+     */
+
+    /**
+     * @cfg {Number} increment
+     * The number of minutes between each time value in the list.
+     */
+    increment: 15,
+
+    /**
+     * @cfg {String} [format=undefined]
+     * The default time format string which can be overriden for localization support. The format must be valid
+     * according to {@link Ext.Date#parse}.
+     *
+     * Defaults to `'g:i A'`, e.g., `'3:15 PM'`. For 24-hour time format try `'H:i'` instead.
+     */
+    //<locale>
+    format : "g:i A",
+    //</locale>
+
+    /**
+     * @private
+     * The field in the implicitly-generated Model objects that gets displayed in the list. This is
+     * an internal field name only and is not useful to change via config.
+     */
+    displayField: 'disp',
+
+    /**
+     * @private
+     * Year, month, and day that all times will be normalized into internally.
+     */
+    initDate: [2008,0,1],
+
+    componentCls: Ext.baseCSSPrefix + 'timepicker',
+
+    /**
+     * @cfg
+     * @private
+     */
+    loadMask: false,
+
+    initComponent: function() {
+        var me = this,
+            dateUtil = Ext.Date,
+            clearTime = dateUtil.clearTime,
+            initDate = me.initDate;
+
+        // Set up absolute min and max for the entire day
+        me.absMin = clearTime(new Date(initDate[0], initDate[1], initDate[2]));
+        me.absMax = dateUtil.add(clearTime(new Date(initDate[0], initDate[1], initDate[2])), 'mi', (24 * 60) - 1);
+
+        me.store = me.createStore();
+        me.updateList();
+
+        me.callParent();
+    },
+
+    /**
+     * Set the {@link #minValue} and update the list of available times. This must be a Date object (only the time
+     * fields will be used); no parsing of String values will be done.
+     * @param {Date} value
+     */
+    setMinValue: function(value) {
+        this.minValue = value;
+        this.updateList();
+    },
+
+    /**
+     * Set the {@link #maxValue} and update the list of available times. This must be a Date object (only the time
+     * fields will be used); no parsing of String values will be done.
+     * @param {Date} value
+     */
+    setMaxValue: function(value) {
+        this.maxValue = value;
+        this.updateList();
+    },
+
+    /**
+     * @private
+     * Sets the year/month/day of the given Date object to the {@link #initDate}, so that only
+     * the time fields are significant. This makes values suitable for time comparison.
+     * @param {Date} date
+     */
+    normalizeDate: function(date) {
+        var initDate = this.initDate;
+        date.setFullYear(initDate[0], initDate[1], initDate[2]);
+        return date;
+    },
+
+    /**
+     * Update the list of available times in the list to be constrained within the {@link #minValue}
+     * and {@link #maxValue}.
+     */
+    updateList: function() {
+        var me = this,
+            min = me.normalizeDate(me.minValue || me.absMin),
+            max = me.normalizeDate(me.maxValue || me.absMax);
+
+        me.store.filterBy(function(record) {
+            var date = record.get('date');
+            return date >= min && date <= max;
+        });
+    },
+
+    /**
+     * @private
+     * Creates the internal {@link Ext.data.Store} that contains the available times. The store
+     * is loaded with all possible times, and it is later filtered to hide those times outside
+     * the minValue/maxValue.
+     */
+    createStore: function() {
+        var me = this,
+            utilDate = Ext.Date,
+            times = [],
+            min = me.absMin,
+            max = me.absMax;
+
+        while(min <= max){
+            times.push({
+                disp: utilDate.dateFormat(min, me.format),
+                date: min
+            });
+            min = utilDate.add(min, 'mi', me.increment);
+        }
+
+        return new Ext.data.Store({
+            fields: ['disp', 'date'],
+            data: times
+        });
+    }
+
+});

data/app/assets/javascripts/extjs-rails/src/resizer/BorderSplitter.js

@@ -0,0 +1,22 @@
+/**
+ * Private utility class for Ext.layout.container.Border.
+ * @private
+ */
+Ext.define('Ext.resizer.BorderSplitter', {
+    extend: 'Ext.resizer.Splitter',
+
+    uses: ['Ext.resizer.BorderSplitterTracker'],
+
+    alias: 'widget.bordersplitter',
+
+    // must be configured in by the border layout:
+    collapseTarget: null,
+
+    getTrackerConfig: function () {
+        var trackerConfig = this.callParent();
+
+        trackerConfig.xclass = 'Ext.resizer.BorderSplitterTracker';
+
+        return trackerConfig;
+    }
+});

data/app/assets/javascripts/extjs-rails/src/resizer/BorderSplitterTracker.js

@@ -0,0 +1,210 @@
+/**
+ * Private utility class for Ext.BorderSplitter.
+ * @private
+ */
+Ext.define('Ext.resizer.BorderSplitterTracker', {
+    extend: 'Ext.resizer.SplitterTracker',
+    requires: ['Ext.util.Region'],
+
+    getPrevCmp: null,
+    getNextCmp: null,
+
+    // calculate the constrain Region in which the splitter el may be moved.
+    calculateConstrainRegion: function() {
+        var me = this,
+            splitter = me.splitter,
+            collapseTarget = splitter.collapseTarget,
+            defaultSplitMin = splitter.defaultSplitMin,
+            sizePropCap = splitter.vertical ? 'Width' : 'Height',
+            minSizeProp = 'min' + sizePropCap,
+            maxSizeProp = 'max' + sizePropCap,
+            getSizeMethod = 'get' + sizePropCap,
+            neighbors = splitter.neighbors,
+            length = neighbors.length,
+            box = collapseTarget.el.getBox(),
+            left = box.x,
+            top = box.y,
+            right = box.right,
+            bottom = box.bottom,
+            size = splitter.vertical ? (right - left) : (bottom - top),
+            //neighborSizes = [],
+            i, neighbor, minRange, maxRange, maxGrowth, maxShrink, targetSize;
+
+        // if size=100 and minSize=80, we can reduce by 20 so minRange = minSize-size = -20
+        minRange = (collapseTarget[minSizeProp] || Math.min(size,defaultSplitMin)) - size;
+
+        // if maxSize=150, maxRange = maxSize - size = 50
+        maxRange = collapseTarget[maxSizeProp];
+        if (!maxRange) {
+            maxRange = 1e9;
+        } else {
+            maxRange -= size;
+        }
+        targetSize = size;
+
+        for (i = 0; i < length; ++i) {
+            neighbor = neighbors[i];
+            size = neighbor[getSizeMethod]();
+            //neighborSizes.push(size);
+
+            maxGrowth = size - neighbor[maxSizeProp]; // NaN if no maxSize or negative
+            maxShrink = size - (neighbor[minSizeProp] || Math.min(size,defaultSplitMin));
+
+            if (!isNaN(maxGrowth)) {
+                // if neighbor can only grow by 10 (maxGrowth = -10), minRange cannot be
+                // -20 anymore, but now only -10:
+                if (minRange < maxGrowth) {
+                    minRange = maxGrowth;
+                }
+            }
+
+            // if neighbor can shrink by 20 (maxShrink=20), maxRange cannot be 50 anymore,
+            // but now only 20:
+            if (maxRange > maxShrink) {
+                maxRange = maxShrink;
+            }
+        }
+
+        if (maxRange - minRange < 2) {
+            return null;
+        }
+
+        box = new Ext.util.Region(top, right, bottom, left);
+
+        me.constraintAdjusters[splitter.collapseDirection](box, minRange, maxRange, splitter);
+
+        me.dragInfo = {
+            minRange: minRange,
+            maxRange: maxRange,
+            //neighborSizes: neighborSizes,
+            targetSize: targetSize
+        };
+
+        return box;
+    },
+
+    constraintAdjusters: {
+        // splitter is to the right of the box
+        left: function (box, minRange, maxRange, splitter) {
+            box[0] = box.x = box.left = box.right + minRange;
+            box.right += maxRange + splitter.getWidth();
+        },
+
+        // splitter is below the box
+        top: function (box, minRange, maxRange, splitter) {
+            box[1] = box.y = box.top = box.bottom + minRange;
+            box.bottom += maxRange + splitter.getHeight();
+        },
+
+        // splitter is above the box
+        bottom: function (box, minRange, maxRange, splitter) {
+            box.bottom = box.top - minRange;
+            box.top -= maxRange + splitter.getHeight();
+        },
+
+        // splitter is to the left of the box
+        right: function (box, minRange, maxRange, splitter) {
+            box.right = box.left - minRange;
+            box.left -= maxRange + splitter.getWidth();
+        }
+    },
+
+    onBeforeStart: function(e) {
+        var me = this,
+            splitter = me.splitter,
+            collapseTarget = splitter.collapseTarget,
+            neighbors = splitter.neighbors,
+            collapseEl = me.getSplitter().collapseEl,
+            target = e.getTarget(),
+            length = neighbors.length,
+            i, neighbor;
+            
+        if (collapseEl && target === splitter.collapseEl.dom) {
+            return false;
+        }
+
+        if (collapseTarget.collapsed) {
+            return false;
+        }
+
+        // disabled if any neighbors are collapsed in parallel direction.
+        for (i = 0; i < length; ++i) {
+            neighbor = neighbors[i];
+
+            if (neighbor.collapsed && neighbor.isHorz === collapseTarget.isHorz) {
+                return false;
+            }
+        }
+
+        if (!(me.constrainTo = me.calculateConstrainRegion())) {
+            return false;
+        }
+
+        me.createDragOverlay();
+        return true;
+    },
+
+    performResize: function(e, offset) {
+        var me = this,
+            splitter = me.splitter,
+            collapseDirection = splitter.collapseDirection,
+            collapseTarget = splitter.collapseTarget,
+            // a vertical splitter adjusts horizontal dimensions
+            adjusters = me.splitAdjusters[splitter.vertical ? 'horz' : 'vert'],
+            delta = offset[adjusters.index],
+            dragInfo = me.dragInfo,
+            //neighbors = splitter.neighbors,
+            //length = neighbors.length,
+            //neighborSizes = dragInfo.neighborSizes,
+            //isVert = collapseTarget.isVert,
+            //i, neighbor,
+            owner;
+
+        if (collapseDirection == 'right' || collapseDirection == 'bottom') {
+            // these splitters grow by moving left/up, so flip the sign of delta...
+            delta = -delta;
+        }
+
+        // now constrain delta to our computed range:
+        delta = Math.min(Math.max(dragInfo.minRange, delta), dragInfo.maxRange);
+
+        if (delta) {
+            (owner = splitter.ownerCt).suspendLayouts();
+
+            adjusters.adjustTarget(collapseTarget, dragInfo.targetSize, delta);
+
+            //for (i = 0; i < length; ++i) {
+            //    neighbor = neighbors[i];
+            //    if (!neighbor.isCenter && !neighbor.maintainFlex && neighbor.isVert == isVert) {
+            //        delete neighbor.flex;
+            //        adjusters.adjustNeighbor(neighbor, neighborSizes[i], delta);
+            //    }
+            //}
+
+            owner.resumeLayouts(true);
+        }
+    },
+
+    splitAdjusters: {
+        horz: {
+            index: 0,
+            //adjustNeighbor: function (neighbor, size, delta) {
+            //    neighbor.setSize(size - delta);
+            //},
+            adjustTarget: function (target, size, delta) {
+                target.flex = null;
+                target.setSize(size + delta);
+            }
+        },
+        vert: {
+            index: 1,
+            //adjustNeighbor: function (neighbor, size, delta) {
+            //    neighbor.setSize(undefined, size - delta);
+            //},
+            adjustTarget: function (target, targetSize, delta) {
+                target.flex = null;
+                target.setSize(undefined, targetSize + delta);
+            }
+        }
+    }
+});

data/app/assets/javascripts/extjs-rails/src/resizer/Handle.js

@@ -0,0 +1,29 @@
+/**
+ * Provides a handle for 9-point resizing of Elements or Components.
+ */
+Ext.define('Ext.resizer.Handle', {
+    extend: 'Ext.Component',
+    handleCls: '',
+    baseHandleCls: Ext.baseCSSPrefix + 'resizable-handle',
+    // Ext.resizer.Resizer.prototype.possiblePositions define the regions
+    // which will be passed in as a region configuration.
+    region: '',
+
+    beforeRender: function() {
+        var me = this;
+
+        me.callParent();
+
+        me.addCls(
+            me.baseHandleCls,
+            me.baseHandleCls + '-' + me.region,
+            me.handleCls
+        );
+    },
+
+    onRender: function() {
+        this.callParent(arguments);
+
+        this.el.unselectable();
+    }
+});

data/app/assets/javascripts/extjs-rails/src/resizer/ResizeTracker.js

@@ -0,0 +1,346 @@
+/**
+ * Private utility class for Ext.resizer.Resizer.
+ * @private
+ */
+Ext.define('Ext.resizer.ResizeTracker', {
+    extend: 'Ext.dd.DragTracker',
+    dynamic: true,
+    preserveRatio: false,
+
+    // Default to no constraint
+    constrainTo: null,
+    
+    proxyCls:  Ext.baseCSSPrefix + 'resizable-proxy',
+
+    constructor: function(config) {
+        var me = this,
+            widthRatio, heightRatio,
+            throttledResizeFn;
+
+        if (!config.el) {
+            if (config.target.isComponent) {
+                me.el = config.target.getEl();
+            } else {
+                me.el = config.target;
+            }
+        }
+        this.callParent(arguments);
+
+        // Ensure that if we are preserving aspect ratio, the largest minimum is honoured
+        if (me.preserveRatio && me.minWidth && me.minHeight) {
+            widthRatio = me.minWidth / me.el.getWidth();
+            heightRatio = me.minHeight / me.el.getHeight();
+
+            // largest ratio of minimum:size must be preserved.
+            // So if a 400x200 pixel image has
+            // minWidth: 50, maxWidth: 50, the maxWidth will be 400 * (50/200)... that is 100
+            if (heightRatio > widthRatio) {
+                me.minWidth = me.el.getWidth() * heightRatio;
+            } else {
+                me.minHeight = me.el.getHeight() * widthRatio;
+            }
+        }
+
+        // If configured as throttled, create an instance version of resize which calls
+        // a throttled function to perform the resize operation.
+        if (me.throttle) {
+            throttledResizeFn = Ext.Function.createThrottled(function() {
+                    Ext.resizer.ResizeTracker.prototype.resize.apply(me, arguments);
+                }, me.throttle);
+
+            me.resize = function(box, direction, atEnd) {
+                if (atEnd) {
+                    Ext.resizer.ResizeTracker.prototype.resize.apply(me, arguments);
+                } else {
+                    throttledResizeFn.apply(null, arguments);
+                }
+            };
+        }
+    },
+
+    onBeforeStart: function(e) {
+        // record the startBox
+        this.startBox = this.el.getBox();
+    },
+
+    /**
+     * @private
+     * Returns the object that will be resized on every mousemove event.
+     * If dynamic is false, this will be a proxy, otherwise it will be our actual target.
+     */
+    getDynamicTarget: function() {
+        var me = this,
+            target = me.target;
+            
+        if (me.dynamic) {
+            return target;
+        } else if (!me.proxy) {
+            me.proxy = me.createProxy(target);
+        }
+        me.proxy.show();
+        return me.proxy;
+    },
+    
+    /**
+     * Create a proxy for this resizer
+     * @param {Ext.Component/Ext.Element} target The target
+     * @return {Ext.Element} A proxy element
+     */
+    createProxy: function(target){
+        var proxy,
+            cls = this.proxyCls,
+            renderTo;
+            
+        if (target.isComponent) {
+            proxy = target.getProxy().addCls(cls);
+        } else {
+            renderTo = Ext.getBody();
+            if (Ext.scopeResetCSS) {
+                renderTo = Ext.getBody().createChild({
+                    cls: Ext.resetCls
+                });
+            }
+            proxy = target.createProxy({
+                tag: 'div',
+                cls: cls,
+                id: target.id + '-rzproxy'
+            }, renderTo);
+        }
+        proxy.removeCls(Ext.baseCSSPrefix + 'proxy-el');
+        return proxy;
+    },
+
+    onStart: function(e) {
+        // returns the Ext.ResizeHandle that the user started dragging
+        this.activeResizeHandle = Ext.get(this.getDragTarget().id);
+
+        // If we are using a proxy, ensure it is sized.
+        if (!this.dynamic) {
+            this.resize(this.startBox, {
+                horizontal: 'none',
+                vertical: 'none'
+            });
+        }
+    },
+
+    onDrag: function(e) {
+        // dynamic resizing, update dimensions during resize
+        if (this.dynamic || this.proxy) {
+            this.updateDimensions(e);
+        }
+    },
+
+    updateDimensions: function(e, atEnd) {
+        var me = this,
+            region = me.activeResizeHandle.region,
+            offset = me.getOffset(me.constrainTo ? 'dragTarget' : null),
+            box = me.startBox,
+            ratio,
+            widthAdjust = 0,
+            heightAdjust = 0,
+            snappedWidth,
+            snappedHeight,
+            adjustX = 0,
+            adjustY = 0,
+            dragRatio,
+            horizDir = offset[0] < 0 ? 'right' : 'left',
+            vertDir = offset[1] < 0 ? 'down' : 'up',
+            oppositeCorner,
+            axis, // 1 = x, 2 = y, 3 = x and y.
+            newBox,
+            newHeight, newWidth;
+
+        switch (region) {
+            case 'south':
+                heightAdjust = offset[1];
+                axis = 2;
+                break;
+            case 'north':
+                heightAdjust = -offset[1];
+                adjustY = -heightAdjust;
+                axis = 2;
+                break;
+            case 'east':
+                widthAdjust = offset[0];
+                axis = 1;
+                break;
+            case 'west':
+                widthAdjust = -offset[0];
+                adjustX = -widthAdjust;
+                axis = 1;
+                break;
+            case 'northeast':
+                heightAdjust = -offset[1];
+                adjustY = -heightAdjust;
+                widthAdjust = offset[0];
+                oppositeCorner = [box.x, box.y + box.height];
+                axis = 3;
+                break;
+            case 'southeast':
+                heightAdjust = offset[1];
+                widthAdjust = offset[0];
+                oppositeCorner = [box.x, box.y];
+                axis = 3;
+                break;
+            case 'southwest':
+                widthAdjust = -offset[0];
+                adjustX = -widthAdjust;
+                heightAdjust = offset[1];
+                oppositeCorner = [box.x + box.width, box.y];
+                axis = 3;
+                break;
+            case 'northwest':
+                heightAdjust = -offset[1];
+                adjustY = -heightAdjust;
+                widthAdjust = -offset[0];
+                adjustX = -widthAdjust;
+                oppositeCorner = [box.x + box.width, box.y + box.height];
+                axis = 3;
+                break;
+        }
+
+        newBox = {
+            width: box.width + widthAdjust,
+            height: box.height + heightAdjust,
+            x: box.x + adjustX,
+            y: box.y + adjustY
+        };
+
+        // Snap value between stops according to configured increments
+        snappedWidth = Ext.Number.snap(newBox.width, me.widthIncrement);
+        snappedHeight = Ext.Number.snap(newBox.height, me.heightIncrement);
+        if (snappedWidth != newBox.width || snappedHeight != newBox.height){
+            switch (region) {
+                case 'northeast':
+                    newBox.y -= snappedHeight - newBox.height;
+                    break;
+                case 'north':
+                    newBox.y -= snappedHeight - newBox.height;
+                    break;
+                case 'southwest':
+                    newBox.x -= snappedWidth - newBox.width;
+                    break;
+                case 'west':
+                    newBox.x -= snappedWidth - newBox.width;
+                    break;
+                case 'northwest':
+                    newBox.x -= snappedWidth - newBox.width;
+                    newBox.y -= snappedHeight - newBox.height;
+            }
+            newBox.width = snappedWidth;
+            newBox.height = snappedHeight;
+        }
+
+        // out of bounds
+        if (newBox.width < me.minWidth || newBox.width > me.maxWidth) {
+            newBox.width = Ext.Number.constrain(newBox.width, me.minWidth, me.maxWidth);
+
+            // Re-adjust the X position if we were dragging the west side
+            if (adjustX) {
+                newBox.x = box.x + (box.width - newBox.width);
+            }
+        } else {
+            me.lastX = newBox.x;
+        }
+        if (newBox.height < me.minHeight || newBox.height > me.maxHeight) {
+            newBox.height = Ext.Number.constrain(newBox.height, me.minHeight, me.maxHeight);
+
+            // Re-adjust the Y position if we were dragging the north side
+            if (adjustY) {
+                newBox.y = box.y + (box.height - newBox.height);
+            }
+        } else {
+            me.lastY = newBox.y;
+        }
+
+        // If this is configured to preserve the aspect ratio, or they are dragging using the shift key
+        if (me.preserveRatio || e.shiftKey) {
+            ratio = me.startBox.width / me.startBox.height;
+
+            // Calculate aspect ratio constrained values.
+            newHeight = Math.min(Math.max(me.minHeight, newBox.width / ratio), me.maxHeight);
+            newWidth = Math.min(Math.max(me.minWidth, newBox.height * ratio), me.maxWidth);
+
+            // X axis: width-only change, height must obey
+            if (axis == 1) {
+                newBox.height = newHeight;
+            }
+
+            // Y axis: height-only change, width must obey
+            else if (axis == 2) {
+                newBox.width = newWidth;
+            }
+
+            // Corner drag.
+            else {
+                // Drag ratio is the ratio of the mouse point from the opposite corner.
+                // Basically what edge we are dragging, a horizontal edge or a vertical edge.
+                dragRatio = Math.abs(oppositeCorner[0] - this.lastXY[0]) / Math.abs(oppositeCorner[1] - this.lastXY[1]);
+
+                // If drag ratio > aspect ratio then width is dominant and height must obey
+                if (dragRatio > ratio) {
+                    newBox.height = newHeight;
+                } else {
+                    newBox.width = newWidth;
+                }
+
+                // Handle dragging start coordinates
+                if (region == 'northeast') {
+                    newBox.y = box.y - (newBox.height - box.height);
+                } else if (region == 'northwest') {
+                    newBox.y = box.y - (newBox.height - box.height);
+                    newBox.x = box.x - (newBox.width - box.width);
+                } else if (region == 'southwest') {
+                    newBox.x = box.x - (newBox.width - box.width);
+                }
+            }
+        }
+
+        if (heightAdjust === 0) {
+            vertDir = 'none';
+        }
+        if (widthAdjust === 0) {
+            horizDir = 'none';
+        }
+        me.resize(newBox, {
+            horizontal: horizDir,
+            vertical: vertDir
+        }, atEnd);
+    },
+
+    getResizeTarget: function(atEnd) {
+        return atEnd ? this.target : this.getDynamicTarget();
+    },
+
+    resize: function(box, direction, atEnd) {
+        var target = this.getResizeTarget(atEnd);
+        if (target.isComponent) {
+            target.setSize(box.width, box.height);
+            if (target.floating) {
+                target.setPagePosition(box.x, box.y);
+            }
+        } else {
+            target.setBox(box);
+        }
+
+        // update the originalTarget if it was wrapped, and the target passed in was the wrap el.
+        target = this.originalTarget;
+        if (target && (this.dynamic || atEnd)) {
+            if (target.isComponent) {
+                target.setSize(box.width, box.height);
+                if (target.floating) {
+                    target.setPagePosition(box.x, box.y);
+                }
+            } else {
+                target.setBox(box);
+            }
+        }
+    },
+
+    onEnd: function(e) {
+        this.updateDimensions(e, true);
+        if (this.proxy) {
+            this.proxy.hide();
+        }
+    }
+});