text: /**
   * @private
   */
  Ext.define('Ext.fx.animation.Slide', {
  
      extend: 'Ext.fx.animation.Abstract',
  
      alternateClassName: 'Ext.fx.animation.SlideIn',
  
      alias: ['animation.slide', 'animation.slideIn'],
  
      config: {
          /**
           * @cfg {String} direction
           * The direction of which the slide animates
           * @accessor
           */
          direction: 'left',
  
          /**
           * @cfg {Boolean} out
           * True if you want to make this animation slide out, instead of slide in.
           * @accessor
           */
          out: false,
  
          /**
           * @cfg {Number} offset
           * The offset that the animation should go offscreen before entering (or when exiting)
           * @accessor
           */
          offset: 0,
  
          /**
           * @cfg easing
           * @inheritdoc
           */
          easing: 'auto',
  
          containerBox: 'auto',
  
          elementBox: 'auto',
  
          isElementBoxFit: true,
  
          useCssTransform: true
      },
  
      reverseDirectionMap: {
          up: 'down',
          top: 'down',
          down: 'up',
          bottom: 'up',
          left: 'right',
          right: 'left'
      },
  
      applyEasing: function(easing) {
          if (easing === 'auto') {
              return 'ease-' + ((this.getOut()) ? 'in' : 'out');
          }
  
          return easing;
      },
  
      getContainerBox: function() {
          var box = this._containerBox;
  
          if (box === 'auto') {
              box = this.getElement().getParent().getBox();
          }
  
          return box;
      },
  
      getElementBox: function() {
          var box = this._elementBox;
  
          if (this.getIsElementBoxFit()) {
              return this.getContainerBox();
          }
  
          if (box === 'auto') {
              box = this.getElement().getBox();
          }
  
          return box;
      },
  
      getData: function() {
          var elementBox = this.getElementBox(),
              containerBox = this.getContainerBox(),
              box = elementBox ? elementBox : containerBox,
              from = this.getFrom(),
              to = this.getTo(),
              out = this.getOut(),
              offset = this.getOffset(),
              direction = this.getDirection(),
              useCssTransform = this.getUseCssTransform(),
              reverse = this.getReverse(),
              translateX = 0,
              translateY = 0,
              offsetPct, fromX, fromY, toX, toY;
  
          if (typeof offset === 'string') {
              offsetPct = true;
              offset = parseFloat(offset);
          }
  
          if (reverse) {
              direction = this.reverseDirectionMap[direction];
          }
  
          switch (direction) {
              case this.DIRECTION_UP:
              case this.DIRECTION_TOP:
                  if (offsetPct) {
                      offset = box.height * offset / 100;
                  }
  
                  if (out) {
                      translateY = containerBox.top - box.top - box.height - offset;
                  }
                  else {
                      translateY = containerBox.bottom - box.bottom + box.height + offset;
                  }
  
                  break;
  
              case this.DIRECTION_DOWN:
              case this.DIRECTION_BOTTOM:
                  if (offsetPct) {
                      offset = box.height * offset / 100;
                  }
  
                  if (out) {
                      translateY = containerBox.bottom - box.bottom + box.height + offset;
                  }
                  else {
                      translateY = containerBox.top - box.height - box.top - offset;
                  }
  
                  break;
  
              case this.DIRECTION_RIGHT:
                  if (offsetPct) {
                      offset = box.width * offset / 100;
                  }
  
                  if (out) {
                      translateX = containerBox.right - box.right + box.width + offset;
                  }
                  else {
                      translateX = containerBox.left - box.left - box.width - offset;
                  }
  
                  break;
  
              case this.DIRECTION_LEFT:
                  if (offsetPct) {
                      offset = box.width * offset / 100;
                  }
  
                  if (out) {
                      translateX = containerBox.left - box.left - box.width - offset;
                  }
                  else {
                      translateX = containerBox.right - box.right + box.width + offset;
                  }
  
                  break;
          }
  
          fromX = (out) ? 0 : translateX;
          fromY = (out) ? 0 : translateY;
  
          if (useCssTransform) {
              from.setTransform({
                  translateX: fromX,
                  translateY: fromY
              });
          }
          else {
              from.set('left', fromX);
              from.set('top', fromY);
          }
  
          toX = (out) ? translateX : 0;
          toY = (out) ? translateY : 0;
  
          if (useCssTransform) {
              to.setTransform({
                  translateX: toX,
                  translateY: toY
              });
          }
          else {
              to.set('left', toX);
              to.set('top', toY);
          }
  
          return this.callParent(arguments);
      }
  });
  