Cacher is the code snippet organizer for pro developers

    /**
     * initializes a step element by reading data from its data attributes and applying the corresponding CSS styles.
     *
     * @param el
     * @param index
     */
    var initStep = function (el, index) {

      var data = el.dataset;

      var step = {

        el: el,

        duration: data.duration,

        rotate: {
          x: toNumber(data.rotateX),
          y: toNumber(data.rotateY),
          z: toNumber(data.rotateZ || data.rotate)
        },

        scale: toNumber(data.scale, 1),

        translate: {
          x: toNumber(data.x),
          y: toNumber(data.y),
          z: toNumber(data.z)
        },

      };

      if ( ! el.id) {
        el.id = 'step-' + (index + 1);
      }

      stepsData['impress-' + el.id] = step;

      css(el, {
        position: 'absolute',
        transform: 'translate(-50%,-50%)' + translate(step.translate) + rotate(step.rotate) +  scale(step.scale),
        transformStyle: 'preserve-3d'
      });
    };