 
 
   _getTransform: (deg) ->
-    "translateZ(-#{ @size / 2 }px) rotateX(#{ deg }deg)"
+    (if @horizontalFlip then 'rotateZ(-90deg)' else '') +
+      " translateZ(-#{ @size / 2 }px) rotateX(#{ deg }deg)"
 
 
   _setContent: (el, content) ->

    cube.touchStarted = true
    e.currentTarget.classList.add 'no-tween'
    if e.type is 'mousedown'
      cube.y1 = e.pageY
    else
      cube.y1 = e.touches[0].pageY


  _onTouchMove: (e, cube) ->
    return unless cube.touchStarted
    e.preventDefault()
    cube.diff = (e.pageY - cube.y1) * @touchSensitivity
    cube.yDelta = cube.yLast - cube.diff
    @_setSides cube


  _onTouchEnd: (e, cube) ->
    cube.touchStarted = false
    mod = cube.yDelta % 90
    if mod < 45
      cube.yLast = cube.yDelta + mod
    else
      if cube.yDelta > 0
        cube.yLast = cube.yDelta + mod
      else
        cube.yLast = cube.yDelta - (90 - mod)

    if cube.yLast % 90 isnt 0
      cube.yLast -= cube.yLast % 90

    cube.el.classList.remove 'no-tween'
    cube.el.style[css.transform] = @_getTransform cube.yLast


  _onTouchLeave: (e, cube) ->

    for side in faceNames
      cube[side] = document.createElement 'div'
      cube[side].className = cssClass + '-' + side
      rotation = do ->
        switch side
          when 'front'
            ''
          when 'back'
            'rotateX(180deg)'
          when 'top'
            'rotateX(90deg)'
          when 'bottom'
            'rotateX(-90deg)'
          when 'left'
            'rotateY(-90deg)'
          when 'right'
            'rotateY(90deg)'

      cube[side].style[css.transform] = "#{ rotation } translate3d(0, 0, #{ @size / 2 }px)" +
        (if @horizontalFlip then 'rotateZ(90deg)' else '')
      cube[side].style.fontSize = @fontSize
      cube.el.appendChild cube[side]

