/**
 * @private
 */
Ext.define('Ext.fx.animation.Cube', {
    extend: 'Ext.fx.animation.Abstract',
 
    alias: 'animation.cube',
 
    config: {
        /**
         * @cfg before
         * @inheritdoc
         */
        before: {
            //            'transform-style': 'preserve-3d'
        },
 
        after: {},
 
        /**
         * @cfg {String} direction
         * The direction of which the slide animates
         * @accessor
         */
        direction: 'right',
 
        out: false
    },
 
    //    getData: function() {
    //        var to = this.getTo(),
    //            from = this.getFrom(),
    //            out  = this.getOut(),
    //            direction  = this.getDirection(),
    //            el = this.getElement(),
    //            elW = el.getWidth(),
    //            elH = el.getHeight(),
    //            halfWidth = (elW / 2),
    //            halfHeight = (elH / 2),
    //            fromTransform = {},
    //            toTransform = {},
    //            originalFromTransform = {
    //                rotateY: 0,
    //                translateX: 0,
    //                translateZ: 0
    //            },
    //            originalToTransform = {
    //                rotateY: 90,
    //                translateX: halfWidth,
    //                translateZ: halfWidth
    //            },
    //            originalVerticalFromTransform = {
    //                rotateX: 0,
    //                translateY: 0,
    //                translateZ: 0
    //            },
    //            originalVerticalToTransform = {
    //                rotateX: 90,
    //                translateY: halfHeight,
    //                translateZ: halfHeight
    //            },
    //            tempTransform;
    //
    //        if (direction == "left" || direction == "right") {
    //            if (out) {
    //                toTransform = originalToTransform;
    //                fromTransform = originalFromTransform;
    //            } else {
    //                toTransform = originalFromTransform;
    //                fromTransform = originalToTransform;
    //                fromTransform.rotateY *= -1;
    //                fromTransform.translateX *= -1;
    //            }
    //
    //            if (direction === 'right') {
    //                tempTransform = fromTransform;
    //                fromTransform = toTransform;
    //                toTransform = tempTransform;
    //            }
    //        }
    //
    //        if (direction == "up" || direction == "down") {
    //            if (out) {
    //                toTransform = originalVerticalFromTransform;
    //                fromTransform = {
    //                    rotateX: -90,
    //                    translateY: halfHeight,
    //                    translateZ: halfHeight
    //                };
    //            } else {
    //                fromTransform = originalVerticalFromTransform;
    //                toTransform = {
    //                    rotateX: 90,
    //                    translateY: -halfHeight,
    //                    translateZ: halfHeight
    //                };
    //            }
    //
    //            if (direction == "up") {
    //                tempTransform = fromTransform;
    //                fromTransform = toTransform;
    //                toTransform = tempTransform;
    //            }
    //        }
    //
    //        from.set('transform', fromTransform);
    //        to.set('transform', toTransform);
    //
    //        return this.callParent(arguments);
    //    },
 
    getData: function() {
        var to = this.getTo(),
            from = this.getFrom(),
            before = this.getBefore(),
            after = this.getAfter(),
            out = this.getOut(),
            direction = this.getDirection(),
            el = this.getElement(),
            elW = el.getWidth(),
            origin = out ? '100% 100%' : '0% 0%',
            fromOpacity = 1,
            toOpacity = 1,
            transformFrom = {
                rotateY: 0,
                translateZ: 0
            },
            transformTo = {
                rotateY: 0,
                translateZ: 0
            };
 
        if (direction === "left" || direction === "right") {
            if (out) {
                toOpacity = 0.5;
                transformTo.translateZ = elW;
                transformTo.rotateY = -90;
            }
            else {
                fromOpacity = 0.5;
                transformFrom.translateZ = elW;
                transformFrom.rotateY = 90;
            }
        }
 
        before['transform-origin'] = origin;
        after['transform-origin'] = null;
 
        to.set('transform', transformTo);
        from.set('transform', transformFrom);
 
        from.set('opacity', fromOpacity);
        to.set('opacity', toOpacity);
 
        return this.callParent(arguments);
    }
});