Fix wrong cuboid rotation on prev. button

Fixes a bug when navigating to previous image rolls the cuboids 270° in the wrong direction instead of 90° proper.
Is compatible with reverse=true config option.
As a bonus those 4 real long lines are split as well to be more readable.

js/jquery.slicebox.js

@@ -699,10 +699,15 @@
 			var oppositeRotationDirection = this.config.reverse ? '-' : ''; //default positive
 
 			this.animationStyles = {
-				side1 : ( this.config.o === 'v' ) ? { 'transform' : 'translate3d( 0, 0, -' + ( this.size.height / 2 ) + 'px )' } : { 'transform' : 'translate3d( 0, 0, -' + ( this.size.width / 2 ) + 'px )' },
-				side2 : ( this.config.o === 'v' ) ? { 'transform' : 'translate3d( 0, 0, -' + ( this.size.height / 2 ) + 'px ) rotate3d( 1, 0, 0, ' + rotationDirection + '90deg )' } : { 'transform' : 'translate3d( 0, 0, -' + ( this.size.width / 2 ) + 'px ) rotate3d( 0, 1, 0, ' + rotationDirection + '90deg )' },
-				side3 : ( this.config.o === 'v' ) ? { 'transform' : 'translate3d( 0, 0, -' + ( this.size.height / 2 ) + 'px ) rotate3d( 1, 0, 0, ' + rotationDirection + '180deg )' } : { 'transform' : 'translate3d( 0, 0, -' + ( this.size.width / 2 ) + 'px ) rotate3d( 0, 1, 0, ' + rotationDirection + '180deg )' },
-				side4 : ( this.config.o === 'v' ) ? { 'transform' : 'translate3d( 0, 0, -' + ( this.size.height / 2 ) + 'px ) rotate3d( 1, 0, 0, ' + rotationDirection + '270deg )' } : { 'transform' : 'translate3d( 0, 0, -' + ( this.size.width / 2 ) + 'px ) rotate3d( 0, 1, 0, ' + rotationDirection + '270deg )' }
+				side1 : ( this.config.o === 'v' )	? { 'transform' : 'translate3d( 0, 0, -' + ( this.size.height / 2 ) + 'px )' }
+									: { 'transform' : 'translate3d( 0, 0, -' + ( this.size.width / 2 ) + 'px )' },
+				side2 : ( this.config.o === 'v' )	? { 'transform' : 'translate3d( 0, 0, -' + ( this.size.height / 2 ) + 'px ) rotate3d( 1, 0, 0, ' + rotationDirection + '90deg )' }
+									: { 'transform' : 'translate3d( 0, 0, -' + ( this.size.width / 2 ) + 'px ) rotate3d( 0, 1, 0, ' + rotationDirection + '90deg )' },
+				side3 : ( this.config.o === 'v' )	? { 'transform' : 'translate3d( 0, 0, -' + ( this.size.height / 2 ) + 'px ) rotate3d( 1, 0, 0, ' + rotationDirection + '180deg )' }
+									: { 'transform' : 'translate3d( 0, 0, -' + ( this.size.width / 2 ) + 'px ) rotate3d( 0, 1, 0, ' + rotationDirection + '180deg )' },
+				side4 : ( this.config.o === 'v' )	? { 'transform' : 'translate3d( 0, 0, -' + ( this.size.height / 2 ) + 'px ) rotate3d( 1, 0, 0, ' + oppositeRotationDirection + '90deg )' }
+									: { 'transform' : 'translate3d( 0, 0, -' + ( this.size.width / 2 ) + 'px ) rotate3d( 0, 1, 0, ' + oppositeRotationDirection +  '90deg )' }
+
 			};
 
 			var measure = ( this.config.o === 'v' ) ? this.size.height : this.size.width;