diff options
Diffstat (limited to 'src/main/webapp/jquery-ui-1.9pre/tests/visual')
36 files changed, 7795 insertions, 0 deletions
diff --git a/src/main/webapp/jquery-ui-1.9pre/tests/visual/addClass/addClass_queue.html b/src/main/webapp/jquery-ui-1.9pre/tests/visual/addClass/addClass_queue.html new file mode 100644 index 0000000..c00101b --- /dev/null +++ b/src/main/webapp/jquery-ui-1.9pre/tests/visual/addClass/addClass_queue.html @@ -0,0 +1,50 @@ +<!DOCTYPE html> +<html lang="en"> +<head> + <meta charset="utf-8"> + <title>addClass Visual Test : Queue</title> + <link rel="stylesheet" href="../visual.css"> + <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css"> + <script src="../../../jquery-1.7.1.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> + +<div id="box1" class="box"></div> +<div id="box2" class="box"></div> + +</body> +</html> diff --git a/src/main/webapp/jquery-ui-1.9pre/tests/visual/button/button.html b/src/main/webapp/jquery-ui-1.9pre/tests/visual/button/button.html new file mode 100644 index 0000000..e93c795 --- /dev/null +++ b/src/main/webapp/jquery-ui-1.9pre/tests/visual/button/button.html @@ -0,0 +1,140 @@ +<!DOCTYPE html> +<html lang="en"> +<head> + <meta charset="UTF-8" /> + <title>Button Visual push: Default</title> + <link rel="stylesheet" href="../visual.css" type="text/css" /> + <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css"> + <style type="text/css"> + #toolbar { margin-top: 2em; padding:0.2em; } + #ops1, #ops2, #format, #mode { margin-right: 1em } + </style> + <script type="text/javascript" src="../../../jquery-1.7.1.js"></script> + <script type="text/javascript" src="../../../external/jquery.metadata.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.button.js"></script> + <script type="text/javascript"> + $(function() { + var buttons = $('#push button, #check').button(); + var buttonSets = $('#radio0, #radio1, #radio2, #ops1, #format, #ops2, #mode, #inputs, #anchors').buttonset(); + + buttons.add(buttonSets).click(function(event) { + var target = $(event.target); + if (target.closest('.ui-button:not(.ui-state-disabled)').length) { + $("<div></div>") + .text("Clicked " + (target.text() || target.val())) + .appendTo("#log"); + window.console && console.log(this, arguments); + } + }); + + $("#disable-widgets").toggle(function() { + buttons.button("disable"); + buttonSets.buttonset("disable"); + }, function() { + buttons.button("enable"); + buttonSets.buttonset("enable"); + }); + $("#toggle-widgets").toggle(function() { + buttons.button(); + buttonSets.buttonset(); + }, function() { + buttons.button("destroy"); + buttonSets.buttonset("destroy"); + }).click(); + }); + </script> +</head> +<body> + +<div id="push"> + <div> + No icon + <button>Simple button, only text</button> + <button class="ui-priority-secondary">Secondary priority button</button> + </div> + <br/> + <div> + With icon + <button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button> + <button class="{button:{icons:{primary:'ui-icon-locked'}}}">Primary icon</button> + <button class="{button:{icons:{secondary:'ui-icon-triangle-1-s'}}}">Secondary icon</button> + <button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Both icons</button> + <button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons and no text</button> + </div> +</div> + +<div id="toggle" style="margin-top: 2em;"> + <input type="checkbox" id="check" /><label for="check">Toggle</label> +</div> + +<div id="radio0" style="margin-top: 2em;"> + <input type="radio" id="radio01" name="radio" checked="checked" /><label for="radio01">Choice 1</label> + <input type="radio" id="radio02" name="radio" /><label for="radio02">Choice 2</label> + <input type="radio" id="radio03" name="radio" /><label for="radio03">Choice 3</label> +</div> +<form> + <div id="radio1" style="margin-top: 2em;"> + <input type="radio" id="radio11" name="radio" /><label for="radio11">Choice 1</label> + <input type="radio" id="radio12" name="radio" checked="checked" /><label for="radio12">Choice 2</label> + <input type="radio" id="radio13" name="radio" /><label for="radio13">Choice 3</label> + </div> +</form> +<form> + <div id="radio2" style="margin-top: 2em;"> + <input type="radio" id="radio21" name="radio" /><label for="radio21">Choice 1</label> + <input type="radio" id="radio22" name="radio" /><label for="radio22">Choice 2</label> + <input type="radio" id="radio23" name="radio" checked="checked" /><label for="radio23">Choice 3</label> + </div> +</form> + +<div id="toolbar" class="ui-widget-header ui-corner-all ui-helper-clearfix"> + <span id="ops1"> + <button class="{button:{icons:{primary:'ui-icon-folder-open'},text:false}}">Open</button> + <button class="{button:{icons:{primary:'ui-icon-disk'},text:false}}">Save</button> + <button class="{button:{icons:{primary:'ui-icon-trash'},text:false}}">Delete</button> + </span> + <span id="format"> + <input type="checkbox" id="check1" /><label for="check1">B</label> + <input type="checkbox" id="check2" /><label for="check2">I</label> + <input type="checkbox" id="check3" /><label for="check3">U</label> + </span> + <span id="ops2"> + <button class="{button:{icons:{primary:'ui-icon-print'},text:false}}">Print...</button> + <button class="{button:{icons:{primary:'ui-icon-mail-closed'},text:false}}">Mail to...</button> + </span> + <span id="mode"> + <input type="radio" id="mode1" name="radio2" checked="checked" /><label for="mode1">Edit</label> + <input type="radio" id="mode2" name="radio2" /><label for="mode2">View</label> + </span> +</div> + +<div id="inputs" style="margin-top: 2em;"> + <input type="submit" value="Submit button" /> + <input type="reset" value="Reset button" class="{button:{label:'Custom reset'}}" /> +</div> + +<div id="anchors" style="margin-top: 2em;"> + <a href="#">Anchor 1</a> + <a href="#" class="{button:{icons:{primary:'ui-icon-print'},text:false}}">Anchor 2</a> + <a href="#" class="{button:{icons:{primary:'ui-icon-mail-closed'},text:false}}">Anchor 3</a> + <a href="#">Anchor 4</a> +</div> + +<div style="margin-top: 2em;"> + <button id="disable-widgets">Toggle disabled</button> + <button id="toggle-widgets">Toggle widget</button> +</div> +<div id="log"></div> + +<script type="text/javascript" src="http://jqueryui.com/themeroller/themeswitchertool/"></script> +<script type="text/javascript"> + $.fn.themeswitcher && $('<div></div>').css({ + position: "absolute", + right: 10, + top: 10 + }).appendTo(document.body).themeswitcher(); +</script> +</body> +</html> diff --git a/src/main/webapp/jquery-ui-1.9pre/tests/visual/button/button_disabled_true.html b/src/main/webapp/jquery-ui-1.9pre/tests/visual/button/button_disabled_true.html new file mode 100644 index 0000000..ac21a56 --- /dev/null +++ b/src/main/webapp/jquery-ui-1.9pre/tests/visual/button/button_disabled_true.html @@ -0,0 +1,84 @@ +<!DOCTYPE html> +<html lang="en"> +<head> + <meta charset="UTF-8" /> + <title>Button Visual Test : Button disabled true</title> + <link rel="stylesheet" href="../visual.css" type="text/css" /> + <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css"> + <script type="text/javascript" src="../../../jquery-1.7.1.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.button.js"></script> + <script type="text/javascript"> + $(function() { + + $("#button1").button({ + disabled: true + }); + + $("#anchor1").button({ + disabled: true + }); + + $("#inputbutton1").button({ + disabled: true + }); + + $("#radio1, #radio2, #radio3").button({ + disabled: true + }); + + $("#checkbox1, #checkbox2, #checkbox3").button({ + disabled: true + }); + + }); + </script> +</head> +<body> + +<fieldset> + <legend>button</legend> + <button disabled="disabled">button</button> + <hr /> + <button id="button1">button</button> +</fieldset> + +<fieldset> + <legend>anchor</legend> + <a href="javascript:void(0)" disabled="disabled">anchor 1</a> + <hr /> + <a href="javascript:void(0)" id="anchor1">anchor 1</a> +</fieldset> + +<fieldset> + <legend>input type="button"</legend> + <input type="button" disabled="disabled" value="input button 1" /> + <hr /> + <input type="button" id="inputbutton1" value="input button 1" /> +</fieldset> + +<fieldset> + <legend>input type="radio"</legend> + <input type="radio" name="radioletter" id="radioa" disabled="disabled" /><label for="radioa">radio a</label> + <input type="radio" name="radioletter" id="radiob" disabled="disabled" /><label for="radiob">radio b</label> + <input type="radio" name="radioletter" id="radioc" disabled="disabled" /><label for="radioc">radio c</label> + <hr /> + <input type="radio" name="radionumber" id="radio1" /><label for="radio1">radio 1</label> + <input type="radio" name="radionumber" id="radio2" /><label for="radio2">radio 2</label> + <input type="radio" name="radionumber" id="radio3" /><label for="radio3">radio 3</label> +</fieldset> + +<fieldset> + <legend>input type="checkbox"</legend> + <input type="checkbox" id="checkboxa" disabled="disabled" /><label for="checkboxa">checkbox a</label> + <input type="checkbox" id="checkboxb" disabled="disabled" /><label for="checkboxb">checkbox b</label> + <input type="checkbox" id="checkboxc" disabled="disabled" /><label for="checkboxc">checkbox c</label> + <hr /> + <input type="checkbox" id="checkbox1" /><label for="checkbox1">checkbox 1</label> + <input type="checkbox" id="checkbox2" /><label for="checkbox2">checkbox 2</label> + <input type="checkbox" id="checkbox3" /><label for="checkbox3">checkbox 3</label> +</fieldset> + +</body> +</html> diff --git a/src/main/webapp/jquery-ui-1.9pre/tests/visual/button/button_performance.html b/src/main/webapp/jquery-ui-1.9pre/tests/visual/button/button_performance.html new file mode 100644 index 0000000..439e2c1 --- /dev/null +++ b/src/main/webapp/jquery-ui-1.9pre/tests/visual/button/button_performance.html @@ -0,0 +1,555 @@ +<!DOCTYPE html> +<html lang="en"> +<head> + <meta charset="UTF-8" /> + <title>Button Visual push: Default</title> + <link rel="stylesheet" href="../visual.css" type="text/css" /> + <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css"> + <style type="text/css"> + #toolbar { margin-top: 2em; padding:0.2em; } + #ops1, #ops2, #format, #mode { margin-right: 1em } + </style> + <script type="text/javascript" src="../../../jquery-1.7.1.js"></script> + <script type="text/javascript" src="../../../external/jquery.metadata.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.button.js"></script> + <script type="text/javascript"> + $(function() { + var start = +new Date(); + $("button").button(); + var end = +new Date(); + $("<p></p>").text( "Time to initialize: " + (end - start) + "ms" ).prependTo("body"); + }); + </script> +</head> +<body> + +<button>Simple button, only text</button> +<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button> +<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button> +<button>Simple button, only text</button> +<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button> +<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button> +<button>Simple button, only text</button> +<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button> +<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button> +<button>Simple button, only text</button> +<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button> +<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button> +<button>Simple button, only text</button> +<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button> +<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button> +<button>Simple button, only text</button> +<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button> +<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button> +<button>Simple button, only text</button> +<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button> +<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button> +<button>Simple button, only text</button> +<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button> +<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button> +<button>Simple button, only text</button> +<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button> +<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button> +<button>Simple button, only text</button> +<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button> +<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button> +<button>Simple button, only text</button> +<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button> +<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button> +<button>Simple button, only text</button> +<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button> +<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button> +<button>Simple button, only text</button> +<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button> +<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button> +<button>Simple button, only text</button> +<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button> +<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button> +<button>Simple button, only text</button> +<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button> +<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button> +<button>Simple button, only text</button> +<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button> +<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button> +<button>Simple button, only text</button> +<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button> +<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button> +<button>Simple button, only text</button> +<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button> +<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button> +<button>Simple button, only text</button> +<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button> +<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button> +<button>Simple button, only text</button> +<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button> +<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button> +<button>Simple button, only text</button> +<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button> +<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button> +<button>Simple button, only text</button> +<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button> +<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button> +<button>Simple button, only text</button> +<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button> +<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button> +<button>Simple button, only text</button> +<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button> +<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button> +<button>Simple button, only text</button> +<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button> +<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button> +<button>Simple button, only text</button> +<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button> +<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button> +<button>Simple button, only text</button> +<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button> +<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button> +<button>Simple button, only text</button> +<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button> +<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button> +<button>Simple button, only text</button> +<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button> +<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button> +<button>Simple button, only text</button> +<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button> +<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button> +<button>Simple button, only text</button> +<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button> +<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button> +<button>Simple button, only text</button> +<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button> +<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button> +<button>Simple button, only text</button> +<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button> +<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button> +<button>Simple button, only text</button> +<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button> +<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button> +<button>Simple button, only text</button> +<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button> +<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button> +<button>Simple button, only text</button> +<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button> +<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button> +<button>Simple button, only text</button> +<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button> +<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button> +<button>Simple button, only text</button> +<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button> +<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button> +<button>Simple button, only text</button> +<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button> +<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button> +<button>Simple button, only text</button> +<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button> +<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button> +<button>Simple button, only text</button> +<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button> +<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button> +<button>Simple button, only text</button> +<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button> +<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button> +<button>Simple button, only text</button> +<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button> +<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button> +<button>Simple button, only text</button> +<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button> +<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button> +<button>Simple button, only text</button> +<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button> +<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button> +<button>Simple button, only text</button> +<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button> +<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button> +<button>Simple button, only text</button> +<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button> +<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button> +<button>Simple button, only text</button> +<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button> +<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button> +<button>Simple button, only text</button> +<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button> +<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button> +<button>Simple button, only text</button> +<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button> +<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button> +<button>Simple button, only text</button> +<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button> +<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button> +<button>Simple button, only text</button> +<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button> +<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button> +<button>Simple button, only text</button> +<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button> +<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button> +<button>Simple button, only text</button> +<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button> +<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button> +<button>Simple button, only text</button> +<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button> +<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button> +<button>Simple button, only text</button> +<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button> +<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button> +<button>Simple button, only text</button> +<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button> +<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button> +<button>Simple button, only text</button> +<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button> +<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button> +<button>Simple button, only text</button> +<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button> +<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button> +<button>Simple button, only text</button> +<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button> +<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button> +<button>Simple button, only text</button> +<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button> +<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button> +<button>Simple button, only text</button> +<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button> +<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button> +<button>Simple button, only text</button> +<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button> +<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button> +<button>Simple button, only text</button> +<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button> +<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button> +<button>Simple button, only text</button> +<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button> +<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button> +<button>Simple button, only text</button> +<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button> +<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button> +<button>Simple button, only text</button> +<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button> +<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button> +<button>Simple button, only text</button> +<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button> +<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button> +<button>Simple button, only text</button> +<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button> +<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button> +<button>Simple button, only text</button> +<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button> +<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button> +<button>Simple button, only text</button> +<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button> +<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button> +<button>Simple button, only text</button> +<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button> +<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button> +<button>Simple button, only text</button> +<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button> +<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button> +<button>Simple button, only text</button> +<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button> +<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button> +<button>Simple button, only text</button> +<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button> +<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button> +<button>Simple button, only text</button> +<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button> +<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button> +<button>Simple button, only text</button> +<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button> +<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button> +<button>Simple button, only text</button> +<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button> +<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button> +<button>Simple button, only text</button> +<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button> +<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button> +<button>Simple button, only text</button> +<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button> +<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button> +<button>Simple button, only text</button> +<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button> +<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button> +<button>Simple button, only text</button> +<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button> +<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button> +<button>Simple button, only text</button> +<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button> +<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button> +<button>Simple button, only text</button> +<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button> +<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button> +<button>Simple button, only text</button> +<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button> +<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button> +<button>Simple button, only text</button> +<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button> +<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button> +<button>Simple button, only text</button> +<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button> +<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button> +<button>Simple button, only text</button> +<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button> +<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button> +<button>Simple button, only text</button> +<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button> +<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button> +<button>Simple button, only text</button> +<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button> +<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button> +<button>Simple button, only text</button> +<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button> +<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button> +<button>Simple button, only text</button> +<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button> +<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button> +<button>Simple button, only text</button> +<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button> +<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button> +<button>Simple button, only text</button> +<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button> +<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button> +<button>Simple button, only text</button> +<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button> +<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button> +<button>Simple button, only text</button> +<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button> +<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button> +<button>Simple button, only text</button> +<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button> +<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button> +<button>Simple button, only text</button> +<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button> +<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button> +<button>Simple button, only text</button> +<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button> +<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button> +<button>Simple button, only text</button> +<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button> +<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button> +<button>Simple button, only text</button> +<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button> +<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button> +<button>Simple button, only text</button> +<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button> +<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button> +<button>Simple button, only text</button> +<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button> +<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button> +<button>Simple button, only text</button> +<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button> +<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button> +<button>Simple button, only text</button> +<button class="{button:{icons:{primary:'ui-icon-locked'},text:false}}">Button with icon only</button> +<button class="{button:{icons:{primary:'ui-icon-locked'}}}">Button with icon on the left</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'}}}">Button with two icons</button> +<button class="{button:{icons:{primary:'ui-icon-gear',secondary:'ui-icon-triangle-1-s'},text:false}}">Button with two icons</button> + +</body> +</html> diff --git a/src/main/webapp/jquery-ui-1.9pre/tests/visual/button/button_ticket_5254.html b/src/main/webapp/jquery-ui-1.9pre/tests/visual/button/button_ticket_5254.html new file mode 100644 index 0000000..14d2769 --- /dev/null +++ b/src/main/webapp/jquery-ui-1.9pre/tests/visual/button/button_ticket_5254.html @@ -0,0 +1,55 @@ +<!DOCTYPE html> +<html lang="en"> +<head> + <meta charset="UTF-8" /> + <title>Button Visual Test : Button ticket #5254</title> + <link rel="stylesheet" href="../visual.css" type="text/css" /> + <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css"> + <script type="text/javascript" src="../../../jquery-1.7.1.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.button.js"></script> + <script type="text/javascript"> + $(function() { + + $('#b1').button(); + + $('#b2').button(); + + $('#b3').button().click(function() { + return false; + }); + + $('#ua').text(navigator.userAgent); + + }); + </script> +</head> +<body> + +<h1 class="ui-widget-header"><a href="http://dev.jqueryui.com/ticket/5254">#5254 - Input, button and anchor buttons aren't consistent in IE7</a></h1> + +<dl> +<dt><h2>Screenshot from ticket:</h2></dt> +<dd><img src="http://dev.jqueryui.com/raw-attachment/ticket/5254/button.png"></dd> +</dl> + +<hr> + +<dl> +<dt><h2>Visual test:</h2></dt> +<dd> + <div id="vt"> + <input id="b1" type="button" value="Input" style="" /> + <button id="b2">Button</button> + <a id="b3" href="#">Anchor</a> + </div> +</dd> +<dt><h2>User agent:</h2></dt> +<dd> + <h3 id="ua"></h3> +</dd> +</dl> + +</body> +</html> diff --git a/src/main/webapp/jquery-ui-1.9pre/tests/visual/button/button_ticket_5261.html b/src/main/webapp/jquery-ui-1.9pre/tests/visual/button/button_ticket_5261.html new file mode 100644 index 0000000..0024393 --- /dev/null +++ b/src/main/webapp/jquery-ui-1.9pre/tests/visual/button/button_ticket_5261.html @@ -0,0 +1,42 @@ +<!DOCTYPE html> +<html lang="en"> +<head> + <meta charset="UTF-8" /> + <title>Button Visual Test : Button ticket #5261</title> + <link rel="stylesheet" href="../visual.css" type="text/css" /> + <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css"> + <script type="text/javascript" src="../../../jquery-1.7.1.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.button.js"></script> + <script type="text/javascript"> + $(function() { + + $('#id1').button().change(function(e) { + console.log('change', e); + }); + $('#id1').bind('change', function(e) { + console.log('bound change', e); + }); + $("body").live('change', function(e) { + console.log('live change on body', e); + }); + $(document).delegate('input', 'change', function(e) { + console.log('delegated input change', e); + }); + $(document).change(function(e) { + console.log('delegated change on document', e); + }); + + }); + </script> +</head> +<body> + +<h1 class="ui-widget-header"><a href="http://dev.jqueryui.com/ticket/5261">#5261 - button change events don't fire in IE 7/8</a></h1> + +<input name="1" id="id1" type="checkbox"/> +<label for="id1">Checkbox</label> + +</body> +</html> diff --git a/src/main/webapp/jquery-ui-1.9pre/tests/visual/button/button_ticket_5278.html b/src/main/webapp/jquery-ui-1.9pre/tests/visual/button/button_ticket_5278.html new file mode 100644 index 0000000..477a0b3 --- /dev/null +++ b/src/main/webapp/jquery-ui-1.9pre/tests/visual/button/button_ticket_5278.html @@ -0,0 +1,58 @@ +<!DOCTYPE html> +<html lang="en"> +<head> + <meta charset="UTF-8" /> + <title>Button Visual Test : Button ticket #5278</title> + <link rel="stylesheet" href="../visual.css" type="text/css" /> + <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css"> + <script type="text/javascript" src="../../../jquery-1.7.1.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.button.js"></script> + <script type="text/javascript"> + $(function() { + + $('#id1, #id2, #id3, #id4').button(); + + $('#r1, #r2, #r3, #r4').button(); + + }); + </script> +</head> +<body> + +<h1 class="ui-widget-header"><a href="http://dev.jqueryui.com/ticket/5278">#5278 - ui.buttons doesn't visually reset on form "reset" event or input "change" event</a></h1> + +<form> + +<input name="a1" id="id1" type="checkbox"/> +<label for="id1">Checkbox</label> + +<input name="a2" id="id2" type="checkbox"/> +<label for="id2">Checkbox</label> + +<input name="a3" id="id3" type="checkbox" checked="checked" /> +<label for="id3">Checkbox</label> + +<input name="a4" id="id4" type="checkbox"/> +<label for="id4">Checkbox</label> + +<input type="reset"/> + +<input name="r" id="r1" type="radio"/> +<label for="r1">Radio</label> + +<input name="r" id="r2" type="radio"/> +<label for="r2">Radio</label> + +<input name="r" id="r3" type="radio" checked="checked" /> +<label for="r3">Radio</label> + +<input name="r" id="r4" type="radio"/> +<label for="r4">Radio</label> + + +</form> + +</body> +</html> diff --git a/src/main/webapp/jquery-ui-1.9pre/tests/visual/compound/accordion_dialog.html b/src/main/webapp/jquery-ui-1.9pre/tests/visual/compound/accordion_dialog.html new file mode 100644 index 0000000..7b3b227 --- /dev/null +++ b/src/main/webapp/jquery-ui-1.9pre/tests/visual/compound/accordion_dialog.html @@ -0,0 +1,202 @@ +<!DOCTYPE html> +<html lang="en"> +<head> + <meta charset="UTF-8" /> + <title>Compound Visual Test : Accordion in Dialog</title> + <link rel="stylesheet" href="../visual.css" type="text/css" /> + <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css"> + <script type="text/javascript" src="../../../jquery-1.7.1.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.resizable.js"></script> + <script type="text/javascript" src="../../../ui/jquery.ui.draggable.js"></script> + <script type="text/javascript" src="../../../ui/jquery.ui.dialog.js"></script> + <script type="text/javascript"> + $(function() { + $('#accordion').accordion({ + collapsible: true, + active: false + }); + $('#dialog').dialog({ + buttons: { + Test: $.noop + } + }); + }); + </script> +</head> +<body> + +<div id="dialog"> + <div id="accordion"> + <h3><a href="#">Section 1</a></h3> + <div> + <p> + Mauris mauris ante, blandit et, ultrices a, suscipit eget, quam. Integer + ut neque. Vivamus nisi metus, molestie vel, gravida in, condimentum sit + amet, nunc. Nam a nibh. Donec suscipit eros. Nam mi. Proin viverra leo ut + odio. Curabitur malesuada. Vestibulum a velit eu ante scelerisque vulputate. + </p> + </div> + <h3><a href="#">Section 2</a></h3> + <div> + <p> + Cras dictum. Pellentesque habitant morbi tristique senectus et netus + et malesuada fames ac turpis egestas. Vestibulum ante ipsum primis in + faucibus orci luctus et ultrices posuere cubilia Curae; Aenean lacinia + mauris vel est. + </p> + <p> + Suspendisse eu nisl. Nullam ut libero. Integer dignissim consequat lectus. + Class aptent taciti sociosqu ad litora torquent per conubia nostra, per + inceptos himenaeos. + </p> + </div> + <h3><a href="#">Section 3</a></h3> + <div> + <p> + Nam enim risus, molestie et, porta ac, aliquam ac, risus. Quisque lobortis. + Phasellus pellentesque purus in massa. Aenean in pede. Phasellus ac libero + ac tellus pellentesque semper. Sed ac felis. Sed commodo, magna quis + lacinia ornare, quam ante aliquam nisi, eu iaculis leo purus venenatis dui. + </p> + <ul> + <li>List item one</li> + <li>List item two</li> + <li>List item three</li> + </ul> + </div> + </div> +</div> + +<p> +Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam vitae urna quam. Fusce adipiscing erat eget magna malesuada vel mollis ligula ullamcorper. Donec pulvinar, libero et vehicula facilisis, odio orci fringilla magna, non ultricies ipsum justo a tellus. Proin facilisis magna vitae quam vestibulum tempor. Aenean semper placerat posuere. In nisi diam, ullamcorper sit amet viverra sed, pretium sed neque. Sed posuere vulputate mauris vitae placerat. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Nam in odio elit, non tempor felis. Integer non iaculis ante. Sed erat mauris, aliquam nec consequat id, congue id libero. Maecenas elementum gravida tincidunt. Suspendisse lacinia enim sit amet nulla cursus pulvinar. +</p> +<p> +Proin ut sem nulla, at cursus sapien. Duis sagittis lacus vitae justo mattis in sagittis ligula eleifend. Curabitur sit amet felis pharetra justo facilisis mollis eget nec massa. Sed nisi urna, semper lobortis pretium ac, interdum nec lacus. In gravida, leo sit amet vehicula malesuada, augue nunc consectetur nulla, vel tincidunt est nunc aliquet neque. Maecenas imperdiet eros id ligula tempor dapibus. Integer commodo metus sit amet quam vestibulum volutpat. In et lorem ac leo rhoncus auctor sit amet ut urna. Nulla sed nisl quis turpis vestibulum accumsan. Duis mollis aliquam sollicitudin. Pellentesque porta semper interdum. Sed eros orci, congue quis sollicitudin ut, rutrum vitae nibh. Nunc et leo non ligula interdum imperdiet. Integer tincidunt rhoncus ullamcorper. Curabitur et ullamcorper lorem. Ut at tellus eu metus congue sollicitudin eget at orci. +</p> +<p> +Duis sem mauris, pulvinar quis placerat vel, aliquet non leo. Cras eros arcu, ullamcorper sit amet imperdiet at, blandit interdum augue. Phasellus non nunc ac ante condimentum tristique vitae sed urna. Integer nec sapien et dolor volutpat bibendum ac vitae justo. Aliquam gravida fermentum felis, nec dictum dui dictum ac. Maecenas eget magna leo. Phasellus ac nulla risus, dapibus ornare turpis. Morbi a massa tortor. Duis ac turpis lacus. Duis nibh metus, euismod quis ultrices vitae, sollicitudin vel leo. Nullam volutpat odio ac elit imperdiet gravida. +</p> +<p> +Donec luctus magna id ipsum aliquam eget convallis tortor tristique. Etiam est quam, aliquam ac rutrum quis, pretium sed tortor. Aliquam lacus diam, rhoncus molestie convallis ut, luctus ac lacus. Nunc porttitor ante a ligula rutrum elementum. Cras dui tellus, pulvinar vel convallis sit amet, facilisis nec ipsum. Donec fermentum lectus lorem, id accumsan eros. Nunc semper laoreet lacus quis ullamcorper. Nunc luctus erat vitae orci sodales facilisis non ut felis. Aliquam pretium sapien sed enim adipiscing in feugiat est ornare. Aenean ultricies convallis tortor sit amet ullamcorper. +</p> +<p> +Etiam ultricies elit non enim elementum aliquet. Vivamus quis fringilla mauris. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Nunc blandit felis at massa interdum ac molestie lectus volutpat. Mauris commodo nibh id sem porta id feugiat ante euismod. Nullam fermentum libero varius turpis pharetra cursus ut sed lacus. Mauris molestie egestas augue eu bibendum. Quisque pulvinar, leo luctus vehicula faucibus, quam mi ornare dui, a rhoncus nisi eros nec dolor. Sed dictum ultricies ipsum eu ultrices. Etiam semper condimentum nibh in tempor. +</p> +<p> + +Vivamus interdum ligula nec neque sollicitudin ornare. Vestibulum a eros eget nisi accumsan hendrerit quis sit amet ipsum. Phasellus condimentum vestibulum felis eu hendrerit. Suspendisse in est tellus, et consequat ante. Nam at sapien lobortis risus dignissim malesuada. In dapibus lectus sed nibh adipiscing dictum. Nulla pellentesque convallis auctor. Suspendisse ut purus et nibh pulvinar tincidunt. Maecenas dapibus purus at odio commodo ac cursus risus luctus. Ut quis libero justo. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Nullam vestibulum ipsum quis ante porttitor porta. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Ut in ante neque. Donec ante ante, porttitor non egestas a, pulvinar sed sem. Nam augue quam, fringilla sed egestas et, vulputate non nisi. +</p> +<p> +Nunc sit amet arcu ac nulla bibendum sollicitudin. Pellentesque sed ligula urna. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Quisque egestas, tortor a vestibulum malesuada, ante dui condimentum massa, ac rutrum massa mauris non mi. Praesent in nisi leo. Sed ac augue nisl. Donec eget enim ut arcu posuere condimentum vel id magna. Vestibulum laoreet imperdiet massa, ut venenatis ante dapibus eu. Phasellus faucibus vestibulum eros mollis adipiscing. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque aliquet lectus at enim gravida tempus tincidunt mi porta. Sed vehicula molestie ligula, sed tincidunt diam suscipit vitae. +</p> +<p> +Nullam euismod tempus ante, vel semper turpis pharetra eget. Nulla pretium ante et ipsum dapibus imperdiet. Praesent ipsum velit, gravida sed adipiscing id, condimentum in odio. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Fusce blandit vehicula felis, pretium ullamcorper leo tempor non. Nunc eget nisi nunc, posuere pellentesque enim. Nunc gravida orci quis odio semper ultricies. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque eu neque a sapien commodo placerat. Aenean non eros semper metus viverra porttitor. Integer vel tortor eu neque commodo ultrices eu quis tellus. Nam commodo sagittis dolor in consequat. Fusce hendrerit turpis eget leo rutrum ut scelerisque nibh condimentum. Fusce sit amet feugiat mauris. Maecenas elementum tellus nec augue rutrum mattis. Sed viverra tempor blandit. Pellentesque adipiscing tincidunt est sit amet tincidunt. Proin suscipit suscipit odio, eu pellentesque dolor pharetra non. Aliquam erat volutpat. +</p> +<p> +Duis pellentesque, enim sed mollis congue, ante mauris feugiat nisi, bibendum euismod erat enim ac magna. Mauris risus nisl, sodales vel viverra ut, interdum sed neque. Nunc ac dignissim felis. Proin tincidunt orci elementum erat molestie suscipit. Cras suscipit, sem ac vehicula vehicula, lorem orci dictum nibh, ut bibendum odio sem non erat. Maecenas quis metus eget mauris feugiat porta a eu ipsum. Vivamus tortor purus, posuere ut luctus sed, ullamcorper feugiat neque. In hac habitasse platea dictumst. Vivamus nec justo vel lacus mattis pellentesque. Nunc vel gravida quam. Etiam at aliquam magna. +</p> +<p> +Sed ac lacus ac felis auctor suscipit. Aliquam lacinia lectus ac nunc placerat aliquam accumsan neque interdum. Aenean in sapien sem. Suspendisse potenti. Aenean congue vulputate scelerisque. Proin eget eros tortor. Morbi rhoncus, mi vitae sollicitudin luctus, est orci porttitor turpis, vitae cursus est dui sed leo. Curabitur erat nunc, placerat bibendum tempus in, blandit eget ipsum. Cras in feugiat ipsum. Vestibulum dapibus quam nec odio pretium non dapibus purus dapibus. Pellentesque vehicula metus bibendum orci ultrices tincidunt. Sed fermentum, neque eget porta tempor, sem neque pulvinar ligula, vitae elementum massa metus eget nunc. Nunc sed orci eu purus sodales fringilla. Quisque aliquet arcu ac dolor ultrices fringilla. Nullam ornare tempus lorem, in mattis magna mollis laoreet. Vestibulum convallis arcu in purus lobortis et sollicitudin ipsum aliquet. Quisque risus est, sagittis eu aliquam ac, condimentum at massa. Fusce consectetur dignissim sem vel ornare. Maecenas posuere ultricies sollicitudin. Duis luctus, purus quis auctor egestas, diam felis scelerisque diam, a varius tellus erat a nunc. +</p> +<p> +Phasellus id ante neque, eget volutpat risus. Vivamus scelerisque, nisi rutrum ultrices varius, sem quam suscipit purus, in elementum nibh nulla nec nisi. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Phasellus interdum hendrerit mi, nec cursus nisi tempor ac. Phasellus luctus ligula bibendum mauris iaculis id tempor odio volutpat. Nunc in augue metus. Suspendisse at libero at libero lacinia convallis eu vitae metus. Duis eget risus odio. Nam id mi tellus, non vulputate libero. In placerat dictum orci eu pellentesque. Etiam sed varius felis. Phasellus ut adipiscing leo. Morbi ante eros, interdum eget dapibus ac, varius congue nunc. Donec vulputate sapien id risus sodales sit amet pretium velit iaculis. Etiam ultrices tempor euismod. +</p> + +<p> +Praesent in turpis ut mauris cursus commodo. Mauris lectus tellus, congue sit amet dictum id, convallis ac nisi. Curabitur ante dolor, sagittis ac auctor ac, aliquet vel nisl. Nulla non porta sapien. Nunc non aliquet erat. Vestibulum euismod auctor volutpat. Mauris libero tellus, pharetra eget lacinia sit amet, viverra eget velit. Sed viverra varius velit at pharetra. Sed pharetra dolor sed erat interdum in placerat magna lacinia. Cras venenatis tellus non sapien egestas sollicitudin. Duis congue pharetra lacinia. Curabitur eu diam vel tortor rhoncus dignissim vel sed enim. Proin ut congue mi. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce viverra elit eu dolor tincidunt tempor vel nec magna. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; +</p> +<p> +Sed ligula purus, tristique nec condimentum sed, facilisis ac augue. Integer volutpat velit urna, et posuere ligula. In tempus luctus dignissim. Duis augue neque, egestas ut tincidunt in, congue a enim. Aliquam ut odio dui, id congue tortor. Nullam venenatis erat non nulla tincidunt scelerisque. Morbi in urna ac nulla molestie scelerisque eu a nulla. Aliquam erat volutpat. Praesent dictum scelerisque lorem mattis vehicula. Quisque ut rutrum metus. Mauris pharetra ante vitae nunc mattis vulputate. Mauris molestie volutpat mauris, ut iaculis dui bibendum ac. Ut egestas laoreet est, eget mollis libero laoreet at. In sagittis vestibulum accumsan. Nam dapibus ultrices urna sit amet accumsan. Pellentesque id ultrices elit. Aliquam quis magna ut leo sagittis posuere sit amet id enim. Etiam congue eros sit amet nulla aliquam gravida. In accumsan lectus nibh. Proin volutpat pretium facilisis. +</p> +<p> +Mauris pulvinar erat at quam egestas ac aliquet mi gravida. Integer pellentesque quam vel massa commodo vitae sollicitudin eros volutpat. Aenean mollis felis molestie quam placerat et elementum eros gravida. In hac habitasse platea dictumst. Mauris ullamcorper facilisis eros, nec rutrum mi auctor sed. Ut viverra, orci a viverra ultricies, turpis enim pellentesque urna, sit amet viverra metus enim ut justo. Donec aliquam, urna id condimentum rutrum, nibh nunc tristique magna, at luctus quam enim at turpis. Maecenas dapibus dui ac velit adipiscing fringilla. Nullam malesuada nunc vel lorem cursus sed congue felis lacinia. Pellentesque vehicula gravida est nec facilisis. Nullam imperdiet fringilla orci in dignissim. Praesent orci dolor, vestibulum eu auctor quis, tristique auctor mi. Nunc euismod dui sit amet metus malesuada feugiat. Fusce iaculis neque in velit interdum rhoncus. Aenean at risus ut arcu dapibus congue a tincidunt dolor. Donec porttitor lacus et urna vestibulum a sagittis nunc mollis. +</p> +<p> +In metus tellus, eleifend id aliquet at, pulvinar ut tortor. Aliquam erat volutpat. Vivamus lacus magna, consequat vel euismod sed, viverra a ipsum. Praesent dapibus laoreet nisi, nec posuere massa commodo vel. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed ullamcorper adipiscing ante, dapibus molestie velit cursus id. Nam cursus arcu consectetur lectus sollicitudin gravida. Maecenas urna sapien, fermentum sit amet consectetur at, feugiat ut massa. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer sit amet ante nec arcu bibendum bibendum ut ut justo. Nulla ut libero est. +</p> +<p> +Aenean sem augue, malesuada quis elementum id, aliquet at turpis. Nam volutpat interdum purus, at dictum risus posuere rhoncus. Praesent metus diam, egestas in lacinia eu, tincidunt in nibh. Phasellus sollicitudin volutpat erat, sit amet mattis sapien fringilla in. Quisque rhoncus, felis a pellentesque dictum, arcu urna molestie sem, ut tincidunt nulla magna in enim. Vestibulum erat nulla, sollicitudin quis faucibus et, blandit quis est. Nam vehicula justo augue. Vivamus elementum sodales aliquet. Donec convallis neque sed dui euismod aliquet. Morbi elementum hendrerit odio, vel mollis felis dignissim vitae. Phasellus a diam lacus. Integer congue, mi vehicula egestas imperdiet, nulla mi commodo tortor, sit amet fermentum urna leo non dolor. Donec elementum elementum urna at sollicitudin. Vestibulum placerat tortor in nibh lobortis ac consectetur felis interdum. Integer faucibus diam nec magna porttitor sit amet dictum elit consectetur. Suspendisse risus velit, pellentesque eget viverra in, porta eget metus. Sed porta elit erat. +</p> +<p> +Nulla facilisi. Aliquam vulputate dolor quis nisi auctor luctus. Fusce vitae scelerisque velit. Sed sit amet tortor a nisi convallis pulvinar et eget sapien. Nulla condimentum auctor velit, a viverra nibh pellentesque eget. Aenean at lacus quam, lobortis posuere justo. Duis et diam in ligula rhoncus pellentesque. Morbi massa tellus, mattis nec condimentum ut, tempus eu lectus. In mi orci, luctus at pulvinar vel, scelerisque nec enim. Vestibulum vehicula odio in augue dignissim tincidunt. Integer ac velit ligula. Integer elit turpis, mattis eget ornare ut, eleifend in magna. Curabitur sagittis dui in felis ultricies gravida. + +</p> +<p> +Praesent adipiscing rhoncus rutrum. Aenean ultricies auctor risus at fringilla. Mauris quam lectus, ullamcorper sed ultricies at, interdum eget tellus. Vestibulum ac mi erat. Sed ac tellus erat, sed laoreet arcu. Fusce eget ipsum ac sem volutpat viverra. Suspendisse ac felis sit amet purus viverra luctus non eget ipsum. Praesent eleifend euismod tortor, vel malesuada felis consectetur ac. Nunc a mi sit amet nulla venenatis tincidunt. Morbi vitae nisl nulla, nec adipiscing sem. Nullam porttitor scelerisque urna, id dapibus diam malesuada vitae. Duis auctor eleifend lectus, a tempor odio aliquet quis. Nam eu est urna, nec ultricies lectus. Ut egestas aliquet nunc, et hendrerit erat vehicula non. Aliquam tempus faucibus arcu, at vulputate erat tempor eu. Quisque tempus, lectus adipiscing blandit scelerisque, magna felis eleifend odio, non volutpat felis enim sit amet leo. Mauris augue tortor, ultrices ac sagittis non, vulputate quis nisl. +</p> +<p> +Fusce erat sem, dictum in bibendum ac, feugiat ut odio. Duis aliquam felis sit amet diam egestas consectetur. Phasellus consequat, mauris eget venenatis porta, velit sapien malesuada nibh, id dignissim ante tellus vitae lacus. Duis non nisl sit amet nunc euismod posuere. Donec eros erat, fringilla vel iaculis condimentum, vestibulum at neque. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Aliquam lorem sapien, bibendum eu mollis nec, gravida dapibus lectus. Aenean pretium volutpat nunc a placerat. Nullam eget tellus quis ipsum ultrices ullamcorper non eu mauris. Donec volutpat tincidunt elit, sit amet cursus justo elementum quis. Mauris volutpat, enim sit amet tempor commodo, purus lacus luctus dui, sed aliquet ligula nisi vel diam. Donec est elit, lobortis at eleifend id, feugiat egestas massa. Fusce elementum sollicitudin adipiscing. Vivamus et dapibus ipsum. Morbi interdum libero a nisl dignissim sed facilisis ipsum lacinia. +</p> +<p> +Cras a augue dui, vitae tincidunt enim. In hac habitasse platea dictumst. Proin nec magna sed nulla mollis tempus id ut lectus. Morbi volutpat ultricies ipsum, quis imperdiet libero tempor nec. Donec bibendum ornare blandit. Aliquam rutrum risus non turpis commodo non commodo erat molestie. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut fermentum, magna vel euismod convallis, mi magna vehicula velit, aliquet rhoncus ipsum massa et nunc. Nullam blandit purus non neque ullamcorper a aliquet nisl tristique. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Sed sit amet velit magna, sit amet rutrum dui. Donec elementum mi sed velit consectetur vulputate. Sed interdum adipiscing mattis. +</p> +Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam vitae urna quam. Fusce adipiscing erat eget magna malesuada vel mollis ligula ullamcorper. Donec pulvinar, libero et vehicula facilisis, odio orci fringilla magna, non ultricies ipsum justo a tellus. Proin facilisis magna vitae quam vestibulum tempor. Aenean semper placerat posuere. In nisi diam, ullamcorper sit amet viverra sed, pretium sed neque. Sed posuere vulputate mauris vitae placerat. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Nam in odio elit, non tempor felis. Integer non iaculis ante. Sed erat mauris, aliquam nec consequat id, congue id libero. Maecenas elementum gravida tincidunt. Suspendisse lacinia enim sit amet nulla cursus pulvinar. +</p> +<p> +Proin ut sem nulla, at cursus sapien. Duis sagittis lacus vitae justo mattis in sagittis ligula eleifend. Curabitur sit amet felis pharetra justo facilisis mollis eget nec massa. Sed nisi urna, semper lobortis pretium ac, interdum nec lacus. In gravida, leo sit amet vehicula malesuada, augue nunc consectetur nulla, vel tincidunt est nunc aliquet neque. Maecenas imperdiet eros id ligula tempor dapibus. Integer commodo metus sit amet quam vestibulum volutpat. In et lorem ac leo rhoncus auctor sit amet ut urna. Nulla sed nisl quis turpis vestibulum accumsan. Duis mollis aliquam sollicitudin. Pellentesque porta semper interdum. Sed eros orci, congue quis sollicitudin ut, rutrum vitae nibh. Nunc et leo non ligula interdum imperdiet. Integer tincidunt rhoncus ullamcorper. Curabitur et ullamcorper lorem. Ut at tellus eu metus congue sollicitudin eget at orci. +</p> +<p> +Duis sem mauris, pulvinar quis placerat vel, aliquet non leo. Cras eros arcu, ullamcorper sit amet imperdiet at, blandit interdum augue. Phasellus non nunc ac ante condimentum tristique vitae sed urna. Integer nec sapien et dolor volutpat bibendum ac vitae justo. Aliquam gravida fermentum felis, nec dictum dui dictum ac. Maecenas eget magna leo. Phasellus ac nulla risus, dapibus ornare turpis. Morbi a massa tortor. Duis ac turpis lacus. Duis nibh metus, euismod quis ultrices vitae, sollicitudin vel leo. Nullam volutpat odio ac elit imperdiet gravida. +</p> +<p> +Donec luctus magna id ipsum aliquam eget convallis tortor tristique. Etiam est quam, aliquam ac rutrum quis, pretium sed tortor. Aliquam lacus diam, rhoncus molestie convallis ut, luctus ac lacus. Nunc porttitor ante a ligula rutrum elementum. Cras dui tellus, pulvinar vel convallis sit amet, facilisis nec ipsum. Donec fermentum lectus lorem, id accumsan eros. Nunc semper laoreet lacus quis ullamcorper. Nunc luctus erat vitae orci sodales facilisis non ut felis. Aliquam pretium sapien sed enim adipiscing in feugiat est ornare. Aenean ultricies convallis tortor sit amet ullamcorper. +</p> +<p> +Etiam ultricies elit non enim elementum aliquet. Vivamus quis fringilla mauris. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Nunc blandit felis at massa interdum ac molestie lectus volutpat. Mauris commodo nibh id sem porta id feugiat ante euismod. Nullam fermentum libero varius turpis pharetra cursus ut sed lacus. Mauris molestie egestas augue eu bibendum. Quisque pulvinar, leo luctus vehicula faucibus, quam mi ornare dui, a rhoncus nisi eros nec dolor. Sed dictum ultricies ipsum eu ultrices. Etiam semper condimentum nibh in tempor. +</p> +<p> + +Vivamus interdum ligula nec neque sollicitudin ornare. Vestibulum a eros eget nisi accumsan hendrerit quis sit amet ipsum. Phasellus condimentum vestibulum felis eu hendrerit. Suspendisse in est tellus, et consequat ante. Nam at sapien lobortis risus dignissim malesuada. In dapibus lectus sed nibh adipiscing dictum. Nulla pellentesque convallis auctor. Suspendisse ut purus et nibh pulvinar tincidunt. Maecenas dapibus purus at odio commodo ac cursus risus luctus. Ut quis libero justo. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Nullam vestibulum ipsum quis ante porttitor porta. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Ut in ante neque. Donec ante ante, porttitor non egestas a, pulvinar sed sem. Nam augue quam, fringilla sed egestas et, vulputate non nisi. +</p> +<p> +Nunc sit amet arcu ac nulla bibendum sollicitudin. Pellentesque sed ligula urna. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Quisque egestas, tortor a vestibulum malesuada, ante dui condimentum massa, ac rutrum massa mauris non mi. Praesent in nisi leo. Sed ac augue nisl. Donec eget enim ut arcu posuere condimentum vel id magna. Vestibulum laoreet imperdiet massa, ut venenatis ante dapibus eu. Phasellus faucibus vestibulum eros mollis adipiscing. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque aliquet lectus at enim gravida tempus tincidunt mi porta. Sed vehicula molestie ligula, sed tincidunt diam suscipit vitae. +</p> +<p> +Nullam euismod tempus ante, vel semper turpis pharetra eget. Nulla pretium ante et ipsum dapibus imperdiet. Praesent ipsum velit, gravida sed adipiscing id, condimentum in odio. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Fusce blandit vehicula felis, pretium ullamcorper leo tempor non. Nunc eget nisi nunc, posuere pellentesque enim. Nunc gravida orci quis odio semper ultricies. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque eu neque a sapien commodo placerat. Aenean non eros semper metus viverra porttitor. Integer vel tortor eu neque commodo ultrices eu quis tellus. Nam commodo sagittis dolor in consequat. Fusce hendrerit turpis eget leo rutrum ut scelerisque nibh condimentum. Fusce sit amet feugiat mauris. Maecenas elementum tellus nec augue rutrum mattis. Sed viverra tempor blandit. Pellentesque adipiscing tincidunt est sit amet tincidunt. Proin suscipit suscipit odio, eu pellentesque dolor pharetra non. Aliquam erat volutpat. +</p> +<p> +Duis pellentesque, enim sed mollis congue, ante mauris feugiat nisi, bibendum euismod erat enim ac magna. Mauris risus nisl, sodales vel viverra ut, interdum sed neque. Nunc ac dignissim felis. Proin tincidunt orci elementum erat molestie suscipit. Cras suscipit, sem ac vehicula vehicula, lorem orci dictum nibh, ut bibendum odio sem non erat. Maecenas quis metus eget mauris feugiat porta a eu ipsum. Vivamus tortor purus, posuere ut luctus sed, ullamcorper feugiat neque. In hac habitasse platea dictumst. Vivamus nec justo vel lacus mattis pellentesque. Nunc vel gravida quam. Etiam at aliquam magna. +</p> +<p> +Sed ac lacus ac felis auctor suscipit. Aliquam lacinia lectus ac nunc placerat aliquam accumsan neque interdum. Aenean in sapien sem. Suspendisse potenti. Aenean congue vulputate scelerisque. Proin eget eros tortor. Morbi rhoncus, mi vitae sollicitudin luctus, est orci porttitor turpis, vitae cursus est dui sed leo. Curabitur erat nunc, placerat bibendum tempus in, blandit eget ipsum. Cras in feugiat ipsum. Vestibulum dapibus quam nec odio pretium non dapibus purus dapibus. Pellentesque vehicula metus bibendum orci ultrices tincidunt. Sed fermentum, neque eget porta tempor, sem neque pulvinar ligula, vitae elementum massa metus eget nunc. Nunc sed orci eu purus sodales fringilla. Quisque aliquet arcu ac dolor ultrices fringilla. Nullam ornare tempus lorem, in mattis magna mollis laoreet. Vestibulum convallis arcu in purus lobortis et sollicitudin ipsum aliquet. Quisque risus est, sagittis eu aliquam ac, condimentum at massa. Fusce consectetur dignissim sem vel ornare. Maecenas posuere ultricies sollicitudin. Duis luctus, purus quis auctor egestas, diam felis scelerisque diam, a varius tellus erat a nunc. +</p> +<p> +Phasellus id ante neque, eget volutpat risus. Vivamus scelerisque, nisi rutrum ultrices varius, sem quam suscipit purus, in elementum nibh nulla nec nisi. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Phasellus interdum hendrerit mi, nec cursus nisi tempor ac. Phasellus luctus ligula bibendum mauris iaculis id tempor odio volutpat. Nunc in augue metus. Suspendisse at libero at libero lacinia convallis eu vitae metus. Duis eget risus odio. Nam id mi tellus, non vulputate libero. In placerat dictum orci eu pellentesque. Etiam sed varius felis. Phasellus ut adipiscing leo. Morbi ante eros, interdum eget dapibus ac, varius congue nunc. Donec vulputate sapien id risus sodales sit amet pretium velit iaculis. Etiam ultrices tempor euismod. +</p> + +<p> +Praesent in turpis ut mauris cursus commodo. Mauris lectus tellus, congue sit amet dictum id, convallis ac nisi. Curabitur ante dolor, sagittis ac auctor ac, aliquet vel nisl. Nulla non porta sapien. Nunc non aliquet erat. Vestibulum euismod auctor volutpat. Mauris libero tellus, pharetra eget lacinia sit amet, viverra eget velit. Sed viverra varius velit at pharetra. Sed pharetra dolor sed erat interdum in placerat magna lacinia. Cras venenatis tellus non sapien egestas sollicitudin. Duis congue pharetra lacinia. Curabitur eu diam vel tortor rhoncus dignissim vel sed enim. Proin ut congue mi. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce viverra elit eu dolor tincidunt tempor vel nec magna. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; +</p> +<p> +Sed ligula purus, tristique nec condimentum sed, facilisis ac augue. Integer volutpat velit urna, et posuere ligula. In tempus luctus dignissim. Duis augue neque, egestas ut tincidunt in, congue a enim. Aliquam ut odio dui, id congue tortor. Nullam venenatis erat non nulla tincidunt scelerisque. Morbi in urna ac nulla molestie scelerisque eu a nulla. Aliquam erat volutpat. Praesent dictum scelerisque lorem mattis vehicula. Quisque ut rutrum metus. Mauris pharetra ante vitae nunc mattis vulputate. Mauris molestie volutpat mauris, ut iaculis dui bibendum ac. Ut egestas laoreet est, eget mollis libero laoreet at. In sagittis vestibulum accumsan. Nam dapibus ultrices urna sit amet accumsan. Pellentesque id ultrices elit. Aliquam quis magna ut leo sagittis posuere sit amet id enim. Etiam congue eros sit amet nulla aliquam gravida. In accumsan lectus nibh. Proin volutpat pretium facilisis. +</p> +<p> +Mauris pulvinar erat at quam egestas ac aliquet mi gravida. Integer pellentesque quam vel massa commodo vitae sollicitudin eros volutpat. Aenean mollis felis molestie quam placerat et elementum eros gravida. In hac habitasse platea dictumst. Mauris ullamcorper facilisis eros, nec rutrum mi auctor sed. Ut viverra, orci a viverra ultricies, turpis enim pellentesque urna, sit amet viverra metus enim ut justo. Donec aliquam, urna id condimentum rutrum, nibh nunc tristique magna, at luctus quam enim at turpis. Maecenas dapibus dui ac velit adipiscing fringilla. Nullam malesuada nunc vel lorem cursus sed congue felis lacinia. Pellentesque vehicula gravida est nec facilisis. Nullam imperdiet fringilla orci in dignissim. Praesent orci dolor, vestibulum eu auctor quis, tristique auctor mi. Nunc euismod dui sit amet metus malesuada feugiat. Fusce iaculis neque in velit interdum rhoncus. Aenean at risus ut arcu dapibus congue a tincidunt dolor. Donec porttitor lacus et urna vestibulum a sagittis nunc mollis. +</p> +<p> +In metus tellus, eleifend id aliquet at, pulvinar ut tortor. Aliquam erat volutpat. Vivamus lacus magna, consequat vel euismod sed, viverra a ipsum. Praesent dapibus laoreet nisi, nec posuere massa commodo vel. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed ullamcorper adipiscing ante, dapibus molestie velit cursus id. Nam cursus arcu consectetur lectus sollicitudin gravida. Maecenas urna sapien, fermentum sit amet consectetur at, feugiat ut massa. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer sit amet ante nec arcu bibendum bibendum ut ut justo. Nulla ut libero est. +</p> +<p> +Aenean sem augue, malesuada quis elementum id, aliquet at turpis. Nam volutpat interdum purus, at dictum risus posuere rhoncus. Praesent metus diam, egestas in lacinia eu, tincidunt in nibh. Phasellus sollicitudin volutpat erat, sit amet mattis sapien fringilla in. Quisque rhoncus, felis a pellentesque dictum, arcu urna molestie sem, ut tincidunt nulla magna in enim. Vestibulum erat nulla, sollicitudin quis faucibus et, blandit quis est. Nam vehicula justo augue. Vivamus elementum sodales aliquet. Donec convallis neque sed dui euismod aliquet. Morbi elementum hendrerit odio, vel mollis felis dignissim vitae. Phasellus a diam lacus. Integer congue, mi vehicula egestas imperdiet, nulla mi commodo tortor, sit amet fermentum urna leo non dolor. Donec elementum elementum urna at sollicitudin. Vestibulum placerat tortor in nibh lobortis ac consectetur felis interdum. Integer faucibus diam nec magna porttitor sit amet dictum elit consectetur. Suspendisse risus velit, pellentesque eget viverra in, porta eget metus. Sed porta elit erat. +</p> +<p> +Nulla facilisi. Aliquam vulputate dolor quis nisi auctor luctus. Fusce vitae scelerisque velit. Sed sit amet tortor a nisi convallis pulvinar et eget sapien. Nulla condimentum auctor velit, a viverra nibh pellentesque eget. Aenean at lacus quam, lobortis posuere justo. Duis et diam in ligula rhoncus pellentesque. Morbi massa tellus, mattis nec condimentum ut, tempus eu lectus. In mi orci, luctus at pulvinar vel, scelerisque nec enim. Vestibulum vehicula odio in augue dignissim tincidunt. Integer ac velit ligula. Integer elit turpis, mattis eget ornare ut, eleifend in magna. Curabitur sagittis dui in felis ultricies gravida. + +</p> +<p> +Praesent adipiscing rhoncus rutrum. Aenean ultricies auctor risus at fringilla. Mauris quam lectus, ullamcorper sed ultricies at, interdum eget tellus. Vestibulum ac mi erat. Sed ac tellus erat, sed laoreet arcu. Fusce eget ipsum ac sem volutpat viverra. Suspendisse ac felis sit amet purus viverra luctus non eget ipsum. Praesent eleifend euismod tortor, vel malesuada felis consectetur ac. Nunc a mi sit amet nulla venenatis tincidunt. Morbi vitae nisl nulla, nec adipiscing sem. Nullam porttitor scelerisque urna, id dapibus diam malesuada vitae. Duis auctor eleifend lectus, a tempor odio aliquet quis. Nam eu est urna, nec ultricies lectus. Ut egestas aliquet nunc, et hendrerit erat vehicula non. Aliquam tempus faucibus arcu, at vulputate erat tempor eu. Quisque tempus, lectus adipiscing blandit scelerisque, magna felis eleifend odio, non volutpat felis enim sit amet leo. Mauris augue tortor, ultrices ac sagittis non, vulputate quis nisl. +</p> +<p> +Fusce erat sem, dictum in bibendum ac, feugiat ut odio. Duis aliquam felis sit amet diam egestas consectetur. Phasellus consequat, mauris eget venenatis porta, velit sapien malesuada nibh, id dignissim ante tellus vitae lacus. Duis non nisl sit amet nunc euismod posuere. Donec eros erat, fringilla vel iaculis condimentum, vestibulum at neque. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Aliquam lorem sapien, bibendum eu mollis nec, gravida dapibus lectus. Aenean pretium volutpat nunc a placerat. Nullam eget tellus quis ipsum ultrices ullamcorper non eu mauris. Donec volutpat tincidunt elit, sit amet cursus justo elementum quis. Mauris volutpat, enim sit amet tempor commodo, purus lacus luctus dui, sed aliquet ligula nisi vel diam. Donec est elit, lobortis at eleifend id, feugiat egestas massa. Fusce elementum sollicitudin adipiscing. Vivamus et dapibus ipsum. Morbi interdum libero a nisl dignissim sed facilisis ipsum lacinia. +</p> +<p> +Cras a augue dui, vitae tincidunt enim. In hac habitasse platea dictumst. Proin nec magna sed nulla mollis tempus id ut lectus. Morbi volutpat ultricies ipsum, quis imperdiet libero tempor nec. Donec bibendum ornare blandit. Aliquam rutrum risus non turpis commodo non commodo erat molestie. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut fermentum, magna vel euismod convallis, mi magna vehicula velit, aliquet rhoncus ipsum massa et nunc. Nullam blandit purus non neque ullamcorper a aliquet nisl tristique. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Sed sit amet velit magna, sit amet rutrum dui. Donec elementum mi sed velit consectetur vulputate. Sed interdum adipiscing mattis. +</p> + +</body> +</html> diff --git a/src/main/webapp/jquery-ui-1.9pre/tests/visual/compound/accordion_tabs.html b/src/main/webapp/jquery-ui-1.9pre/tests/visual/compound/accordion_tabs.html new file mode 100644 index 0000000..e98edaf --- /dev/null +++ b/src/main/webapp/jquery-ui-1.9pre/tests/visual/compound/accordion_tabs.html @@ -0,0 +1,86 @@ +<!DOCTYPE html> +<html lang="en"> +<head> + <meta charset="UTF-8" /> + <title>Compound Visual Test : Accordion in Tabs</title> + <link rel="stylesheet" href="../visual.css" type="text/css" /> + <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css"> + <script type="text/javascript" src="../../../jquery-1.7.1.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.accordion.js"></script> + <script type="text/javascript" src="../../../ui/jquery.ui.tabs.js"></script> + <script type="text/javascript"> + $(function() { + $('#tabs').tabs(); + $('#accordion-1, #accordion-2').accordion(); + }); + </script> +</head> +<body> + +<div id="tabs"> + <ul> + <li><a href="#tabs-1">First</a></li> + <li><a href="#tabs-2">Second</a></li> + </ul> + <div id="tabs-1"> + <div id="accordion-1"> + <h3><a href="#">Accordion Header 1</a></h3> + <div> + <p>Accordion Content 1</p> + <p>Accordion Content 1</p> + <p>Accordion Content 1</p> + <p>Accordion Content 1</p> + <p>Accordion Content 1</p> + </div> + <h3><a href="#">Accordion Header 2</a></h3> + <div> + <p>Accordion Content 2</p> + <p>Accordion Content 2</p> + <p>Accordion Content 2</p> + <p>Accordion Content 2</p> + <p>Accordion Content 2</p> + </div> + <h3><a href="#">Accordion Header 3</a></h3> + <div> + <p>Accordion Content 3</p> + <p>Accordion Content 3</p> + <p>Accordion Content 3</p> + <p>Accordion Content 3</p> + <p>Accordion Content 3</p> + </div> + </div> + </div> + <div id="tabs-2"> + <div id="accordion-2"> + <h3><a href="#">Accordion Header 1</a></h3> + <div> + <p>Accordion Content 1</p> + <p>Accordion Content 1</p> + <p>Accordion Content 1</p> + <p>Accordion Content 1</p> + <p>Accordion Content 1</p> + </div> + <h3><a href="#">Accordion Header 2</a></h3> + <div> + <p>Accordion Content 2</p> + <p>Accordion Content 2</p> + <p>Accordion Content 2</p> + <p>Accordion Content 2</p> + <p>Accordion Content 2</p> + </div> + <h3><a href="#">Accordion Header 3</a></h3> + <div> + <p>Accordion Content 3</p> + <p>Accordion Content 3</p> + <p>Accordion Content 3</p> + <p>Accordion Content 3</p> + <p>Accordion Content 3</p> + </div> + </div> + </div> +</div> + +</body> +</html> diff --git a/src/main/webapp/jquery-ui-1.9pre/tests/visual/compound/datepicker_dialog.html b/src/main/webapp/jquery-ui-1.9pre/tests/visual/compound/datepicker_dialog.html new file mode 100644 index 0000000..0ef3f9b --- /dev/null +++ b/src/main/webapp/jquery-ui-1.9pre/tests/visual/compound/datepicker_dialog.html @@ -0,0 +1,157 @@ +<!DOCTYPE html> +<html lang="en"> +<head> + <meta charset="UTF-8" /> + <title>Compound Visual Test : Datepicker in Dialog</title> + <link rel="stylesheet" href="../visual.css" type="text/css" /> + <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css"> + <script type="text/javascript" src="../../../jquery-1.7.1.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.resizable.js"></script> + <script type="text/javascript" src="../../../ui/jquery.ui.draggable.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"> + $(function() { + $('#datepicker').datepicker(); + $('#dialog').dialog(); + }); + </script> +</head> +<body> + +<div id="dialog"> + <input id="datepicker"> +</div> + +<p> +Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam vitae urna quam. Fusce adipiscing erat eget magna malesuada vel mollis ligula ullamcorper. Donec pulvinar, libero et vehicula facilisis, odio orci fringilla magna, non ultricies ipsum justo a tellus. Proin facilisis magna vitae quam vestibulum tempor. Aenean semper placerat posuere. In nisi diam, ullamcorper sit amet viverra sed, pretium sed neque. Sed posuere vulputate mauris vitae placerat. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Nam in odio elit, non tempor felis. Integer non iaculis ante. Sed erat mauris, aliquam nec consequat id, congue id libero. Maecenas elementum gravida tincidunt. Suspendisse lacinia enim sit amet nulla cursus pulvinar. +</p> +<p> +Proin ut sem nulla, at cursus sapien. Duis sagittis lacus vitae justo mattis in sagittis ligula eleifend. Curabitur sit amet felis pharetra justo facilisis mollis eget nec massa. Sed nisi urna, semper lobortis pretium ac, interdum nec lacus. In gravida, leo sit amet vehicula malesuada, augue nunc consectetur nulla, vel tincidunt est nunc aliquet neque. Maecenas imperdiet eros id ligula tempor dapibus. Integer commodo metus sit amet quam vestibulum volutpat. In et lorem ac leo rhoncus auctor sit amet ut urna. Nulla sed nisl quis turpis vestibulum accumsan. Duis mollis aliquam sollicitudin. Pellentesque porta semper interdum. Sed eros orci, congue quis sollicitudin ut, rutrum vitae nibh. Nunc et leo non ligula interdum imperdiet. Integer tincidunt rhoncus ullamcorper. Curabitur et ullamcorper lorem. Ut at tellus eu metus congue sollicitudin eget at orci. +</p> +<p> +Duis sem mauris, pulvinar quis placerat vel, aliquet non leo. Cras eros arcu, ullamcorper sit amet imperdiet at, blandit interdum augue. Phasellus non nunc ac ante condimentum tristique vitae sed urna. Integer nec sapien et dolor volutpat bibendum ac vitae justo. Aliquam gravida fermentum felis, nec dictum dui dictum ac. Maecenas eget magna leo. Phasellus ac nulla risus, dapibus ornare turpis. Morbi a massa tortor. Duis ac turpis lacus. Duis nibh metus, euismod quis ultrices vitae, sollicitudin vel leo. Nullam volutpat odio ac elit imperdiet gravida. +</p> +<p> +Donec luctus magna id ipsum aliquam eget convallis tortor tristique. Etiam est quam, aliquam ac rutrum quis, pretium sed tortor. Aliquam lacus diam, rhoncus molestie convallis ut, luctus ac lacus. Nunc porttitor ante a ligula rutrum elementum. Cras dui tellus, pulvinar vel convallis sit amet, facilisis nec ipsum. Donec fermentum lectus lorem, id accumsan eros. Nunc semper laoreet lacus quis ullamcorper. Nunc luctus erat vitae orci sodales facilisis non ut felis. Aliquam pretium sapien sed enim adipiscing in feugiat est ornare. Aenean ultricies convallis tortor sit amet ullamcorper. +</p> +<p> +Etiam ultricies elit non enim elementum aliquet. Vivamus quis fringilla mauris. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Nunc blandit felis at massa interdum ac molestie lectus volutpat. Mauris commodo nibh id sem porta id feugiat ante euismod. Nullam fermentum libero varius turpis pharetra cursus ut sed lacus. Mauris molestie egestas augue eu bibendum. Quisque pulvinar, leo luctus vehicula faucibus, quam mi ornare dui, a rhoncus nisi eros nec dolor. Sed dictum ultricies ipsum eu ultrices. Etiam semper condimentum nibh in tempor. +</p> +<p> + +Vivamus interdum ligula nec neque sollicitudin ornare. Vestibulum a eros eget nisi accumsan hendrerit quis sit amet ipsum. Phasellus condimentum vestibulum felis eu hendrerit. Suspendisse in est tellus, et consequat ante. Nam at sapien lobortis risus dignissim malesuada. In dapibus lectus sed nibh adipiscing dictum. Nulla pellentesque convallis auctor. Suspendisse ut purus et nibh pulvinar tincidunt. Maecenas dapibus purus at odio commodo ac cursus risus luctus. Ut quis libero justo. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Nullam vestibulum ipsum quis ante porttitor porta. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Ut in ante neque. Donec ante ante, porttitor non egestas a, pulvinar sed sem. Nam augue quam, fringilla sed egestas et, vulputate non nisi. +</p> +<p> +Nunc sit amet arcu ac nulla bibendum sollicitudin. Pellentesque sed ligula urna. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Quisque egestas, tortor a vestibulum malesuada, ante dui condimentum massa, ac rutrum massa mauris non mi. Praesent in nisi leo. Sed ac augue nisl. Donec eget enim ut arcu posuere condimentum vel id magna. Vestibulum laoreet imperdiet massa, ut venenatis ante dapibus eu. Phasellus faucibus vestibulum eros mollis adipiscing. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque aliquet lectus at enim gravida tempus tincidunt mi porta. Sed vehicula molestie ligula, sed tincidunt diam suscipit vitae. +</p> +<p> +Nullam euismod tempus ante, vel semper turpis pharetra eget. Nulla pretium ante et ipsum dapibus imperdiet. Praesent ipsum velit, gravida sed adipiscing id, condimentum in odio. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Fusce blandit vehicula felis, pretium ullamcorper leo tempor non. Nunc eget nisi nunc, posuere pellentesque enim. Nunc gravida orci quis odio semper ultricies. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque eu neque a sapien commodo placerat. Aenean non eros semper metus viverra porttitor. Integer vel tortor eu neque commodo ultrices eu quis tellus. Nam commodo sagittis dolor in consequat. Fusce hendrerit turpis eget leo rutrum ut scelerisque nibh condimentum. Fusce sit amet feugiat mauris. Maecenas elementum tellus nec augue rutrum mattis. Sed viverra tempor blandit. Pellentesque adipiscing tincidunt est sit amet tincidunt. Proin suscipit suscipit odio, eu pellentesque dolor pharetra non. Aliquam erat volutpat. +</p> +<p> +Duis pellentesque, enim sed mollis congue, ante mauris feugiat nisi, bibendum euismod erat enim ac magna. Mauris risus nisl, sodales vel viverra ut, interdum sed neque. Nunc ac dignissim felis. Proin tincidunt orci elementum erat molestie suscipit. Cras suscipit, sem ac vehicula vehicula, lorem orci dictum nibh, ut bibendum odio sem non erat. Maecenas quis metus eget mauris feugiat porta a eu ipsum. Vivamus tortor purus, posuere ut luctus sed, ullamcorper feugiat neque. In hac habitasse platea dictumst. Vivamus nec justo vel lacus mattis pellentesque. Nunc vel gravida quam. Etiam at aliquam magna. +</p> +<p> +Sed ac lacus ac felis auctor suscipit. Aliquam lacinia lectus ac nunc placerat aliquam accumsan neque interdum. Aenean in sapien sem. Suspendisse potenti. Aenean congue vulputate scelerisque. Proin eget eros tortor. Morbi rhoncus, mi vitae sollicitudin luctus, est orci porttitor turpis, vitae cursus est dui sed leo. Curabitur erat nunc, placerat bibendum tempus in, blandit eget ipsum. Cras in feugiat ipsum. Vestibulum dapibus quam nec odio pretium non dapibus purus dapibus. Pellentesque vehicula metus bibendum orci ultrices tincidunt. Sed fermentum, neque eget porta tempor, sem neque pulvinar ligula, vitae elementum massa metus eget nunc. Nunc sed orci eu purus sodales fringilla. Quisque aliquet arcu ac dolor ultrices fringilla. Nullam ornare tempus lorem, in mattis magna mollis laoreet. Vestibulum convallis arcu in purus lobortis et sollicitudin ipsum aliquet. Quisque risus est, sagittis eu aliquam ac, condimentum at massa. Fusce consectetur dignissim sem vel ornare. Maecenas posuere ultricies sollicitudin. Duis luctus, purus quis auctor egestas, diam felis scelerisque diam, a varius tellus erat a nunc. +</p> +<p> +Phasellus id ante neque, eget volutpat risus. Vivamus scelerisque, nisi rutrum ultrices varius, sem quam suscipit purus, in elementum nibh nulla nec nisi. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Phasellus interdum hendrerit mi, nec cursus nisi tempor ac. Phasellus luctus ligula bibendum mauris iaculis id tempor odio volutpat. Nunc in augue metus. Suspendisse at libero at libero lacinia convallis eu vitae metus. Duis eget risus odio. Nam id mi tellus, non vulputate libero. In placerat dictum orci eu pellentesque. Etiam sed varius felis. Phasellus ut adipiscing leo. Morbi ante eros, interdum eget dapibus ac, varius congue nunc. Donec vulputate sapien id risus sodales sit amet pretium velit iaculis. Etiam ultrices tempor euismod. +</p> + +<p> +Praesent in turpis ut mauris cursus commodo. Mauris lectus tellus, congue sit amet dictum id, convallis ac nisi. Curabitur ante dolor, sagittis ac auctor ac, aliquet vel nisl. Nulla non porta sapien. Nunc non aliquet erat. Vestibulum euismod auctor volutpat. Mauris libero tellus, pharetra eget lacinia sit amet, viverra eget velit. Sed viverra varius velit at pharetra. Sed pharetra dolor sed erat interdum in placerat magna lacinia. Cras venenatis tellus non sapien egestas sollicitudin. Duis congue pharetra lacinia. Curabitur eu diam vel tortor rhoncus dignissim vel sed enim. Proin ut congue mi. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce viverra elit eu dolor tincidunt tempor vel nec magna. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; +</p> +<p> +Sed ligula purus, tristique nec condimentum sed, facilisis ac augue. Integer volutpat velit urna, et posuere ligula. In tempus luctus dignissim. Duis augue neque, egestas ut tincidunt in, congue a enim. Aliquam ut odio dui, id congue tortor. Nullam venenatis erat non nulla tincidunt scelerisque. Morbi in urna ac nulla molestie scelerisque eu a nulla. Aliquam erat volutpat. Praesent dictum scelerisque lorem mattis vehicula. Quisque ut rutrum metus. Mauris pharetra ante vitae nunc mattis vulputate. Mauris molestie volutpat mauris, ut iaculis dui bibendum ac. Ut egestas laoreet est, eget mollis libero laoreet at. In sagittis vestibulum accumsan. Nam dapibus ultrices urna sit amet accumsan. Pellentesque id ultrices elit. Aliquam quis magna ut leo sagittis posuere sit amet id enim. Etiam congue eros sit amet nulla aliquam gravida. In accumsan lectus nibh. Proin volutpat pretium facilisis. +</p> +<p> +Mauris pulvinar erat at quam egestas ac aliquet mi gravida. Integer pellentesque quam vel massa commodo vitae sollicitudin eros volutpat. Aenean mollis felis molestie quam placerat et elementum eros gravida. In hac habitasse platea dictumst. Mauris ullamcorper facilisis eros, nec rutrum mi auctor sed. Ut viverra, orci a viverra ultricies, turpis enim pellentesque urna, sit amet viverra metus enim ut justo. Donec aliquam, urna id condimentum rutrum, nibh nunc tristique magna, at luctus quam enim at turpis. Maecenas dapibus dui ac velit adipiscing fringilla. Nullam malesuada nunc vel lorem cursus sed congue felis lacinia. Pellentesque vehicula gravida est nec facilisis. Nullam imperdiet fringilla orci in dignissim. Praesent orci dolor, vestibulum eu auctor quis, tristique auctor mi. Nunc euismod dui sit amet metus malesuada feugiat. Fusce iaculis neque in velit interdum rhoncus. Aenean at risus ut arcu dapibus congue a tincidunt dolor. Donec porttitor lacus et urna vestibulum a sagittis nunc mollis. +</p> +<p> +In metus tellus, eleifend id aliquet at, pulvinar ut tortor. Aliquam erat volutpat. Vivamus lacus magna, consequat vel euismod sed, viverra a ipsum. Praesent dapibus laoreet nisi, nec posuere massa commodo vel. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed ullamcorper adipiscing ante, dapibus molestie velit cursus id. Nam cursus arcu consectetur lectus sollicitudin gravida. Maecenas urna sapien, fermentum sit amet consectetur at, feugiat ut massa. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer sit amet ante nec arcu bibendum bibendum ut ut justo. Nulla ut libero est. +</p> +<p> +Aenean sem augue, malesuada quis elementum id, aliquet at turpis. Nam volutpat interdum purus, at dictum risus posuere rhoncus. Praesent metus diam, egestas in lacinia eu, tincidunt in nibh. Phasellus sollicitudin volutpat erat, sit amet mattis sapien fringilla in. Quisque rhoncus, felis a pellentesque dictum, arcu urna molestie sem, ut tincidunt nulla magna in enim. Vestibulum erat nulla, sollicitudin quis faucibus et, blandit quis est. Nam vehicula justo augue. Vivamus elementum sodales aliquet. Donec convallis neque sed dui euismod aliquet. Morbi elementum hendrerit odio, vel mollis felis dignissim vitae. Phasellus a diam lacus. Integer congue, mi vehicula egestas imperdiet, nulla mi commodo tortor, sit amet fermentum urna leo non dolor. Donec elementum elementum urna at sollicitudin. Vestibulum placerat tortor in nibh lobortis ac consectetur felis interdum. Integer faucibus diam nec magna porttitor sit amet dictum elit consectetur. Suspendisse risus velit, pellentesque eget viverra in, porta eget metus. Sed porta elit erat. +</p> +<p> +Nulla facilisi. Aliquam vulputate dolor quis nisi auctor luctus. Fusce vitae scelerisque velit. Sed sit amet tortor a nisi convallis pulvinar et eget sapien. Nulla condimentum auctor velit, a viverra nibh pellentesque eget. Aenean at lacus quam, lobortis posuere justo. Duis et diam in ligula rhoncus pellentesque. Morbi massa tellus, mattis nec condimentum ut, tempus eu lectus. In mi orci, luctus at pulvinar vel, scelerisque nec enim. Vestibulum vehicula odio in augue dignissim tincidunt. Integer ac velit ligula. Integer elit turpis, mattis eget ornare ut, eleifend in magna. Curabitur sagittis dui in felis ultricies gravida. + +</p> +<p> +Praesent adipiscing rhoncus rutrum. Aenean ultricies auctor risus at fringilla. Mauris quam lectus, ullamcorper sed ultricies at, interdum eget tellus. Vestibulum ac mi erat. Sed ac tellus erat, sed laoreet arcu. Fusce eget ipsum ac sem volutpat viverra. Suspendisse ac felis sit amet purus viverra luctus non eget ipsum. Praesent eleifend euismod tortor, vel malesuada felis consectetur ac. Nunc a mi sit amet nulla venenatis tincidunt. Morbi vitae nisl nulla, nec adipiscing sem. Nullam porttitor scelerisque urna, id dapibus diam malesuada vitae. Duis auctor eleifend lectus, a tempor odio aliquet quis. Nam eu est urna, nec ultricies lectus. Ut egestas aliquet nunc, et hendrerit erat vehicula non. Aliquam tempus faucibus arcu, at vulputate erat tempor eu. Quisque tempus, lectus adipiscing blandit scelerisque, magna felis eleifend odio, non volutpat felis enim sit amet leo. Mauris augue tortor, ultrices ac sagittis non, vulputate quis nisl. +</p> +<p> +Fusce erat sem, dictum in bibendum ac, feugiat ut odio. Duis aliquam felis sit amet diam egestas consectetur. Phasellus consequat, mauris eget venenatis porta, velit sapien malesuada nibh, id dignissim ante tellus vitae lacus. Duis non nisl sit amet nunc euismod posuere. Donec eros erat, fringilla vel iaculis condimentum, vestibulum at neque. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Aliquam lorem sapien, bibendum eu mollis nec, gravida dapibus lectus. Aenean pretium volutpat nunc a placerat. Nullam eget tellus quis ipsum ultrices ullamcorper non eu mauris. Donec volutpat tincidunt elit, sit amet cursus justo elementum quis. Mauris volutpat, enim sit amet tempor commodo, purus lacus luctus dui, sed aliquet ligula nisi vel diam. Donec est elit, lobortis at eleifend id, feugiat egestas massa. Fusce elementum sollicitudin adipiscing. Vivamus et dapibus ipsum. Morbi interdum libero a nisl dignissim sed facilisis ipsum lacinia. +</p> +<p> +Cras a augue dui, vitae tincidunt enim. In hac habitasse platea dictumst. Proin nec magna sed nulla mollis tempus id ut lectus. Morbi volutpat ultricies ipsum, quis imperdiet libero tempor nec. Donec bibendum ornare blandit. Aliquam rutrum risus non turpis commodo non commodo erat molestie. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut fermentum, magna vel euismod convallis, mi magna vehicula velit, aliquet rhoncus ipsum massa et nunc. Nullam blandit purus non neque ullamcorper a aliquet nisl tristique. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Sed sit amet velit magna, sit amet rutrum dui. Donec elementum mi sed velit consectetur vulputate. Sed interdum adipiscing mattis. +</p> +Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam vitae urna quam. Fusce adipiscing erat eget magna malesuada vel mollis ligula ullamcorper. Donec pulvinar, libero et vehicula facilisis, odio orci fringilla magna, non ultricies ipsum justo a tellus. Proin facilisis magna vitae quam vestibulum tempor. Aenean semper placerat posuere. In nisi diam, ullamcorper sit amet viverra sed, pretium sed neque. Sed posuere vulputate mauris vitae placerat. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Nam in odio elit, non tempor felis. Integer non iaculis ante. Sed erat mauris, aliquam nec consequat id, congue id libero. Maecenas elementum gravida tincidunt. Suspendisse lacinia enim sit amet nulla cursus pulvinar. +</p> +<p> +Proin ut sem nulla, at cursus sapien. Duis sagittis lacus vitae justo mattis in sagittis ligula eleifend. Curabitur sit amet felis pharetra justo facilisis mollis eget nec massa. Sed nisi urna, semper lobortis pretium ac, interdum nec lacus. In gravida, leo sit amet vehicula malesuada, augue nunc consectetur nulla, vel tincidunt est nunc aliquet neque. Maecenas imperdiet eros id ligula tempor dapibus. Integer commodo metus sit amet quam vestibulum volutpat. In et lorem ac leo rhoncus auctor sit amet ut urna. Nulla sed nisl quis turpis vestibulum accumsan. Duis mollis aliquam sollicitudin. Pellentesque porta semper interdum. Sed eros orci, congue quis sollicitudin ut, rutrum vitae nibh. Nunc et leo non ligula interdum imperdiet. Integer tincidunt rhoncus ullamcorper. Curabitur et ullamcorper lorem. Ut at tellus eu metus congue sollicitudin eget at orci. +</p> +<p> +Duis sem mauris, pulvinar quis placerat vel, aliquet non leo. Cras eros arcu, ullamcorper sit amet imperdiet at, blandit interdum augue. Phasellus non nunc ac ante condimentum tristique vitae sed urna. Integer nec sapien et dolor volutpat bibendum ac vitae justo. Aliquam gravida fermentum felis, nec dictum dui dictum ac. Maecenas eget magna leo. Phasellus ac nulla risus, dapibus ornare turpis. Morbi a massa tortor. Duis ac turpis lacus. Duis nibh metus, euismod quis ultrices vitae, sollicitudin vel leo. Nullam volutpat odio ac elit imperdiet gravida. +</p> +<p> +Donec luctus magna id ipsum aliquam eget convallis tortor tristique. Etiam est quam, aliquam ac rutrum quis, pretium sed tortor. Aliquam lacus diam, rhoncus molestie convallis ut, luctus ac lacus. Nunc porttitor ante a ligula rutrum elementum. Cras dui tellus, pulvinar vel convallis sit amet, facilisis nec ipsum. Donec fermentum lectus lorem, id accumsan eros. Nunc semper laoreet lacus quis ullamcorper. Nunc luctus erat vitae orci sodales facilisis non ut felis. Aliquam pretium sapien sed enim adipiscing in feugiat est ornare. Aenean ultricies convallis tortor sit amet ullamcorper. +</p> +<p> +Etiam ultricies elit non enim elementum aliquet. Vivamus quis fringilla mauris. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Nunc blandit felis at massa interdum ac molestie lectus volutpat. Mauris commodo nibh id sem porta id feugiat ante euismod. Nullam fermentum libero varius turpis pharetra cursus ut sed lacus. Mauris molestie egestas augue eu bibendum. Quisque pulvinar, leo luctus vehicula faucibus, quam mi ornare dui, a rhoncus nisi eros nec dolor. Sed dictum ultricies ipsum eu ultrices. Etiam semper condimentum nibh in tempor. +</p> +<p> + +Vivamus interdum ligula nec neque sollicitudin ornare. Vestibulum a eros eget nisi accumsan hendrerit quis sit amet ipsum. Phasellus condimentum vestibulum felis eu hendrerit. Suspendisse in est tellus, et consequat ante. Nam at sapien lobortis risus dignissim malesuada. In dapibus lectus sed nibh adipiscing dictum. Nulla pellentesque convallis auctor. Suspendisse ut purus et nibh pulvinar tincidunt. Maecenas dapibus purus at odio commodo ac cursus risus luctus. Ut quis libero justo. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Nullam vestibulum ipsum quis ante porttitor porta. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Ut in ante neque. Donec ante ante, porttitor non egestas a, pulvinar sed sem. Nam augue quam, fringilla sed egestas et, vulputate non nisi. +</p> +<p> +Nunc sit amet arcu ac nulla bibendum sollicitudin. Pellentesque sed ligula urna. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Quisque egestas, tortor a vestibulum malesuada, ante dui condimentum massa, ac rutrum massa mauris non mi. Praesent in nisi leo. Sed ac augue nisl. Donec eget enim ut arcu posuere condimentum vel id magna. Vestibulum laoreet imperdiet massa, ut venenatis ante dapibus eu. Phasellus faucibus vestibulum eros mollis adipiscing. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque aliquet lectus at enim gravida tempus tincidunt mi porta. Sed vehicula molestie ligula, sed tincidunt diam suscipit vitae. +</p> +<p> +Nullam euismod tempus ante, vel semper turpis pharetra eget. Nulla pretium ante et ipsum dapibus imperdiet. Praesent ipsum velit, gravida sed adipiscing id, condimentum in odio. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Fusce blandit vehicula felis, pretium ullamcorper leo tempor non. Nunc eget nisi nunc, posuere pellentesque enim. Nunc gravida orci quis odio semper ultricies. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque eu neque a sapien commodo placerat. Aenean non eros semper metus viverra porttitor. Integer vel tortor eu neque commodo ultrices eu quis tellus. Nam commodo sagittis dolor in consequat. Fusce hendrerit turpis eget leo rutrum ut scelerisque nibh condimentum. Fusce sit amet feugiat mauris. Maecenas elementum tellus nec augue rutrum mattis. Sed viverra tempor blandit. Pellentesque adipiscing tincidunt est sit amet tincidunt. Proin suscipit suscipit odio, eu pellentesque dolor pharetra non. Aliquam erat volutpat. +</p> +<p> +Duis pellentesque, enim sed mollis congue, ante mauris feugiat nisi, bibendum euismod erat enim ac magna. Mauris risus nisl, sodales vel viverra ut, interdum sed neque. Nunc ac dignissim felis. Proin tincidunt orci elementum erat molestie suscipit. Cras suscipit, sem ac vehicula vehicula, lorem orci dictum nibh, ut bibendum odio sem non erat. Maecenas quis metus eget mauris feugiat porta a eu ipsum. Vivamus tortor purus, posuere ut luctus sed, ullamcorper feugiat neque. In hac habitasse platea dictumst. Vivamus nec justo vel lacus mattis pellentesque. Nunc vel gravida quam. Etiam at aliquam magna. +</p> +<p> +Sed ac lacus ac felis auctor suscipit. Aliquam lacinia lectus ac nunc placerat aliquam accumsan neque interdum. Aenean in sapien sem. Suspendisse potenti. Aenean congue vulputate scelerisque. Proin eget eros tortor. Morbi rhoncus, mi vitae sollicitudin luctus, est orci porttitor turpis, vitae cursus est dui sed leo. Curabitur erat nunc, placerat bibendum tempus in, blandit eget ipsum. Cras in feugiat ipsum. Vestibulum dapibus quam nec odio pretium non dapibus purus dapibus. Pellentesque vehicula metus bibendum orci ultrices tincidunt. Sed fermentum, neque eget porta tempor, sem neque pulvinar ligula, vitae elementum massa metus eget nunc. Nunc sed orci eu purus sodales fringilla. Quisque aliquet arcu ac dolor ultrices fringilla. Nullam ornare tempus lorem, in mattis magna mollis laoreet. Vestibulum convallis arcu in purus lobortis et sollicitudin ipsum aliquet. Quisque risus est, sagittis eu aliquam ac, condimentum at massa. Fusce consectetur dignissim sem vel ornare. Maecenas posuere ultricies sollicitudin. Duis luctus, purus quis auctor egestas, diam felis scelerisque diam, a varius tellus erat a nunc. +</p> +<p> +Phasellus id ante neque, eget volutpat risus. Vivamus scelerisque, nisi rutrum ultrices varius, sem quam suscipit purus, in elementum nibh nulla nec nisi. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Phasellus interdum hendrerit mi, nec cursus nisi tempor ac. Phasellus luctus ligula bibendum mauris iaculis id tempor odio volutpat. Nunc in augue metus. Suspendisse at libero at libero lacinia convallis eu vitae metus. Duis eget risus odio. Nam id mi tellus, non vulputate libero. In placerat dictum orci eu pellentesque. Etiam sed varius felis. Phasellus ut adipiscing leo. Morbi ante eros, interdum eget dapibus ac, varius congue nunc. Donec vulputate sapien id risus sodales sit amet pretium velit iaculis. Etiam ultrices tempor euismod. +</p> + +<p> +Praesent in turpis ut mauris cursus commodo. Mauris lectus tellus, congue sit amet dictum id, convallis ac nisi. Curabitur ante dolor, sagittis ac auctor ac, aliquet vel nisl. Nulla non porta sapien. Nunc non aliquet erat. Vestibulum euismod auctor volutpat. Mauris libero tellus, pharetra eget lacinia sit amet, viverra eget velit. Sed viverra varius velit at pharetra. Sed pharetra dolor sed erat interdum in placerat magna lacinia. Cras venenatis tellus non sapien egestas sollicitudin. Duis congue pharetra lacinia. Curabitur eu diam vel tortor rhoncus dignissim vel sed enim. Proin ut congue mi. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce viverra elit eu dolor tincidunt tempor vel nec magna. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; +</p> +<p> +Sed ligula purus, tristique nec condimentum sed, facilisis ac augue. Integer volutpat velit urna, et posuere ligula. In tempus luctus dignissim. Duis augue neque, egestas ut tincidunt in, congue a enim. Aliquam ut odio dui, id congue tortor. Nullam venenatis erat non nulla tincidunt scelerisque. Morbi in urna ac nulla molestie scelerisque eu a nulla. Aliquam erat volutpat. Praesent dictum scelerisque lorem mattis vehicula. Quisque ut rutrum metus. Mauris pharetra ante vitae nunc mattis vulputate. Mauris molestie volutpat mauris, ut iaculis dui bibendum ac. Ut egestas laoreet est, eget mollis libero laoreet at. In sagittis vestibulum accumsan. Nam dapibus ultrices urna sit amet accumsan. Pellentesque id ultrices elit. Aliquam quis magna ut leo sagittis posuere sit amet id enim. Etiam congue eros sit amet nulla aliquam gravida. In accumsan lectus nibh. Proin volutpat pretium facilisis. +</p> +<p> +Mauris pulvinar erat at quam egestas ac aliquet mi gravida. Integer pellentesque quam vel massa commodo vitae sollicitudin eros volutpat. Aenean mollis felis molestie quam placerat et elementum eros gravida. In hac habitasse platea dictumst. Mauris ullamcorper facilisis eros, nec rutrum mi auctor sed. Ut viverra, orci a viverra ultricies, turpis enim pellentesque urna, sit amet viverra metus enim ut justo. Donec aliquam, urna id condimentum rutrum, nibh nunc tristique magna, at luctus quam enim at turpis. Maecenas dapibus dui ac velit adipiscing fringilla. Nullam malesuada nunc vel lorem cursus sed congue felis lacinia. Pellentesque vehicula gravida est nec facilisis. Nullam imperdiet fringilla orci in dignissim. Praesent orci dolor, vestibulum eu auctor quis, tristique auctor mi. Nunc euismod dui sit amet metus malesuada feugiat. Fusce iaculis neque in velit interdum rhoncus. Aenean at risus ut arcu dapibus congue a tincidunt dolor. Donec porttitor lacus et urna vestibulum a sagittis nunc mollis. +</p> +<p> +In metus tellus, eleifend id aliquet at, pulvinar ut tortor. Aliquam erat volutpat. Vivamus lacus magna, consequat vel euismod sed, viverra a ipsum. Praesent dapibus laoreet nisi, nec posuere massa commodo vel. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed ullamcorper adipiscing ante, dapibus molestie velit cursus id. Nam cursus arcu consectetur lectus sollicitudin gravida. Maecenas urna sapien, fermentum sit amet consectetur at, feugiat ut massa. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer sit amet ante nec arcu bibendum bibendum ut ut justo. Nulla ut libero est. +</p> +<p> +Aenean sem augue, malesuada quis elementum id, aliquet at turpis. Nam volutpat interdum purus, at dictum risus posuere rhoncus. Praesent metus diam, egestas in lacinia eu, tincidunt in nibh. Phasellus sollicitudin volutpat erat, sit amet mattis sapien fringilla in. Quisque rhoncus, felis a pellentesque dictum, arcu urna molestie sem, ut tincidunt nulla magna in enim. Vestibulum erat nulla, sollicitudin quis faucibus et, blandit quis est. Nam vehicula justo augue. Vivamus elementum sodales aliquet. Donec convallis neque sed dui euismod aliquet. Morbi elementum hendrerit odio, vel mollis felis dignissim vitae. Phasellus a diam lacus. Integer congue, mi vehicula egestas imperdiet, nulla mi commodo tortor, sit amet fermentum urna leo non dolor. Donec elementum elementum urna at sollicitudin. Vestibulum placerat tortor in nibh lobortis ac consectetur felis interdum. Integer faucibus diam nec magna porttitor sit amet dictum elit consectetur. Suspendisse risus velit, pellentesque eget viverra in, porta eget metus. Sed porta elit erat. +</p> +<p> +Nulla facilisi. Aliquam vulputate dolor quis nisi auctor luctus. Fusce vitae scelerisque velit. Sed sit amet tortor a nisi convallis pulvinar et eget sapien. Nulla condimentum auctor velit, a viverra nibh pellentesque eget. Aenean at lacus quam, lobortis posuere justo. Duis et diam in ligula rhoncus pellentesque. Morbi massa tellus, mattis nec condimentum ut, tempus eu lectus. In mi orci, luctus at pulvinar vel, scelerisque nec enim. Vestibulum vehicula odio in augue dignissim tincidunt. Integer ac velit ligula. Integer elit turpis, mattis eget ornare ut, eleifend in magna. Curabitur sagittis dui in felis ultricies gravida. + +</p> +<p> +Praesent adipiscing rhoncus rutrum. Aenean ultricies auctor risus at fringilla. Mauris quam lectus, ullamcorper sed ultricies at, interdum eget tellus. Vestibulum ac mi erat. Sed ac tellus erat, sed laoreet arcu. Fusce eget ipsum ac sem volutpat viverra. Suspendisse ac felis sit amet purus viverra luctus non eget ipsum. Praesent eleifend euismod tortor, vel malesuada felis consectetur ac. Nunc a mi sit amet nulla venenatis tincidunt. Morbi vitae nisl nulla, nec adipiscing sem. Nullam porttitor scelerisque urna, id dapibus diam malesuada vitae. Duis auctor eleifend lectus, a tempor odio aliquet quis. Nam eu est urna, nec ultricies lectus. Ut egestas aliquet nunc, et hendrerit erat vehicula non. Aliquam tempus faucibus arcu, at vulputate erat tempor eu. Quisque tempus, lectus adipiscing blandit scelerisque, magna felis eleifend odio, non volutpat felis enim sit amet leo. Mauris augue tortor, ultrices ac sagittis non, vulputate quis nisl. +</p> +<p> +Fusce erat sem, dictum in bibendum ac, feugiat ut odio. Duis aliquam felis sit amet diam egestas consectetur. Phasellus consequat, mauris eget venenatis porta, velit sapien malesuada nibh, id dignissim ante tellus vitae lacus. Duis non nisl sit amet nunc euismod posuere. Donec eros erat, fringilla vel iaculis condimentum, vestibulum at neque. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Aliquam lorem sapien, bibendum eu mollis nec, gravida dapibus lectus. Aenean pretium volutpat nunc a placerat. Nullam eget tellus quis ipsum ultrices ullamcorper non eu mauris. Donec volutpat tincidunt elit, sit amet cursus justo elementum quis. Mauris volutpat, enim sit amet tempor commodo, purus lacus luctus dui, sed aliquet ligula nisi vel diam. Donec est elit, lobortis at eleifend id, feugiat egestas massa. Fusce elementum sollicitudin adipiscing. Vivamus et dapibus ipsum. Morbi interdum libero a nisl dignissim sed facilisis ipsum lacinia. +</p> +<p> +Cras a augue dui, vitae tincidunt enim. In hac habitasse platea dictumst. Proin nec magna sed nulla mollis tempus id ut lectus. Morbi volutpat ultricies ipsum, quis imperdiet libero tempor nec. Donec bibendum ornare blandit. Aliquam rutrum risus non turpis commodo non commodo erat molestie. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut fermentum, magna vel euismod convallis, mi magna vehicula velit, aliquet rhoncus ipsum massa et nunc. Nullam blandit purus non neque ullamcorper a aliquet nisl tristique. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Sed sit amet velit magna, sit amet rutrum dui. Donec elementum mi sed velit consectetur vulputate. Sed interdum adipiscing mattis. +</p> + +</body> +</html> diff --git a/src/main/webapp/jquery-ui-1.9pre/tests/visual/compound/draggable_accordion.html b/src/main/webapp/jquery-ui-1.9pre/tests/visual/compound/draggable_accordion.html new file mode 100644 index 0000000..396d0e2 --- /dev/null +++ b/src/main/webapp/jquery-ui-1.9pre/tests/visual/compound/draggable_accordion.html @@ -0,0 +1,65 @@ +<!DOCTYPE html> +<html lang="en"> +<head> + <meta charset="UTF-8" /> + <title>Compound Visual Test : Draggable in Accordion</title> + <link rel="stylesheet" href="../visual.css" type="text/css" /> + <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css"> + <script type="text/javascript" src="../../../jquery-1.7.1.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.accordion.js"></script> + <script type="text/javascript" src="../../../ui/jquery.ui.draggable.js"></script> + <style type="text/css"> + .draggable { + width: 10em; + margin: 0.5em; + } + </style> + <script type="text/javascript"> + $(function() { + $( "#accordion" ).accordion(); + $( ".draggable" ).addClass( "ui-widget ui-widget-content ui-corner-all" ) + $( "#first .draggable" ).draggable(); + $( "#second .draggable" ).draggable({ + appendTo: "body" + }); + $( "#third .draggable" ).draggable({ + helper: "clone", + appendTo: "body" + }); + }); + </script> +</head> +<body> + +<div id="accordion"> + <h3><a href="#">.draggable()</a></h3> + <div id="first"> + <div class="draggable">Draggable 1-1</div> + <div class="draggable">Draggable 1-2</div> + <div class="draggable">Draggable 1-3</div> + <div class="draggable">Draggable 1-4</div> + <div class="draggable">Draggable 1-5</div> + </div> + <h3><a href="#">.draggable({ appendTo: "body" })</a></h3> + <div id="second"> + <div class="draggable">Draggable 2-1</div> + <div class="draggable">Draggable 2-2</div> + <div class="draggable">Draggable 2-3</div> + <div class="draggable">Draggable 2-4</div> + <div class="draggable">Draggable 2-5</div> + </div> + <h3><a href="#">.draggable({ helper: "clone", appendTo: "body" })</a></h3> + <div id="third"> + <div class="draggable">Draggable 3-1</div> + <div class="draggable">Draggable 3-2</div> + <div class="draggable">Draggable 3-3</div> + <div class="draggable">Draggable 3-4</div> + <div class="draggable">Draggable 3-5</div> + </div> +</div> + +</body> +</html> diff --git a/src/main/webapp/jquery-ui-1.9pre/tests/visual/compound/draggable_accordion_accordion_tabs_draggable.html b/src/main/webapp/jquery-ui-1.9pre/tests/visual/compound/draggable_accordion_accordion_tabs_draggable.html new file mode 100644 index 0000000..a1199c8 --- /dev/null +++ b/src/main/webapp/jquery-ui-1.9pre/tests/visual/compound/draggable_accordion_accordion_tabs_draggable.html @@ -0,0 +1,109 @@ +<!DOCTYPE html> +<html lang="en"> +<head> + <meta charset="UTF-8" /> + <title>Compound Visual Test : Draggable in Accordion</title> + <link rel="stylesheet" href="../visual.css" type="text/css" /> + <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css"> + <script type="text/javascript" src="../../../jquery-1.7.1.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.accordion.js"></script> + <script type="text/javascript" src="../../../ui/jquery.ui.draggable.js"></script> + <script type="text/javascript" src="../../../ui/jquery.ui.tabs.js"></script> + <style type="text/css"> + #main-draggable { + width: 300px; + position: absolute; + right: 100px; + } + #main-draggable-handle { + padding: 1em; + margin: 0; + } + .draggable { + width: 10em; + margin: 0.5em; + } + </style> + <script type="text/javascript"> + $(function() { + $( ".draggable" ).addClass( "ui-widget ui-widget-content ui-corner-all" ) + $( ".draggable" ).draggable({ + helper: "clone", + appendTo: "body" + }); + + // PROBLEM: nested accordions must be initialized before outer accordion + $( "#accordion > div" ).accordion(); + $( "#accordion" ).accordion(); + + + // PROBLEM: nested widgets must be initialized before tabs + $( "#tabs" ).tabs(); + + $( "#main-draggable" ).draggable({ + handle: "#main-draggable-handle" + }); + }); + </script> +</head> +<body> +<div id="main-draggable" class="ui-widget ui-widget-content ui-corner-all"> + <p id="main-draggable-handle" class="ui-widget-header ui-corner-all">Drag me around!</p> + <div id="tabs"> + <ul> + <li><a href="#tabs-1">First Tab</a></li> + <li><a href="#tabs-2">Second Tab</a></li> + </ul> + <div id="tabs-1"> + <p>Click the other tab!</p> + </div> + <div id="tabs-2"> + <div id="accordion"> + <h3><a>Accordion Group 1</a></h3> + <div id="accordion-1-1"> + <h3><a href="#">Header 1-1</a></h3> + <div> + <div class="draggable">Draggable 1-1</div> + <div class="draggable">Draggable 1-2</div> + <div class="draggable">Draggable 1-3</div> + <div class="draggable">Draggable 1-4</div> + <div class="draggable">Draggable 1-5</div> + </div> + <h3><a href="#">Header 1-2</a></h3> + <div> + <div class="draggable">Draggable 2-1</div> + <div class="draggable">Draggable 2-2</div> + <div class="draggable">Draggable 2-3</div> + <div class="draggable">Draggable 2-4</div> + <div class="draggable">Draggable 2-5</div> + </div> + </div> + <h3><a>Accordion Group 2</a></h3> + <div id="accordion-1-2"> + <h3><a href="#">Header 2-1</a></h3> + <div> + <div class="draggable">Draggable 1-1</div> + <div class="draggable">Draggable 1-2</div> + <div class="draggable">Draggable 1-3</div> + <div class="draggable">Draggable 1-4</div> + <div class="draggable">Draggable 1-5</div> + </div> + <h3><a href="#">Header 2-2</a></h3> + <div> + <div class="draggable">Draggable 2-1</div> + <div class="draggable">Draggable 2-2</div> + <div class="draggable">Draggable 2-3</div> + <div class="draggable">Draggable 2-4</div> + <div class="draggable">Draggable 2-5</div> + </div> + </div> + </div> + </div> + </div> +</div> + +</body> +</html> diff --git a/src/main/webapp/jquery-ui-1.9pre/tests/visual/compound/sortable_accordion_sortable_tabs.html b/src/main/webapp/jquery-ui-1.9pre/tests/visual/compound/sortable_accordion_sortable_tabs.html new file mode 100644 index 0000000..02a6c0d --- /dev/null +++ b/src/main/webapp/jquery-ui-1.9pre/tests/visual/compound/sortable_accordion_sortable_tabs.html @@ -0,0 +1,108 @@ +<!DOCTYPE html> +<html lang="en"> +<head> + <meta charset="UTF-8" /> + <title>Compound Visual Test : Accordion in Tabs</title> + <link rel="stylesheet" href="../visual.css" type="text/css" /> + <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css"> + <script type="text/javascript" src="../../../jquery-1.7.1.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.sortable.js"></script> + <script type="text/javascript" src="../../../ui/jquery.ui.accordion.js"></script> + <script type="text/javascript" src="../../../ui/jquery.ui.tabs.js"></script> + <script type="text/javascript"> + $(function() { + $( "#accordion-1, #accordion-2" ) + .accordion({ + header: "> div > h3" + }) + .sortable(); + + $( "#tabs" ) + .tabs() + .find( ".ui-tabs-nav" ) + .sortable(); + }); + </script> +</head> +<body> + +<div id="tabs"> + <ul> + <li><a href="#tabs-1">First</a></li> + <li><a href="#tabs-2">Second</a></li> + </ul> + <div id="tabs-1"> + <div id="accordion-1"> + <div> + <h3><a href="#">Accordion Header 1</a></h3> + <div> + <p>Accordion Content 1</p> + <p>Accordion Content 1</p> + <p>Accordion Content 1</p> + <p>Accordion Content 1</p> + <p>Accordion Content 1</p> + </div> + </div> + <div> + <h3><a href="#">Accordion Header 2</a></h3> + <div> + <p>Accordion Content 2</p> + <p>Accordion Content 2</p> + <p>Accordion Content 2</p> + <p>Accordion Content 2</p> + <p>Accordion Content 2</p> + </div> + </div> + <div> + <h3><a href="#">Accordion Header 3</a></h3> + <div> + <p>Accordion Content 3</p> + <p>Accordion Content 3</p> + <p>Accordion Content 3</p> + <p>Accordion Content 3</p> + <p>Accordion Content 3</p> + </div> + </div> + </div> + </div> + <div id="tabs-2"> + <div id="accordion-1"> + <div> + <h3><a href="#">Accordion Header 1</a></h3> + <div> + <p>Accordion Content 1</p> + <p>Accordion Content 1</p> + <p>Accordion Content 1</p> + <p>Accordion Content 1</p> + <p>Accordion Content 1</p> + </div> + </div> + <div> + <h3><a href="#">Accordion Header 2</a></h3> + <div> + <p>Accordion Content 2</p> + <p>Accordion Content 2</p> + <p>Accordion Content 2</p> + <p>Accordion Content 2</p> + <p>Accordion Content 2</p> + </div> + </div> + <div> + <h3><a href="#">Accordion Header 3</a></h3> + <div> + <p>Accordion Content 3</p> + <p>Accordion Content 3</p> + <p>Accordion Content 3</p> + <p>Accordion Content 3</p> + <p>Accordion Content 3</p> + </div> + </div> + </div> + </div> +</div> + +</body> +</html> diff --git a/src/main/webapp/jquery-ui-1.9pre/tests/visual/compound/tabs_tabs.html b/src/main/webapp/jquery-ui-1.9pre/tests/visual/compound/tabs_tabs.html new file mode 100644 index 0000000..12515a4 --- /dev/null +++ b/src/main/webapp/jquery-ui-1.9pre/tests/visual/compound/tabs_tabs.html @@ -0,0 +1,73 @@ +<!DOCTYPE html> +<html lang="en"> +<head> + <meta charset="UTF-8" /> + <title>Compound Visual Test : Tabs in Tabs</title> + <link rel="stylesheet" href="../visual.css" type="text/css" /> + <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css"> + <script type="text/javascript" src="../../../jquery-1.7.1.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.accordion.js"></script> + <script type="text/javascript" src="../../../ui/jquery.ui.tabs.js"></script> + <script type="text/javascript"> + $(function() { + $('#tabs, #tabs-a, #tabs-b').tabs(); + }); + </script> +</head> +<body> + +<div id="tabs"> + <ul> + <li><a href="#tabs-1">First</a></li> + <li><a href="#tabs-2">Second</a></li> + </ul> + <div id="tabs-1"> + <div id="tabs-a"> + <ul> + <li><a href="#tabs-a-1">First</a></li> + <li><a href="#tabs-a-2">Second</a></li> + </ul> + <div id="tabs-a-1"> + <p>nested tabs a-1</p> + <p>nested tabs a-1</p> + <p>nested tabs a-1</p> + <p>nested tabs a-1</p> + <p>nested tabs a-1</p> + </div> + <div id="tabs-a-2"> + <p>nested tabs a-2</p> + <p>nested tabs a-2</p> + <p>nested tabs a-2</p> + <p>nested tabs a-2</p> + <p>nested tabs a-2</p> + </div> + </div> + </div> + <div id="tabs-2"> + <div id="tabs-b"> + <ul> + <li><a href="#tabs-b-1">First</a></li> + <li><a href="#tabs-b-2">Second</a></li> + </ul> + <div id="tabs-b-1"> + <p>nested tabs b-1</p> + <p>nested tabs b-1</p> + <p>nested tabs b-1</p> + <p>nested tabs b-1</p> + <p>nested tabs b-1</p> + </div> + <div id="tabs-b-2"> + <p>nested tabs b-2</p> + <p>nested tabs b-2</p> + <p>nested tabs b-2</p> + <p>nested tabs b-2</p> + <p>nested tabs b-2</p> + </div> + </div> + </div> +</div> + +</body> +</html> diff --git a/src/main/webapp/jquery-ui-1.9pre/tests/visual/compound/tabs_tooltips.html b/src/main/webapp/jquery-ui-1.9pre/tests/visual/compound/tabs_tooltips.html new file mode 100644 index 0000000..38b85e5 --- /dev/null +++ b/src/main/webapp/jquery-ui-1.9pre/tests/visual/compound/tabs_tooltips.html @@ -0,0 +1,37 @@ +<!DOCTYPE html> +<html lang="en"> +<head> + <meta charset="UTF-8" /> + <title>Compound Visual Test : Tabs in Tabs</title> + <link rel="stylesheet" href="../visual.css" type="text/css" /> + <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css"> + <script type="text/javascript" src="../../../jquery-1.7.1.js"></script> + <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script> + <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script> + <script type="text/javascript" src="../../../ui/jquery.ui.position.js"></script> + <script type="text/javascript" src="../../../ui/jquery.ui.tooltip.js"></script> + <script type="text/javascript" src="../../../ui/jquery.ui.tabs.js"></script> + <script type="text/javascript"> + $(function() { + $("#tabs").tabs(); + $("a").tooltip(); + }); + </script> +</head> +<body> + +<div id="tabs"> + <ul> + <li><a href="#tabs-1" title="first tab tooltip">First</a></li> + <li><a href="#tabs-2" title="second tab tooltip">Second</a></li> + </ul> + <div id="tabs-1"> + <a href="#" title="title content">label</a> + </div> + <div id="tabs-2"> + <a href="#" title="other title content">other label</a> + </div> +</div> + +</body> +</html> diff --git a/src/main/webapp/jquery-ui-1.9pre/tests/visual/compound/widgets_in_dialog.html b/src/main/webapp/jquery-ui-1.9pre/tests/visual/compound/widgets_in_dialog.html new file mode 100644 index 0000000..b711efa --- /dev/null +++ b/src/main/webapp/jquery-ui-1.9pre/tests/visual/compound/widgets_in_dialog.html @@ -0,0 +1,229 @@ +<!DOCTYPE html> +<html lang="en"> +<head> + <meta charset="UTF-8" /> + <title>Compound Visual Test : All Widgets in Dialog</title> + <link rel="stylesheet" href="../visual.css" type="text/css" /> + <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css"> + <script type="text/javascript" src="../../../jquery-1.7.1.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.menu.js"></script> + <script type="text/javascript" src="../../../ui/jquery.ui.resizable.js"></script> + <script type="text/javascript" src="../../../ui/jquery.ui.draggable.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.progressbar.js"></script> + <script type="text/javascript" src="../../../ui/jquery.ui.slider.js"></script> + <script type="text/javascript" src="../../../ui/jquery.ui.tabs.js"></script> + <script type="text/javascript" src="../../../ui/jquery.ui.tooltip.js"></script> + <script type="text/javascript"> + $(function() { + $("[title]").tooltip(); + + $("#accordion").accordion(); + $("#autocomplete").autocomplete({ + source: ["c++", "java", "php", "coldfusion", "javascript", "asp", "ruby", "python", "c", "scala", "groovy", "haskell", "perl"] + }); + $("button").button().click(function() { + $("#dialog2").dialog("open"); + }); + $("#datepicker").datepicker(); + $("#progressbar").progressbar({ + value: 30 + }); + $("#slider").slider({ + // should be animated + animate: true, + value: 30, + slide: function(event, ui) { + $("#progress").val(ui.value); + $("#progressbar").progressbar("option", "value", ui.value); + } + }); + $("#tabs").tabs(); + + $("#dialog").dialog(); + $("#dialog2").dialog({ + autoOpen: false, + width: 100, + height: 75, + modal: true + }); + }); + </script> +</head> +<body> + +<div id="dialog"> + <div id="accordion"> + <h3><a href="#">Accordion Header 1</a></h3> + <div> + Accordion Content 1 + </div> + <h3><a href="#">Accordion Header 2</a></h3> + <div> + Accordion Content 2 + </div> + <h3><a href="#">Accordion Header 3</a></h3> + <div> + Accordion Content 3 + </div> + </div> + <input id="autocomplete"> + <button>A Button</button> + <input id="datepicker"> + <button>Another button</button> + <div> + <label for="progress">Progress: <input title="The progress we made so far" id="progress" /></label> + </div> + <div id="progressbar"> + </div> + <div id="slider" title="Sliding progress..."></div> + <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> +</div> +<div id="dialog2"> + Yay, another dialog. +</div> + +Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam vitae urna quam. Fusce adipiscing erat eget magna malesuada vel mollis ligula ullamcorper. Donec pulvinar, libero et vehicula facilisis, odio orci fringilla magna, non ultricies ipsum justo a tellus. Proin facilisis magna vitae quam vestibulum tempor. Aenean semper placerat posuere. In nisi diam, ullamcorper sit amet viverra sed, pretium sed neque. Sed posuere vulputate mauris vitae placerat. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Nam in odio elit, non tempor felis. Integer non iaculis ante. Sed erat mauris, aliquam nec consequat id, congue id libero. Maecenas elementum gravida tincidunt. Suspendisse lacinia enim sit amet nulla cursus pulvinar. +</p> +<p> +Proin ut sem nulla, at cursus sapien. Duis sagittis lacus vitae justo mattis in sagittis ligula eleifend. Curabitur sit amet felis pharetra justo facilisis mollis eget nec massa. Sed nisi urna, semper lobortis pretium ac, interdum nec lacus. In gravida, leo sit amet vehicula malesuada, augue nunc consectetur nulla, vel tincidunt est nunc aliquet neque. Maecenas imperdiet eros id ligula tempor dapibus. Integer commodo metus sit amet quam vestibulum volutpat. In et lorem ac leo rhoncus auctor sit amet ut urna. Nulla sed nisl quis turpis vestibulum accumsan. Duis mollis aliquam sollicitudin. Pellentesque porta semper interdum. Sed eros orci, congue quis sollicitudin ut, rutrum vitae nibh. Nunc et leo non ligula interdum imperdiet. Integer tincidunt rhoncus ullamcorper. Curabitur et ullamcorper lorem. Ut at tellus eu metus congue sollicitudin eget at orci. +</p> +<p> +Duis sem mauris, pulvinar quis placerat vel, aliquet non leo. Cras eros arcu, ullamcorper sit amet imperdiet at, blandit interdum augue. Phasellus non nunc ac ante condimentum tristique vitae sed urna. Integer nec sapien et dolor volutpat bibendum ac vitae justo. Aliquam gravida fermentum felis, nec dictum dui dictum ac. Maecenas eget magna leo. Phasellus ac nulla risus, dapibus ornare turpis. Morbi a massa tortor. Duis ac turpis lacus. Duis nibh metus, euismod quis ultrices vitae, sollicitudin vel leo. Nullam volutpat odio ac elit imperdiet gravida. +</p> +<p> +Donec luctus magna id ipsum aliquam eget convallis tortor tristique. Etiam est quam, aliquam ac rutrum quis, pretium sed tortor. Aliquam lacus diam, rhoncus molestie convallis ut, luctus ac lacus. Nunc porttitor ante a ligula rutrum elementum. Cras dui tellus, pulvinar vel convallis sit amet, facilisis nec ipsum. Donec fermentum lectus lorem, id accumsan eros. Nunc semper laoreet lacus quis ullamcorper. Nunc luctus erat vitae orci sodales facilisis non ut felis. Aliquam pretium sapien sed enim adipiscing in feugiat est ornare. Aenean ultricies convallis tortor sit amet ullamcorper. +</p> +<p> +Etiam ultricies elit non enim elementum aliquet. Vivamus quis fringilla mauris. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Nunc blandit felis at massa interdum ac molestie lectus volutpat. Mauris commodo nibh id sem porta id feugiat ante euismod. Nullam fermentum libero varius turpis pharetra cursus ut sed lacus. Mauris molestie egestas augue eu bibendum. Quisque pulvinar, leo luctus vehicula faucibus, quam mi ornare dui, a rhoncus nisi eros nec dolor. Sed dictum ultricies ipsum eu ultrices. Etiam semper condimentum nibh in tempor. +</p> +<p> + +Vivamus interdum ligula nec neque sollicitudin ornare. Vestibulum a eros eget nisi accumsan hendrerit quis sit amet ipsum. Phasellus condimentum vestibulum felis eu hendrerit. Suspendisse in est tellus, et consequat ante. Nam at sapien lobortis risus dignissim malesuada. In dapibus lectus sed nibh adipiscing dictum. Nulla pellentesque convallis auctor. Suspendisse ut purus et nibh pulvinar tincidunt. Maecenas dapibus purus at odio commodo ac cursus risus luctus. Ut quis libero justo. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Nullam vestibulum ipsum quis ante porttitor porta. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Ut in ante neque. Donec ante ante, porttitor non egestas a, pulvinar sed sem. Nam augue quam, fringilla sed egestas et, vulputate non nisi. +</p> +<p> +Nunc sit amet arcu ac nulla bibendum sollicitudin. Pellentesque sed ligula urna. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Quisque egestas, tortor a vestibulum malesuada, ante dui condimentum massa, ac rutrum massa mauris non mi. Praesent in nisi leo. Sed ac augue nisl. Donec eget enim ut arcu posuere condimentum vel id magna. Vestibulum laoreet imperdiet massa, ut venenatis ante dapibus eu. Phasellus faucibus vestibulum eros mollis adipiscing. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque aliquet lectus at enim gravida tempus tincidunt mi porta. Sed vehicula molestie ligula, sed tincidunt diam suscipit vitae. +</p> +<p> +Nullam euismod tempus ante, vel semper turpis pharetra eget. Nulla pretium ante et ipsum dapibus imperdiet. Praesent ipsum velit, gravida sed adipiscing id, condimentum in odio. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Fusce blandit vehicula felis, pretium ullamcorper leo tempor non. Nunc eget nisi nunc, posuere pellentesque enim. Nunc gravida orci quis odio semper ultricies. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque eu neque a sapien commodo placerat. Aenean non eros semper metus viverra porttitor. Integer vel tortor eu neque commodo ultrices eu quis tellus. Nam commodo sagittis dolor in consequat. Fusce hendrerit turpis eget leo rutrum ut scelerisque nibh condimentum. Fusce sit amet feugiat mauris. Maecenas elementum tellus nec augue rutrum mattis. Sed viverra tempor blandit. Pellentesque adipiscing tincidunt est sit amet tincidunt. Proin suscipit suscipit odio, eu pellentesque dolor pharetra non. Aliquam erat volutpat. +</p> +<p> +Duis pellentesque, enim sed mollis congue, ante mauris feugiat nisi, bibendum euismod erat enim ac magna. Mauris risus nisl, sodales vel viverra ut, interdum sed neque. Nunc ac dignissim felis. Proin tincidunt orci elementum erat molestie suscipit. Cras suscipit, sem ac vehicula vehicula, lorem orci dictum nibh, ut bibendum odio sem non erat. Maecenas quis metus eget mauris feugiat porta a eu ipsum. Vivamus tortor purus, posuere ut luctus sed, ullamcorper feugiat neque. In hac habitasse platea dictumst. Vivamus nec justo vel lacus mattis pellentesque. Nunc vel gravida quam. Etiam at aliquam magna. +</p> +<p> +Sed ac lacus ac felis auctor suscipit. Aliquam lacinia lectus ac nunc placerat aliquam accumsan neque interdum. Aenean in sapien sem. Suspendisse potenti. Aenean congue vulputate scelerisque. Proin eget eros tortor. Morbi rhoncus, mi vitae sollicitudin luctus, est orci porttitor turpis, vitae cursus est dui sed leo. Curabitur erat nunc, placerat bibendum tempus in, blandit eget ipsum. Cras in feugiat ipsum. Vestibulum dapibus quam nec odio pretium non dapibus purus dapibus. Pellentesque vehicula metus bibendum orci ultrices tincidunt. Sed fermentum, neque eget porta tempor, sem neque pulvinar ligula, vitae elementum massa metus eget nunc. Nunc sed orci eu purus sodales fringilla. Quisque aliquet arcu ac dolor ultrices fringilla. Nullam ornare tempus lorem, in mattis magna mollis laoreet. Vestibulum convallis arcu in purus lobortis et sollicitudin ipsum aliquet. Quisque risus est, sagittis eu aliquam ac, condimentum at massa. Fusce consectetur dignissim sem vel ornare. Maecenas posuere ultricies sollicitudin. Duis luctus, purus quis auctor egestas, diam felis scelerisque diam, a varius tellus erat a nunc. +</p> +<p> +Phasellus id ante neque, eget volutpat risus. Vivamus scelerisque, nisi rutrum ultrices varius, sem quam suscipit purus, in elementum nibh nulla nec nisi. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Phasellus interdum hendrerit mi, nec cursus nisi tempor ac. Phasellus luctus ligula bibendum mauris iaculis id tempor odio volutpat. Nunc in augue metus. Suspendisse at libero at libero lacinia convallis eu vitae metus. Duis eget risus odio. Nam id mi tellus, non vulputate libero. In placerat dictum orci eu pellentesque. Etiam sed varius felis. Phasellus ut adipiscing leo. Morbi ante eros, interdum eget dapibus ac, varius congue nunc. Donec vulputate sapien id risus sodales sit amet pretium velit iaculis. Etiam ultrices tempor euismod. +</p> + +<p> +Praesent in turpis ut mauris cursus commodo. Mauris lectus tellus, congue sit amet dictum id, convallis ac nisi. Curabitur ante dolor, sagittis ac auctor ac, aliquet vel nisl. Nulla non porta sapien. Nunc non aliquet erat. Vestibulum euismod auctor volutpat. Mauris libero tellus, pharetra eget lacinia sit amet, viverra eget velit. Sed viverra varius velit at pharetra. Sed pharetra dolor sed erat interdum in placerat magna lacinia. Cras venenatis tellus non sapien egestas sollicitudin. Duis congue pharetra lacinia. Curabitur eu diam vel tortor rhoncus dignissim vel sed enim. Proin ut congue mi. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce viverra elit eu dolor tincidunt tempor vel nec magna. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; +</p> +<p> +Sed ligula purus, tristique nec condimentum sed, facilisis ac augue. Integer volutpat velit urna, et posuere ligula. In tempus luctus dignissim. Duis augue neque, egestas ut tincidunt in, congue a enim. Aliquam ut odio dui, id congue tortor. Nullam venenatis erat non nulla tincidunt scelerisque. Morbi in urna ac nulla molestie scelerisque eu a nulla. Aliquam erat volutpat. Praesent dictum scelerisque lorem mattis vehicula. Quisque ut rutrum metus. Mauris pharetra ante vitae nunc mattis vulputate. Mauris molestie volutpat mauris, ut iaculis dui bibendum ac. Ut egestas laoreet est, eget mollis libero laoreet at. In sagittis vestibulum accumsan. Nam dapibus ultrices urna sit amet accumsan. Pellentesque id ultrices elit. Aliquam quis magna ut leo sagittis posuere sit amet id enim. Etiam congue eros sit amet nulla aliquam gravida. In accumsan lectus nibh. Proin volutpat pretium facilisis. +</p> +<p> +Mauris pulvinar erat at quam egestas ac aliquet mi gravida. Integer pellentesque quam vel massa commodo vitae sollicitudin eros volutpat. Aenean mollis felis molestie quam placerat et elementum eros gravida. In hac habitasse platea dictumst. Mauris ullamcorper facilisis eros, nec rutrum mi auctor sed. Ut viverra, orci a viverra ultricies, turpis enim pellentesque urna, sit amet viverra metus enim ut justo. Donec aliquam, urna id condimentum rutrum, nibh nunc tristique magna, at luctus quam enim at turpis. Maecenas dapibus dui ac velit adipiscing fringilla. Nullam malesuada nunc vel lorem cursus sed congue felis lacinia. Pellentesque vehicula gravida est nec facilisis. Nullam imperdiet fringilla orci in dignissim. Praesent orci dolor, vestibulum eu auctor quis, tristique auctor mi. Nunc euismod dui sit amet metus malesuada feugiat. Fusce iaculis neque in velit interdum rhoncus. Aenean at risus ut arcu dapibus congue a tincidunt dolor. Donec porttitor lacus et urna vestibulum a sagittis nunc mollis. +</p> +<p> +In metus tellus, eleifend id aliquet at, pulvinar ut tortor. Aliquam erat volutpat. Vivamus lacus magna, consequat vel euismod sed, viverra a ipsum. Praesent dapibus laoreet nisi, nec posuere massa commodo vel. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed ullamcorper adipiscing ante, dapibus molestie velit cursus id. Nam cursus arcu consectetur lectus sollicitudin gravida. Maecenas urna sapien, fermentum sit amet consectetur at, feugiat ut massa. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer sit amet ante nec arcu bibendum bibendum ut ut justo. Nulla ut libero est. +</p> +<p> +Aenean sem augue, malesuada quis elementum id, aliquet at turpis. Nam volutpat interdum purus, at dictum risus posuere rhoncus. Praesent metus diam, egestas in lacinia eu, tincidunt in nibh. Phasellus sollicitudin volutpat erat, sit amet mattis sapien fringilla in. Quisque rhoncus, felis a pellentesque dictum, arcu urna molestie sem, ut tincidunt nulla magna in enim. Vestibulum erat nulla, sollicitudin quis faucibus et, blandit quis est. Nam vehicula justo augue. Vivamus elementum sodales aliquet. Donec convallis neque sed dui euismod aliquet. Morbi elementum hendrerit odio, vel mollis felis dignissim vitae. Phasellus a diam lacus. Integer congue, mi vehicula egestas imperdiet, nulla mi commodo tortor, sit amet fermentum urna leo non dolor. Donec elementum elementum urna at sollicitudin. Vestibulum placerat tortor in nibh lobortis ac consectetur felis interdum. Integer faucibus diam nec magna porttitor sit amet dictum elit consectetur. Suspendisse risus velit, pellentesque eget viverra in, porta eget metus. Sed porta elit erat. +</p> +<p> +Nulla facilisi. Aliquam vulputate dolor quis nisi auctor luctus. Fusce vitae scelerisque velit. Sed sit amet tortor a nisi convallis pulvinar et eget sapien. Nulla condimentum auctor velit, a viverra nibh pellentesque eget. Aenean at lacus quam, lobortis posuere justo. Duis et diam in ligula rhoncus pellentesque. Morbi massa tellus, mattis nec condimentum ut, tempus eu lectus. In mi orci, luctus at pulvinar vel, scelerisque nec enim. Vestibulum vehicula odio in augue dignissim tincidunt. Integer ac velit ligula. Integer elit turpis, mattis eget ornare ut, eleifend in magna. Curabitur sagittis dui in felis ultricies gravida. + +</p> +<p> +Praesent adipiscing rhoncus rutrum. Aenean ultricies auctor risus at fringilla. Mauris quam lectus, ullamcorper sed ultricies at, interdum eget tellus. Vestibulum ac mi erat. Sed ac tellus erat, sed laoreet arcu. Fusce eget ipsum ac sem volutpat viverra. Suspendisse ac felis sit amet purus viverra luctus non eget ipsum. Praesent eleifend euismod tortor, vel malesuada felis consectetur ac. Nunc a mi sit amet nulla venenatis tincidunt. Morbi vitae nisl nulla, nec adipiscing sem. Nullam porttitor scelerisque urna, id dapibus diam malesuada vitae. Duis auctor eleifend lectus, a tempor odio aliquet quis. Nam eu est urna, nec ultricies lectus. Ut egestas aliquet nunc, et hendrerit erat vehicula non. Aliquam tempus faucibus arcu, at vulputate erat tempor eu. Quisque tempus, lectus adipiscing blandit scelerisque, magna felis eleifend odio, non volutpat felis enim sit amet leo. Mauris augue tortor, ultrices ac sagittis non, vulputate quis nisl. +</p> +<p> +Fusce erat sem, dictum in bibendum ac, feugiat ut odio. Duis aliquam felis sit amet diam egestas consectetur. Phasellus consequat, mauris eget venenatis porta, velit sapien malesuada nibh, id dignissim ante tellus vitae lacus. Duis non nisl sit amet nunc euismod posuere. Donec eros erat, fringilla vel iaculis condimentum, vestibulum at neque. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Aliquam lorem sapien, bibendum eu mollis nec, gravida dapibus lectus. Aenean pretium volutpat nunc a placerat. Nullam eget tellus quis ipsum ultrices ullamcorper non eu mauris. Donec volutpat tincidunt elit, sit amet cursus justo elementum quis. Mauris volutpat, enim sit amet tempor commodo, purus lacus luctus dui, sed aliquet ligula nisi vel diam. Donec est elit, lobortis at eleifend id, feugiat egestas massa. Fusce elementum sollicitudin adipiscing. Vivamus et dapibus ipsum. Morbi interdum libero a nisl dignissim sed facilisis ipsum lacinia. +</p> +<p> +Cras a augue dui, vitae tincidunt enim. In hac habitasse platea dictumst. Proin nec magna sed nulla mollis tempus id ut lectus. Morbi volutpat ultricies ipsum, quis imperdiet libero tempor nec. Donec bibendum ornare blandit. Aliquam rutrum risus non turpis commodo non commodo erat molestie. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut fermentum, magna vel euismod convallis, mi magna vehicula velit, aliquet rhoncus ipsum massa et nunc. Nullam blandit purus non neque ullamcorper a aliquet nisl tristique. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Sed sit amet velit magna, sit amet rutrum dui. Donec elementum mi sed velit consectetur vulputate. Sed interdum adipiscing mattis. +</p> +Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam vitae urna quam. Fusce adipiscing erat eget magna malesuada vel mollis ligula ullamcorper. Donec pulvinar, libero et vehicula facilisis, odio orci fringilla magna, non ultricies ipsum justo a tellus. Proin facilisis magna vitae quam vestibulum tempor. Aenean semper placerat posuere. In nisi diam, ullamcorper sit amet viverra sed, pretium sed neque. Sed posuere vulputate mauris vitae placerat. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Nam in odio elit, non tempor felis. Integer non iaculis ante. Sed erat mauris, aliquam nec consequat id, congue id libero. Maecenas elementum gravida tincidunt. Suspendisse lacinia enim sit amet nulla cursus pulvinar. +</p> +<p> +Proin ut sem nulla, at cursus sapien. Duis sagittis lacus vitae justo mattis in sagittis ligula eleifend. Curabitur sit amet felis pharetra justo facilisis mollis eget nec massa. Sed nisi urna, semper lobortis pretium ac, interdum nec lacus. In gravida, leo sit amet vehicula malesuada, augue nunc consectetur nulla, vel tincidunt est nunc aliquet neque. Maecenas imperdiet eros id ligula tempor dapibus. Integer commodo metus sit amet quam vestibulum volutpat. In et lorem ac leo rhoncus auctor sit amet ut urna. Nulla sed nisl quis turpis vestibulum accumsan. Duis mollis aliquam sollicitudin. Pellentesque porta semper interdum. Sed eros orci, congue quis sollicitudin ut, rutrum vitae nibh. Nunc et leo non ligula interdum imperdiet. Integer tincidunt rhoncus ullamcorper. Curabitur et ullamcorper lorem. Ut at tellus eu metus congue sollicitudin eget at orci. +</p> +<p> +Duis sem mauris, pulvinar quis placerat vel, aliquet non leo. Cras eros arcu, ullamcorper sit amet imperdiet at, blandit interdum augue. Phasellus non nunc ac ante condimentum tristique vitae sed urna. Integer nec sapien et dolor volutpat bibendum ac vitae justo. Aliquam gravida fermentum felis, nec dictum dui dictum ac. Maecenas eget magna leo. Phasellus ac nulla risus, dapibus ornare turpis. Morbi a massa tortor. Duis ac turpis lacus. Duis nibh metus, euismod quis ultrices vitae, sollicitudin vel leo. Nullam volutpat odio ac elit imperdiet gravida. +</p> +<p> +Donec luctus magna id ipsum aliquam eget convallis tortor tristique. Etiam est quam, aliquam ac rutrum quis, pretium sed tortor. Aliquam lacus diam, rhoncus molestie convallis ut, luctus ac lacus. Nunc porttitor ante a ligula rutrum elementum. Cras dui tellus, pulvinar vel convallis sit amet, facilisis nec ipsum. Donec fermentum lectus lorem, id accumsan eros. Nunc semper laoreet lacus quis ullamcorper. Nunc luctus erat vitae orci sodales facilisis non ut felis. Aliquam pretium sapien sed enim adipiscing in feugiat est ornare. Aenean ultricies convallis tortor sit amet ullamcorper. +</p> +<p> +Etiam ultricies elit non enim elementum aliquet. Vivamus quis fringilla mauris. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Nunc blandit felis at massa interdum ac molestie lectus volutpat. Mauris commodo nibh id sem porta id feugiat ante euismod. Nullam fermentum libero varius turpis pharetra cursus ut sed lacus. Mauris molestie egestas augue eu bibendum. Quisque pulvinar, leo luctus vehicula faucibus, quam mi ornare dui, a rhoncus nisi eros nec dolor. Sed dictum ultricies ipsum eu ultrices. Etiam semper condimentum nibh in tempor. +</p> +<p> + +Vivamus interdum ligula nec neque sollicitudin ornare. Vestibulum a eros eget nisi accumsan hendrerit quis sit amet ipsum. Phasellus condimentum vestibulum felis eu hendrerit. Suspendisse in est tellus, et consequat ante. Nam at sapien lobortis risus dignissim malesuada. In dapibus lectus sed nibh adipiscing dictum. Nulla pellentesque convallis auctor. Suspendisse ut purus et nibh pulvinar tincidunt. Maecenas dapibus purus at odio commodo ac cursus risus luctus. Ut quis libero justo. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Nullam vestibulum ipsum quis ante porttitor porta. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Ut in ante neque. Donec ante ante, porttitor non egestas a, pulvinar sed sem. Nam augue quam, fringilla sed egestas et, vulputate non nisi. +</p> +<p> +Nunc sit amet arcu ac nulla bibendum sollicitudin. Pellentesque sed ligula urna. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Quisque egestas, tortor a vestibulum malesuada, ante dui condimentum massa, ac rutrum massa mauris non mi. Praesent in nisi leo. Sed ac augue nisl. Donec eget enim ut arcu posuere condimentum vel id magna. Vestibulum laoreet imperdiet massa, ut venenatis ante dapibus eu. Phasellus faucibus vestibulum eros mollis adipiscing. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque aliquet lectus at enim gravida tempus tincidunt mi porta. Sed vehicula molestie ligula, sed tincidunt diam suscipit vitae. +</p> +<p> +Nullam euismod tempus ante, vel semper turpis pharetra eget. Nulla pretium ante et ipsum dapibus imperdiet. Praesent ipsum velit, gravida sed adipiscing id, condimentum in odio. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Fusce blandit vehicula felis, pretium ullamcorper leo tempor non. Nunc eget nisi nunc, posuere pellentesque enim. Nunc gravida orci quis odio semper ultricies. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque eu neque a sapien commodo placerat. Aenean non eros semper metus viverra porttitor. Integer vel tortor eu neque commodo ultrices eu quis tellus. Nam commodo sagittis dolor in consequat. Fusce hendrerit turpis eget leo rutrum ut scelerisque nibh condimentum. Fusce sit amet feugiat mauris. Maecenas elementum tellus nec augue rutrum mattis. Sed viverra tempor blandit. Pellentesque adipiscing tincidunt est sit amet tincidunt. Proin suscipit suscipit odio, eu pellentesque dolor pharetra non. Aliquam erat volutpat. +</p> +<p> +Duis pellentesque, enim sed mollis congue, ante mauris feugiat nisi, bibendum euismod erat enim ac magna. Mauris risus nisl, sodales vel viverra ut, interdum sed neque. Nunc ac dignissim felis. Proin tincidunt orci elementum erat molestie suscipit. Cras suscipit, sem ac vehicula vehicula, lorem orci dictum nibh, ut bibendum odio sem non erat. Maecenas quis metus eget mauris feugiat porta a eu ipsum. Vivamus tortor purus, posuere ut luctus sed, ullamcorper feugiat neque. In hac habitasse platea dictumst. Vivamus nec justo vel lacus mattis pellentesque. Nunc vel gravida quam. Etiam at aliquam magna. +</p> +<p> +Sed ac lacus ac felis auctor suscipit. Aliquam lacinia lectus ac nunc placerat aliquam accumsan neque interdum. Aenean in sapien sem. Suspendisse potenti. Aenean congue vulputate scelerisque. Proin eget eros tortor. Morbi rhoncus, mi vitae sollicitudin luctus, est orci porttitor turpis, vitae cursus est dui sed leo. Curabitur erat nunc, placerat bibendum tempus in, blandit eget ipsum. Cras in feugiat ipsum. Vestibulum dapibus quam nec odio pretium non dapibus purus dapibus. Pellentesque vehicula metus bibendum orci ultrices tincidunt. Sed fermentum, neque eget porta tempor, sem neque pulvinar ligula, vitae elementum massa metus eget nunc. Nunc sed orci eu purus sodales fringilla. Quisque aliquet arcu ac dolor ultrices fringilla. Nullam ornare tempus lorem, in mattis magna mollis laoreet. Vestibulum convallis arcu in purus lobortis et sollicitudin ipsum aliquet. Quisque risus est, sagittis eu aliquam ac, condimentum at massa. Fusce consectetur dignissim sem vel ornare. Maecenas posuere ultricies sollicitudin. Duis luctus, purus quis auctor egestas, diam felis scelerisque diam, a varius tellus erat a nunc. +</p> +<p> +Phasellus id ante neque, eget volutpat risus. Vivamus scelerisque, nisi rutrum ultrices varius, sem quam suscipit purus, in elementum nibh nulla nec nisi. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Phasellus interdum hendrerit mi, nec cursus nisi tempor ac. Phasellus luctus ligula bibendum mauris iaculis id tempor odio volutpat. Nunc in augue metus. Suspendisse at libero at libero lacinia convallis eu vitae metus. Duis eget risus odio. Nam id mi tellus, non vulputate libero. In placerat dictum orci eu pellentesque. Etiam sed varius felis. Phasellus ut adipiscing leo. Morbi ante eros, interdum eget dapibus ac, varius congue nunc. Donec vulputate sapien id risus sodales sit amet pretium velit iaculis. Etiam ultrices tempor euismod. +</p> + +<p> +Praesent in turpis ut mauris cursus commodo. Mauris lectus tellus, congue sit amet dictum id, convallis ac nisi. Curabitur ante dolor, sagittis ac auctor ac, aliquet vel nisl. Nulla non porta sapien. Nunc non aliquet erat. Vestibulum euismod auctor volutpat. Mauris libero tellus, pharetra eget lacinia sit amet, viverra eget velit. Sed viverra varius velit at pharetra. Sed pharetra dolor sed erat interdum in placerat magna lacinia. Cras venenatis tellus non sapien egestas sollicitudin. Duis congue pharetra lacinia. Curabitur eu diam vel tortor rhoncus dignissim vel sed enim. Proin ut congue mi. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce viverra elit eu dolor tincidunt tempor vel nec magna. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; +</p> +<p> +Sed ligula purus, tristique nec condimentum sed, facilisis ac augue. Integer volutpat velit urna, et posuere ligula. In tempus luctus dignissim. Duis augue neque, egestas ut tincidunt in, congue a enim. Aliquam ut odio dui, id congue tortor. Nullam venenatis erat non nulla tincidunt scelerisque. Morbi in urna ac nulla molestie scelerisque eu a nulla. Aliquam erat volutpat. Praesent dictum scelerisque lorem mattis vehicula. Quisque ut rutrum metus. Mauris pharetra ante vitae nunc mattis vulputate. Mauris molestie volutpat mauris, ut iaculis dui bibendum ac. Ut egestas laoreet est, eget mollis libero laoreet at. In sagittis vestibulum accumsan. Nam dapibus ultrices urna sit amet accumsan. Pellentesque id ultrices elit. Aliquam quis magna ut leo sagittis posuere sit amet id enim. Etiam congue eros sit amet nulla aliquam gravida. In accumsan lectus nibh. Proin volutpat pretium facilisis. +</p> +<p> +Mauris pulvinar erat at quam egestas ac aliquet mi gravida. Integer pellentesque quam vel massa commodo vitae sollicitudin eros volutpat. Aenean mollis felis molestie quam placerat et elementum eros gravida. In hac habitasse platea dictumst. Mauris ullamcorper facilisis eros, nec rutrum mi auctor sed. Ut viverra, orci a viverra ultricies, turpis enim pellentesque urna, sit amet viverra metus enim ut justo. Donec aliquam, urna id condimentum rutrum, nibh nunc tristique magna, at luctus quam enim at turpis. Maecenas dapibus dui ac velit adipiscing fringilla. Nullam malesuada nunc vel lorem cursus sed congue felis lacinia. Pellentesque vehicula gravida est nec facilisis. Nullam imperdiet fringilla orci in dignissim. Praesent orci dolor, vestibulum eu auctor quis, tristique auctor mi. Nunc euismod dui sit amet metus malesuada feugiat. Fusce iaculis neque in velit interdum rhoncus. Aenean at risus ut arcu dapibus congue a tincidunt dolor. Donec porttitor lacus et urna vestibulum a sagittis nunc mollis. +</p> +<p> +In metus tellus, eleifend id aliquet at, pulvinar ut tortor. Aliquam erat volutpat. Vivamus lacus magna, consequat vel euismod sed, viverra a ipsum. Praesent dapibus laoreet nisi, nec posuere massa commodo vel. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Sed ullamcorper adipiscing ante, dapibus molestie velit cursus id. Nam cursus arcu consectetur lectus sollicitudin gravida. Maecenas urna sapien, fermentum sit amet consectetur at, feugiat ut massa. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer sit amet ante nec arcu bibendum bibendum ut ut justo. Nulla ut libero est. +</p> +<p> +Aenean sem augue, malesuada quis elementum id, aliquet at turpis. Nam volutpat interdum purus, at dictum risus posuere rhoncus. Praesent metus diam, egestas in lacinia eu, tincidunt in nibh. Phasellus sollicitudin volutpat erat, sit amet mattis sapien fringilla in. Quisque rhoncus, felis a pellentesque dictum, arcu urna molestie sem, ut tincidunt nulla magna in enim. Vestibulum erat nulla, sollicitudin quis faucibus et, blandit quis est. Nam vehicula justo augue. Vivamus elementum sodales aliquet. Donec convallis neque sed dui euismod aliquet. Morbi elementum hendrerit odio, vel mollis felis dignissim vitae. Phasellus a diam lacus. Integer congue, mi vehicula egestas imperdiet, nulla mi commodo tortor, sit amet fermentum urna leo non dolor. Donec elementum elementum urna at sollicitudin. Vestibulum placerat tortor in nibh lobortis ac consectetur felis interdum. Integer faucibus diam nec magna porttitor sit amet dictum elit consectetur. Suspendisse risus velit, pellentesque eget viverra in, porta eget metus. Sed porta elit erat. +</p> +<p> +Nulla facilisi. Aliquam vulputate dolor quis nisi auctor luctus. Fusce vitae scelerisque velit. Sed sit amet tortor a nisi convallis pulvinar et eget sapien. Nulla condimentum auctor velit, a viverra nibh pellentesque eget. Aenean at lacus quam, lobortis posuere justo. Duis et diam in ligula rhoncus pellentesque. Morbi massa tellus, mattis nec condimentum ut, tempus eu lectus. In mi orci, luctus at pulvinar vel, scelerisque nec enim. Vestibulum vehicula odio in augue dignissim tincidunt. Integer ac velit ligula. Integer elit turpis, mattis eget ornare ut, eleifend in magna. Curabitur sagittis dui in felis ultricies gravida. + +</p> +<p> +Praesent adipiscing rhoncus rutrum. Aenean ultricies auctor risus at fringilla. Mauris quam lectus, ullamcorper sed ultricies at, interdum eget tellus. Vestibulum ac mi erat. Sed ac tellus erat, sed laoreet arcu. Fusce eget ipsum ac sem volutpat viverra. Suspendisse ac felis sit amet purus viverra luctus non eget ipsum. Praesent eleifend euismod tortor, vel malesuada felis consectetur ac. Nunc a mi sit amet nulla venenatis tincidunt. Morbi vitae nisl nulla, nec adipiscing sem. Nullam porttitor scelerisque urna, id dapibus diam malesuada vitae. Duis auctor eleifend lectus, a tempor odio aliquet quis. Nam eu est urna, nec ultricies lectus. Ut egestas aliquet nunc, et hendrerit erat vehicula non. Aliquam tempus faucibus arcu, at vulputate erat tempor eu. Quisque tempus, lectus adipiscing blandit scelerisque, magna felis eleifend odio, non volutpat felis enim sit amet leo. Mauris augue tortor, ultrices ac sagittis non, vulputate quis nisl. +</p> +<p> +Fusce erat sem, dictum in bibendum ac, feugiat ut odio. Duis aliquam felis sit amet diam egestas consectetur. Phasellus consequat, mauris eget venenatis porta, velit sapien malesuada nibh, id dignissim ante tellus vitae lacus. Duis non nisl sit amet nunc euismod posuere. Donec eros erat, fringilla vel iaculis condimentum, vestibulum at neque. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Aliquam lorem sapien, bibendum eu mollis nec, gravida dapibus lectus. Aenean pretium volutpat nunc a placerat. Nullam eget tellus quis ipsum ultrices ullamcorper non eu mauris. Donec volutpat tincidunt elit, sit amet cursus justo elementum quis. Mauris volutpat, enim sit amet tempor commodo, purus lacus luctus dui, sed aliquet ligula nisi vel diam. Donec est elit, lobortis at eleifend id, feugiat egestas massa. Fusce elementum sollicitudin adipiscing. Vivamus et dapibus ipsum. Morbi interdum libero a nisl dignissim sed facilisis ipsum lacinia. +</p> +<p> +Cras a augue dui, vitae tincidunt enim. In hac habitasse platea dictumst. Proin nec magna sed nulla mollis tempus id ut lectus. Morbi volutpat ultricies ipsum, quis imperdiet libero tempor nec. Donec bibendum ornare blandit. Aliquam rutrum risus non turpis commodo non commodo erat molestie. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut fermentum, magna vel euismod convallis, mi magna vehicula velit, aliquet rhoncus ipsum massa et nunc. Nullam blandit purus non neque ullamcorper a aliquet nisl tristique. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Sed sit amet velit magna, sit amet rutrum dui. Donec elementum mi sed velit consectetur vulputate. Sed interdum adipiscing mattis. +</p> + +</body> +</html> diff --git a/src/main/webapp/jquery-ui-1.9pre/tests/visual/dialog/dialog_on_page_with_large_dom.html b/src/main/webapp/jquery-ui-1.9pre/tests/visual/dialog/dialog_on_page_with_large_dom.html new file mode 100644 index 0000000..c7c1056 --- /dev/null +++ b/src/main/webapp/jquery-ui-1.9pre/tests/visual/dialog/dialog_on_page_with_large_dom.html @@ -0,0 +1,2963 @@ +<!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" type="text/css" /> + <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css"> + <script type="text/javascript" src="../../../jquery-1.7.1.js"></script> + <script type="text/javascript" src="../../../external/jquery.bgiframe-2.1.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.draggable.js"></script> + <script type="text/javascript" src="../../../ui/jquery.ui.position.js"></script> + <script type="text/javascript" src="../../../ui/jquery.ui.resizable.js"></script> + <script type="text/javascript" src="../../../ui/jquery.ui.dialog.js"></script> + <script type="text/javascript"> + $(function() { + $("#dialog").dialog({ + modal: true, + autoOpen: false + }); + $('#opener').click(function() { + $('#dialog').dialog('open'); + }); + }); + </script> +</head> +<body> + +<button id="opener">open dialog</button> +<div id="dialog" title="Dialog Title"> + <p> Dialog Content </p> + <input type="text"> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +<div> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="text"> +<input type="checkbox"><input type="checkbox"><input type="checkbox"> +<select> + <option value="a">option</option> + <option value="b">option</option> + <option value="c">option</option> + <option value="d">option</option> + <option value="e">option</option> + <option value="f">option</option> + <option value="g">option</option> + <option value="h">option</option> + <option value="i">option</option> +</select> +</div> + +</body> +</html> diff --git a/src/main/webapp/jquery-ui-1.9pre/tests/visual/effects/effects.all.css b/src/main/webapp/jquery-ui-1.9pre/tests/visual/effects/effects.all.css new file mode 100644 index 0000000..1d531b0 --- /dev/null +++ b/src/main/webapp/jquery-ui-1.9pre/tests/visual/effects/effects.all.css @@ -0,0 +1,55 @@ + +body,html { + margin: 0; + padding: 0; + font-size: 12px; + font-family: Arial; + background: #191919; + color: #fff; +} +body { margin: 1em; } + +ul.effects { + list-style-type: none; + margin: 0; + padding: 0; +} + +ul.effects li { + list-style-type: none; + margin: 0; + padding: 0; + width: 120px; + height: 100px; + float: left; + margin-top: 20px; + margin-left: 20px; +} + +div.effect { + width: 120px; + height: 100px; + background: #ccc; + border: 5px outset #aaa; + float: left; + cursor: pointer; + cursor: hand; +} + +div.current { + border: 5px outset #FF9C08; + background: #FF9C08; +} + +div.effect p { + color: #191919; + font-weight: bold; + margin: 0px; + padding: 10px; +} + +.ui-effects-transfer { + border: 1px dotted #fff; + background: #666; + opacity: 0.5; +} diff --git a/src/main/webapp/jquery-ui-1.9pre/tests/visual/effects/effects.all.html b/src/main/webapp/jquery-ui-1.9pre/tests/visual/effects/effects.all.html new file mode 100644 index 0000000..ddc6654 --- /dev/null +++ b/src/main/webapp/jquery-ui-1.9pre/tests/visual/effects/effects.all.html @@ -0,0 +1,217 @@ +<!doctype html> +<html lang="en"> +<head> + <meta charset="utf-8"> + <title>jQuery UI Effects Test Suite</title> + <link rel="stylesheet" href="effects.all.css" type="text/css"> + <script src="../../../jquery-1.7.1.js"></script> + <script src="../../../ui/jquery.effects.core.js"></script> + <script src="../../../ui/jquery.effects.blind.js"></script> + <script src="../../../ui/jquery.effects.bounce.js"></script> + <script src="../../../ui/jquery.effects.clip.js"></script> + <script src="../../../ui/jquery.effects.drop.js"></script> + <script src="../../../ui/jquery.effects.explode.js"></script> + <script src="../../../ui/jquery.effects.fade.js"></script> + <script src="../../../ui/jquery.effects.fold.js"></script> + <script src="../../../ui/jquery.effects.highlight.js"></script> + <script src="../../../ui/jquery.effects.pulsate.js"></script> + <script src="../../../ui/jquery.effects.scale.js"></script> + <script src="../../../ui/jquery.effects.shake.js"></script> + <script src="../../../ui/jquery.effects.slide.js"></script> + <script src="../../../ui/jquery.effects.transfer.js"></script> + <script src="effects.all.js"></script> +</head> +<body> + +<ul class="effects"> + + <li> + <div class="effect" id="blindUp"> + <p>Blind up</p> + </div> + </li> + + <li> + <div class="effect" id="blindDown"> + <p>Blind down</p> + </div> + </li> + + <li> + <div class="effect" id="blindLeft"> + <p>Blind left</p> + </div> + </li> + + <li> + <div class="effect" id="blindRight"> + <p>Blind right</p> + </div> + </li> + + <li> + <div class="effect" id="bounce3times"> + <p>Bounce 3 times</p> + </div> + </li> + + <li> + <div class="effect" id="clipHorizontally"> + <p>Clip horizontally</p> + </div> + </li> + + <li> + <div class="effect" id="clipVertically"> + <p>Clip vertically</p> + </div> + </li> + + <li> + <div class="effect" id="dropDown"> + <p>Drop down</p> + </div> + </li> + + <li> + <div class="effect" id="dropUp"> + <p>Drop up</p> + </div> + </li> + + <li> + <div class="effect" id="dropLeft"> + <p>Drop left</p> + </div> + </li> + + <li> + <div class="effect" id="dropRight"> + <p>Drop right</p> + </div> + </li> + + <li> + <div class="effect" id="explode9"> + <p>Explode in 9 pieces</p> + </div> + </li> + + <li> + <div class="effect" id="explode36"> + <p>Explode in 36 pieces</p> + </div> + </li> + + <li> + <div class="effect" id="fade"> + <p>Fade</p> + </div> + </li> + + <li> + <div class="effect" id="fold"> + <p>Fold</p> + </div> + </li> + + <li> + <div class="effect" id="highlight"> + <p>Highlight</p> + </div> + </li> + + <li> + <div class="effect" id="pulsate"> + <p>Pulsate 2 times</p> + </div> + </li> + + <li> + <div class="effect" id="puff"> + <p>Puff</p> + </div> + </li> + + <li> + <div class="effect" id="scale"> + <p>Scale</p> + </div> + </li> + + <li> + <div class="effect" id="shake"> + <p>Shake</p> + </div> + </li> + + <li> + <div class="effect" id="size"> + <p>Size Default Show/Hide</p> + </div> + </li> + + <li> + <div class="effect" id="sizeToggle"> + <p>Size Toggle</p> + </div> + </li> + + <li> + <div class="effect" id="slideDown"> + <p>Slide down</p> + </div> + </li> + + <li> + <div class="effect" id="slideUp"> + <p>Slide up</p> + </div> + </li> + + <li> + <div class="effect" id="slideLeft"> + <p>Slide left</p> + </div> + </li> + + <li> + <div class="effect" id="slideRight"> + <p>Slide right</p> + </div> + </li> + + <li> + <div class="effect" id="transfer"> + <p>Transfer to first element</p> + </div> + </li> + + <li> + <div class="effect" id="addClass"> + <p>addClass</p> + </div> + </li> + + <li> + <div class="effect" id="removeClass"> + <p>removeClass</p> + </div> + </li> + + <li> + <div class="effect" id="toggleClass"> + <p>toggleClass</p> + </div> + </li> + + <li> + <div class="effect" id="hide"> + <p>hide/show (jQuery)</p> + </div> + </li> + +</ul> + +</body> +</html> diff --git a/src/main/webapp/jquery-ui-1.9pre/tests/visual/effects/effects.all.js b/src/main/webapp/jquery-ui-1.9pre/tests/visual/effects/effects.all.js new file mode 100644 index 0000000..a28c41a --- /dev/null +++ b/src/main/webapp/jquery-ui-1.9pre/tests/visual/effects/effects.all.js @@ -0,0 +1,106 @@ + +$(function() { + var duration = 1000, wait = 500; + + $("div.effect") + .hover(function() { $(this).addClass("hover"); }, + function() { $(this).removeClass("hover"); }); + + var effect = function(el, n, o) { + + $.extend(o, { + easing: "easeOutQuint" + }); + + $(el).bind("click", function() { + + $(this).addClass("current") + // delaying the initial animation makes sure that the queue stays in tact + .delay( 10 ) + .hide( n, o, duration ) + .delay( wait ) + .show( n, o, duration, function() { + $( this ).removeClass("current"); + }); + }); + + }; + + $("#hide").click(function() { + var el = $(this); + el.addClass("current").hide(duration, function() { + setTimeout(function() { + el.show(duration, function() { el.removeClass("current"); }); + }, wait); + }); + }); + + effect("#blindLeft", "blind", { direction: "left" }); + effect("#blindUp", "blind", { direction: "up" }); + effect("#blindRight", "blind", { direction: "right" }); + effect("#blindDown", "blind", { direction: "down" }); + + effect("#bounce3times", "bounce", { times: 3 }); + + effect("#clipHorizontally", "clip", { direction: "horizontal" }); + effect("#clipVertically", "clip", { direction: "vertical" }); + + effect("#dropDown", "drop", { direction: "down" }); + effect("#dropUp", "drop", { direction: "up" }); + effect("#dropLeft", "drop", { direction: "left" }); + effect("#dropRight", "drop", { direction: "right" }); + + effect("#explode9", "explode", {}); + effect("#explode36", "explode", { pieces: 36 }); + + effect("#fade", "fade", {}); + + effect("#fold", "fold", { size: 50 }); + + effect("#highlight", "highlight", {}); + + effect("#pulsate", "pulsate", { times: 2 }); + + effect("#puff", "puff", { times: 2 }); + effect("#scale", "scale", {}); + effect("#size", "size", {}); + $("#sizeToggle").bind("click", function() { + var opts = { to: { width: 300, height: 300 }}; + $(this).addClass('current') + .toggle("size", opts, duration) + .delay(wait) + .toggle("size", opts, duration, function() { + $(this).removeClass("current"); + }); + }); + + $("#shake").bind("click", function() { $(this).addClass("current").effect("shake", {}, 100, function() { $(this).removeClass("current"); }); }); + + effect("#slideDown", "slide", { direction: "down" }); + effect("#slideUp", "slide", { direction: "up" }); + effect("#slideLeft", "slide", { direction: "left" }); + effect("#slideRight", "slide", { direction: "right" }); + + $("#transfer").bind("click", function() { $(this).addClass("current").effect("transfer", { to: "div:eq(0)" }, 1000, function() { $(this).removeClass("current"); }); }); + + $("#addClass").click(function() { + $(this).addClass(function() { + window.console && console.log(arguments); + return "current"; + }, duration, function() { + $(this).removeClass("current"); + }); + }); + $("#removeClass").click(function() { + $(this).addClass("current").removeClass(function() { + window.console && console.log(arguments); + return "current"; + }, duration); + }); + $("#toggleClass").click(function() { + $(this).toggleClass(function() { + window.console && console.log(arguments); + return "current"; + }, duration); + }); +}); diff --git a/src/main/webapp/jquery-ui-1.9pre/tests/visual/effects/effects.scale.html b/src/main/webapp/jquery-ui-1.9pre/tests/visual/effects/effects.scale.html new file mode 100644 index 0000000..845625e --- /dev/null +++ b/src/main/webapp/jquery-ui-1.9pre/tests/visual/effects/effects.scale.html @@ -0,0 +1,159 @@ +<!doctype html> +<html lang="en"> +<head> + <meta charset="utf-8"> + <title>jQuery UI Effects Test Suite</title> + <link rel="stylesheet" href="effects.all.css" type="text/css"> + <script src="../../../jquery-1.7.1.js"></script> + <script src="../../../ui/jquery.effects.core.js"></script> + <script src="../../../ui/jquery.effects.scale.js"></script> + <script src="effects.all.js"></script> + <script type="text/javascript" charset="utf-8"> + jQuery(function( $ ) { + var test = $( "#testBox" ), + opts = $( ".arg" ), + optsRev = $( opts.get().reverse() ), + doer = $( "#doAnim" ), + current = $( "#current" ), + cleanStyle = test[0].style, + total = 1; + + opts.each(function() { + total *= this.options.length; + }); + + opts.change( doAnim ); + doer.click( doAnim ); + $( "#cyclePrev" ).click(function() { + cycle( -1 ); + }); + $( "#cycleNext" ).click(function() { + cycle( 1 ); + }); + + function cycle( direction ) { + optsRev.each(function() { + var cur = this.selectedIndex, + next = cur + direction, + len = this.options.length; + + this.selectedIndex = ( next + len ) % len; + + if ( ( next+len ) % len === next ) return false; + }); + doAnim(); + } + + + function doAnim() { + var cur = 0; + opts.each(function() { + cur *= this.options.length + cur += this.selectedIndex; + }); + cur++; + current.text( "Configuration: " + cur + " of " + total ); + run.apply(test, opts.map(function() { + return $(this).val(); + }).get()); + } + + function run( position, v, h, vo, ho ) { + var el = this, + style = el[0].style, + effect = { + effect: "scale", + mode: "effect", + percent: 200, + origin: [ vo, ho ], + duration: 500 + }; + el.stop(true, true); + if ( typeof style === "object" ) { + style.cssText = ""; + } else { + el[0].style = ""; + } + el.css( "position", position ) + .css( h, 5 ) + .css( v, 5 ) + .delay( 100 ) + .effect( effect ); + } + }); + </script> + <style type="text/css"> + #testArea { +/* border: 5px dashed #777;*/ + width: 200px; + height: 200px; + position: relative; + } + #testBox { + width: 50px; + height: 50px; + background-color: #bada55; + color: black; + border: 10px solid #fff; + margin: 10px; + padding: 10px; + } + label { + display: block; + } + #controls { + position: absolute; + z-index: 300; + left: 50%; + top: 50%; + margin-left: -200px; + width: 400px; + opacity: 0.8; + } + </style> +</head> +<body> + <div id="testArea"> + <div id="testBox"> + </div> + </div> + <div id="controls"> + <label for="pos">Positioning + <select id="pos" class="arg"> + <option value="absolute">absolute</option> + <option value="relative">relative</option> + <option value="fixed">fixed</option> + </select> + </label> + <label for="vertPos">Vertical Positioning + <select id="vertPos" class="arg"> + <option value="top">top</option> + <option value="bottom">bottom</option> + </select> + </label> + <label for="horizPos">Horizontal Positioning + <select id="horizPos" class="arg"> + <option value="left">left</option> + <option value="right">right</option> + </select> + </label> + <label for="vertOrigin">Vertical Origin + <select id="vertOrigin" class="arg"> + <option value="top">top</option> + <option value="middle">middle</option> + <option value="bottom">bottom</option> + </select> + </label> + <label for="horizOrigin">Horizontal Origin + <select id="horizOrigin" class="arg"> + <option value="left">left</option> + <option value="center">center</option> + <option value="right">right</option> + </select> + </label><br /> + <label id="current">jQuery UI Scale Animation Test</label> + <button id="cyclePrev">Back</button> + <button id="doAnim">Run Animation</button> + <button id="cycleNext">Forward</button> + </div> +</body>
\ No newline at end of file diff --git a/src/main/webapp/jquery-ui-1.9pre/tests/visual/menu/drilldown.html b/src/main/webapp/jquery-ui-1.9pre/tests/visual/menu/drilldown.html new file mode 100644 index 0000000..a2ae9e8 --- /dev/null +++ b/src/main/webapp/jquery-ui-1.9pre/tests/visual/menu/drilldown.html @@ -0,0 +1,266 @@ +<!doctype html> +<html> +<head> + <title>Menu Visual Test: Default</title> + <link rel="stylesheet" href="../visual.css" type="text/css" /> + <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css" title="ui-theme" /> + <script type="text/javascript" src="../../../jquery-1.7.1.js"></script> + <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script> + <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script> + <script type="text/javascript" src="../../../ui/jquery.ui.position.js"></script> + <script type="text/javascript" src="../../../ui/jquery.ui.button.js"></script> + <script type="text/javascript" src="../../../ui/jquery.ui.menu.js"></script> + <script type="text/javascript" src="http://jqueryui.com/themeroller/themeswitchertool/"></script> + <script type="text/javascript"> + $(function() { + $.fn.themeswitcher && $('<div/>').css({ + position: "absolute", + right: 10, + top: 10 + }).appendTo(document.body).themeswitcher(); + + $.widget("ui.drilldown", { + _init: function() { + var self = this; + this.active = this.element.find(">ul").attr("tabindex", 0); + + // hide submenus and create indicator icons + this.element.find("ul").hide().prev("a").prepend('<span class="ui-icon ui-icon-carat-1-e"></span>').end().filter(":first").show(); + + this.element.find("ul").menu({ + // disable built-in key handling + input: $(), + focus: function(event, ui) { + self.activeItem = ui.item; + }, + select: function(event, ui) { + if (this != self.active[0]) { + return; + } + var nested = $(">ul", ui.item); + if (nested.length) { + self._open(nested); + } else { + self.element.find("h3").text(ui.item.text()); + self.options.select.apply(this, arguments); + } + } + }); + + this.back = this.element.children(":last").button({ + icons: { + primary: "ui-icon-carat-1-w" + } + }).click(function() { + self.up(); + return false; + }).hide(); + }, + + _open: function(submenu) { + this.active = submenu.show().css({ + opacity: 0 + }).position({ + my: "left top", + at: "right top", + of: this.widget() + }).position({ + my: "left top", + at: "left top", + of: this.widget(), + using: function(to) { + $(this).animate({ + left: to.left, + top: to.top, + opacity: 1 + }); + } + }); + this.back.show(); + }, + + up: function() { + if (this.active.parent()[0] == this.element[0]) { + return; + } + this.active.position({ + my: "left top", + at: "right top", + of: this.widget(), + using: function(to) { + $(this).animate({ + left: to.left, + top: to.top, + opacity: 0 + }); + } + }); + this.active = this.active.parent().parent().show(); + this.activeItem = this.active.data("menu").active; + if (!this.active.parent().parent().is(":ui-menu")) { + this.back.hide(); + } + }, + + down: function(event) { + var nested = this.activeItem.find(">ul"); + if (nested.length) { + this._open(nested); + nested.menu("focus", event, nested.children(":first")) + } + }, + + show: function() { + }, + + hide: function() { + }, + + widget: function() { + return this.element.find(">ul"); + } + }); + + var drilldown = $("#drilldown").drilldown({ + select: function(event, ui) { + $("#log").append("<div>Selected " + ui.item.text() + "</div>"); + } + }); + + drilldown.drilldown("widget").keydown(function(event) { + var menu = drilldown.data("drilldown").active.data("menu"); + if (menu.widget().is(":hidden")) + return; + event.stopPropagation(); + switch (event.keyCode) { + case $.ui.keyCode.PAGE_UP: + menu.previousPage(); + break; + case $.ui.keyCode.PAGE_DOWN: + menu.nextPage(); + break; + case $.ui.keyCode.UP: + menu.previous(); + break; + case $.ui.keyCode.LEFT: + drilldown.drilldown("up"); + break; + case $.ui.keyCode.RIGHT: + drilldown.drilldown("down"); + break; + case $.ui.keyCode.DOWN: + menu.next(); + event.preventDefault(); + break; + case $.ui.keyCode.ENTER: + case $.ui.keyCode.TAB: + menu.select(); + drilldown.drilldown("hide"); + event.preventDefault(); + break; + case $.ui.keyCode.ESCAPE: + drilldown.drilldown("hide", event); + break; + default: + clearTimeout(menu.filterTimer); + var prev = menu.previousFilter || ""; + var character = String.fromCharCode(event.keyCode); + var skip = false; + if (character == prev) { + skip = true; + } else { + character = prev + character; + } + + var match = menu.widget().children("li").filter(function() { + return new RegExp("^" + character, "i").test($("a", this).text()); + }); + var match = skip && match.index(menu.active.next()) != -1 ? match.next() : match; + if (!match.length) { + character = String.fromCharCode(event.keyCode); + match = menu.widget().children("li").filter(function() { + return new RegExp("^" + character, "i").test($(this).text()); + }); + } + if (match.length) { + menu.focus(event, match); + if (match.length > 1) { + menu.previousFilter = character; + menu.filterTimer = setTimeout(function() { + delete menu.previousFilter; + }, 1000); + } else { + delete menu.previousFilter; + } + } else { + delete menu.previousFilter; + } + } + }); + }); + </script> + <style> + body { font-size:62.5%; } + .ui-menu { width: 200px; height: 170px; } + .ui-menu .ui-menu { position: absolute; } + .ui-menu .ui-icon { float: right; } + </style> +</head> +<body> + +<div id="drilldown"> + <h3>Make a selection...</h3> + <ul> + <li> + <a href="#">Amsterdam</a> + <ul> + <li><a href="#">Aberdeen</a></li> + <li><a href="#">Ada</a></li> + <li> + <a href="#">Adamsville</a> + <ul> + <li><a href="#">Anaheim</a></li> + <li> + <a href="#">Cologne</a> + <ul> + <li><a href="#">Mberdeen</a></li> + <li><a href="#">Mda</a></li> + <li><a href="#">Mdamsville</a></li> + <li><a href="#">Mddyston</a></li> + <li><a href="#">Mmesville</a></li> + </ul> + </li> + <li><a href="#">Frankfurt</a></li> + </ul> + </li> + <li><a href="#">Addyston</a></li> + <li><a href="#">Amesville</a></li> + </ul> + </li> + <li><a href="#">Anaheim</a></li> + <li><a href="#">Cologne</a></li> + <li><a href="#">Frankfurt</a></li> + <li> + <a href="#">Magdeburg</a> + <ul> + <li><a href="#">Mberdeen</a></li> + <li><a href="#">Mda</a></li> + <li><a href="#">Mdamsville</a></li> + <li><a href="#">Mddyston</a></li> + <li><a href="#">Mmesville</a></li> + </ul> + </li> + <li><a href="#">Munich</a></li> + <li><a href="#">Utrecht</a></li> + <li><a href="#">Zurich</a></li> + </ul> + <a href="#">Go back</a> +</div> + +<div class="ui-widget" style="clear: left; margin-top:2em; font-family:Arial"> + Log: + <div id="log" style="height: 400px; width: 300px; overflow: auto;" class="ui-widget-content"></div> +</div> + +</body> +</html> diff --git a/src/main/webapp/jquery-ui-1.9pre/tests/visual/menu/menu.html b/src/main/webapp/jquery-ui-1.9pre/tests/visual/menu/menu.html new file mode 100644 index 0000000..50837f4 --- /dev/null +++ b/src/main/webapp/jquery-ui-1.9pre/tests/visual/menu/menu.html @@ -0,0 +1,283 @@ +<!doctype html> +<html> +<head> + <title>Menu Visual Test: Default</title> + <link rel="stylesheet" href="../visual.css" type="text/css" /> + <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css" title="ui-theme" /> + <script type="text/javascript" src="../../../jquery-1.7.1.js"></script> + <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script> + <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script> + <script type="text/javascript" src="../../../ui/jquery.ui.position.js"></script> + <script type="text/javascript" src="../../../ui/jquery.ui.menu.js"></script> + <script type="text/javascript"> + $(function() { + $.fn.themeswitcher && $('<div/>').css({ + position: "absolute", + right: 10, + top: 10 + }).appendTo(document.body).themeswitcher(); + + function create() { + menus.menu({ + select: function(event, ui) { + $("<div/>").text("Selected: " + ui.item.text()).appendTo("#log"); + } + }); + + $("#menu5").menu({ + select: function(event, ui) { + $("<div/>").text("Selected: " + ui.item.text()).appendTo("#log"); + }, + items: "div" + }); + + $("#menu6").menu({ + select: function(event, ui) { + $("<div/>").text("Selected: " + ui.item.text()).appendTo("#log"); + }, + items: ".menuElement" + }); + } + + var menus = $("#menu1, #menu2, #menu3, .menu4"); + create(); + + $("#toggle-destroy").toggle(function() { + menus.menu("destroy"); + }, create); + $("#toggle-disable").toggle(function() { + menus.menu("disable"); + }, function() { + menus.menu("enable"); + }); + }); + </script> + <style> + body { font-size:62.5%; } + .ui-menu { width: 200px; margin-bottom: 2em; } + .menu4 { height: 200px; overflow-y: auto; overflow-x: hidden; } + .address-item { border-bottom: 1px solid #999; } + .address-header { display: block; margin-bottom: .2em; font-weight: bold; } + .address-content { display: block; margin-bottom: .2em; padding-left: 10px; } + </style> +</head> +<body> + +<ul id="menu1"> + <li><a href="#">Aberdeen</a></li> + <li><a href="#">Ada</a></li> + <li><a href="#">Adamsville</a></li> + <li><a href="#">Addyston</a></li> + <li><a href="#">Delphi</a></li> + <li><a href="#">Saarland</a></li> + <li><a href="#">Salzburg</a></li> +</ul> + +<ul id="menu2"> + <li><a href="#">Aberdeen</a></li> + <li><a href="#">Ada</a></li> + <li><a href="#">Adamsville</a></li> + <li><a href="#">Addyston</a></li> + <li> + <a href="#">Delphi</a> + <ul> + <li><a href="#">Ada</a></li> + <li><a href="#">Saarland</a></li> + <li><a href="#">Salzburg</a></li> + </ul> + </li> + <li><a href="#">Saarland</a></li> + <li> + <a href="#">Salzburg</a> + <ul> + <li> + <a href="#">Delphi</a> + <ul> + <li><a href="#">Ada</a></li> + <li><a href="#">Saarland</a></li> + <li><a href="#">Salzburg</a></li> + </ul> + </li> + <li> + <a href="#">Delphi</a> + <ul> + <li><a href="#">Ada</a></li> + <li><a href="#">Saarland</a></li> + <li><a href="#">Salzburg</a></li> + </ul> + </li> + <li><a href="#">Perch</a></li> + </ul> + </li> +</ul> + +<ul id="menu3"> + <li><a href="#"><span class="ui-icon ui-icon-print"></span>Aberdeen</a></li> + <li><a href="#"><span class="ui-icon ui-icon-scissors"></span>Ada</a></li> + <li><a href="#">Adamsville</a></li> + <li><a href="#"><span class="ui-icon ui-icon-wrench"></span>Addyston</a></li> + <li> + <a href="#">Delphi</a> + <ul> + <li><a href="#">Ada</a></li> + <li><a href="#"><span class="ui-icon ui-icon-wrench"></span>Saarland</a></li> + <li><a href="#">Salzburg</a></li> + </ul> + </li> + <li><a href="#">Saarland</a></li> + <li> + <a href="#"><span class="ui-icon ui-icon-print"></span>Salzburg</a> + <ul> + <li> + <a href="#"><span class="ui-icon ui-icon-wrench"></span>Delphi</a> + <ul> + <li><a href="#">Ada</a></li> + <li><a href="#">Saarland</a></li> + <li><a href="#">Salzburg</a></li> + </ul> + </li> + <li> + <a href="#">Delphi</a> + <ul> + <li><a href="#"><span class="ui-icon ui-icon-wrench"></span>Ada</a></li> + <li><a href="#"><span class="ui-icon ui-icon-wrench"></span>Saarland</a></li> + <li><a href="#"><span class="ui-icon ui-icon-wrench"></span>Salzburg</a></li> + </ul> + </li> + <li><a href="#">Perch</a></li> + </ul> + </li> +</ul> + +<ul class="menu4"> + <li><a href="#">Aberdeen</a></li> + <li><a href="#">Ada</a></li> + <li><a href="#">Adamsville</a></li> + <li><a href="#">Addyston</a></li> + <li><a href="#">Adelphi</a></li> + <li><a href="#">Adena</a></li> + <li><a href="#">Adrian</a></li> + <li><a href="#">Akron</a></li> + <li><a href="#">Albany</a></li> + <li><a href="#">Alexandria</a></li> + <li><a href="#">Alger</a></li> + <li><a href="#">Alledonia</a></li> + <li><a href="#">Alliance</a></li> + <li><a href="#">Alpha</a></li> + <li><a href="#">Alvada</a></li> + <li><a href="#">Alvordton</a></li> + <li><a href="#">Amanda</a></li> + <li><a href="#">Amelia</a></li> + <li><a href="#">Amesville</a></li> + <li><a href="#">Aberdeen</a></li> + <li><a href="#">Ada</a></li> + <li><a href="#">Adamsville</a></li> + <li><a href="#">Addyston</a></li> + <li><a href="#">Adelphi</a></li> + <li><a href="#">Adena</a></li> + <li><a href="#">Adrian</a></li> + <li><a href="#">Akron</a></li> + <li><a href="#">Albany</a></li> + <li><a href="#">Alexandria</a></li> + <li><a href="#">Alger</a></li> + <li><a href="#">Alledonia</a></li> + <li><a href="#">Alliance</a></li> + <li><a href="#">Alpha</a></li> + <li><a href="#">Alvada</a></li> + <li><a href="#">Alvordton</a></li> + <li><a href="#">Amanda</a></li> + <li><a href="#">Amelia</a></li> + <li><a href="#">Amesville</a></li> +</ul> + +<div id="menu5"> + <blockquote><a href="#">Aberdeen</a></blockquote> + <blockquote><a href="#">Ada</a></blockquote> + <blockquote><a href="#">Adamsville</a></blockquote> + <blockquote><a href="#">Addyston</a></blockquote> + <blockquote> + <a href="#">Delphi</a> + <div> + <blockquote><a href="#">Ada</a></blockquote> + <blockquote><a href="#">Saarland</a></blockquote> + <blockquote><a href="#">Salzburg</a></blockquote> + </div> + </blockquote> + <blockquote><a href="#">Saarland</a></blockquote> + <blockquote> + <a href="#">Salzburg</a> + <div> + <blockquote> + <a href="#">Delphi</a> + <div> + <blockquote><a href="#">Ada</a></blockquote> + <blockquote><a href="#">Saarland</a></blockquote> + <blockquote><a href="#">Salzburg</a></blockquote> + </div> + </blockquote> + <blockquote> + <a href="#">Delphi</a> + <div> + <blockquote><a href="#">Ada</a></blockquote> + <blockquote><a href="#">Saarland</a></blockquote> + <blockquote><a href="#">Salzburg</a></blockquote> + </div> + </blockquote> + <blockquote><a href="#">Perch</a></blockquote> + </div> + </blockquote> +</div> + +<div class="menuElement" id="menu6"> + <div class="address-item"> + <a href="#"> + <span class="address-header">John Doe</span> + <span class="address-content">78 West Main St Apt 3A</span> + <span class="address-content">Bloomsburg, PA 12345</span> + </a> + </div> + <div class="address-item"> + <a href="#"> + <span class="address-header">Jane Doe</span> + <span class="address-content">78 West Main St Apt 3A</span> + <span class="address-content">Bloomsburg, PA 12345</span> + </a> + </div> + <div class="address-item"> + <a href="#"> + <span class="address-header">James Doe</span> + <span class="address-content">78 West Main St Apt 3A</span> + <span class="address-content">Bloomsburg, PA 12345</span> + </a> + </div> + <div class="address-item"> + <a href="#"> + <span class="address-header">Jenny Doe</span> + <span class="address-content">78 West Main St Apt 3A</span> + <span class="address-content">Bloomsburg, PA 12345</span> + </a> + </div> + <div class="address-item"> + <a href="#"> + <span class="address-header">John Doe</span> + <span class="address-content">78 West Main St Apt 3A</span> + <span class="address-content">Bloomsburg, PA 12345</span> + </a> + <div class="menuElement"> + <div><a href="#">Ada</a></div> + <div><a href="#">Saarland</a></div> + <div><a href="#">Salzburg</a></div> + </div> + </div> +</div> + +<div class="ui-widget" style="clear: left; margin-top:2em; font-family:Arial"> + Log: + <div id="log" style="height: 400px; width: 300px; overflow: auto;" class="ui-widget-content"></div> +</div> + +<button id="toggle-disable">Disable / Enable</button> +<button id="toggle-destroy">Destroy / Create</button> + +</body> +</html>
\ No newline at end of file diff --git a/src/main/webapp/jquery-ui-1.9pre/tests/visual/menu/tablemenu.html b/src/main/webapp/jquery-ui-1.9pre/tests/visual/menu/tablemenu.html new file mode 100644 index 0000000..bce64bf --- /dev/null +++ b/src/main/webapp/jquery-ui-1.9pre/tests/visual/menu/tablemenu.html @@ -0,0 +1,67 @@ +<!doctype html> +<html> +<head> + <title>Menu Visual Test: Default</title> + <link rel="stylesheet" href="../visual.css" type="text/css" /> + <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css" title="ui-theme" /> + <script type="text/javascript" src="../../../jquery-1.7.1.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.menu.js"></script> + <script type="text/javascript"> + $(function() { + var table = $("table"); + var colgroup = table.find("colgroup"); + var menu = $("<ul>").insertAfter(table); + var thead = table.find("thead"); + thead.children("tr").addClass("ui-state-default"); + var rows = table.find("tbody tr"); + $("<table>").width("100%").append(colgroup.clone()).append(thead).wrap("<li>").parent().appendTo(menu); + rows.each(function() { + $("<table>").width("100%").append(colgroup.clone()).append(this).wrap("<li><a></a></li>").parent().parent().appendTo(menu); + }); + + menu.menu({ + select: function(event, ui) { + $("<div/>").text("Selected: " + ui.item.text()).appendTo("#log"); + } + }); + }); + </script> + <style> + body { font-size:62.5%; } + .ui-menu { width: 200px; } + </style> +</head> +<body> + +<table> + <colgroup><col style="width: 50%"><col style="width: 50%"></colgroup> + <thead> + <tr> + <th>Firstname</th> + <th>Lastname</th> + </tr> + </thead> + <tbody> + <tr> + <td>Scott</td> + <td>Gonzo</td> + </tr> + <tr> + <td>Richy</td> + <td>Worth</td> + </tr> + </tbody> +</table> + +<div class="ui-widget" style="clear: left; margin-top:2em; font-family:Arial"> + Log: + <div id="log" style="height: 400px; width: 300px; overflow: auto;" class="ui-widget-content"></div> +</div> + +<button id="toggle-disable">Disable / Enable</button> +<button id="toggle-destroy">Destroy / Create</button> + +</body> +</html> diff --git a/src/main/webapp/jquery-ui-1.9pre/tests/visual/position/position.html b/src/main/webapp/jquery-ui-1.9pre/tests/visual/position/position.html new file mode 100644 index 0000000..9d29abe --- /dev/null +++ b/src/main/webapp/jquery-ui-1.9pre/tests/visual/position/position.html @@ -0,0 +1,67 @@ +<!DOCTYPE html> +<html lang="en"> +<head> + <meta charset="UTF-8" /> + <title>Position Visual Test: Default</title> + <link rel="stylesheet" href="../visual.css" type="text/css" /> + <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css" title="ui-theme" /> + <script type="text/javascript" src="../../../jquery-1.7.1.js"></script> + <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script> + <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script> + <script type="text/javascript" src="../../../ui/jquery.ui.position.js"></script> + <script type="text/javascript" src="../../../ui/jquery.ui.menu.js"></script> + <script type="text/javascript" src="http://jqueryui.com/themeroller/themeswitchertool/"></script> + <script type="text/javascript"> + $(function() { + var inputs = $("input"); + $("ul").insertAfter(inputs); + $(window).resize(function() { + inputs.each(function() { + $(this).position({ + my: this.id.replace(/-/, " "), + at: this.id.replace(/-/, " "), + of: "#container", + collision: "none" + }); + $(this).next().menu().position({ + my: "left top", + at: "left bottom", + of: this + }); + }); + }).resize(); + }); + </script> + <style> + input, .ui-menu { position: absolute; } + .ui-menu { width: 200px; } + html, body { width: 99%; height: 99%; min-height:700px; min-width:700px; } + #container { width: 95%; height: 95%; border: 1px solid black; margin: auto; } + </style> +</head> +<body> + +<div id="container"></div> + +<input id="left-top" /> +<input id="left-center" /> +<input id="left-bottom" /> +<input id="center-top" /> +<input id="center-center" /> +<input id="center-bottom" /> +<input id="right-top" /> +<input id="right-center" /> +<input id="right-bottom" /> + +<ul> + <li><a href="#">Java</a></li> + <li><a href="#">JavaScript</a></li> + <li><a href="#">Perl</a></li> + <li><a href="#">Ruby</a></li> + <li><a href="#">C++</a></li> + <li><a href="#">Python</a></li> + <li><a href="#">C#</a></li> +</ul> + +</body> +</html> diff --git a/src/main/webapp/jquery-ui-1.9pre/tests/visual/position/position_fit.html b/src/main/webapp/jquery-ui-1.9pre/tests/visual/position/position_fit.html new file mode 100644 index 0000000..78751d3 --- /dev/null +++ b/src/main/webapp/jquery-ui-1.9pre/tests/visual/position/position_fit.html @@ -0,0 +1,148 @@ +<!DOCTYPE html> +<html lang="en"> +<head> + <meta charset="UTF-8" /> + <title>Position Visual Test: Fit</title> + <link rel="stylesheet" href="../visual.css" type="text/css" /> + <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css" title="ui-theme" /> + <script type="text/javascript" src="../../../jquery-1.7.1.js"></script> + <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script> + <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script> + <script type="text/javascript" src="../../../ui/jquery.ui.position.js"></script> + <script type="text/javascript" src="../../../ui/jquery.ui.menu.js"></script> + <script type="text/javascript" src="http://jqueryui.com/themeroller/themeswitchertool/"></script> + <script type="text/javascript"> + $(function() { + var inputs = $("input"); + $("ul").insertAfter(inputs); + inputs.each(function(index) { + $(this).position({ + my: this.id.replace(/-/, " "), + at: this.id.replace(/-/, " "), + of: "#container"+index, + collision: "none" + }); + if(index < 3) { + $(this).next().menu().position({ + my: "left top", + at: "left bottom", + of: this, + within: "#container"+index, + collision: "fit" + }); + } + if(index >= 3 && index < 6) { + $(this).next().menu().position({ + my: "right top", + at: "right bottom", + of: this, + within: "#container"+index, + collision: "fit" + }); + } + if(index >= 6 && index < 9) { + $(this).next().menu().position({ + my: "center top", + at: "center bottom", + of: this, + within: "#container"+index, + collision: "fit" + }); + } + if(index >= 9 && index < 12) { + $(this).next().menu().position({ + my: "left top", + at: "left bottom", + of: this, + within: "#container"+index, + collision: "fit" + }); + } + if(index >= 12 && index < 15) { + $(this).next().menu().position({ + my: "center center", + at: "center center", + of: this, + within: "#container"+index, + collision: "fit" + }); + } + if(index >= 15) { + $(this).next().menu().position({ + my: "left bottom", + at: "left top", + of: this, + within: "#container"+index, + collision: "fit" + }); + } + }); + }); + </script> + <style> + input, .ui-menu { position: absolute; } + .ui-menu { width: 300px; } + #ui-menu-9, #ui-menu-10, #ui-menu-11, #ui-menu-12, #ui-menu-13, #ui-menu-14, #ui-menu-15, #ui-menu-16, #ui-menu-17 { width: auto; } + html, body { width: 99%; height: 99%; min-height:700px; min-width:700px; } + .container { width: 200px; height: 200px; border: 1px solid black; display:inline-block; margin-left: 230px; margin-top: 15px; margin-bottom: 135px; } + .container2 { width: 200px; height: 100px; border: 1px solid black; display:inline-block; margin-left: 230px; margin-top: 15px; margin-bottom: 135px; } + </style> +</head> +<body> + +<div id="container0" class="container"></div> +<div id="container1" class="container"></div> +<div id="container2" class="container"></div> +<div style="clear:both;"></div> +<div id="container3" class="container"></div> +<div id="container4" class="container"></div> +<div id="container5" class="container"></div> +<div style="clear:both;"></div> +<div id="container6" class="container"></div> +<div id="container7" class="container"></div> +<div id="container8" class="container"></div> +<div style="clear:both;"></div> +<div id="container9" class="container2"></div> +<div id="container10" class="container2"></div> +<div id="container11" class="container2"></div> +<div style="clear:both;"></div> +<div id="container12" class="container2"></div> +<div id="container13" class="container2"></div> +<div id="container14" class="container2"></div> +<div style="clear:both;"></div> +<div id="container15" class="container2"></div> +<div id="container16" class="container2"></div> +<div id="container17" class="container2"></div> + +<input id="left-top" /> +<input id="center-top" /> +<input id="right-top" /> +<input id="left-top" /> +<input id="center-top" /> +<input id="right-top" /> +<input id="left-top" /> +<input id="center-top" /> +<input id="right-top" /> + +<input id="left-top" /> +<input id="center-center" /> +<input id="right-bottom" /> +<input id="left-top" /> +<input id="center-center" /> +<input id="right-bottom" /> +<input id="left-top" /> +<input id="center-center" /> +<input id="right-bottom" /> + +<ul> + <li><a href="#">Java</a></li> + <li><a href="#">JavaScript</a></li> + <li><a href="#">Perl</a></li> + <li><a href="#">Ruby</a></li> + <li><a href="#">C++</a></li> + <li><a href="#">Python</a></li> + <li><a href="#">C#</a></li> +</ul> + +</body> +</html> diff --git a/src/main/webapp/jquery-ui-1.9pre/tests/visual/position/position_flip.html b/src/main/webapp/jquery-ui-1.9pre/tests/visual/position/position_flip.html new file mode 100644 index 0000000..7b26f6a --- /dev/null +++ b/src/main/webapp/jquery-ui-1.9pre/tests/visual/position/position_flip.html @@ -0,0 +1,77 @@ +<!DOCTYPE html> +<html lang="en"> +<head> + <meta charset="UTF-8" /> + <title>Position Visual Test: Flip</title> + <link rel="stylesheet" href="../visual.css" type="text/css" /> + <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css" title="ui-theme" /> + <script type="text/javascript" src="../../../jquery-1.7.1.js"></script> + <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script> + <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script> + <script type="text/javascript" src="../../../ui/jquery.ui.position.js"></script> + <script type="text/javascript" src="../../../ui/jquery.ui.menu.js"></script> + <script type="text/javascript" src="http://jqueryui.com/themeroller/themeswitchertool/"></script> + <script type="text/javascript"> + $(function() { + var inputs = $("input"); + $("ul").insertAfter(inputs); + inputs.each(function(index) { + $(this).position({ + my: this.id.replace(/-/, " "), + at: this.id.replace(/-/, " "), + of: "#container"+index, + collision: "none" + }); + $(this).next().menu().position({ + my: "left top", + at: "left bottom", + of: this, + within: "#container"+index + }); + }); + }); + </script> + <style> + input, .ui-menu { position: absolute; } + .ui-menu { width: 300px; } + #ui-menu-6, #ui-menu-7, #ui-menu-8 { width: auto; } + html, body { width: 99%; height: 99%; min-height:700px; min-width:700px; } + .container { width: 200px; height: 200px; border: 1px solid black; display:inline-block; margin-left: 230px; margin-top: 150px; } + </style> +</head> +<body> + +<div id="container0" class="container"></div> +<div id="container1" class="container"></div> +<div id="container2" class="container"></div><br> +<div style="clear:both;"></div> +<div id="container3" class="container" style="width:300px;"></div> +<div id="container4" class="container" style="width:300px;"></div> +<div id="container5" class="container" style="width:300px;"></div> +<div style="clear:both;"></div> +<div id="container6" class="container" style="height:100px; margin-bottom: 500px;"></div> +<div id="container7" class="container" style="height:100px; margin-bottom: 500px;"></div> +<div id="container8" class="container" style="height:100px; margin-bottom: 500px;"></div> + +<input id="left-top" /> +<input id="center-top" /> +<input id="right-top" /> +<input id="left-center" /> +<input id="center-center" /> +<input id="right-center" /> +<input id="left-bottom" /> +<input id="center-center" /> +<input id="right-bottom" /> + +<ul> + <li><a href="#">Java</a></li> + <li><a href="#">JavaScript</a></li> + <li><a href="#">Perl</a></li> + <li><a href="#">Ruby</a></li> + <li><a href="#">C++</a></li> + <li><a href="#">Python</a></li> + <li><a href="#">C#</a></li> +</ul> + +</body> +</html> diff --git a/src/main/webapp/jquery-ui-1.9pre/tests/visual/position/position_flipfit.html b/src/main/webapp/jquery-ui-1.9pre/tests/visual/position/position_flipfit.html new file mode 100644 index 0000000..b5cf829 --- /dev/null +++ b/src/main/webapp/jquery-ui-1.9pre/tests/visual/position/position_flipfit.html @@ -0,0 +1,86 @@ +<!DOCTYPE html> +<html lang="en"> +<head> + <meta charset="UTF-8" /> + <title>Position Visual Test: FlipFit</title> + <link rel="stylesheet" href="../visual.css" type="text/css" /> + <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css" title="ui-theme" /> + <script type="text/javascript" src="../../../jquery-1.7.1.js"></script> + <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script> + <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script> + <script type="text/javascript" src="../../../ui/jquery.ui.position.js"></script> + <script type="text/javascript" src="../../../ui/jquery.ui.menu.js"></script> + <script type="text/javascript" src="http://jqueryui.com/themeroller/themeswitchertool/"></script> + <script type="text/javascript"> + $(function() { + var inputs = $("input"); + $("ul").insertAfter(inputs); + inputs.each(function(index) { + $(this).position({ + my: this.id.replace(/-/, " "), + at: this.id.replace(/-/, " "), + of: "#container"+index, + collision: "none" + }); + $(this).next().menu().position({ + my: index > 2 && index < 6 ? "right top" : "left top", + at: index > 2 && index < 6 ? "right bottom" : "left bottom", + of: this, + within: "#container"+index, + collision: "flipfit" + }); + }); + }); + </script> + <style> + input, .ui-menu { position: absolute; } + .ui-menu { width: 300px; } + #ui-menu-3, #ui-menu-4, #ui-menu-5 { width: 185px; } + #ui-menu-9, #ui-menu-10, #ui-menu-11 { width: auto; } + html, body { width: 99%; height: 99%; min-height:700px; min-width:700px; } + .container { width: 200px; height: 200px; border: 1px solid black; display:inline-block; margin-left: 230px; margin-top: 150px; } + </style> +</head> +<body> + +<div id="container0" class="container"></div> +<div id="container1" class="container"></div> +<div id="container2" class="container"></div><br> +<div style="clear:both;"></div> +<div id="container3" class="container"></div> +<div id="container4" class="container"></div> +<div id="container5" class="container"></div><br> +<div style="clear:both;"></div> +<div id="container6" class="container" style="width:300px;"></div> +<div id="container7" class="container" style="width:300px;"></div> +<div id="container8" class="container" style="width:300px;"></div> +<div style="clear:both;"></div> +<div id="container9" class="container" style="height:100px; margin-bottom: 500px;"></div> +<div id="container10" class="container" style="height:100px; margin-bottom: 500px;"></div> +<div id="container11" class="container" style="height:100px; margin-bottom: 500px;"></div> + +<input id="left-top" /> +<input id="center-top" /> +<input id="right-top" /> +<input id="left-top" /> +<input id="center-top" /> +<input id="right-top" /> +<input id="left-center" /> +<input id="center-center" /> +<input id="right-center" /> +<input id="left-bottom" /> +<input id="center-center" /> +<input id="right-bottom" /> + +<ul> + <li><a href="#">Java</a></li> + <li><a href="#">JavaScript</a></li> + <li><a href="#">Perl</a></li> + <li><a href="#">Ruby</a></li> + <li><a href="#">C++</a></li> + <li><a href="#">Python</a></li> + <li><a href="#">C#</a></li> +</ul> + +</body> +</html> diff --git a/src/main/webapp/jquery-ui-1.9pre/tests/visual/position/position_margin.html b/src/main/webapp/jquery-ui-1.9pre/tests/visual/position/position_margin.html new file mode 100644 index 0000000..52b8008 --- /dev/null +++ b/src/main/webapp/jquery-ui-1.9pre/tests/visual/position/position_margin.html @@ -0,0 +1,43 @@ +<!DOCTYPE html> +<html lang="en"> +<head> + <meta charset="UTF-8" /> + <title>Position Visual Test: Default</title> + <link rel="stylesheet" href="../visual.css" type="text/css" /> + <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css" title="ui-theme" /> + <script type="text/javascript" src="../../../jquery-1.7.1.js"></script> + <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script> + <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script> + <script type="text/javascript" src="../../../ui/jquery.ui.position.js"></script> + <script type="text/javascript" src="http://jqueryui.com/themeroller/themeswitchertool/"></script> + <script type="text/javascript"> + $(function() { + $( "#elem" ).position({ + my: "right bottom", + at: "right bottom", + of: window, + collision: "fit" + }); + }); + </script> + <style> + #elem { + position: absolute; + top: 100px; + left: 100px; + width: 200px; + height: 200px; + box-shadow: 10px 10px 5px #888; + -moz-box-shadow: 10px 10px 5px #888; + -webkit-box-shadow: 10px 10px 5px #888; + background-color: #aaa; + margin: 15px; + } + </style> +</head> +<body> + +<div id="elem"></div> + +</body> +</html> diff --git a/src/main/webapp/jquery-ui-1.9pre/tests/visual/position/position_within.html b/src/main/webapp/jquery-ui-1.9pre/tests/visual/position/position_within.html new file mode 100644 index 0000000..156c82e --- /dev/null +++ b/src/main/webapp/jquery-ui-1.9pre/tests/visual/position/position_within.html @@ -0,0 +1,200 @@ +<!doctype html> +<html lang="en"> +<head> + <meta charset="utf-8"> + <title>Position Visual Test: Containing Element</title> + + <link rel="stylesheet" href="../visual.css" type="text/css" /> + <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css" title="ui-theme" /> + + <script src="../../../jquery-1.7.1.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.draggable.js"></script> + <script src="../../../ui/jquery.ui.position.js"></script> + + <style> + html, body { + height:100%; + width:100%; + margin:0; + /* force scroll bar*/ + min-height:800px; + min-width:800px; + + /* IE6 needs this */ + text-align:center; + } + .demo-description { + text-align:center; + padding:1.5em; + } + .demo-container { + background:#aaa; + width:80%; + height:80%; + + text-align:left; + margin:0 auto; + position:relative; + padding:10px; + } + .demo { + background:#eee; + overflow:hidden; + position:relative; + height:100%; + /* IE6 needs this */ + width:100%; + } + #parent { + width: 60%; + margin: 10px auto; + padding: 5px; + border: 1px solid #777; + background-color: #fbca93; + text-align: center; + cursor:move; + } + .positionable { + width: 75px; + height: 75px; + position: absolute; + display: block; + right: 0; + bottom: 0; + background-color: #bcd5e6; + text-align: center; + cursor:move; + } + .ui-flipped-top { + border-top: 3px solid #000000; + } + .ui-flipped-bottom { + border-bottom: 3px solid #000000; + } + .ui-flipped-left { + border-left: 3px solid #000000; + } + .ui-flipped-right { + border-right: 3px solid #000000; + } + select, input { + margin-left: 15px; + } + </style> + <script> + $(function() { + function position( using ) { + $( ".positionable" ).position({ + of: $( "#parent" ), + my: $( "#my_horizontal" ).val() + " " + $( "#my_vertical" ).val(), + at: $( "#at_horizontal" ).val() + " " + $( "#at_vertical" ).val(), + offset: $( "#offset" ).val(), + using: using, + within: $( ".demo" ), + collision: $( "#collision_horizontal" ).val() + " " + $( "#collision_vertical" ).val() + }); + } + $( ".demo" ).append("<div style='width:5000px;height:5000px;' />").css("overflow","auto"); + + $( ".positionable" ).css( "opacity", 0.5 ); + + $( ":input" ).bind( "click keyup change", function() { position(); } ); + + $( "#parent" ).draggable({ + drag: function() { position(); } + }); + + $( ".positionable" ).draggable({ + drag: function( event, ui ) { + // reset offset before calculating it + $( "#offset" ).val( "0" ); + position(function( result ) { + var demo = $( ".demo" ); + $( "#offset" ).val( "" + ( ui.offset.left - result.left - demo.offset().left + demo.scrollLeft() ) + + " " + ( ui.offset.top - result.top - demo.offset().top + demo.scrollTop() ) ); + position(); + }); + } + }); + + position(); + }); + </script> +</head> +<body> + +<div class="demo-description"> + Use the form controls to configure the positioning, or drag the positioned element to modify its offset. + <br/>Drag around the parent element to see collision detection in action. +</div><!-- End demo-description --> + +<div class="demo-container"> +<div class="demo"> + + <div id="parent"> + <p>This is the position parent element.</p> + </div> + + <div class="positionable"> + <p>to position</p> + </div> + + <div class="positionable" style="width:120px; height: 40px;"> + <p>to position 2</p> + </div> + + <div style="padding: 20px; margin-top: 75px;"> + position... + <div style="padding-bottom: 20px;"> + <b>my:</b> + <select id="my_horizontal"> + <option value="left">left</option> + <option value="center">center</option> + <option value="right" selected="selected">right</option> + </select> + <select id="my_vertical"> + <option value="top">top</option> + <option value="middle">center</option> + <option value="bottom">bottom</option> + </select> + </div> + <div style="padding-bottom: 20px;"> + <b>at:</b> + <select id="at_horizontal"> + <option value="left">left</option> + <option value="center">center</option> + <option value="right" selected="selected">right</option> + </select> + <select id="at_vertical"> + <option value="top">top</option> + <option value="middle">center</option> + <option value="bottom">bottom</option> + </select> + </div> + <div style="padding-bottom: 20px;"> + <b>offset:</b> + <input id="offset" type="text" size="15"/> + </div> + <div style="padding-bottom: 20px;"> + <b>collision:</b> + <select id="collision_horizontal"> + <option value="flip">flip</option> + <option value="fit">fit</option> + <option value="none">none</option> + </select> + <select id="collision_vertical"> + <option value="flip">flip</option> + <option value="fit">fit</option> + <option value="none">none</option> + </select> + </div> + </div> + +</div><!-- End demo --> +</div> + +</body> +</html> diff --git a/src/main/webapp/jquery-ui-1.9pre/tests/visual/theme.html b/src/main/webapp/jquery-ui-1.9pre/tests/visual/theme.html new file mode 100644 index 0000000..131cc41 --- /dev/null +++ b/src/main/webapp/jquery-ui-1.9pre/tests/visual/theme.html @@ -0,0 +1,532 @@ +<!DOCTYPE html> +<html> + <head> + <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> + <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.7.1.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(); + + }); + </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% 4%; 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> + </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> + + diff --git a/src/main/webapp/jquery-ui-1.9pre/tests/visual/tooltip/ajaxcontent.php b/src/main/webapp/jquery-ui-1.9pre/tests/visual/tooltip/ajaxcontent.php new file mode 100644 index 0000000..a689a73 --- /dev/null +++ b/src/main/webapp/jquery-ui-1.9pre/tests/visual/tooltip/ajaxcontent.php @@ -0,0 +1,2 @@ +<?php sleep(1); ?> +<strong>Hello</strong> world!
\ No newline at end of file diff --git a/src/main/webapp/jquery-ui-1.9pre/tests/visual/tooltip/animations.html b/src/main/webapp/jquery-ui-1.9pre/tests/visual/tooltip/animations.html new file mode 100644 index 0000000..993fbbd --- /dev/null +++ b/src/main/webapp/jquery-ui-1.9pre/tests/visual/tooltip/animations.html @@ -0,0 +1,72 @@ +<!DOCTYPE html> +<html lang="en"> +<head> + <title>Tooltip Visual Test: Default</title> + <link rel="stylesheet" href="../visual.css" type="text/css" /> + <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css"> + <script type="text/javascript" src="../../../jquery-1.7.1.js"></script> + <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script> + <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script> + <script type="text/javascript" src="../../../ui/jquery.ui.position.js"></script> + <script type="text/javascript" src="../../../ui/jquery.ui.button.js"></script> + <script type="text/javascript" src="../../../ui/jquery.ui.tooltip.js"></script> + <script type="text/javascript" src="../../../ui/jquery.effects.core.js"></script> + <script type="text/javascript" src="../../../ui/jquery.effects.blind.js"></script> + <script type="text/javascript" src="../../../ui/jquery.effects.bounce.js"></script> + <script type="text/javascript" src="../../../ui/jquery.effects.drop.js"></script> + <script type="text/javascript" src="../../../ui/jquery.effects.explode.js"></script> + <!-- + <script type="text/javascript" src="http://jqueryui.com/themeroller/themeswitchertool/"></script> + --> + <script type="text/javascript"> + $(function() { + var animations = [{}, { + show: { + effect: "slideDown" + }, + hide: { + effect: "slideUp" + } + }, { + show: { + effect: "explode" + }, + hide: { + effect: "explode" + } + }, { + show: { + effect: "bounce" + }, + hide: { + effect: "blind" + } + }, + { + show: { + effect: "drop", + direction: "right" + }, + hide: { + effect: "drop", + direction: "right" + } + }]; + $.each(animations, function(index, animation) { + var text = JSON.stringify(animation); + $("<span></span>").attr("title", text).text(text).tooltip({ + show: animation.show, + hide: animation.hide + }).wrap("<li></li>").parent().appendTo("ul"); + }); + }); + </script> +</head> +<body> + +<div style="width:300px"> + <ul class="ui-widget ui-widget-header"> + </ul> +</div> +</body> +</html> diff --git a/src/main/webapp/jquery-ui-1.9pre/tests/visual/tooltip/callout.html b/src/main/webapp/jquery-ui-1.9pre/tests/visual/tooltip/callout.html new file mode 100644 index 0000000..79d8d32 --- /dev/null +++ b/src/main/webapp/jquery-ui-1.9pre/tests/visual/tooltip/callout.html @@ -0,0 +1,213 @@ +<!DOCTYPE html> +<html lang="en"> +<head> + <title>Tooltip Visual Test: Default</title> + <link rel="stylesheet" href="../visual.css" type="text/css" /> + <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css"> + <script type="text/javascript" src="../../../jquery-1.7.1.js"></script> + <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script> + <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script> + <script type="text/javascript" src="../../../ui/jquery.ui.position.js"></script> + <script type="text/javascript" src="../../../ui/jquery.ui.tooltip.js"></script> + <script type="text/javascript"> + $.widget("ui.callout", { + _init: function() { + this.element.append('<div class="ui-tooltip-pointer ui-widget-content"><div class="ui-tooltip-pointer-inner" style="border-right-color:rgb(255, 255, 255)"></div></div>'); + }, + pointAt: function(target) { + target = $(target); + var tx = target.offset().left + target.width() / 2, + ty = target.offset().top + target.height() / 2, + dx = this.element.offset().left + this.element.width() / 2, + dy = this.element.offset().top + this.element.height() / 2; + function d(a, b) { + return a > b ? a - b : b - a; + } + this.element.attr("class", this.element.attr("class").replace(/(.+)ui-tooltip-arrow-..(.+)?/, "$1 $2")); + if (dx < tx && d(dx, tx) > d(dy, tx)) { + this.element.addClass("ui-tooltip-arrow-rc"); + } + if (dx > tx && d(dx, tx) > d(dy, ty)) { + this.element.addClass("ui-tooltip-arrow-lc"); + } + if (dy > ty && d(dx, tx) < d(dy, ty)) { + this.element.addClass("ui-tooltip-arrow-tc"); + } + if (dy < ty && d(dx, tx) < d(dy, ty)) { + this.element.addClass("ui-tooltip-arrow-bc"); + } + + // fix inner borders + $('.ui-tooltip-pointer-inner', this.element).each(function(){ + var pt = $(this).parent().parent(); + var bColor = pt.css('backgroundColor'); + $(this).css({ + borderLeftColor: '', + borderRightColor: '', + borderTopColor: '', + borderBottomColor: '' + }); + if(pt.is('.ui-tooltip-arrow-rb,.ui-tooltip-arrow-rc,.ui-tooltip-arrow-rt')){ $(this).css('border-left-color', bColor); } + else if(pt.is('.ui-tooltip-arrow-br,.ui-tooltip-arrow-bc,.ui-tooltip-arrow-bl')){ $(this).css('border-top-color', bColor); } + else if(pt.is('.ui-tooltip-arrow-lb,.ui-tooltip-arrow-lc,.ui-tooltip-arrow-lt')){ $(this).css('border-right-color', bColor); } + else { $(this).css('border-bottom-color', bColor); } + }); + } + }); + + $(function() { + $.ui.tooltip.prototype.options.show = function(event, ui) { + $(this).tooltip("widget").callout("pointAt", ui.target); + } + + function enable() { + // default + $("#context1, form input").tooltip(); + + // custom class, replaces ui-widget-content + $("#context2").tooltip({ + tooltipClass: "ui-widget-header" + }); + $("#right1").tooltip({ + tooltipClass: "ui-state-error" + }); + + // synchronous content + $("#see-footnote").tooltip({ + content: function() { + return $($(this).attr("href")).html(); + } + }); + // asynchronous content + $("#ajax").tooltip({ + content: function(response) { + $.get("ajaxcontent.html", response); + } + }); + + // custom position + $("#right2").tooltip({ + position: { + my: "center top", + at: "center bottom", + offset: "0 10" + }, + tooltipClass: "ui-state-highlight" + }); + + $(".ui-tooltip").callout(); + } + enable(); + + $("#disable").toggle(function() { + $("*").tooltip("disable"); + }, function() { + $("*").tooltip("enable"); + }); + $("#toggle").toggle(function() { + $("*").tooltip("destroy"); + }, function() { + enable(); + }); + }); + </script> + + <style> + .ui-tooltip .ui-tooltip-pointer,.ui-tooltip .ui-tooltip-pointer-inner { position:absolute; width:0; height:0; background:none; } + + /*top*/ + .ui-tooltip-arrow-tr .ui-tooltip-pointer,.ui-tooltip-arrow-tc .ui-tooltip-pointer,.ui-tooltip-arrow-tl .ui-tooltip-pointer { top:-14px; border-top:0; border-bottom-width:14px; } + .ui-tooltip-arrow-tr .ui-tooltip-pointer { border-left:18px dotted transparent; border-right:0; right:10px; } + .ui-tooltip-arrow-tc .ui-tooltip-pointer { border-left:10px dotted transparent; border-right:10px dotted transparent; left:50%; margin-left:-10px; } + .ui-tooltip-arrow-tl .ui-tooltip-pointer { border-left:0; border-right:18px dotted transparent; left:10px; } + .ui-tooltip-arrow-tr .ui-tooltip-pointer-inner,.ui-tooltip-arrow-tc .ui-tooltip-pointer-inner,.ui-tooltip-arrow-tl .ui-tooltip-pointer-inner { border-bottom:10px solid #fff; bottom:-14px; } + .ui-tooltip-arrow-tr .ui-tooltip-pointer-inner { border-left:12px dotted transparent; border-right:0; right:2px; } + .ui-tooltip-arrow-tc .ui-tooltip-pointer-inner { border-left:8px dotted transparent; border-right:8px dotted transparent; left:-8px; } + .ui-tooltip-arrow-tl .ui-tooltip-pointer-inner { border-left:0; border-right:12px dotted transparent; left:2px; } + + /*right*/ + .ui-tooltip-arrow-rb .ui-tooltip-pointer,.ui-tooltip-arrow-rc .ui-tooltip-pointer,.ui-tooltip-arrow-rt .ui-tooltip-pointer { right:-14px; border-right:0; border-left-width:14px; } + .ui-tooltip-arrow-rb .ui-tooltip-pointer { border-bottom:0; border-top:18px dotted transparent; bottom:10px; } + .ui-tooltip-arrow-rc .ui-tooltip-pointer { border-bottom:10px dotted transparent; border-top:10px dotted transparent; bottom:50%; margin-bottom:-10px; } + .ui-tooltip-arrow-rt .ui-tooltip-pointer { border-bottom:18px dotted transparent; border-top:0; top:10px; } + .ui-tooltip-arrow-rb .ui-tooltip-pointer-inner,.ui-tooltip-arrow-rc .ui-tooltip-pointer-inner,.ui-tooltip-arrow-rt .ui-tooltip-pointer-inner { border-left:10px solid #fff; left:-14px; } + .ui-tooltip-arrow-rb .ui-tooltip-pointer-inner { border-bottom:0; border-top:12px dotted transparent; bottom:2px; } + .ui-tooltip-arrow-rc .ui-tooltip-pointer-inner { border-bottom:8px dotted transparent; border-top:8px dotted transparent; bottom:-8px; } + .ui-tooltip-arrow-rt .ui-tooltip-pointer-inner { border-bottom:12px dotted transparent; border-top:0; top:2px; } + + /*bottom*/ + .ui-tooltip-arrow-br .ui-tooltip-pointer,.ui-tooltip-arrow-bc .ui-tooltip-pointer,.ui-tooltip-arrow-bl .ui-tooltip-pointer { bottom:-14px; border-bottom:0; border-top-width:14px; } + .ui-tooltip-arrow-br .ui-tooltip-pointer { border-left:18px dotted transparent; border-right:0; right:10px; } + .ui-tooltip-arrow-bc .ui-tooltip-pointer { border-left:10px dotted transparent; border-right:10px dotted transparent; left:50%; margin-left:-10px; } + .ui-tooltip-arrow-bl .ui-tooltip-pointer { border-left:0; border-right:18px dotted transparent; left:10px; } + .ui-tooltip-arrow-br .ui-tooltip-pointer-inner,.ui-tooltip-arrow-bc .ui-tooltip-pointer-inner,.ui-tooltip-arrow-bl .ui-tooltip-pointer-inner { border-top:10px solid #fff; top:-14px; } + .ui-tooltip-arrow-br .ui-tooltip-pointer-inner { border-left:12px dotted transparent; border-right:0; right:2px; } + .ui-tooltip-arrow-bc .ui-tooltip-pointer-inner { border-left:8px dotted transparent; border-right:8px dotted transparent; left:-8px; } + .ui-tooltip-arrow-bl .ui-tooltip-pointer-inner { border-left:0; border-right:12px dotted transparent; left:2px; } + + /*left*/ + .ui-tooltip-arrow-lb .ui-tooltip-pointer,.ui-tooltip-arrow-lc .ui-tooltip-pointer,.ui-tooltip-arrow-lt .ui-tooltip-pointer { left:-14px; border-left:0; border-right-width:14px; } + .ui-tooltip-arrow-lb .ui-tooltip-pointer { border-bottom:0; border-top:18px dotted transparent; bottom:10px; } + .ui-tooltip-arrow-lc .ui-tooltip-pointer { border-bottom:10px dotted transparent; border-top:10px dotted transparent; bottom:50%; margin-bottom:-10px; } + .ui-tooltip-arrow-lt .ui-tooltip-pointer { border-bottom:18px dotted transparent; border-top:0; top:10px; } + .ui-tooltip-arrow-lb .ui-tooltip-pointer-inner,.ui-tooltip-arrow-lc .ui-tooltip-pointer-inner,.ui-tooltip-arrow-lt .ui-tooltip-pointer-inner { border-right:10px solid #fff; right:-14px; } + .ui-tooltip-arrow-lb .ui-tooltip-pointer-inner { border-bottom:0; border-top:12px dotted transparent; bottom:2px; } + .ui-tooltip-arrow-lc .ui-tooltip-pointer-inner { border-bottom:8px dotted transparent; border-top:8px dotted transparent; bottom:-8px; } + </style> +</head> +<body> + +<div style="width:300px"> + <ul id="context1" class="ui-widget ui-widget-header"> + <li><a href="#" title="Tooltip text 1">Anchor 1</a></li> + <li><a href="#" title="Tooltip text 2">Anchor 2</a></li> + <li><a href="#" title="Tooltip text 3">Anchor 3</a></li> + <li><a href="#" title="Tooltip text 4 more Tooltip text Tooltip text ">Anchor 4</a></li> + <li><a href="#" title="Tooltip text 5 more Tooltip text Tooltip text ">Anchor 5</a></li> + <li><a href="#" title="Tooltip text 6 more Tooltip text Tooltip text ">Anchor 6</a></li> + </ul> + + <div id="right1" style="position: absolute; right: 1em" title="right aligned element"> + collision detection should kick in around here + </div> + + <div style="margin: 2em 0"> + <a id="see-footnote" href="#footnote">I'm a link to a footnote.</a> + </div> + + <div id="right2" style="position: absolute; right: 1em" title="right aligned element with custom position"> + right aligned with custom position + </div> + + <div id="ajax" style="width: 100px;" class="ui-widget-content" title="never be seen"> + gets its content via ajax + </div> + + <div id="context2" class="ui-widget ui-widget-content"> + <span title="something" style="border:1px solid blue">span</span> + <div title="something else" style="border:1px solid red;"> + div + <span title="something more" style="border:1px solid green;">nested span</span> + </div> + </div> + + <form style="margin: 2em 0;"> + <div> + <label for="first">First Name:</label> + <input id="first" title="Your first name is optional" /> + </div> + <div> + <label for="last">Last Name:</label> + <input id="last" title="Your last name is optional" /> + </div> + </form> + + <div id="footnote">This is <strong>the</strong> footnote, including other elements</div> + + <button id="disable">Toggle disabled</button> + <button id="toggle">Toggle widget</button> +</div> + + +</body> +</html> diff --git a/src/main/webapp/jquery-ui-1.9pre/tests/visual/tooltip/tooltip.html b/src/main/webapp/jquery-ui-1.9pre/tests/visual/tooltip/tooltip.html new file mode 100644 index 0000000..b282a73 --- /dev/null +++ b/src/main/webapp/jquery-ui-1.9pre/tests/visual/tooltip/tooltip.html @@ -0,0 +1,186 @@ +<!DOCTYPE html> +<html lang="en"> +<head> + <title>Tooltip Visual Test: Default</title> + <link rel="stylesheet" href="../visual.css" type="text/css" /> + <link rel="stylesheet" href="../../../themes/base/jquery.ui.all.css" type="text/css"> + <script type="text/javascript" src="../../../jquery-1.7.1.js"></script> + <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script> + <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script> + <script type="text/javascript" src="../../../ui/jquery.ui.position.js"></script> + <script type="text/javascript" src="../../../ui/jquery.ui.button.js"></script> + <script type="text/javascript" src="../../../ui/jquery.ui.tooltip.js"></script> + <!-- + <script type="text/javascript" src="http://jqueryui.com/themeroller/themeswitchertool/"></script> + --> + <script type="text/javascript"> + $(function() { + $.fn.themeswitcher && $('<div/>').css({ + position: "absolute", + right: 10, + top: 10 + }).appendTo(document.body).themeswitcher(); + + function enable() { + // default + $("#context1, form, #childish").tooltip(); + + // custom class, replaces ui-widget-content + $("#context2").tooltip({ + tooltipClass: "ui-widget-header" + }); + $("#right1").tooltip({ + tooltipClass: "ui-state-error" + }); + + // synchronous content + $("#footnotes").tooltip({ + items: "[href^='#']", + content: function() { + return $($(this).attr("href")).html(); + } + }); + // asynchronous content + $("#ajax").tooltip({ + content: function(response) { + $.get("ajaxcontent.php", response); + return "Loading..."; + } + }); + // asynchronous content with caching + var content; + $("#ajax2").tooltip({ + content: function(response) { + if (content) { + return content; + } + $.ajax({ + url: "ajaxcontent.php", + cache: false, + success: function(result) { + content = result; + response(result); + } + }); + return "Loading..."; + } + }); + + // custom position + $("#right2").tooltip({ + tooltipClass: "ui-state-highlight", + position: { + my: "center top", + at: "center bottom", + offset: "0 10" + } + }); + + $("#button1").button(); + $("#button2").button({ + icons: { + primary: "ui-icon-wrench" + } + }); + $("#button3, #button4").button({ + icons: { + primary: "ui-icon-wrench" + }, + text: false + }); + $("#buttons").tooltip({ + position: { + my: "center bottom", + at: "center top", + offset: "0 -5" + } + }); + } + enable(); + + $("#disable").toggle(function() { + $(":ui-tooltip").tooltip("disable"); + }, function() { + $(":ui-tooltip").tooltip("enable"); + }); + $("#toggle").toggle(function() { + $(":ui-tooltip").tooltip("destroy"); + }, function() { + enable(); + }); + }); + </script> +</head> +<body> + +<div style="width:300px"> + <ul id="context1" class="ui-widget ui-widget-header"> + <li><a href="#" title="Tooltip text 1">Anchor 1</a></li> + <li><a href="#" title="Tooltip text 2">Anchor 2</a></li> + <li><a href="#" title="Tooltip text 3">Anchor 3</a></li> + <li><a href="#" title="Tooltip text 4 more Tooltip text Tooltip text ">Anchor 4</a></li> + <li><a href="#" title="Tooltip text 5 more Tooltip text Tooltip text ">Anchor 5</a></li> + <li><a href="#" title="Tooltip text 6 more Tooltip text Tooltip text ">Anchor 6</a></li> + </ul> + + <div id="right1" style="position: absolute; right: 1em" title="right aligned element"> + collision detection should kick in around here + </div> + + <div id="footnotes" style="margin: 2em 0"> + <a href="#footnote1">I'm a link to a footnote.</a> + <a href="#footnote2">I'm another link to a footnote.</a> + </div> + + <div id="right2" style="position: absolute; right: 1em" title="right aligned element with custom position"> + right aligned with custom position + </div> + + <div id="ajax" style="width: 100px;" class="ui-widget-content" title="never be seen"> + gets its content via ajax + </div> + <div id="ajax2" style="width: 100px;" class="ui-widget-content" title="never be seen"> + gets its content via ajax, caches the response + </div> + + <div id="context2" class="ui-widget ui-widget-content"> + <span title="something" style="border:1px solid blue">span</span> + <div title="something else" style="border:1px solid red;"> + div + <span title="something more" style="border:1px solid green;">nested span</span> + </div> + </div> + + <div id="childish" class="ui-widget ui-widget-content" style="margin: 2em 0; border: 1px solid black;" title="element with child elements"> + Text in <strong>bold</strong>. + </div> + + <form style="margin: 2em 0;"> + <div> + <label for="first">First Name:</label> + <input id="first" title="Your first name is optional" /> + </div> + <div> + <label for="last">Last Name:</label> + <input id="last" title="Your last name is optional" /> + </div> + </form> + + <div id="buttons"> + <button id="button1" title="Button Tooltip">Button Label</button> + <button id="button2" title="Icon Button">Button with Icon</button> + <button id="button3">Icon Only Button 1</button> + <button id="button4">Icon Only Button 2</button> + </div> + + <div id="footnote1">This is <strong>the</strong> footnote, including other elements</div> + <div id="footnote2">This is <strong>the other</strong> footnote, including other elements</div> + + <button id="disable">Toggle disabled</button> + <button id="toggle">Toggle widget</button> +</div> + +<div style="height: 2000px"></div> + +</body> +</html> diff --git a/src/main/webapp/jquery-ui-1.9pre/tests/visual/visual.css b/src/main/webapp/jquery-ui-1.9pre/tests/visual/visual.css new file mode 100644 index 0000000..b61fc0e --- /dev/null +++ b/src/main/webapp/jquery-ui-1.9pre/tests/visual/visual.css @@ -0,0 +1,3 @@ +body { font-size: 62.5%; } +#draggable, #resizable { width: 100px; height: 100px; background: #abc; } +#droppable { width: 100px; height: 100px; background: #cde; } |