Position visual tests: Cleanup.

author: Scott González <scott.gonzalez@gmail.com> 2012-04-20 11:18:58 -0400
committer: Scott González <scott.gonzalez@gmail.com> 2012-04-20 11:18:58 -0400
commit: af1576280a807dcc166ddf619abab1fc24cac664 (patch)
tree: f29e8e0f93a93dcb9a934970b3a96bfce446072a /tests
parent: 308b55e50ca781ad9db08a252f313ee2e8e2f257 (diff)
download: jquery-ui-af1576280a807dcc166ddf619abab1fc24cac664.tar.gz
jquery-ui-af1576280a807dcc166ddf619abab1fc24cac664.zip
2 files changed, 143 insertions, 138 deletions
diff --git a/tests/visual/position/position_feedback.html b/tests/visual/position/position_feedback.html
index 11bb19f3e..006a1be02 100644
--- a/tests/visual/position/position_feedback.html
+++ b/tests/visual/position/position_feedback.html
@@ -1,19 +1,19 @@
-<!DOCTYPE html>
+<!doctype html>
 <html lang="en">
 <head>
-	<meta charset="UTF-8" />
+	<meta charset="utf-8">
 	<title>Position Visual Test: Default</title>
-	<link rel="stylesheet" href="../visual.css" type="text/css" />
-	<link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css" title="ui-theme" />
-	<script type="text/javascript" src="../../../jquery-1.7.2.js"></script>
-	<script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
-	<script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
-	<script type="text/javascript" src="../../../ui/jquery.ui.position.js"></script>
-	<script type="text/javascript" src="../../../ui/jquery.ui.menu.js"></script>
-	<script type="text/javascript">
+	<link rel="stylesheet" href="../visual.css">
+	<link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css">
+	<script src="../../../jquery-1.7.2.js"></script>
+	<script src="../../../ui/jquery.ui.core.js"></script>
+	<script src="../../../ui/jquery.ui.widget.js"></script>
+	<script src="../../../ui/jquery.ui.position.js"></script>
+	<script src="../../../ui/jquery.ui.menu.js"></script>
+	<script>
 	$(function() {
 		function using( position, feedback ) {
-			$(this)
+			$( this )
 				.css( position )
 				.text( feedback.horizontal + " " + feedback.vertical + " " + feedback.important )
 				.removeClass( "left right top bottom center middle vertical horizontal" )
@@ -21,12 +21,18 @@
 				.addClass( feedback.vertical )
 				.addClass( feedback.important );
 		}
-		var target = $("#target").position({
-			my: "center",
-			at: "center",
-			of: window
-		});
-		var element = $(".element");
+
+		var element = $( ".element" ),
+			target = $( "#target" ).position({
+				my: "center",
+				at: "center",
+				of: window
+			}),
+			targetOffset = target.offset(),
+			oppositeElement = element.clone().width( 50 ).appendTo( "body" ),
+			leftElement = element.clone().width( 50 ).height( 150 ).appendTo( "body" ),
+			rightElement = element.clone().height( 150 ).width( 150 ).appendTo( "body" );
+
 		$.each([
 			"center top-100",
 			"right+25 top-50",
@@ -40,106 +46,101 @@
 			"left-75 center",
 			"left-75 top",
 			"left-25 top-50"
-		], function(index, direction) {
-			element.clone().insertAfter(target).position({
+		], function( index, direction ) {
+			element.clone().insertAfter( target ).position({
 				my: "center",
 				at: direction,
 				of: target,
 				using: using
-			})
+			});
 		});
 
-		var targetOffset = target.offset();
-		var oppositeElement = element.clone().width(50).appendTo('body');
-		var leftElement = element.clone().width(50).height(150).appendTo('body');
-		var rightElement = element.clone().height(150).width(150).appendTo('body');
-		element.width(150);
-		$(document).on( "mousemove", function(event) {
+		element.width( 150 );
+		$( document ).on( "mousemove", function( event ) {
 			var base = {
 				my: "left top",
 				at: "left top",
 				of: target,
 				using: using
-			}
+			};
 			element.position( $.extend({
 				offset: (event.pageX - targetOffset.left) + " " + (event.pageY - targetOffset.top)
-			}, base));
+			}, base ));
 			oppositeElement.position( $.extend({
 				offset: (-1 * (event.pageX - targetOffset.left)) + " " + (-1 * (event.pageY - targetOffset.top))
-			}, base));
+			}, base ));
 			leftElement.position( $.extend({
 				offset: (-0.9 * (event.pageX - targetOffset.left)) + " " + (0.9 * (event.pageY - targetOffset.top))
-			}, base));
+			}, base ));
 			rightElement.position( $.extend({
 				offset: (0.9 * (event.pageX - targetOffset.left)) + " " + (-0.9 * (event.pageY - targetOffset.top))
-			}, base));
+			}, base) );
 		});
 	});
 	</script>
 	<style>
-		#target, .element {
-			position: absolute;
-			border: 1px solid black;
-			border-radius: 5px;
-			width: 75px;
-			height: 25px;
-			padding: 5px;
-		}
-		#target {
-			height: 75px;
-		}
-		.element:before {
-			font-size: 12pt;
-			content: "↑";
-			position: absolute;
-			top: -19px;
-			left: 5px;
-		}
-		.right:before {
-			left: auto;
-			right: 5px;
-		}
-		.bottom:before {
-			content: "↓";
-			top: auto;
-			bottom: -19px;
-		}
-		.center:before {
-			left: 50%;
-			right: auto;
-		}
-		.middle:before {
-			top: 50%;
-			bottom: auto;
-		}
-		.horizontal:before {
-			height: 10px;
-			top: 50%;
-			margin-top: -8px;
-			bottom: auto;
-			left: -18px;
-			right: auto;
-			content: "←";
-		}
-		.right.horizontal:before {
-			left: auto;
-			right: -18px;
-			content: "→";
-		}
-		.bottom.horizontal:before {
-			top: auto;
-			bottom: 5px;
-		}
-		.top.horizontal:before {
-			top: 5px;
-		}
+	#target, .element {
+		position: absolute;
+		border: 1px solid black;
+		border-radius: 5px;
+		width: 75px;
+		height: 25px;
+		padding: 5px;
+	}
+	#target {
+		height: 75px;
+	}
+	.element:before {
+		font-size: 12pt;
+		content: "↑";
+		position: absolute;
+		top: -19px;
+		left: 5px;
+	}
+	.right:before {
+		left: auto;
+		right: 5px;
+	}
+	.bottom:before {
+		content: "↓";
+		top: auto;
+		bottom: -19px;
+	}
+	.center:before {
+		left: 50%;
+		right: auto;
+	}
+	.middle:before {
+		top: 50%;
+		bottom: auto;
+	}
+	.horizontal:before {
+		height: 10px;
+		top: 50%;
+		margin-top: -8px;
+		bottom: auto;
+		left: -18px;
+		right: auto;
+		content: "←";
+	}
+	.right.horizontal:before {
+		left: auto;
+		right: -18px;
+		content: "→";
+	}
+	.bottom.horizontal:before {
+		top: auto;
+		bottom: 5px;
+	}
+	.top.horizontal:before {
+		top: 5px;
+	}
 	</style>
 </head>
 <body>
 
-	<div id="target">all around me</div>
-
-	<div class="element"></div>
+<div id="target">all around me</div>
+<div class="element"></div>
 
 </body>
 </html>
diff --git a/tests/visual/position/position_feedback_rotate.html b/tests/visual/position/position_feedback_rotate.html
index a93287e7d..11138b112 100644
--- a/tests/visual/position/position_feedback_rotate.html
+++ b/tests/visual/position/position_feedback_rotate.html
@@ -1,22 +1,25 @@
-<!DOCTYPE html>
+<!doctype html>
 <html lang="en">
 <head>
-	<meta charset="UTF-8" />
+	<meta charset="utf-8">
 	<title>Position Visual Test: Default</title>
-	<link rel="stylesheet" href="../visual.css" type="text/css" />
-	<link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css" title="ui-theme" />
-	<script type="text/javascript" src="../../../jquery-1.7.2.js"></script>
-	<script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
-	<script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
-	<script type="text/javascript" src="../../../ui/jquery.ui.position.js"></script>
-	<script type="text/javascript" src="../../../ui/jquery.ui.menu.js"></script>
-	<script type="text/javascript">
+	<link rel="stylesheet" href="../visual.css">
+	<link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css">
+	<script src="../../../jquery-1.7.2.js"></script>
+	<script src="../../../ui/jquery.ui.core.js"></script>
+	<script src="../../../ui/jquery.ui.widget.js"></script>
+	<script src="../../../ui/jquery.ui.position.js"></script>
+	<script src="../../../ui/jquery.ui.menu.js"></script>
+	<script>
 	$(function() {
 		function using( position, feedback ) {
-			var angleRad = Math.atan2( feedback.target.top + feedback.target.height / 2 - feedback.element.top - feedback.element.height / 2, feedback.target.left + feedback.target.width / 2 - feedback.element.left - feedback.element.width / 2 ) * 180 / Math.PI;
-			var angle = (Math.round( angleRad * 100) / 100 );
-			$(this)
-				.offset( position )
+			var angleRad = Math.atan2(
+					feedback.target.top + feedback.target.height / 2 - feedback.element.top - feedback.element.height / 2,
+					feedback.target.left + feedback.target.width / 2 - feedback.element.left - feedback.element.width / 2
+				) * 180 / Math.PI,
+				angle = Math.round( angleRad * 100) / 100;
+			$( this )
+				.css( position )
 				.text( feedback.horizontal + " " + feedback.vertical + " " + feedback.important + " " + angle + "°" )
 				.css({
 					"-webkit-transform": "rotate(" + angle + "deg)",
@@ -26,12 +29,18 @@
 					"transform": "rotate(" + angle + "deg)"
 				});
 		}
-		var target = $("#target").position({
-			my: "center",
-			at: "center",
-			of: window
-		});
-		var element = $(".element");
+
+		var element = $( ".element" ),
+			target = $( "#target" ).position({
+				my: "center",
+				at: "center",
+				of: window
+			}),
+			targetOffset = target.offset();
+			oppositeElement = element.clone().width( 50 ).appendTo( "body" ),
+			leftElement = element.clone().width( 50 ).height( 150 ).appendTo( "body" ),
+			rightElement = element.clone().height( 150 ).width( 150 ).appendTo( "body" );
+
 		$.each([
 			"center top-100",
 			"right+25 top-50",
@@ -45,61 +54,56 @@
 			"left-75 center",
 			"left-75 top",
 			"left-25 top-50"
-		], function(index, direction) {
-			element.clone().insertAfter(target).position({
+		], function( index, direction ) {
+			element.clone().insertAfter( target ).position({
 				my: "center",
 				at: direction,
 				of: target,
 				using: using
-			})
+			});
 		});
 
-		var targetOffset = target.offset();
-		var oppositeElement = element.clone().width(50).appendTo('body');
-		var leftElement = element.clone().width(50).height(150).appendTo('body');
-		var rightElement = element.clone().height(150).width(150).appendTo('body');
-		element.width(150);
-		$(document).on( "mousemove", function(event) {
+		element.width( 150 );
+		$( document ).on( "mousemove", function( event ) {
 			var base = {
 				my: "left top",
 				at: "left top",
 				of: target,
 				using: using
-			}
+			};
 			element.position( $.extend({
 				offset: (event.pageX - targetOffset.left) + " " + (event.pageY - targetOffset.top)
-			}, base));
+			}, base ));
 			oppositeElement.position( $.extend({
 				offset: (-1 * (event.pageX - targetOffset.left)) + " " + (-1 * (event.pageY - targetOffset.top))
-			}, base));
+			}, base ));
 			leftElement.position( $.extend({
 				offset: (-0.9 * (event.pageX - targetOffset.left)) + " " + (0.9 * (event.pageY - targetOffset.top))
-			}, base));
+			}, base ));
 			rightElement.position( $.extend({
 				offset: (0.9 * (event.pageX - targetOffset.left)) + " " + (-0.9 * (event.pageY - targetOffset.top))
-			}, base));
+			}, base ));
 		});
 	});
 	</script>
 	<style>
-		#target, .element {
-			position: absolute;
-			border: 1px solid black;
-			border-radius: 5px;
-			width: 75px;
-			height: 25px;
-			padding: 5px;
-		}
-		#target {
-			height: 75px;
-		}
+	#target, .element {
+		position: absolute;
+		border: 1px solid black;
+		border-radius: 5px;
+		width: 75px;
+		height: 25px;
+		padding: 5px;
+	}
+	#target {
+		height: 75px;
+	}
 	</style>
 </head>
 <body>
 
-	<div id="target">all around me</div>
-
-	<div class="element"></div>
+<div id="target">all around me</div>
+<div class="element"></div>
 
 </body>
 </html>
author	Scott González <scott.gonzalez@gmail.com>	2012-04-20 11:18:58 -0400
committer	Scott González <scott.gonzalez@gmail.com>	2012-04-20 11:18:58 -0400
commit	af1576280a807dcc166ddf619abab1fc24cac664 (patch)
tree	f29e8e0f93a93dcb9a934970b3a96bfce446072a /tests
parent	308b55e50ca781ad9db08a252f313ee2e8e2f257 (diff)
download	jquery-ui-af1576280a807dcc166ddf619abab1fc24cac664.tar.gz jquery-ui-af1576280a807dcc166ddf619abab1fc24cac664.zip