Effects Tests: Fix and format scale visual test

jquery · Sep 2, 2014 · 6c4367b · 6c4367b
1 parent 304c00d
commit 6c4367b
Showing 1 changed file with 23 additions and 12 deletions.
diff --git a/tests/visual/effects/scale.html b/tests/visual/effects/scale.html
@@ -7,14 +7,14 @@
 	<script src="../../../external/jquery/jquery.js"></script>
 	<script src="../../../ui/effect.js"></script>
 	<script src="../../../ui/effect-scale.js"></script>
+	<script src="../../../ui/effect-size.js"></script>
 	<script>
 	$(function() {
 		var test = $( "#testBox" ),
 			opts = $( ".arg" ),
 			optsRev = $( opts.get().reverse() ),
 			doer = $( "#doAnim" ),
 			current = $( "#current" ),
-			cleanStyle = test[0].style,
 			total = 1;
 
 		opts.each(function() {
@@ -34,45 +34,50 @@
 			optsRev.each(function() {
 				var cur = this.selectedIndex,
 					next = cur + direction,
-					len = this.options.length;
+					len = this.options.length,
+					newIndex = ( next + len ) % len;
 
-				this.selectedIndex = ( next + len ) % len;
+				this.selectedIndex = newIndex;
 
-				if ( ( next+len ) % len === next ) return false;
+				if ( newIndex === next ) {
+					return false;
+				}
 			});
 			doAnim();
 		}
 
-
 		function doAnim() {
 			var cur = 0;
 			opts.each(function() {
-				cur *= this.options.length
+				cur *= this.options.length;
 				cur += this.selectedIndex;
 			});
 			cur++;
 			current.text( "Configuration: " + cur + " of " + total );
-			run.apply(test, opts.map(function() {
-				return $(this).val();
-			}).get());
+			run.apply( test, opts.map(function() {
+				return $( this ).val();
+			}).get() );
 		}
 
 		function run( position, v, h, vo, ho ) {
 			var el = this,
-				style = el[0].style,
+				style = el[ 0 ].style,
 				effect = {
 					effect: "scale",
 					mode: "effect",
 					percent: 200,
 					origin: [ vo, ho ],
 					duration: 500
 				};
-			el.stop(true, true);
+
+			el.stop( true, true );
+
 			if ( typeof style === "object" ) {
 				style.cssText = "";
 			} else {
-				el[0].style = "";
+				el[ 0 ].style = "";
 			}
+
 			el.css( "position", position )
 				.css( h, 5 )
 				.css( v, 5 )
@@ -95,6 +100,9 @@
 		border: 10px solid #fff;
 		margin: 10px;
 		padding: 10px;
+		position: absolute;
+		left: 5px;
+		top: 5px;
 	}
 	label {
 		display: block;
@@ -111,6 +119,7 @@
 	</style>
 </head>
 <body>
+
 	<div id="testArea">
 		<div id="testBox">
 		</div>
@@ -154,4 +163,6 @@
 		<button id="doAnim">Run Animation</button>
 		<button id="cycleNext">Forward</button>
 	</div>
+
 </body>
+</html>