+++ /dev/null
-<!doctype html>
-<html lang="en">
-<head>
- <meta charset="utf-8">
- <title>Accordion Visual Test</title>
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css">
- <script src="../../../jquery-1.7.2.js"></script>
- <script src="../../../ui/jquery.ui.core.js"></script>
- <script src="../../../ui/jquery.ui.widget.js"></script>
- <script src="../../../ui/jquery.ui.accordion.js"></script>
- <script>
- $(function() {
- $( "#accordion-ynynyn" ).accordion({ icons: null });
- $( "#accordion-ynyny" ).accordion();
- $( "#accordion-ynyn" ).accordion({ icons: null });
- $( "#accordion-yny" ).accordion();
- $( "#accordion-yn" ).accordion({ icons: null });
- $( "#accordion-y" ).accordion();
-
- $( "#accordion-nynyny" ).accordion();
- $( "#accordion-nynyn" ).accordion({ icons: null });
- $( "#accordion-nyny" ).accordion();
- $( "#accordion-nyn" ).accordion({ icons: null });
- $( "#accordion-ny" ).accordion();
- $( "#accordion-n" ).accordion({ icons: null });
- });
- </script>
-</head>
-<body>
-
-<p>WHAT: The following set of nested accordions alternate between icons and no icons.</p>
-<p>EXPECTED: The padding on the headers should correctly account for the icon settings.</p>
-
-<div id="accordion-y">
- <div>Icons</div>
- <div>
- <div id="accordion-yn">
- <div>No Icons</div>
- <div>
- <div id="accordion-yny">
- <div>Icons</div>
- <div>
- <div id="accordion-ynyn">
- <div>No Icons</div>
- <div>
- <div id="accordion-ynyny">
- <div>Icons</div>
- <div>
- <div id="accordion-ynynyn">
- <div>No Icons</div>
- <div></div>
- </div>
- </div>
- </div>
- </div>
- </div>
- </div>
- </div>
- </div>
- </div>
- </div>
-</div>
-
-<div id="accordion-n">
- <div>No Icons</div>
- <div>
- <div id="accordion-ny">
- <div>Icons</div>
- <div>
- <div id="accordion-nyn">
- <div>No Icons</div>
- <div>
- <div id="accordion-nyny">
- <div>Icons</div>
- <div>
- <div id="accordion-nynyn">
- <div>No Icons</div>
- <div>
- <div id="accordion-nynyny">
- <div>Icons</div>
- <div></div>
- </div>
- </div>
- </div>
- </div>
- </div>
- </div>
- </div>
- </div>
- </div>
- </div>
-</div>
-
-</body>
-</html>
--- /dev/null
+<!doctype html>
+<html lang="en">
+<head>
+ <meta charset="utf-8">
+ <title>Accordion Visual Test</title>
+ <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css">
+ <script src="../../../jquery-1.7.2.js"></script>
+ <script src="../../../ui/jquery.ui.core.js"></script>
+ <script src="../../../ui/jquery.ui.widget.js"></script>
+ <script src="../../../ui/jquery.ui.accordion.js"></script>
+ <script>
+ $(function() {
+ $( "#accordion-ynynyn" ).accordion({ icons: null });
+ $( "#accordion-ynyny" ).accordion();
+ $( "#accordion-ynyn" ).accordion({ icons: null });
+ $( "#accordion-yny" ).accordion();
+ $( "#accordion-yn" ).accordion({ icons: null });
+ $( "#accordion-y" ).accordion();
+
+ $( "#accordion-nynyny" ).accordion();
+ $( "#accordion-nynyn" ).accordion({ icons: null });
+ $( "#accordion-nyny" ).accordion();
+ $( "#accordion-nyn" ).accordion({ icons: null });
+ $( "#accordion-ny" ).accordion();
+ $( "#accordion-n" ).accordion({ icons: null });
+ });
+ </script>
+</head>
+<body>
+
+<p>WHAT: The following set of nested accordions alternate between icons and no icons.</p>
+<p>EXPECTED: The padding on the headers should correctly account for the icon settings.</p>
+
+<div id="accordion-y">
+ <div>Icons</div>
+ <div>
+ <div id="accordion-yn">
+ <div>No Icons</div>
+ <div>
+ <div id="accordion-yny">
+ <div>Icons</div>
+ <div>
+ <div id="accordion-ynyn">
+ <div>No Icons</div>
+ <div>
+ <div id="accordion-ynyny">
+ <div>Icons</div>
+ <div>
+ <div id="accordion-ynynyn">
+ <div>No Icons</div>
+ <div></div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+</div>
+
+<div id="accordion-n">
+ <div>No Icons</div>
+ <div>
+ <div id="accordion-ny">
+ <div>Icons</div>
+ <div>
+ <div id="accordion-nyn">
+ <div>No Icons</div>
+ <div>
+ <div id="accordion-nyny">
+ <div>Icons</div>
+ <div>
+ <div id="accordion-nynyn">
+ <div>No Icons</div>
+ <div>
+ <div id="accordion-nynyny">
+ <div>Icons</div>
+ <div></div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+</div>
+
+</body>
+</html>
+++ /dev/null
-<!doctype html>
-<html lang="en">
-<head>
- <meta charset="utf-8">
- <title>addClass Visual Test : Queue</title>
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css">
- <script src="../../../jquery-1.7.2.js"></script>
- <script src="../../../ui/jquery.effects.core.js"></script>
- <style>
- .box {
- width: 100px;
- height: 100px;
- background-color: #000;
- }
- .red {
- background-color: #f00;
- }
- .green {
- background-color: #0f0;
- }
- .blue {
- background-color: #00f;
- }
- </style>
- <script>
- $(function() {
- $( "#box1" )
- .delay( 500 )
- .addClass( "red", 2000 )
- .delay( 500 )
- .addClass( "green", 2000 )
- .delay( 500 )
- .addClass( "blue", 2000 );
- $( "#box2" )
- .addClass( "red", 2000 )
- .delay( 500 )
- .addClass( "green", 2000 )
- .delay( 500 )
- .addClass( "blue", 2000 );
- });
- </script>
-</head>
-<body>
-
-<p>WHAT: The two boxes animate from black to red to green to blue.</p>
-<p>The first box should start with a delay, the second box should start immediately.</p>
-
-<div id="box1" class="box"></div>
-<div id="box2" class="box"></div>
-
-</body>
-</html>
--- /dev/null
+<!doctype html>
+<html lang="en">
+<head>
+ <meta charset="utf-8">
+ <title>addClass Visual Test : Queue</title>
+ <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css">
+ <script src="../../../jquery-1.7.2.js"></script>
+ <script src="../../../ui/jquery.effects.core.js"></script>
+ <style>
+ .box {
+ width: 100px;
+ height: 100px;
+ background-color: #000;
+ }
+ .red {
+ background-color: #f00;
+ }
+ .green {
+ background-color: #0f0;
+ }
+ .blue {
+ background-color: #00f;
+ }
+ </style>
+ <script>
+ $(function() {
+ $( "#box1" )
+ .delay( 500 )
+ .addClass( "red", 2000 )
+ .delay( 500 )
+ .addClass( "green", 2000 )
+ .delay( 500 )
+ .addClass( "blue", 2000 );
+ $( "#box2" )
+ .addClass( "red", 2000 )
+ .delay( 500 )
+ .addClass( "green", 2000 )
+ .delay( 500 )
+ .addClass( "blue", 2000 );
+ });
+ </script>
+</head>
+<body>
+
+<p>WHAT: The two boxes animate from black to red to green to blue.</p>
+<p>EXPECTED: The first box should start with a delay, the second box should start immediately.</p>
+
+<div id="box1" class="box"></div>
+<div id="box2" class="box"></div>
+
+</body>
+</html>
+++ /dev/null
-<!doctype html>
-<html lang="en">
-<head>
- <meta charset="utf-8">
- <title>Dialog Visual Test - Modal Dialog in Large DOM</title>
- <link rel="stylesheet" href="../visual.css">
- <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css">
- <script src="../../../jquery-1.7.2.js"></script>
- <script src="../../../external/jquery.bgiframe-2.1.2.js"></script>
- <script src="../../../ui/jquery.ui.core.js"></script>
- <script src="../../../ui/jquery.ui.position.js"></script>
- <script src="../../../ui/jquery.ui.widget.js"></script>
- <script src="../../../ui/jquery.ui.mouse.js"></script>
- <script src="../../../ui/jquery.ui.draggable.js"></script>
- <script src="../../../ui/jquery.ui.resizable.js"></script>
- <script src="../../../ui/jquery.ui.dialog.js"></script>
- <script>
- $(function() {
- var start,
- html = new Array( 500 ).join( $( "#template" ).html() );
- $( html ).appendTo( "body" );
-
- start = $.now();
- $( "#dialog" ).dialog({
- modal: true,
- autoOpen: false
- });
- $( "<li>Create: " + ($.now() - start) + "ms</li>" ).appendTo( "#log" );
-
- $( "#opener" ).click(function() {
- start = $.now();
- $( "#dialog" ).dialog( "open" );
- $( "<li>Open: " + ($.now() - start) + "ms</li>" ).appendTo( "#log" );
- });
- });
- </script>
-</head>
-<body>
-
-<button id="opener">open dialog</button>
-<div id="dialog" title="Dialog Title">
- <p> Dialog Content </p>
- <input type="text">
-</div>
-
-<ul id="log"></ul>
-
-<script type="text/html" id="template">
-<div><div><div><div><div><div><div><div><div><div>
-<div><div><div><div><div><div><div><div><div><div>
-<div><div><div><div><div><div><div><div><div><div>
-<div><div><div><div><div><div><div><div><div><div>
-<div><div><div><div><div><div><div><div><div><div>
-<div><p>This <span>is</span> <span>a</span> <strong>large</strong> <abbr>DOM</abbr></p>.</div>
-<input>
-<select>
- <option>option 1</option>
- <option>option 2</option>
- <option>option 3</option>
- <option>option 4</option>
- <option>option 5</option>
-</select>
-</div></div></div></div></div></div></div></div></div></div>
-</div></div></div></div></div></div></div></div></div></div>
-</div></div></div></div></div></div></div></div></div></div>
-</div></div></div></div></div></div></div></div></div></div>
-</div></div></div></div></div></div></div></div></div></div>
-</script>
-
-</body>
-</html>
--- /dev/null
+<!doctype html>
+<html lang="en">
+<head>
+ <meta charset="utf-8">
+ <title>Dialog Visual Test - Modal Dialog in Large DOM</title>
+ <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css">
+ <script src="../../../jquery-1.7.2.js"></script>
+ <script src="../../../external/jquery.bgiframe-2.1.2.js"></script>
+ <script src="../../../ui/jquery.ui.core.js"></script>
+ <script src="../../../ui/jquery.ui.position.js"></script>
+ <script src="../../../ui/jquery.ui.widget.js"></script>
+ <script src="../../../ui/jquery.ui.mouse.js"></script>
+ <script src="../../../ui/jquery.ui.draggable.js"></script>
+ <script src="../../../ui/jquery.ui.resizable.js"></script>
+ <script src="../../../ui/jquery.ui.dialog.js"></script>
+ <script>
+ $(function() {
+ var start,
+ html = new Array( 500 ).join( $( "#template" ).html() );
+ $( html ).appendTo( "body" );
+
+ start = $.now();
+ $( "#dialog" ).dialog({
+ modal: true,
+ autoOpen: false
+ });
+ $( "<li>Create: " + ($.now() - start) + "ms</li>" ).appendTo( "#log" );
+
+ $( "#opener" ).click(function() {
+ start = $.now();
+ $( "#dialog" ).dialog( "open" );
+ $( "<li>Open: " + ($.now() - start) + "ms</li>" ).appendTo( "#log" );
+ });
+ });
+ </script>
+</head>
+<body>
+
+<p>WHAT: A single dialog is created on a page with a large DOM.</p>
+<p>EXPECTED: Creating and opening the dialog should be fast, regardless of page size.</p>
+
+<button id="opener">open dialog</button>
+<div id="dialog" title="Dialog Title">
+ <p> Dialog Content </p>
+ <input type="text">
+</div>
+
+<ul id="log"></ul>
+
+<script type="text/html" id="template">
+<div><div><div><div><div><div><div><div><div><div>
+<div><div><div><div><div><div><div><div><div><div>
+<div><div><div><div><div><div><div><div><div><div>
+<div><div><div><div><div><div><div><div><div><div>
+<div><div><div><div><div><div><div><div><div><div>
+<div><p>This <span>is</span> <span>a</span> <strong>large</strong> <abbr>DOM</abbr>.</p></div>
+<input>
+<select>
+ <option>option 1</option>
+ <option>option 2</option>
+ <option>option 3</option>
+ <option>option 4</option>
+ <option>option 5</option>
+</select>
+</div></div></div></div></div></div></div></div></div></div>
+</div></div></div></div></div></div></div></div></div></div>
+</div></div></div></div></div></div></div></div></div></div>
+</div></div></div></div></div></div></div></div></div></div>
+</div></div></div></div></div></div></div></div></div></div>
+</script>
+
+</body>
+</html>