From 144268a2eb88184c34ee82a7ee422d9db8aa12a9 Mon Sep 17 00:00:00 2001
From: Scott González <scott.gonzalez@gmail.com>
Date: Thu, 14 Nov 2013 10:10:42 -0500
Subject: Dialog test: Ensure dialog is tall enough to be scrolled.

---
 tests/unit/dialog/dialog.html | 2 ++
 1 file changed, 2 insertions(+)

(limited to 'tests')

diff --git a/tests/unit/dialog/dialog.html b/tests/unit/dialog/dialog.html
index 7943b425b..d8506a1bd 100644
--- a/tests/unit/dialog/dialog.html
+++ b/tests/unit/dialog/dialog.html
@@ -52,6 +52,8 @@
 	<div id="dialog1"></div>
 	<div id="dialog2"></div>
 	<div id="form-dialog" title="Profile Information">
+		<!-- create a spacer to ensure there's enough space to scroll -->
+		<div style="height: 250px;">...</div>
 		<fieldset>
 			<legend>Please share some personal information</legend>
 			<label for="favorite-animal">Your favorite animal</label><input id="favorite-animal">
-- 
cgit v1.2.3


From ce5539f3681f60b997b53785c84ff66b5a61f08f Mon Sep 17 00:00:00 2001
From: Scott González <scott.gonzalez@gmail.com>
Date: Thu, 14 Nov 2013 10:32:09 -0500
Subject: Dialog tests: Work around focus issue in IE8.

---
 tests/unit/dialog/dialog_methods.js | 5 +++++
 1 file changed, 5 insertions(+)

(limited to 'tests')

diff --git a/tests/unit/dialog/dialog_methods.js b/tests/unit/dialog/dialog_methods.js
index 8918e8d36..d315e5fc3 100644
--- a/tests/unit/dialog/dialog_methods.js
+++ b/tests/unit/dialog/dialog_methods.js
@@ -220,6 +220,11 @@ asyncTest( "#8958: dialog can be opened while opening", function() {
 		}
 	});
 
+	// Support: IE8
+	// For some reason the #favorite-color input doesn't get focus if we don't
+	// focus the body first, causing the test to hang.
+	$( "body" ).focus();
+
 	$( "#favorite-animal" )
 		// We focus the input to start the test. Once it receives focus, the
 		// dialog will open. Opening the dialog, will cause an element inside
-- 
cgit v1.2.3


From 0e5a2e126ab4179f1ec83e1e4e773058b49e336d Mon Sep 17 00:00:00 2001
From: Jörn Zaefferer <joern.zaefferer@gmail.com>
Date: Wed, 2 Oct 2013 17:27:43 +0200
Subject: Dialog: Restore focus to the previously focused element when window
 regains focus. Fixes #9101 - Dialog: Track last focused element instead of
 always focusing the first tabbable element

---
 tests/unit/dialog/dialog_core.js | 48 ++++++++++++++++++++++++++++------------
 ui/jquery.ui.dialog.js           | 33 +++++++++++++++++++--------
 2 files changed, 58 insertions(+), 23 deletions(-)

(limited to 'tests')

diff --git a/tests/unit/dialog/dialog_core.js b/tests/unit/dialog/dialog_core.js
index e85759dc9..062d44576 100644
--- a/tests/unit/dialog/dialog_core.js
+++ b/tests/unit/dialog/dialog_core.js
@@ -40,7 +40,7 @@ test("widget method", function() {
 });
 
 asyncTest( "focus tabbable", function() {
-	expect( 5 );
+	expect( 6 );
 	var element,
 		options = {
 			buttons: [{
@@ -50,6 +50,12 @@ asyncTest( "focus tabbable", function() {
 		};
 
 	function checkFocus( markup, options, testFn, next ) {
+
+		// Support: IE8
+		// For some reason the focus doesn't get set properly if we don't
+		// focus the body first.
+		$( "body" ).focus();
+
 		element = $( markup ).dialog( options );
 		setTimeout(function() {
 			testFn();
@@ -59,43 +65,57 @@ asyncTest( "focus tabbable", function() {
 	}
 
 	function step1() {
+		element = $( "<div><input><input></div>" ).dialog( options );
+		setTimeout(function() {
+			var input = element.find( "input:last" ).focus().blur();
+			element.dialog( "instance" )._focusTabbable();
+			setTimeout(function() {
+				equal( document.activeElement, input[ 0 ],
+					"1. an element that was focused previously." );
+				element.remove();
+				setTimeout( step2 );
+			});
+		});
+	}
+
+	function step2() {
 		checkFocus( "<div><input><input autofocus></div>", options, function() {
 			equal( document.activeElement, element.find( "input" )[ 1 ],
-				"1. first element inside the dialog matching [autofocus]" );
-		}, step2 );
+				"2. first element inside the dialog matching [autofocus]" );
+		}, step3 );
 	}
 
-	function step2() {
+	function step3() {
 		checkFocus( "<div><input><input></div>", options, function() {
 			equal( document.activeElement, element.find( "input" )[ 0 ],
-				"2. tabbable element inside the content element" );
-		}, step3 );
+				"3. tabbable element inside the content element" );
+		}, step4 );
 	}
 
-	function step3() {
+	function step4() {
 		checkFocus( "<div>text</div>", options, function() {
 			equal( document.activeElement,
 				element.dialog( "widget" ).find( ".ui-dialog-buttonpane button" )[ 0 ],
-				"3. tabbable element inside the buttonpane" );
-		}, step4 );
+				"4. tabbable element inside the buttonpane" );
+		}, step5 );
 	}
 
-	function step4() {
+	function step5() {
 		checkFocus( "<div>text</div>", {}, function() {
 			equal( document.activeElement,
 				element.dialog( "widget" ).find( ".ui-dialog-titlebar .ui-dialog-titlebar-close" )[ 0 ],
-				"4. the close button" );
-		}, step5 );
+				"5. the close button" );
+		}, step6 );
 	}
 
-	function step5() {
+	function step6() {
 		element = $( "<div>text</div>" ).dialog({
 			autoOpen: false
 		});
 		element.dialog( "widget" ).find( ".ui-dialog-titlebar-close" ).hide();
 		element.dialog( "open" );
 		setTimeout(function() {
-			equal( document.activeElement, element.parent()[ 0 ], "5. the dialog itself" );
+			equal( document.activeElement, element.parent()[ 0 ], "6. the dialog itself" );
 			element.remove();
 			start();
 		});
diff --git a/ui/jquery.ui.dialog.js b/ui/jquery.ui.dialog.js
index c5bd42ab5..2684b7615 100644
--- a/ui/jquery.ui.dialog.js
+++ b/ui/jquery.ui.dialog.js
@@ -118,6 +118,8 @@ $.widget( "ui.dialog", {
 		}
 
 		this._isOpen = false;
+
+		this._trackFocus();
 	},
 
 	_init: function() {
@@ -178,6 +180,7 @@ $.widget( "ui.dialog", {
 		}
 
 		this._isOpen = false;
+		this._focusedElement = null;
 		this._destroyOverlay();
 
 		if ( !this.opener.filter(":focusable").focus().length ) {
@@ -256,20 +259,24 @@ $.widget( "ui.dialog", {
 
 	_focusTabbable: function() {
 		// Set focus to the first match:
-		// 1. First element inside the dialog matching [autofocus]
-		// 2. Tabbable element inside the content element
-		// 3. Tabbable element inside the buttonpane
-		// 4. The close button
-		// 5. The dialog itself
-		var hasFocus = this.element.find("[autofocus]");
+		// 1. An element that was focused previously
+		// 2. First element inside the dialog matching [autofocus]
+		// 3. Tabbable element inside the content element
+		// 4. Tabbable element inside the buttonpane
+		// 5. The close button
+		// 6. The dialog itself
+		var hasFocus = this._focusedElement;
+		if ( !hasFocus ) {
+			hasFocus = this.element.find( "[autofocus]" );
+		}
 		if ( !hasFocus.length ) {
-			hasFocus = this.element.find(":tabbable");
+			hasFocus = this.element.find( ":tabbable" );
 		}
 		if ( !hasFocus.length ) {
-			hasFocus = this.uiDialogButtonPane.find(":tabbable");
+			hasFocus = this.uiDialogButtonPane.find( ":tabbable" );
 		}
 		if ( !hasFocus.length ) {
-			hasFocus = this.uiDialogTitlebarClose.filter(":tabbable");
+			hasFocus = this.uiDialogTitlebarClose.filter( ":tabbable" );
 		}
 		if ( !hasFocus.length ) {
 			hasFocus = this.uiDialog;
@@ -552,6 +559,14 @@ $.widget( "ui.dialog", {
 		.css( "position", position );
 	},
 
+	_trackFocus: function() {
+		this._on( this.widget(), {
+			"focusin": function( event ) {
+				this._focusedElement = $( event.target );
+			}
+		});
+	},
+
 	_minHeight: function() {
 		var options = this.options;
 
-- 
cgit v1.2.3


From 3945a8f074e8b101a2cdcba4a3b1cdbe9a8356e2 Mon Sep 17 00:00:00 2001
From: Jörn Zaefferer <joern.zaefferer@gmail.com>
Date: Fri, 15 Nov 2013 12:51:10 +0100
Subject: Menu: Update unit test that regressed from style changes (see
 9910e938aad1090339a2c7f60693093ee18aba82)

---
 tests/unit/menu/menu_common.js  |  2 +-
 tests/unit/menu/menu_events.js  | 12 ++++++------
 tests/unit/menu/menu_options.js |  9 +++------
 3 files changed, 10 insertions(+), 13 deletions(-)

(limited to 'tests')

diff --git a/tests/unit/menu/menu_common.js b/tests/unit/menu/menu_common.js
index 2404ebe02..099dd091e 100644
--- a/tests/unit/menu/menu_common.js
+++ b/tests/unit/menu/menu_common.js
@@ -7,7 +7,7 @@ TestHelpers.commonWidgetTests( "menu", {
 		items: "> *",
 		menus: "ul",
 		position: {
-			my: "left top",
+			my: "left-1 top",
 			at: "right top"
 		},
 		role: "menu",
diff --git a/tests/unit/menu/menu_events.js b/tests/unit/menu/menu_events.js
index 0b89b86ac..9d74b4bbb 100644
--- a/tests/unit/menu/menu_events.js
+++ b/tests/unit/menu/menu_events.js
@@ -389,15 +389,15 @@ asyncTest( "handle keyboard navigation on menu with scroll and without submenus"
 
 		log( "keydown", true );
 		element.simulate( "keydown", { keyCode: $.ui.keyCode.PAGE_DOWN } );
-		equal( logOutput(), "keydown,10", "Keydown PAGE_DOWN" );
+		equal( logOutput(), "keydown,11", "Keydown PAGE_DOWN" );
 
 		log( "keydown", true );
 		element.simulate( "keydown", { keyCode: $.ui.keyCode.PAGE_DOWN } );
-		equal( logOutput(), "keydown,20", "Keydown PAGE_DOWN" );
+		equal( logOutput(), "keydown,22", "Keydown PAGE_DOWN" );
 
 		log( "keydown", true );
 		element.simulate( "keydown", { keyCode: $.ui.keyCode.PAGE_UP } );
-		equal( logOutput(), "keydown,10", "Keydown PAGE_UP" );
+		equal( logOutput(), "keydown,11", "Keydown PAGE_UP" );
 
 		log( "keydown", true );
 		element.simulate( "keydown", { keyCode: $.ui.keyCode.PAGE_UP } );
@@ -484,15 +484,15 @@ asyncTest( "handle keyboard navigation on menu with scroll and with submenus", f
 	function menukeyboard3() {
 		log( "keydown", true );
 		element.simulate( "keydown", { keyCode: $.ui.keyCode.PAGE_DOWN } );
-		equal( logOutput(), "keydown,10", "Keydown PAGE_DOWN" );
+		equal( logOutput(), "keydown,11", "Keydown PAGE_DOWN" );
 
 		log( "keydown", true );
 		element.simulate( "keydown", { keyCode: $.ui.keyCode.PAGE_DOWN } );
-		equal( logOutput(), "keydown,20", "Keydown PAGE_DOWN" );
+		equal( logOutput(), "keydown,22", "Keydown PAGE_DOWN" );
 
 		log( "keydown", true );
 		element.simulate( "keydown", { keyCode: $.ui.keyCode.PAGE_UP } );
-		equal( logOutput(), "keydown,10", "Keydown PAGE_UP" );
+		equal( logOutput(), "keydown,11", "Keydown PAGE_UP" );
 
 		log( "keydown", true );
 		element.simulate( "keydown", { keyCode: $.ui.keyCode.PAGE_UP } );
diff --git a/tests/unit/menu/menu_options.js b/tests/unit/menu/menu_options.js
index 527cc4784..c76673345 100644
--- a/tests/unit/menu/menu_options.js
+++ b/tests/unit/menu/menu_options.js
@@ -66,13 +66,12 @@ test( "{ icons: { submenu: 'custom' } }", function() {
 test( "{ role: 'menu' } ", function() {
 	var element = $( "#menu1" ).menu(),
 		items = element.find( "li" );
-	expect( 2 + 4 * items.length );
+	expect( 2 + 3 * items.length );
 	equal( element.attr( "role" ), "menu" );
 	ok( items.length > 0, "number of menu items" );
 	items.each(function( item ) {
 		ok( $( this ).hasClass( "ui-menu-item" ), "menu item ("+ item + ") class for item" );
 		equal( $( this ).attr( "role" ), "menuitem", "menu item ("+ item + ") role" );
-		ok( $( this ).hasClass( "ui-corner-all" ), "class for menu item ("+ item + ")" );
 		equal( $( this ).attr( "tabindex" ), "-1", "tabindex for menu item ("+ item + ")" );
 	});
 });
@@ -82,13 +81,12 @@ test( "{ role: 'listbox' } ", function() {
 			role: "listbox"
 		}),
 		items = element.find( "li" );
-	expect( 2 + 4 * items.length );
+	expect( 2 + 3 * items.length );
 	equal( element.attr( "role" ), "listbox" );
 	ok( items.length > 0, "number of menu items" );
 	items.each(function( item ) {
 		ok( $( this ).hasClass( "ui-menu-item" ), "menu item ("+ item + ") class for item" );
 		equal( $( this ).attr( "role" ), "option", "menu item ("+ item + ") role" );
-		ok( $( this ).hasClass( "ui-corner-all" ), "class for menu item ("+ item + ")" );
 		equal( $( this ).attr( "tabindex" ), "-1", "tabindex for menu item ("+ item + ")" );
 	});
 });
@@ -98,13 +96,12 @@ test( "{ role: null }", function() {
 			role: null
 		}),
 		items = element.find( "li" );
-	expect( 2 + 4 * items.length );
+	expect( 2 + 3 * items.length );
 	strictEqual( element.attr( "role" ), undefined );
 	ok( items.length > 0, "number of menu items" );
 	items.each(function( item ) {
 		ok( $( this ).hasClass( "ui-menu-item" ), "menu item ("+ item + ") class for item" );
 		equal( $( this ).attr( "role" ), undefined, "menu item ("+ item + ") role" );
-		ok( $( this ).hasClass( "ui-corner-all" ), "class for menu item ("+ item + ")" );
 		equal( $( this ).attr( "tabindex" ), "-1", "tabindex for menu item ("+ item + ")" );
 	});
 });
-- 
cgit v1.2.3


From 1096f19f37d6075328509d62a4c2c6d6a53d4b37 Mon Sep 17 00:00:00 2001
From: Jörn Zaefferer <joern.zaefferer@gmail.com>
Date: Sat, 16 Nov 2013 12:21:02 +0100
Subject: Dialog: Keep track of instances to focus when elements outside the
 dialog get focus. Works with inheritance. Adds tests for both. Fixes #9241 -
 Dialog: UI dialog inheritance causes undefined property '_focusTabbable' in
 IE9

---
 tests/unit/dialog/dialog_core.js | 48 ++++++++++++++++++++++++++++++++++++++++
 ui/jquery.ui.dialog.js           | 23 +++++++++++++++++--
 2 files changed, 69 insertions(+), 2 deletions(-)

(limited to 'tests')

diff --git a/tests/unit/dialog/dialog_core.js b/tests/unit/dialog/dialog_core.js
index 062d44576..c08019da9 100644
--- a/tests/unit/dialog/dialog_core.js
+++ b/tests/unit/dialog/dialog_core.js
@@ -4,6 +4,7 @@
 
 (function($) {
 
+// TODO add teardown callback to remove dialogs
 module("dialog: core");
 
 test("title id", function() {
@@ -180,4 +181,51 @@ asyncTest( "#9048: multiple modal dialogs opened and closed in different order",
 		start();
 	});
 });
+
+asyncTest( "interaction between overlay and other dialogs", function() {
+	$.widget( "ui.testWidget", $.ui.dialog, {
+		options: {
+			modal: true,
+			autoOpen: false
+		}
+	});
+	expect( 2 );
+	var first = $( "<div><input id='input-1'></div>" ).dialog({
+			modal: true
+		}),
+		firstInput = first.find( "input" ),
+		second = $( "<div><input id='input-2'></div>" ).testWidget(),
+		secondInput = second.find( "input" );
+
+	// Support: IE8
+	// For some reason the focus doesn't get set properly if we don't
+	// focus the body first.
+	$( "body" ).focus();
+
+	// Wait for the modal to init
+	setTimeout(function() {
+		second.testWidget( "open" );
+
+		// Simulate user tabbing from address bar to an element outside the dialog
+		$( "#favorite-animal" ).focus();
+		setTimeout(function() {
+			equal( document.activeElement, secondInput[ 0 ] );
+
+			// Last active dialog must receive focus
+			firstInput.focus();
+			$( "#favorite-animal" ).focus();
+			setTimeout(function() {
+				equal( document.activeElement, firstInput[ 0 ] );
+
+				// Cleanup
+				first.remove();
+				second.remove();
+				delete $.ui.testWidget;
+				delete $.fn.testWidget;
+				start();
+			});
+		});
+	});
+});
+
 })(jQuery);
diff --git a/ui/jquery.ui.dialog.js b/ui/jquery.ui.dialog.js
index d3ce333f4..7f90908bd 100644
--- a/ui/jquery.ui.dialog.js
+++ b/ui/jquery.ui.dialog.js
@@ -182,6 +182,7 @@ $.widget( "ui.dialog", {
 		this._isOpen = false;
 		this._focusedElement = null;
 		this._destroyOverlay();
+		this._untrackInstance();
 
 		if ( !this.opener.filter( ":focusable" ).focus().length ) {
 
@@ -562,11 +563,30 @@ $.widget( "ui.dialog", {
 	_trackFocus: function() {
 		this._on( this.widget(), {
 			"focusin": function( event ) {
+				this._untrackInstance();
+				this._trackingInstances().unshift( this );
 				this._focusedElement = $( event.target );
 			}
 		});
 	},
 
+	_untrackInstance: function() {
+		var instances = this._trackingInstances(),
+			exists = $.inArray( this, instances );
+		if ( exists !== -1 ) {
+			instances.splice( exists, 1 );
+		}
+	},
+
+	_trackingInstances: function() {
+		var instances = this.document.data( "ui-dialog-instances" );
+		if ( !instances ) {
+			instances = [];
+			this.document.data( "ui-dialog-instances", instances );
+		}
+		return instances;
+	},
+
 	_minHeight: function() {
 		var options = this.options;
 
@@ -783,8 +803,7 @@ $.widget( "ui.dialog", {
 
 					if ( !this._allowInteraction( event ) ) {
 						event.preventDefault();
-						this.document.find( ".ui-dialog:visible:last .ui-dialog-content" )
-							.data( this.widgetFullName )._focusTabbable();
+						this._trackingInstances()[ 0 ]._focusTabbable();
 					}
 				}
 			});
-- 
cgit v1.2.3


From 6a74bf992944419caabc7adb8ec8ca758451f1d5 Mon Sep 17 00:00:00 2001
From: Scott González <scott.gonzalez@gmail.com>
Date: Wed, 20 Nov 2013 11:14:19 -0500
Subject: Menu tests: Force line height to ensure we know how many items will
 be scrolled.

---
 tests/unit/menu/menu.html      |  4 ++++
 tests/unit/menu/menu_events.js | 12 ++++++------
 2 files changed, 10 insertions(+), 6 deletions(-)

(limited to 'tests')

diff --git a/tests/unit/menu/menu.html b/tests/unit/menu/menu.html
index a49c72a04..504d3f3cf 100644
--- a/tests/unit/menu/menu.html
+++ b/tests/unit/menu/menu.html
@@ -31,6 +31,10 @@
 	<style>
 	.ui-menu {
 		font-size: 15px;
+		line-height: 15px;
+	}
+	.ui-menu .ui-menu-item {
+		padding: 0;
 	}
 	#menu3 {
 		height: 250px;
diff --git a/tests/unit/menu/menu_events.js b/tests/unit/menu/menu_events.js
index 9d74b4bbb..3f834fd66 100644
--- a/tests/unit/menu/menu_events.js
+++ b/tests/unit/menu/menu_events.js
@@ -389,15 +389,15 @@ asyncTest( "handle keyboard navigation on menu with scroll and without submenus"
 
 		log( "keydown", true );
 		element.simulate( "keydown", { keyCode: $.ui.keyCode.PAGE_DOWN } );
-		equal( logOutput(), "keydown,11", "Keydown PAGE_DOWN" );
+		equal( logOutput(), "keydown,17", "Keydown PAGE_DOWN" );
 
 		log( "keydown", true );
 		element.simulate( "keydown", { keyCode: $.ui.keyCode.PAGE_DOWN } );
-		equal( logOutput(), "keydown,22", "Keydown PAGE_DOWN" );
+		equal( logOutput(), "keydown,34", "Keydown PAGE_DOWN" );
 
 		log( "keydown", true );
 		element.simulate( "keydown", { keyCode: $.ui.keyCode.PAGE_UP } );
-		equal( logOutput(), "keydown,11", "Keydown PAGE_UP" );
+		equal( logOutput(), "keydown,17", "Keydown PAGE_UP" );
 
 		log( "keydown", true );
 		element.simulate( "keydown", { keyCode: $.ui.keyCode.PAGE_UP } );
@@ -484,15 +484,15 @@ asyncTest( "handle keyboard navigation on menu with scroll and with submenus", f
 	function menukeyboard3() {
 		log( "keydown", true );
 		element.simulate( "keydown", { keyCode: $.ui.keyCode.PAGE_DOWN } );
-		equal( logOutput(), "keydown,11", "Keydown PAGE_DOWN" );
+		equal( logOutput(), "keydown,17", "Keydown PAGE_DOWN" );
 
 		log( "keydown", true );
 		element.simulate( "keydown", { keyCode: $.ui.keyCode.PAGE_DOWN } );
-		equal( logOutput(), "keydown,22", "Keydown PAGE_DOWN" );
+		equal( logOutput(), "keydown,27", "Keydown PAGE_DOWN" );
 
 		log( "keydown", true );
 		element.simulate( "keydown", { keyCode: $.ui.keyCode.PAGE_UP } );
-		equal( logOutput(), "keydown,11", "Keydown PAGE_UP" );
+		equal( logOutput(), "keydown,10", "Keydown PAGE_UP" );
 
 		log( "keydown", true );
 		element.simulate( "keydown", { keyCode: $.ui.keyCode.PAGE_UP } );
-- 
cgit v1.2.3


From 4e758450f126df60cebc858f1f4f1b84107607ce Mon Sep 17 00:00:00 2001
From: Jörn Zaefferer <joern.zaefferer@gmail.com>
Date: Wed, 20 Nov 2013 19:03:54 +0100
Subject: Tests: Cleanup visual theme test

---
 tests/visual/theme.html | 1037 +++++++++++++++++++++++------------------------
 1 file changed, 515 insertions(+), 522 deletions(-)

(limited to 'tests')

diff --git a/tests/visual/theme.html b/tests/visual/theme.html
index b6e319803..9b4b6e874 100644
--- a/tests/visual/theme.html
+++ b/tests/visual/theme.html
@@ -1,532 +1,525 @@
 <!DOCTYPE html>
-<html>
-	<head>
-		<meta charset="utf-8">
-		<title>jQuery UI Example Page</title>
-		<link rel="stylesheet" href="../../themes/base/jquery.ui.all.css" type="text/css">
-		<script type="text/javascript" src="../../jquery-1.10.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.mouse.js"></script>
-		<script type="text/javascript" src="../../ui/jquery.ui.position.js"></script>
-		<script type="text/javascript" src="../../ui/jquery.ui.accordion.js"></script>
-		<script type="text/javascript" src="../../ui/jquery.ui.autocomplete.js"></script>
-		<script type="text/javascript" src="../../ui/jquery.ui.button.js"></script>
-		<script type="text/javascript" src="../../ui/jquery.ui.datepicker.js"></script>
-		<script type="text/javascript" src="../../ui/jquery.ui.dialog.js"></script>
-		<script type="text/javascript" src="../../ui/jquery.ui.draggable.js"></script>
-		<script type="text/javascript" src="../../ui/jquery.ui.droppable.js"></script>
-		<script type="text/javascript" src="../../ui/jquery.ui.progressbar.js"></script>
-		<script type="text/javascript" src="../../ui/jquery.ui.resizable.js"></script>
-		<script type="text/javascript" src="../../ui/jquery.ui.selectable.js"></script>
-		<script type="text/javascript" src="../../ui/jquery.ui.slider.js"></script>
-		<script type="text/javascript" src="../../ui/jquery.ui.sortable.js"></script>
-		<script type="text/javascript" src="../../ui/jquery.ui.tabs.js"></script>
-		<script type="text/javascript">
-			$(function(){
-
-				// Accordion
-				$(".accordion").accordion({ header: "h3" });
-				$(".accordion").last().accordion("option", "icons", false);
-
-
-				// Tabs
-				$('#tabs').tabs();
-
-
-				// Dialog
-				$('#dialog').dialog({
-					autoOpen: false,
-					width: 600,
-					buttons: {
-						"Ok": function() {
-							$(this).dialog("close");
-						},
-						"Cancel": function() {
-							$(this).dialog("close");
-						}
-					}
-				});
-
-				// Dialog Link
-				$('#dialog_link').click(function(){
-					$('#dialog').dialog('open');
-					return false;
-				});
-
-				// Datepicker
-				$('#datepicker').datepicker({
-					inline: true,
-					showWeek: true
-				});
-
-				$('#multidatepicker').datepicker({
-					numberOfMonths: 3,
-					showButtonPanel: true,
-					inline: true
-				});
-
-				// Slider
-				$('.slider').slider({
-					range: true,
-					values: [17, 67]
-				});
-
-				$("#eq > span").each(function() {
-					var value = parseInt($(this).text());
-					$(this).empty().slider({
-						value: value,
-						range: "min",
-						animate: true,
-						orientation: "vertical"
-					});
-				});
-
-
-				// Progressbar
-				$("#progressbar").progressbar({
-					value: 20
-				});
-
-				//hover states on the static widgets
-				$('#dialog_link, ul#icons li').hover(
-					function() { $(this).addClass('ui-state-hover'); },
-					function() { $(this).removeClass('ui-state-hover'); }
-				);
-
-				$(".buttonset > button").button()
-				.next()
-				.button({
-					text: false,
-					icons: {
-						primary: "ui-icon-triangle-1-s"
-					}
-				})
-				.parent()
-				.buttonset();
-
-
-				$('#beginning').button({
-					text: false,
-					icons: {
-						primary: 'ui-icon-seek-start'
-					}
-				});
-				$('#rewind').button({
-					text: false,
-					icons: {
-						primary: 'ui-icon-seek-prev'
-					}
-				});
-				$('#play').button({
-					text: false,
-					icons: {
-						primary: 'ui-icon-play'
-					}
-				});
-				$('#stop').button({
-					text: false,
-					icons: {
-						primary: 'ui-icon-stop'
-					}
-				});
-				$('#forward').button({
-					text: false,
-					icons: {
-						primary: 'ui-icon-seek-next'
-					}
-				});
-				$('#end').button({
-					text: false,
-					icons: {
-						primary: 'ui-icon-seek-end'
-					}
-				});
-				$("#shuffle").button();
-				$("#repeat").buttonset();
-
+<html lang="en">
+<head>
+	<meta charset="utf-8">
+	<title>jQuery UI Example Page</title>
+	<link rel="stylesheet" href="../../themes/base/jquery.ui.all.css">
+	<script src="../../jquery-1.10.2.js"></script>
+	<script src="../../ui/jquery.ui.core.js"></script>
+	<script src="../../ui/jquery.ui.widget.js"></script>
+	<script src="../../ui/jquery.ui.mouse.js"></script>
+	<script src="../../ui/jquery.ui.position.js"></script>
+	<script src="../../ui/jquery.ui.accordion.js"></script>
+	<script src="../../ui/jquery.ui.autocomplete.js"></script>
+	<script src="../../ui/jquery.ui.button.js"></script>
+	<script src="../../ui/jquery.ui.datepicker.js"></script>
+	<script src="../../ui/jquery.ui.dialog.js"></script>
+	<script src="../../ui/jquery.ui.draggable.js"></script>
+	<script src="../../ui/jquery.ui.droppable.js"></script>
+	<script src="../../ui/jquery.ui.progressbar.js"></script>
+	<script src="../../ui/jquery.ui.resizable.js"></script>
+	<script src="../../ui/jquery.ui.selectable.js"></script>
+	<script src="../../ui/jquery.ui.slider.js"></script>
+	<script src="../../ui/jquery.ui.sortable.js"></script>
+	<script src="../../ui/jquery.ui.tabs.js"></script>
+	<script>
+	$(function(){
+
+		// Accordion
+		$(".accordion").accordion({ header: "h3" });
+		$(".accordion").last().accordion("option", "icons", false);
+
+		// Tabs
+		$('#tabs').tabs();
+
+		// Dialog
+		$('#dialog').dialog({
+			autoOpen: false,
+			width: 600,
+			buttons: {
+				"Ok": function() {
+					$(this).dialog("close");
+				},
+				"Cancel": function() {
+					$(this).dialog("close");
+				}
+			}
+		});
+
+		// Dialog Link
+		$('#dialog_link').click(function(){
+			$('#dialog').dialog('open');
+			return false;
+		});
+
+		// Datepicker
+		$('#datepicker').datepicker({
+			inline: true,
+			showWeek: true
+		});
+
+		$('#multidatepicker').datepicker({
+			numberOfMonths: 3,
+			showButtonPanel: true,
+			inline: true
+		});
+
+		// Slider
+		$('.slider').slider({
+			range: true,
+			values: [17, 67]
+		});
+
+		$("#eq > span").each(function() {
+			var value = parseInt($(this).text());
+			$(this).empty().slider({
+				value: value,
+				range: "min",
+				animate: true,
+				orientation: "vertical"
 			});
-		</script>
-		<style type="text/css">
-			/*demo page css*/
-			body{ font: 62.5% "Trebuchet MS", sans-serif; margin: 50px;}
-			.demoHeaders { margin-top: 2em; clear:both; }
-			#dialog_link {padding: .4em 1em .4em 20px;text-decoration: none;position: relative;}
-			#dialog_link span.ui-icon {margin: 0 5px 0 0;position: absolute;left: .2em;top: 50%;margin-top: -8px;}
-			ul#icons {margin: 0; padding: 0;}
-			ul#icons li {margin: 2px; position: relative; padding: 4px 0; cursor: pointer; float: left;  list-style: none;}
-			ul#icons span.ui-icon {float: left; margin: 0 4px;}
-			.columnbox { height: 150px; width: 48%; float:left; margin-right: 1%; }
-			#eq span { 	height:120px; float:left; margin:15px 	}
-			.buttonset {margin-bottom: 5px; }
-			#toolbar { padding: 10px 4px;  }
-		</style>
-	</head>
-	<body>
-
-	<!-- <p style="font-size: 1.3em; line-height: 1.5; margin: 1em 0; width: 50%;">This page demonstrates the widgets using a theme.</p> -->
-		<div id="switcher" style="position:absolute; right: 20px; top: 20px;"></div>
-
-		<!-- Accordion -->
-		<h2 class="demoHeaders">Accordion</h2>
-		<div class="columnbox">
-			<div class="accordion">
-				<div>
-					<h3><a href="#">First</a></h3>
-					<div>Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet.</div>
-				</div>
-				<div>
-					<h3><a href="#">Second</a></h3>
-					<div>Phasellus mattis tincidunt nibh.</div>
-				</div>
-				<div>
-					<h3><a href="#">Third</a></h3>
-					<div>Nam dui erat, auctor a, dignissim quis.</div>
-				</div>
-			</div>
-		</div>
-		<div class="columnbox">
-			<div class="accordion">
-				<div>
-					<h3><a href="#">First no icons</a></h3>
-					<div>Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet.</div>
-				</div>
-				<div>
-					<h3><a href="#">Second no icons</a></h3>
-					<div>Phasellus mattis tincidunt nibh.</div>
-				</div>
-				<div>
-					<h3><a href="#">Third no icons</a></h3>
-					<div>Nam dui erat, auctor a, dignissim quis.</div>
-				</div>
-			</div>
-		</div>
-
-
-		<!-- Tabs -->
-		<h2 class="demoHeaders">Tabs</h2>
-		<div id="tabs">
-			<ul>
-				<li><a href="#tabs-1">First</a></li>
-				<li><a href="#tabs-2">Second</a></li>
-				<li><a href="#tabs-3">Third</a></li>
-			</ul>
-			<div id="tabs-1">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</div>
-			<div id="tabs-2">Phasellus mattis tincidunt nibh. Cras orci urna, blandit id, pretium vel, aliquet ornare, felis. Maecenas scelerisque sem non nisl. Fusce sed lorem in enim dictum bibendum.</div>
-			<div id="tabs-3">Nam dui erat, auctor a, dignissim quis, sollicitudin eu, felis. Pellentesque nisi urna, interdum eget, sagittis et, consequat vestibulum, lacus. Mauris porttitor ullamcorper augue.</div>
-		</div>
-
-		<!-- Dialog NOTE: Dialog is not generated by UI in this demo so it can be visually styled in themeroller-->
-		<h2 class="demoHeaders">Dialog</h2>
-		<p><a href="#" id="dialog_link" class="ui-state-default ui-corner-all"><span class="ui-icon ui-icon-newwin"></span>Open Dialog</a></p>
-
-		<div class="ui-dialog ui-widget ui-widget-content ui-corner-all  ui-draggable ui-resizable" ><div class="ui-dialog-titlebar ui-widget-header ui-corner-all ui-helper-clearfix"><span class="ui-dialog-title">Inline Dialog</span><a href="#" class="ui-dialog-titlebar-close ui-corner-all" ><span class="ui-icon ui-icon-closethick" >close</span></a></div><div class="ui-dialog-content ui-widget-content" >
-		<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
-		</div><div class="ui-resizable-handle ui-resizable-n" ></div><div class="ui-resizable-handle ui-resizable-e" ></div><div class="ui-resizable-handle ui-resizable-s" ></div><div class="ui-resizable-handle ui-resizable-w" ></div><div class="ui-resizable-handle ui-resizable-se ui-icon ui-icon-gripsmall-diagonal-se ui-icon-grip-diagonal-se" ></div><div class="ui-resizable-handle ui-resizable-sw" ></div><div class="ui-resizable-handle ui-resizable-ne" ></div><div class="ui-resizable-handle ui-resizable-nw" ></div><div class="ui-dialog-buttonpane ui-widget-content ui-helper-clearfix"><button type="button" class="ui-button ui-widget ui-state-default ui-corner-all ui-button-text-only" role="button" aria-disabled="false"><span class="ui-button-text">Ok</span></button><button type="button" class="ui-button ui-widget ui-state-default ui-corner-all ui-button-text-only" role="button" aria-disabled="false"><span class="ui-button-text">Cancel</span></button></div></div>
-
-
-		<h2 class="demoHeaders">Overlay and Shadow Classes <em>(not currently used in UI widgets)</em></h2>
-		<div style="position: relative; width: 96%; height: 200px; padding:1% 2%; overflow:hidden;" class="fakewindowcontain">
-			<p>Lorem ipsum dolor sit amet,  Nulla nec tortor. Donec id elit quis purus consectetur consequat. </p><p>Nam congue semper tellus. Sed erat dolor, dapibus sit amet, venenatis ornare, ultrices ut, nisi. Aliquam ante. Suspendisse scelerisque dui nec velit. Duis augue augue, gravida euismod, vulputate ac, facilisis id, sem. Morbi in orci. </p><p>Nulla purus lacus, pulvinar vel, malesuada ac, mattis nec, quam. Nam molestie scelerisque quam. Nullam feugiat cursus lacus.orem ipsum dolor sit amet, consectetur adipiscing elit. Donec libero risus, commodo vitae, pharetra mollis, posuere eu, pede. Nulla nec tortor. Donec id elit quis purus consectetur consequat. </p><p>Nam congue semper tellus. Sed erat dolor, dapibus sit amet, venenatis ornare, ultrices ut, nisi. Aliquam ante. Suspendisse scelerisque dui nec velit. Duis augue augue, gravida euismod, vulputate ac, facilisis id, sem. Morbi in orci. Nulla purus lacus, pulvinar vel, malesuada ac, mattis nec, quam. Nam molestie scelerisque quam. </p><p>Nullam feugiat cursus lacus.orem ipsum dolor sit amet, consectetur adipiscing elit. Donec libero risus, commodo vitae, pharetra mollis, posuere eu, pede. Nulla nec tortor. Donec id elit quis purus consectetur consequat. Nam congue semper tellus. Sed erat dolor, dapibus sit amet, venenatis ornare, ultrices ut, nisi. Aliquam ante. </p><p>Suspendisse scelerisque dui nec velit. Duis augue augue, gravida euismod, vulputate ac, facilisis id, sem. Morbi in orci. Nulla purus lacus, pulvinar vel, malesuada ac, mattis nec, quam. Nam molestie scelerisque quam. Nullam feugiat cursus lacus.orem ipsum dolor sit amet, consectetur adipiscing elit. Donec libero risus, commodo vitae, pharetra mollis, posuere eu, pede. Nulla nec tortor. Donec id elit quis purus consectetur consequat. Nam congue semper tellus. Sed erat dolor, dapibus sit amet, venenatis ornare, ultrices ut, nisi. </p>
-
-			<!-- ui-dialog -->
-			<div class="ui-overlay"><div class="ui-widget-overlay"></div><div class="ui-widget-shadow ui-corner-all" style="width: 302px; height: 152px; position: absolute; left: 50px; top: 30px;"></div></div>
-			<div style="position: absolute; width: 280px; height: 130px;left: 50px; top: 30px; padding: 10px;" class="ui-widget ui-widget-content ui-corner-all">
-				<div class="ui-dialog-content ui-widget-content" style="background: none; border: 0;">
-					<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
-				</div>
-			</div>
-
-		</div>
-
-
-		<!-- ui-dialog -->
-		<div id="dialog" title="Dialog Title">
-			<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
-		</div>
-
-
-
-		<h2 class="demoHeaders">Framework Icons (content color preview)</h2>
-		<ul id="icons" class="ui-widget ui-helper-clearfix">
-
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-carat-1-n"><span class="ui-icon ui-icon-carat-1-n"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-carat-1-ne"><span class="ui-icon ui-icon-carat-1-ne"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-carat-1-e"><span class="ui-icon ui-icon-carat-1-e"></span></li>
-
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-carat-1-se"><span class="ui-icon ui-icon-carat-1-se"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-carat-1-s"><span class="ui-icon ui-icon-carat-1-s"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-carat-1-sw"><span class="ui-icon ui-icon-carat-1-sw"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-carat-1-w"><span class="ui-icon ui-icon-carat-1-w"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-carat-1-nw"><span class="ui-icon ui-icon-carat-1-nw"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-carat-2-n-s"><span class="ui-icon ui-icon-carat-2-n-s"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-carat-2-e-w"><span class="ui-icon ui-icon-carat-2-e-w"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-triangle-1-n"><span class="ui-icon ui-icon-triangle-1-n"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-triangle-1-ne"><span class="ui-icon ui-icon-triangle-1-ne"></span></li>
-
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-triangle-1-e"><span class="ui-icon ui-icon-triangle-1-e"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-triangle-1-se"><span class="ui-icon ui-icon-triangle-1-se"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-triangle-1-s"><span class="ui-icon ui-icon-triangle-1-s"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-triangle-1-sw"><span class="ui-icon ui-icon-triangle-1-sw"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-triangle-1-w"><span class="ui-icon ui-icon-triangle-1-w"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-triangle-1-nw"><span class="ui-icon ui-icon-triangle-1-nw"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-triangle-2-n-s"><span class="ui-icon ui-icon-triangle-2-n-s"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-triangle-2-e-w"><span class="ui-icon ui-icon-triangle-2-e-w"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-arrow-1-n"><span class="ui-icon ui-icon-arrow-1-n"></span></li>
-
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-arrow-1-ne"><span class="ui-icon ui-icon-arrow-1-ne"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-arrow-1-e"><span class="ui-icon ui-icon-arrow-1-e"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-arrow-1-se"><span class="ui-icon ui-icon-arrow-1-se"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-arrow-1-s"><span class="ui-icon ui-icon-arrow-1-s"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-arrow-1-sw"><span class="ui-icon ui-icon-arrow-1-sw"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-arrow-1-w"><span class="ui-icon ui-icon-arrow-1-w"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-arrow-1-nw"><span class="ui-icon ui-icon-arrow-1-nw"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-arrow-2-n-s"><span class="ui-icon ui-icon-arrow-2-n-s"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-arrow-2-ne-sw"><span class="ui-icon ui-icon-arrow-2-ne-sw"></span></li>
-
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-arrow-2-e-w"><span class="ui-icon ui-icon-arrow-2-e-w"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-arrow-2-se-nw"><span class="ui-icon ui-icon-arrow-2-se-nw"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-arrowstop-1-n"><span class="ui-icon ui-icon-arrowstop-1-n"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-arrowstop-1-e"><span class="ui-icon ui-icon-arrowstop-1-e"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-arrowstop-1-s"><span class="ui-icon ui-icon-arrowstop-1-s"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-arrowstop-1-w"><span class="ui-icon ui-icon-arrowstop-1-w"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-arrowthick-1-n"><span class="ui-icon ui-icon-arrowthick-1-n"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-arrowthick-1-ne"><span class="ui-icon ui-icon-arrowthick-1-ne"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-arrowthick-1-e"><span class="ui-icon ui-icon-arrowthick-1-e"></span></li>
-
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-arrowthick-1-se"><span class="ui-icon ui-icon-arrowthick-1-se"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-arrowthick-1-s"><span class="ui-icon ui-icon-arrowthick-1-s"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-arrowthick-1-sw"><span class="ui-icon ui-icon-arrowthick-1-sw"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-arrowthick-1-w"><span class="ui-icon ui-icon-arrowthick-1-w"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-arrowthick-1-nw"><span class="ui-icon ui-icon-arrowthick-1-nw"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-arrowthick-2-n-s"><span class="ui-icon ui-icon-arrowthick-2-n-s"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-arrowthick-2-ne-sw"><span class="ui-icon ui-icon-arrowthick-2-ne-sw"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-arrowthick-2-e-w"><span class="ui-icon ui-icon-arrowthick-2-e-w"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-arrowthick-2-se-nw"><span class="ui-icon ui-icon-arrowthick-2-se-nw"></span></li>
-
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-arrowthickstop-1-n"><span class="ui-icon ui-icon-arrowthickstop-1-n"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-arrowthickstop-1-e"><span class="ui-icon ui-icon-arrowthickstop-1-e"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-arrowthickstop-1-s"><span class="ui-icon ui-icon-arrowthickstop-1-s"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-arrowthickstop-1-w"><span class="ui-icon ui-icon-arrowthickstop-1-w"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-arrowreturnthick-1-w"><span class="ui-icon ui-icon-arrowreturnthick-1-w"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-arrowreturnthick-1-n"><span class="ui-icon ui-icon-arrowreturnthick-1-n"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-arrowreturnthick-1-e"><span class="ui-icon ui-icon-arrowreturnthick-1-e"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-arrowreturnthick-1-s"><span class="ui-icon ui-icon-arrowreturnthick-1-s"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-arrowreturn-1-w"><span class="ui-icon ui-icon-arrowreturn-1-w"></span></li>
-
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-arrowreturn-1-n"><span class="ui-icon ui-icon-arrowreturn-1-n"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-arrowreturn-1-e"><span class="ui-icon ui-icon-arrowreturn-1-e"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-arrowreturn-1-s"><span class="ui-icon ui-icon-arrowreturn-1-s"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-arrowrefresh-1-w"><span class="ui-icon ui-icon-arrowrefresh-1-w"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-arrowrefresh-1-n"><span class="ui-icon ui-icon-arrowrefresh-1-n"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-arrowrefresh-1-e"><span class="ui-icon ui-icon-arrowrefresh-1-e"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-arrowrefresh-1-s"><span class="ui-icon ui-icon-arrowrefresh-1-s"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-arrow-4"><span class="ui-icon ui-icon-arrow-4"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-arrow-4-diag"><span class="ui-icon ui-icon-arrow-4-diag"></span></li>
-
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-extlink"><span class="ui-icon ui-icon-extlink"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-newwin"><span class="ui-icon ui-icon-newwin"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-refresh"><span class="ui-icon ui-icon-refresh"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-shuffle"><span class="ui-icon ui-icon-shuffle"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-transfer-e-w"><span class="ui-icon ui-icon-transfer-e-w"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-transferthick-e-w"><span class="ui-icon ui-icon-transferthick-e-w"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-folder-collapsed"><span class="ui-icon ui-icon-folder-collapsed"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-folder-open"><span class="ui-icon ui-icon-folder-open"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-document"><span class="ui-icon ui-icon-document"></span></li>
-
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-document-b"><span class="ui-icon ui-icon-document-b"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-note"><span class="ui-icon ui-icon-note"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-mail-closed"><span class="ui-icon ui-icon-mail-closed"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-mail-open"><span class="ui-icon ui-icon-mail-open"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-suitcase"><span class="ui-icon ui-icon-suitcase"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-comment"><span class="ui-icon ui-icon-comment"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-person"><span class="ui-icon ui-icon-person"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-print"><span class="ui-icon ui-icon-print"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-trash"><span class="ui-icon ui-icon-trash"></span></li>
-
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-locked"><span class="ui-icon ui-icon-locked"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-unlocked"><span class="ui-icon ui-icon-unlocked"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-bookmark"><span class="ui-icon ui-icon-bookmark"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-tag"><span class="ui-icon ui-icon-tag"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-home"><span class="ui-icon ui-icon-home"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-flag"><span class="ui-icon ui-icon-flag"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-calculator"><span class="ui-icon ui-icon-calculator"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-cart"><span class="ui-icon ui-icon-cart"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-pencil"><span class="ui-icon ui-icon-pencil"></span></li>
-
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-clock"><span class="ui-icon ui-icon-clock"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-disk"><span class="ui-icon ui-icon-disk"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-calendar"><span class="ui-icon ui-icon-calendar"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-zoomin"><span class="ui-icon ui-icon-zoomin"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-zoomout"><span class="ui-icon ui-icon-zoomout"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-search"><span class="ui-icon ui-icon-search"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-wrench"><span class="ui-icon ui-icon-wrench"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-gear"><span class="ui-icon ui-icon-gear"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-heart"><span class="ui-icon ui-icon-heart"></span></li>
-
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-star"><span class="ui-icon ui-icon-star"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-link"><span class="ui-icon ui-icon-link"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-cancel"><span class="ui-icon ui-icon-cancel"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-plus"><span class="ui-icon ui-icon-plus"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-plusthick"><span class="ui-icon ui-icon-plusthick"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-minus"><span class="ui-icon ui-icon-minus"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-minusthick"><span class="ui-icon ui-icon-minusthick"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-close"><span class="ui-icon ui-icon-close"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-closethick"><span class="ui-icon ui-icon-closethick"></span></li>
-
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-key"><span class="ui-icon ui-icon-key"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-lightbulb"><span class="ui-icon ui-icon-lightbulb"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-scissors"><span class="ui-icon ui-icon-scissors"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-clipboard"><span class="ui-icon ui-icon-clipboard"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-copy"><span class="ui-icon ui-icon-copy"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-contact"><span class="ui-icon ui-icon-contact"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-image"><span class="ui-icon ui-icon-image"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-video"><span class="ui-icon ui-icon-video"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-script"><span class="ui-icon ui-icon-script"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-alert"><span class="ui-icon ui-icon-alert"></span></li>
-
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-info"><span class="ui-icon ui-icon-info"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-notice"><span class="ui-icon ui-icon-notice"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-help"><span class="ui-icon ui-icon-help"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-check"><span class="ui-icon ui-icon-check"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-bullet"><span class="ui-icon ui-icon-bullet"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-radio-off"><span class="ui-icon ui-icon-radio-off"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-radio-on"><span class="ui-icon ui-icon-radio-on"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-pin-w"><span class="ui-icon ui-icon-pin-w"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-pin-s"><span class="ui-icon ui-icon-pin-s"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-play"><span class="ui-icon ui-icon-play"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-pause"><span class="ui-icon ui-icon-pause"></span></li>
-
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-seek-next"><span class="ui-icon ui-icon-seek-next"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-seek-prev"><span class="ui-icon ui-icon-seek-prev"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-seek-end"><span class="ui-icon ui-icon-seek-end"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-seek-first"><span class="ui-icon ui-icon-seek-first"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-stop"><span class="ui-icon ui-icon-stop"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-eject"><span class="ui-icon ui-icon-eject"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-volume-off"><span class="ui-icon ui-icon-volume-off"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-volume-on"><span class="ui-icon ui-icon-volume-on"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-power"><span class="ui-icon ui-icon-power"></span></li>
-
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-signal-diag"><span class="ui-icon ui-icon-signal-diag"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-signal"><span class="ui-icon ui-icon-signal"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-battery-0"><span class="ui-icon ui-icon-battery-0"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-battery-1"><span class="ui-icon ui-icon-battery-1"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-battery-2"><span class="ui-icon ui-icon-battery-2"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-battery-3"><span class="ui-icon ui-icon-battery-3"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-circle-plus"><span class="ui-icon ui-icon-circle-plus"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-circle-minus"><span class="ui-icon ui-icon-circle-minus"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-circle-close"><span class="ui-icon ui-icon-circle-close"></span></li>
-
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-circle-triangle-e"><span class="ui-icon ui-icon-circle-triangle-e"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-circle-triangle-s"><span class="ui-icon ui-icon-circle-triangle-s"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-circle-triangle-w"><span class="ui-icon ui-icon-circle-triangle-w"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-circle-triangle-n"><span class="ui-icon ui-icon-circle-triangle-n"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-circle-arrow-e"><span class="ui-icon ui-icon-circle-arrow-e"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-circle-arrow-s"><span class="ui-icon ui-icon-circle-arrow-s"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-circle-arrow-w"><span class="ui-icon ui-icon-circle-arrow-w"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-circle-arrow-n"><span class="ui-icon ui-icon-circle-arrow-n"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-circle-zoomin"><span class="ui-icon ui-icon-circle-zoomin"></span></li>
-
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-circle-zoomout"><span class="ui-icon ui-icon-circle-zoomout"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-circle-check"><span class="ui-icon ui-icon-circle-check"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-circlesmall-plus"><span class="ui-icon ui-icon-circlesmall-plus"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-circlesmall-minus"><span class="ui-icon ui-icon-circlesmall-minus"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-circlesmall-close"><span class="ui-icon ui-icon-circlesmall-close"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-squaresmall-plus"><span class="ui-icon ui-icon-squaresmall-plus"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-squaresmall-minus"><span class="ui-icon ui-icon-squaresmall-minus"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-squaresmall-close"><span class="ui-icon ui-icon-squaresmall-close"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-grip-dotted-vertical"><span class="ui-icon ui-icon-grip-dotted-vertical"></span></li>
-
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-grip-dotted-horizontal"><span class="ui-icon ui-icon-grip-dotted-horizontal"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-grip-solid-vertical"><span class="ui-icon ui-icon-grip-solid-vertical"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-grip-solid-horizontal"><span class="ui-icon ui-icon-grip-solid-horizontal"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-gripsmall-diagonal-se"><span class="ui-icon ui-icon-gripsmall-diagonal-se"></span></li>
-		<li class="ui-state-default ui-corner-all" title=".ui-icon-grip-diagonal-se"><span class="ui-icon ui-icon-grip-diagonal-se"></span></li>
-		</ul>
-
-
-		<!-- Slider -->
-		<h2 class="demoHeaders">Slider</h2>
-		<div class="columnbox">
-			<div class="slider"></div>
+		});
+
+
+		// Progressbar
+		$("#progressbar").progressbar({
+			value: 20
+		});
+
+		//hover states on the static widgets
+		$('#dialog_link, ul#icons li').hover(
+			function() { $(this).addClass('ui-state-hover'); },
+			function() { $(this).removeClass('ui-state-hover'); }
+		);
+
+		$(".buttonset > button").button()
+		.next()
+		.button({
+			text: false,
+			icons: {
+				primary: "ui-icon-triangle-1-s"
+			}
+		})
+		.parent()
+		.buttonset();
+
+
+		$('#beginning').button({
+			text: false,
+			icons: {
+				primary: 'ui-icon-seek-start'
+			}
+		});
+		$('#rewind').button({
+			text: false,
+			icons: {
+				primary: 'ui-icon-seek-prev'
+			}
+		});
+		$('#play').button({
+			text: false,
+			icons: {
+				primary: 'ui-icon-play'
+			}
+		});
+		$('#stop').button({
+			text: false,
+			icons: {
+				primary: 'ui-icon-stop'
+			}
+		});
+		$('#forward').button({
+			text: false,
+			icons: {
+				primary: 'ui-icon-seek-next'
+			}
+		});
+		$('#end').button({
+			text: false,
+			icons: {
+				primary: 'ui-icon-seek-end'
+			}
+		});
+		$("#shuffle").button();
+		$("#repeat").buttonset();
+
+	});
+	</script>
+	<style>
+		/*demo page css*/
+		body{ font: 62.5% "Trebuchet MS", sans-serif; margin: 50px;}
+		.demoHeaders { margin-top: 2em; clear:both; }
+		#dialog_link {padding: .4em 1em .4em 20px;text-decoration: none;position: relative;}
+		#dialog_link span.ui-icon {margin: 0 5px 0 0;position: absolute;left: .2em;top: 50%;margin-top: -8px;}
+		ul#icons {margin: 0; padding: 0;}
+		ul#icons li {margin: 2px; position: relative; padding: 4px 0; cursor: pointer; float: left;  list-style: none;}
+		ul#icons span.ui-icon {float: left; margin: 0 4px;}
+		.columnbox { height: 150px; width: 48%; float:left; margin-right: 1%; }
+		#eq span { 	height:120px; float:left; margin:15px 	}
+		.buttonset {margin-bottom: 5px; }
+		#toolbar { padding: 10px 4px;  }
+	</style>
+</head>
+<body>
+
+<div id="switcher" style="position:absolute; right: 20px; top: 20px;"></div>
+
+<!-- Accordion -->
+<h2 class="demoHeaders">Accordion</h2>
+<div class="columnbox">
+	<div class="accordion">
+		<div>
+			<h3><a href="#">First</a></h3>
+			<div>Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet.</div>
 		</div>
-		<div class="columnbox">
-			<div id="eq">
-				<span>88</span>
-				<span>77</span>
-				<span>55</span>
-				<span>33</span>
-				<span>40</span>
-				<span>45</span>
-				<span>70</span>
-			</div>
+		<div>
+			<h3><a href="#">Second</a></h3>
+			<div>Phasellus mattis tincidunt nibh.</div>
 		</div>
-
-
-		<!-- Datepicker -->
-		<h2 class="demoHeaders">Datepicker</h2>
-		<div class="columnbox" style="width: 32%">
-			<div id="datepicker"></div>
+		<div>
+			<h3><a href="#">Third</a></h3>
+			<div>Nam dui erat, auctor a, dignissim quis.</div>
 		</div>
-		<div class="columnbox" style="width: 66%; height: 220px;">
-			<div id="multidatepicker"></div>
+	</div>
+</div>
+<div class="columnbox">
+	<div class="accordion">
+		<div>
+			<h3><a href="#">First no icons</a></h3>
+			<div>Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet.</div>
 		</div>
-
-
-		<!-- Progressbar -->
-		<h2 class="demoHeaders">Progressbar</h2>
-		<div id="progressbar"></div>
-
-		<!-- Highlight / Error -->
-		<h2 class="demoHeaders">Highlight / Error</h2>
-		<div class="ui-widget">
-			<div class="ui-state-highlight ui-corner-all" style="margin-top: 20px; padding: 0 .7em;">
-				<p><span class="ui-icon ui-icon-info" style="float: left; margin-right: .3em;"></span>
-				<strong>Hey!</strong> Sample ui-state-highlight style.</p>
-			</div>
+		<div>
+			<h3><a href="#">Second no icons</a></h3>
+			<div>Phasellus mattis tincidunt nibh.</div>
 		</div>
-		<br/>
-		<div class="ui-widget">
-			<div class="ui-state-error ui-corner-all" style="padding: 0 .7em;">
-				<p><span class="ui-icon ui-icon-alert" style="float: left; margin-right: .3em;"></span>
-				<strong>Alert:</strong> Sample ui-state-error style.</p>
-			</div>
+		<div>
+			<h3><a href="#">Third no icons</a></h3>
+			<div>Nam dui erat, auctor a, dignissim quis.</div>
 		</div>
-
-		<h2 class="demoHeaders">Button</h2>
-
-		<div class="buttonset">
-			<button id="rerun">Run last action</button>
-			<button id="select">Select an action</button>
+	</div>
+</div>
+
+
+<!-- Tabs -->
+<h2 class="demoHeaders">Tabs</h2>
+<div id="tabs">
+	<ul>
+		<li><a href="#tabs-1">First</a></li>
+		<li><a href="#tabs-2">Second</a></li>
+		<li><a href="#tabs-3">Third</a></li>
+	</ul>
+	<div id="tabs-1">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</div>
+	<div id="tabs-2">Phasellus mattis tincidunt nibh. Cras orci urna, blandit id, pretium vel, aliquet ornare, felis. Maecenas scelerisque sem non nisl. Fusce sed lorem in enim dictum bibendum.</div>
+	<div id="tabs-3">Nam dui erat, auctor a, dignissim quis, sollicitudin eu, felis. Pellentesque nisi urna, interdum eget, sagittis et, consequat vestibulum, lacus. Mauris porttitor ullamcorper augue.</div>
+</div>
+
+<!-- Dialog NOTE: Dialog is not generated by UI in this demo so it can be visually styled in themeroller-->
+<h2 class="demoHeaders">Dialog</h2>
+<p><a href="#" id="dialog_link" class="ui-state-default ui-corner-all"><span class="ui-icon ui-icon-newwin"></span>Open Dialog</a></p>
+
+<div class="ui-dialog ui-widget ui-widget-content ui-corner-all  ui-draggable ui-resizable" ><div class="ui-dialog-titlebar ui-widget-header ui-corner-all ui-helper-clearfix"><span class="ui-dialog-title">Inline Dialog</span><a href="#" class="ui-dialog-titlebar-close ui-corner-all" ><span class="ui-icon ui-icon-closethick" >close</span></a></div><div class="ui-dialog-content ui-widget-content" >
+<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
+</div><div class="ui-resizable-handle ui-resizable-n" ></div><div class="ui-resizable-handle ui-resizable-e" ></div><div class="ui-resizable-handle ui-resizable-s" ></div><div class="ui-resizable-handle ui-resizable-w" ></div><div class="ui-resizable-handle ui-resizable-se ui-icon ui-icon-gripsmall-diagonal-se ui-icon-grip-diagonal-se" ></div><div class="ui-resizable-handle ui-resizable-sw" ></div><div class="ui-resizable-handle ui-resizable-ne" ></div><div class="ui-resizable-handle ui-resizable-nw" ></div><div class="ui-dialog-buttonpane ui-widget-content ui-helper-clearfix"><button type="button" class="ui-button ui-widget ui-state-default ui-corner-all ui-button-text-only" role="button" aria-disabled="false"><span class="ui-button-text">Ok</span></button><button type="button" class="ui-button ui-widget ui-state-default ui-corner-all ui-button-text-only" role="button" aria-disabled="false"><span class="ui-button-text">Cancel</span></button></div></div>
+
+
+<h2 class="demoHeaders">Overlay and Shadow Classes <em>(not currently used in UI widgets)</em></h2>
+<div style="position: relative; width: 96%; height: 200px; padding:1% 2%; overflow:hidden;" class="fakewindowcontain">
+	<p>Lorem ipsum dolor sit amet,  Nulla nec tortor. Donec id elit quis purus consectetur consequat. </p><p>Nam congue semper tellus. Sed erat dolor, dapibus sit amet, venenatis ornare, ultrices ut, nisi. Aliquam ante. Suspendisse scelerisque dui nec velit. Duis augue augue, gravida euismod, vulputate ac, facilisis id, sem. Morbi in orci. </p><p>Nulla purus lacus, pulvinar vel, malesuada ac, mattis nec, quam. Nam molestie scelerisque quam. Nullam feugiat cursus lacus.orem ipsum dolor sit amet, consectetur adipiscing elit. Donec libero risus, commodo vitae, pharetra mollis, posuere eu, pede. Nulla nec tortor. Donec id elit quis purus consectetur consequat. </p><p>Nam congue semper tellus. Sed erat dolor, dapibus sit amet, venenatis ornare, ultrices ut, nisi. Aliquam ante. Suspendisse scelerisque dui nec velit. Duis augue augue, gravida euismod, vulputate ac, facilisis id, sem. Morbi in orci. Nulla purus lacus, pulvinar vel, malesuada ac, mattis nec, quam. Nam molestie scelerisque quam. </p><p>Nullam feugiat cursus lacus.orem ipsum dolor sit amet, consectetur adipiscing elit. Donec libero risus, commodo vitae, pharetra mollis, posuere eu, pede. Nulla nec tortor. Donec id elit quis purus consectetur consequat. Nam congue semper tellus. Sed erat dolor, dapibus sit amet, venenatis ornare, ultrices ut, nisi. Aliquam ante. </p><p>Suspendisse scelerisque dui nec velit. Duis augue augue, gravida euismod, vulputate ac, facilisis id, sem. Morbi in orci. Nulla purus lacus, pulvinar vel, malesuada ac, mattis nec, quam. Nam molestie scelerisque quam. Nullam feugiat cursus lacus.orem ipsum dolor sit amet, consectetur adipiscing elit. Donec libero risus, commodo vitae, pharetra mollis, posuere eu, pede. Nulla nec tortor. Donec id elit quis purus consectetur consequat. Nam congue semper tellus. Sed erat dolor, dapibus sit amet, venenatis ornare, ultrices ut, nisi. </p>
+
+	<!-- ui-dialog -->
+	<div class="ui-overlay"><div class="ui-widget-overlay"></div><div class="ui-widget-shadow ui-corner-all" style="width: 302px; height: 152px; position: absolute; left: 50px; top: 30px;"></div></div>
+	<div style="position: absolute; width: 280px; height: 130px;left: 50px; top: 30px; padding: 10px;" class="ui-widget ui-widget-content ui-corner-all">
+		<div class="ui-dialog-content ui-widget-content" style="background: none; border: 0;">
+			<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
 		</div>
-
-		<span id="toolbar" class="ui-widget-header ui-corner-all">
-			<button id="beginning">go to beginning</button>
-			<button id="rewind">rewind</button>
-			<button id="play">play</button>
-			<button id="stop">stop</button>
-			<button id="forward">fast forward</button>
-			<button id="end">go to end</button>
-
-			<input type="checkbox" id="shuffle" /><label for="shuffle">Shuffle</label>
-
-			<span id="repeat">
-				<input type="radio" id="repeat0" name="repeat" checked="checked" /><label for="repeat0">No Repeat</label>
-				<input type="radio" id="repeat1" name="repeat" /><label for="repeat1">Once</label>
-				<input type="radio" id="repeatall" name="repeat" /><label for="repeatall">All</label>
-			</span>
-		</span>
-
-		<!-- theme switcher -->
-
-	<script src="http://jqueryui.com/themeroller/themeswitchertool/"></script>
-	<script>
-		$('#switcher').themeswitcher();
-	</script>
-
-
-
-	</body>
+	</div>
+
+</div>
+
+
+<!-- ui-dialog -->
+<div id="dialog" title="Dialog Title">
+	<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
+</div>
+
+
+
+<h2 class="demoHeaders">Framework Icons (content color preview)</h2>
+<ul id="icons" class="ui-widget ui-helper-clearfix">
+
+<li class="ui-state-default ui-corner-all" title=".ui-icon-carat-1-n"><span class="ui-icon ui-icon-carat-1-n"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-carat-1-ne"><span class="ui-icon ui-icon-carat-1-ne"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-carat-1-e"><span class="ui-icon ui-icon-carat-1-e"></span></li>
+
+<li class="ui-state-default ui-corner-all" title=".ui-icon-carat-1-se"><span class="ui-icon ui-icon-carat-1-se"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-carat-1-s"><span class="ui-icon ui-icon-carat-1-s"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-carat-1-sw"><span class="ui-icon ui-icon-carat-1-sw"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-carat-1-w"><span class="ui-icon ui-icon-carat-1-w"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-carat-1-nw"><span class="ui-icon ui-icon-carat-1-nw"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-carat-2-n-s"><span class="ui-icon ui-icon-carat-2-n-s"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-carat-2-e-w"><span class="ui-icon ui-icon-carat-2-e-w"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-triangle-1-n"><span class="ui-icon ui-icon-triangle-1-n"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-triangle-1-ne"><span class="ui-icon ui-icon-triangle-1-ne"></span></li>
+
+<li class="ui-state-default ui-corner-all" title=".ui-icon-triangle-1-e"><span class="ui-icon ui-icon-triangle-1-e"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-triangle-1-se"><span class="ui-icon ui-icon-triangle-1-se"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-triangle-1-s"><span class="ui-icon ui-icon-triangle-1-s"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-triangle-1-sw"><span class="ui-icon ui-icon-triangle-1-sw"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-triangle-1-w"><span class="ui-icon ui-icon-triangle-1-w"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-triangle-1-nw"><span class="ui-icon ui-icon-triangle-1-nw"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-triangle-2-n-s"><span class="ui-icon ui-icon-triangle-2-n-s"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-triangle-2-e-w"><span class="ui-icon ui-icon-triangle-2-e-w"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-arrow-1-n"><span class="ui-icon ui-icon-arrow-1-n"></span></li>
+
+<li class="ui-state-default ui-corner-all" title=".ui-icon-arrow-1-ne"><span class="ui-icon ui-icon-arrow-1-ne"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-arrow-1-e"><span class="ui-icon ui-icon-arrow-1-e"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-arrow-1-se"><span class="ui-icon ui-icon-arrow-1-se"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-arrow-1-s"><span class="ui-icon ui-icon-arrow-1-s"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-arrow-1-sw"><span class="ui-icon ui-icon-arrow-1-sw"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-arrow-1-w"><span class="ui-icon ui-icon-arrow-1-w"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-arrow-1-nw"><span class="ui-icon ui-icon-arrow-1-nw"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-arrow-2-n-s"><span class="ui-icon ui-icon-arrow-2-n-s"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-arrow-2-ne-sw"><span class="ui-icon ui-icon-arrow-2-ne-sw"></span></li>
+
+<li class="ui-state-default ui-corner-all" title=".ui-icon-arrow-2-e-w"><span class="ui-icon ui-icon-arrow-2-e-w"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-arrow-2-se-nw"><span class="ui-icon ui-icon-arrow-2-se-nw"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-arrowstop-1-n"><span class="ui-icon ui-icon-arrowstop-1-n"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-arrowstop-1-e"><span class="ui-icon ui-icon-arrowstop-1-e"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-arrowstop-1-s"><span class="ui-icon ui-icon-arrowstop-1-s"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-arrowstop-1-w"><span class="ui-icon ui-icon-arrowstop-1-w"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-arrowthick-1-n"><span class="ui-icon ui-icon-arrowthick-1-n"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-arrowthick-1-ne"><span class="ui-icon ui-icon-arrowthick-1-ne"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-arrowthick-1-e"><span class="ui-icon ui-icon-arrowthick-1-e"></span></li>
+
+<li class="ui-state-default ui-corner-all" title=".ui-icon-arrowthick-1-se"><span class="ui-icon ui-icon-arrowthick-1-se"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-arrowthick-1-s"><span class="ui-icon ui-icon-arrowthick-1-s"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-arrowthick-1-sw"><span class="ui-icon ui-icon-arrowthick-1-sw"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-arrowthick-1-w"><span class="ui-icon ui-icon-arrowthick-1-w"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-arrowthick-1-nw"><span class="ui-icon ui-icon-arrowthick-1-nw"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-arrowthick-2-n-s"><span class="ui-icon ui-icon-arrowthick-2-n-s"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-arrowthick-2-ne-sw"><span class="ui-icon ui-icon-arrowthick-2-ne-sw"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-arrowthick-2-e-w"><span class="ui-icon ui-icon-arrowthick-2-e-w"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-arrowthick-2-se-nw"><span class="ui-icon ui-icon-arrowthick-2-se-nw"></span></li>
+
+<li class="ui-state-default ui-corner-all" title=".ui-icon-arrowthickstop-1-n"><span class="ui-icon ui-icon-arrowthickstop-1-n"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-arrowthickstop-1-e"><span class="ui-icon ui-icon-arrowthickstop-1-e"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-arrowthickstop-1-s"><span class="ui-icon ui-icon-arrowthickstop-1-s"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-arrowthickstop-1-w"><span class="ui-icon ui-icon-arrowthickstop-1-w"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-arrowreturnthick-1-w"><span class="ui-icon ui-icon-arrowreturnthick-1-w"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-arrowreturnthick-1-n"><span class="ui-icon ui-icon-arrowreturnthick-1-n"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-arrowreturnthick-1-e"><span class="ui-icon ui-icon-arrowreturnthick-1-e"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-arrowreturnthick-1-s"><span class="ui-icon ui-icon-arrowreturnthick-1-s"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-arrowreturn-1-w"><span class="ui-icon ui-icon-arrowreturn-1-w"></span></li>
+
+<li class="ui-state-default ui-corner-all" title=".ui-icon-arrowreturn-1-n"><span class="ui-icon ui-icon-arrowreturn-1-n"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-arrowreturn-1-e"><span class="ui-icon ui-icon-arrowreturn-1-e"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-arrowreturn-1-s"><span class="ui-icon ui-icon-arrowreturn-1-s"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-arrowrefresh-1-w"><span class="ui-icon ui-icon-arrowrefresh-1-w"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-arrowrefresh-1-n"><span class="ui-icon ui-icon-arrowrefresh-1-n"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-arrowrefresh-1-e"><span class="ui-icon ui-icon-arrowrefresh-1-e"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-arrowrefresh-1-s"><span class="ui-icon ui-icon-arrowrefresh-1-s"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-arrow-4"><span class="ui-icon ui-icon-arrow-4"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-arrow-4-diag"><span class="ui-icon ui-icon-arrow-4-diag"></span></li>
+
+<li class="ui-state-default ui-corner-all" title=".ui-icon-extlink"><span class="ui-icon ui-icon-extlink"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-newwin"><span class="ui-icon ui-icon-newwin"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-refresh"><span class="ui-icon ui-icon-refresh"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-shuffle"><span class="ui-icon ui-icon-shuffle"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-transfer-e-w"><span class="ui-icon ui-icon-transfer-e-w"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-transferthick-e-w"><span class="ui-icon ui-icon-transferthick-e-w"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-folder-collapsed"><span class="ui-icon ui-icon-folder-collapsed"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-folder-open"><span class="ui-icon ui-icon-folder-open"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-document"><span class="ui-icon ui-icon-document"></span></li>
+
+<li class="ui-state-default ui-corner-all" title=".ui-icon-document-b"><span class="ui-icon ui-icon-document-b"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-note"><span class="ui-icon ui-icon-note"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-mail-closed"><span class="ui-icon ui-icon-mail-closed"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-mail-open"><span class="ui-icon ui-icon-mail-open"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-suitcase"><span class="ui-icon ui-icon-suitcase"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-comment"><span class="ui-icon ui-icon-comment"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-person"><span class="ui-icon ui-icon-person"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-print"><span class="ui-icon ui-icon-print"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-trash"><span class="ui-icon ui-icon-trash"></span></li>
+
+<li class="ui-state-default ui-corner-all" title=".ui-icon-locked"><span class="ui-icon ui-icon-locked"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-unlocked"><span class="ui-icon ui-icon-unlocked"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-bookmark"><span class="ui-icon ui-icon-bookmark"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-tag"><span class="ui-icon ui-icon-tag"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-home"><span class="ui-icon ui-icon-home"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-flag"><span class="ui-icon ui-icon-flag"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-calculator"><span class="ui-icon ui-icon-calculator"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-cart"><span class="ui-icon ui-icon-cart"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-pencil"><span class="ui-icon ui-icon-pencil"></span></li>
+
+<li class="ui-state-default ui-corner-all" title=".ui-icon-clock"><span class="ui-icon ui-icon-clock"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-disk"><span class="ui-icon ui-icon-disk"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-calendar"><span class="ui-icon ui-icon-calendar"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-zoomin"><span class="ui-icon ui-icon-zoomin"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-zoomout"><span class="ui-icon ui-icon-zoomout"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-search"><span class="ui-icon ui-icon-search"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-wrench"><span class="ui-icon ui-icon-wrench"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-gear"><span class="ui-icon ui-icon-gear"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-heart"><span class="ui-icon ui-icon-heart"></span></li>
+
+<li class="ui-state-default ui-corner-all" title=".ui-icon-star"><span class="ui-icon ui-icon-star"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-link"><span class="ui-icon ui-icon-link"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-cancel"><span class="ui-icon ui-icon-cancel"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-plus"><span class="ui-icon ui-icon-plus"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-plusthick"><span class="ui-icon ui-icon-plusthick"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-minus"><span class="ui-icon ui-icon-minus"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-minusthick"><span class="ui-icon ui-icon-minusthick"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-close"><span class="ui-icon ui-icon-close"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-closethick"><span class="ui-icon ui-icon-closethick"></span></li>
+
+<li class="ui-state-default ui-corner-all" title=".ui-icon-key"><span class="ui-icon ui-icon-key"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-lightbulb"><span class="ui-icon ui-icon-lightbulb"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-scissors"><span class="ui-icon ui-icon-scissors"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-clipboard"><span class="ui-icon ui-icon-clipboard"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-copy"><span class="ui-icon ui-icon-copy"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-contact"><span class="ui-icon ui-icon-contact"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-image"><span class="ui-icon ui-icon-image"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-video"><span class="ui-icon ui-icon-video"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-script"><span class="ui-icon ui-icon-script"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-alert"><span class="ui-icon ui-icon-alert"></span></li>
+
+<li class="ui-state-default ui-corner-all" title=".ui-icon-info"><span class="ui-icon ui-icon-info"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-notice"><span class="ui-icon ui-icon-notice"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-help"><span class="ui-icon ui-icon-help"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-check"><span class="ui-icon ui-icon-check"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-bullet"><span class="ui-icon ui-icon-bullet"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-radio-off"><span class="ui-icon ui-icon-radio-off"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-radio-on"><span class="ui-icon ui-icon-radio-on"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-pin-w"><span class="ui-icon ui-icon-pin-w"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-pin-s"><span class="ui-icon ui-icon-pin-s"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-play"><span class="ui-icon ui-icon-play"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-pause"><span class="ui-icon ui-icon-pause"></span></li>
+
+<li class="ui-state-default ui-corner-all" title=".ui-icon-seek-next"><span class="ui-icon ui-icon-seek-next"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-seek-prev"><span class="ui-icon ui-icon-seek-prev"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-seek-end"><span class="ui-icon ui-icon-seek-end"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-seek-first"><span class="ui-icon ui-icon-seek-first"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-stop"><span class="ui-icon ui-icon-stop"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-eject"><span class="ui-icon ui-icon-eject"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-volume-off"><span class="ui-icon ui-icon-volume-off"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-volume-on"><span class="ui-icon ui-icon-volume-on"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-power"><span class="ui-icon ui-icon-power"></span></li>
+
+<li class="ui-state-default ui-corner-all" title=".ui-icon-signal-diag"><span class="ui-icon ui-icon-signal-diag"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-signal"><span class="ui-icon ui-icon-signal"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-battery-0"><span class="ui-icon ui-icon-battery-0"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-battery-1"><span class="ui-icon ui-icon-battery-1"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-battery-2"><span class="ui-icon ui-icon-battery-2"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-battery-3"><span class="ui-icon ui-icon-battery-3"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-circle-plus"><span class="ui-icon ui-icon-circle-plus"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-circle-minus"><span class="ui-icon ui-icon-circle-minus"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-circle-close"><span class="ui-icon ui-icon-circle-close"></span></li>
+
+<li class="ui-state-default ui-corner-all" title=".ui-icon-circle-triangle-e"><span class="ui-icon ui-icon-circle-triangle-e"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-circle-triangle-s"><span class="ui-icon ui-icon-circle-triangle-s"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-circle-triangle-w"><span class="ui-icon ui-icon-circle-triangle-w"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-circle-triangle-n"><span class="ui-icon ui-icon-circle-triangle-n"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-circle-arrow-e"><span class="ui-icon ui-icon-circle-arrow-e"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-circle-arrow-s"><span class="ui-icon ui-icon-circle-arrow-s"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-circle-arrow-w"><span class="ui-icon ui-icon-circle-arrow-w"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-circle-arrow-n"><span class="ui-icon ui-icon-circle-arrow-n"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-circle-zoomin"><span class="ui-icon ui-icon-circle-zoomin"></span></li>
+
+<li class="ui-state-default ui-corner-all" title=".ui-icon-circle-zoomout"><span class="ui-icon ui-icon-circle-zoomout"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-circle-check"><span class="ui-icon ui-icon-circle-check"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-circlesmall-plus"><span class="ui-icon ui-icon-circlesmall-plus"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-circlesmall-minus"><span class="ui-icon ui-icon-circlesmall-minus"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-circlesmall-close"><span class="ui-icon ui-icon-circlesmall-close"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-squaresmall-plus"><span class="ui-icon ui-icon-squaresmall-plus"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-squaresmall-minus"><span class="ui-icon ui-icon-squaresmall-minus"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-squaresmall-close"><span class="ui-icon ui-icon-squaresmall-close"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-grip-dotted-vertical"><span class="ui-icon ui-icon-grip-dotted-vertical"></span></li>
+
+<li class="ui-state-default ui-corner-all" title=".ui-icon-grip-dotted-horizontal"><span class="ui-icon ui-icon-grip-dotted-horizontal"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-grip-solid-vertical"><span class="ui-icon ui-icon-grip-solid-vertical"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-grip-solid-horizontal"><span class="ui-icon ui-icon-grip-solid-horizontal"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-gripsmall-diagonal-se"><span class="ui-icon ui-icon-gripsmall-diagonal-se"></span></li>
+<li class="ui-state-default ui-corner-all" title=".ui-icon-grip-diagonal-se"><span class="ui-icon ui-icon-grip-diagonal-se"></span></li>
+</ul>
+
+
+<!-- Slider -->
+<h2 class="demoHeaders">Slider</h2>
+<div class="columnbox">
+	<div class="slider"></div>
+</div>
+<div class="columnbox">
+	<div id="eq">
+		<span>88</span>
+		<span>77</span>
+		<span>55</span>
+		<span>33</span>
+		<span>40</span>
+		<span>45</span>
+		<span>70</span>
+	</div>
+</div>
+
+
+<!-- Datepicker -->
+<h2 class="demoHeaders">Datepicker</h2>
+<div class="columnbox" style="width: 32%">
+	<div id="datepicker"></div>
+</div>
+<div class="columnbox" style="width: 66%; height: 220px;">
+	<div id="multidatepicker"></div>
+</div>
+
+
+<!-- Progressbar -->
+<h2 class="demoHeaders">Progressbar</h2>
+<div id="progressbar"></div>
+
+<!-- Highlight / Error -->
+<h2 class="demoHeaders">Highlight / Error</h2>
+<div class="ui-widget">
+	<div class="ui-state-highlight ui-corner-all" style="margin-top: 20px; padding: 0 .7em;">
+		<p><span class="ui-icon ui-icon-info" style="float: left; margin-right: .3em;"></span>
+		<strong>Hey!</strong> Sample ui-state-highlight style.</p>
+	</div>
+</div>
+<br/>
+<div class="ui-widget">
+	<div class="ui-state-error ui-corner-all" style="padding: 0 .7em;">
+		<p><span class="ui-icon ui-icon-alert" style="float: left; margin-right: .3em;"></span>
+		<strong>Alert:</strong> Sample ui-state-error style.</p>
+	</div>
+</div>
+
+<h2 class="demoHeaders">Button</h2>
+
+<div class="buttonset">
+	<button id="rerun">Run last action</button>
+	<button id="select">Select an action</button>
+</div>
+
+<span id="toolbar" class="ui-widget-header ui-corner-all">
+	<button id="beginning">go to beginning</button>
+	<button id="rewind">rewind</button>
+	<button id="play">play</button>
+	<button id="stop">stop</button>
+	<button id="forward">fast forward</button>
+	<button id="end">go to end</button>
+
+	<input type="checkbox" id="shuffle" /><label for="shuffle">Shuffle</label>
+
+	<span id="repeat">
+		<input type="radio" id="repeat0" name="repeat" checked="checked" /><label for="repeat0">No Repeat</label>
+		<input type="radio" id="repeat1" name="repeat" /><label for="repeat1">Once</label>
+		<input type="radio" id="repeatall" name="repeat" /><label for="repeatall">All</label>
+	</span>
+</span>
+
+<!-- theme switcher -->
+
+<script src="http://jqueryui.com/themeroller/themeswitchertool/"></script>
+<script>
+	$('#switcher').themeswitcher();
+</script>
+
+</body>
 </html>
-
-
-- 
cgit v1.2.3


From f848ae38e0389874c0a6d026d54d40cb044f9561 Mon Sep 17 00:00:00 2001
From: Scott González <scott.gonzalez@gmail.com>
Date: Fri, 22 Nov 2013 09:54:18 -0500
Subject: Build: Include es3 option for JSHint.

---
 tests/.jshintrc | 1 +
 ui/.jshintrc    | 1 +
 2 files changed, 2 insertions(+)

(limited to 'tests')

diff --git a/tests/.jshintrc b/tests/.jshintrc
index 26f47fcee..aeb3150a2 100644
--- a/tests/.jshintrc
+++ b/tests/.jshintrc
@@ -14,6 +14,7 @@
 	"unused": true,
 
 	"browser": true,
+	"es3": true,
 	"evil": true,
 	"jquery": true,
 
diff --git a/ui/.jshintrc b/ui/.jshintrc
index a5d36e1d3..073418812 100644
--- a/ui/.jshintrc
+++ b/ui/.jshintrc
@@ -14,6 +14,7 @@
 	"unused": true,
 
 	"browser": true,
+	"es3": true,
 	"jquery": true,
 
 	"globals": {
-- 
cgit v1.2.3


From d186deb770e578e7d3f807336f7490429add0cac Mon Sep 17 00:00:00 2001
From: Scott González <scott.gonzalez@gmail.com>
Date: Fri, 22 Nov 2013 10:49:17 -0500
Subject: Tests: Fixed path to theme files in index.

---
 tests/index.html | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

(limited to 'tests')

diff --git a/tests/index.html b/tests/index.html
index e00e03dbc..38595f0b0 100644
--- a/tests/index.html
+++ b/tests/index.html
@@ -3,8 +3,8 @@
 <head>
 	<meta charset="utf-8">
 	<title>jQuery UI Tests</title>
-	<link rel="stylesheet" href="../../themes/base/jquery.ui.core.css">
-	<link rel="stylesheet" href="../../themes/base/jquery.ui.theme.css">
+	<link rel="stylesheet" href="../themes/base/jquery.ui.core.css">
+	<link rel="stylesheet" href="../themes/base/jquery.ui.theme.css">
 	<link rel="stylesheet" href="index.css">
 	<script src="jquery-1.10.2.js"></script>
 	<script src="index.js"></script>
-- 
cgit v1.2.3


From 161d7ee38905ea2ce425bca3baa499fada41c98d Mon Sep 17 00:00:00 2001
From: Scott González <scott.gonzalez@gmail.com>
Date: Fri, 22 Nov 2013 10:49:44 -0500
Subject: Tests: Updated URL for TestSwarm.

---
 tests/index.html | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

(limited to 'tests')

diff --git a/tests/index.html b/tests/index.html
index 38595f0b0..53487e8b3 100644
--- a/tests/index.html
+++ b/tests/index.html
@@ -18,7 +18,7 @@
 		<p><a href="unit/index.html">Unit tests</a> exist for all functionality in jQuery UI.
 		The unit tests can be run locally (some tests require a web server with PHP)
 		to ensure proper functionality before committing changes.
-		The unit tests are also run on <a href="http://swarm.jquery.com/user/jqueryui">TestSwarm</a>
+		The unit tests are also run on <a href="http://swarm.jquery.org/project/jqueryui">TestSwarm</a>
 		for every commit.</p>
 
 		<h2>Visual Tests</h2>
-- 
cgit v1.2.3


From 8eeb0e7d88a943e3860f8492661ac8090cb8d3ac Mon Sep 17 00:00:00 2001
From: Scott González <scott.gonzalez@gmail.com>
Date: Fri, 22 Nov 2013 11:43:55 -0500
Subject: Tests: Skip JSHint in browsers that don't support
 Function.prototype.bind() to work around a bug in JSHint.

---
 tests/unit/testsuite.js | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

(limited to 'tests')

diff --git a/tests/unit/testsuite.js b/tests/unit/testsuite.js
index 13daa7e66..ffd1e73de 100644
--- a/tests/unit/testsuite.js
+++ b/tests/unit/testsuite.js
@@ -59,7 +59,9 @@ QUnit.config.urlConfig.push({
 
 jshintLoaded = false;
 TestHelpers.testJshint = function( module ) {
-	if ( QUnit.urlParams.nojshint ) {
+	// Function.prototype.bind check is needed because JSHint doesn't work in ES3 browsers anymore
+	// https://github.com/jshint/jshint/issues/1384
+	if ( QUnit.urlParams.nojshint || !Function.prototype.bind ) {
 		return;
 	}
 
-- 
cgit v1.2.3