summaryrefslogtreecommitdiffstats
path: root/tests/visual/button/button.html
diff options
context:
space:
mode:
authorjzaefferer <joern.zaefferer@gmail.com>2010-03-21 21:07:25 +0100
committerjzaefferer <joern.zaefferer@gmail.com>2010-03-21 21:07:25 +0100
commitf5a14de1b1315140eaf04a8056107cc95732922f (patch)
treeb74379ac9f4cab5561f86fc867edd7f8ad88c992 /tests/visual/button/button.html
parentd29f819269a6271b8c2f6af89c5ede4cbae99b89 (diff)
downloadjquery-ui-f5a14de1b1315140eaf04a8056107cc95732922f.tar.gz
jquery-ui-f5a14de1b1315140eaf04a8056107cc95732922f.zip
Cleaning up visual tests
Fixes #5395 - Visual Tests Cleanup
Diffstat (limited to 'tests/visual/button/button.html')
-rw-r--r--tests/visual/button/button.html139
1 files changed, 139 insertions, 0 deletions
diff --git a/tests/visual/button/button.html b/tests/visual/button/button.html
new file mode 100644
index 000000000..13e19302c
--- /dev/null
+++ b/tests/visual/button/button.html
@@ -0,0 +1,139 @@
+<!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.4.2.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'}}}">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>
+ </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>
generated by cgit v1.2.3 (git 2.39.1) at 2024-12-24 01:44:03 +0000