/** * @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); }});