Merged in /branches/dev r3251:3620 (excluding autocomplete, modal, to…

…oltip, menu; including menu static tests).
jquery · Jan 7, 2010 · 90fb45d · 90fb45d
1 parent 975b02a
commit 90fb45d
Show file tree

Hide file tree

Showing 72 changed files with 3,220 additions and 1,750 deletions.
diff --git a/demos/button/checkbox.html b/demos/button/checkbox.html
@@ -0,0 +1,46 @@
+<!doctype html>
+<html lang="en">
+<head>
+	<title>jQuery UI Button - Checkboxes demo</title>
+	<link type="text/css" href="../../themes/base/ui.all.css" rel="stylesheet" />
+	<script type="text/javascript" src="../../jquery-1.3.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.button.js"></script>
+	<link type="text/css" href="../demos.css" rel="stylesheet" />
+	<script type="text/javascript">
+	$(function() {
+		$("#check").button();
+		$("#format").buttonset();
+	});
+	</script>
+	<style>
+		#format { margin-top: 2em; }
+	</style>
+</head>
+<body>
+
+<div class="demo">
+
+	<input type="checkbox" id="check" /><label for="check">Toggle</label>
+
+	<div 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>
+	</div>
+
+</div><!-- End demo -->
+
+
+
+<div class="demo-description">
+
+<p>TODO</p>
+
+</div><!-- End demo-description -->
+
+
+
+</body>
+</html>
diff --git a/demos/button/default.html b/demos/button/default.html
@@ -0,0 +1,43 @@
+<!doctype html>
+<html lang="en">
+<head>
+	<title>jQuery UI Button - Default demo</title>
+	<link type="text/css" href="../../themes/base/ui.all.css" rel="stylesheet" />
+	<script type="text/javascript" src="../../jquery-1.3.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.button.js"></script>
+	<link type="text/css" href="../demos.css" rel="stylesheet" />
+	<script type="text/javascript">
+	$(function() {
+		$("button, input:submit, a").button();
+	});
+	</script>
+	<style>
+
+	</style>
+</head>
+<body>
+
+<div class="demo">
+
+	<button>A button element</button>
+
+	<input type="submit" value="A submit button">
+
+	<a href="#">An anchor</a>
+
+</div><!-- End demo -->
+
+
+
+<div class="demo-description">
+
+<p>Examples of the markup that can be used for buttons: A button element, an input of type submit and an anchor.</p>
+
+</div><!-- End demo-description -->
+
+
+
+</body>
+</html>
diff --git a/demos/button/icons.html b/demos/button/icons.html
@@ -0,0 +1,62 @@
+<!doctype html>
+<html lang="en">
+<head>
+	<title>jQuery UI Button - Icons demo</title>
+	<link type="text/css" href="../../themes/base/ui.all.css" rel="stylesheet" />
+	<script type="text/javascript" src="../../jquery-1.3.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.button.js"></script>
+	<link type="text/css" href="../demos.css" rel="stylesheet" />
+	<script type="text/javascript">
+	$(function() {
+		$("button:first").button({
+            icons: {
+                primary: 'ui-icon-locked'
+            },
+            text: false
+        }).next().button({
+            icons: {
+                primary: 'ui-icon-locked'
+            }
+        }).next().button({
+            icons: {
+                primary: 'ui-icon-gear',
+                secondary: 'ui-icon-triangle-1-s'
+            }
+        }).next().button({
+            icons: {
+                primary: 'ui-icon-gear',
+                secondary: 'ui-icon-triangle-1-s'
+            },
+            text: false
+        });
+	});
+	</script>
+	<style>
+
+	</style>
+</head>
+<body>
+
+<div class="demo">
+
+	<button>Button with icon only</button>
+	<button>Button with icon on the left</button>
+	<button>Button with two icons</button>
+	<button>Button with two icons and no text</button>
+
+</div><!-- End demo -->
+
+
+
+<div class="demo-description">
+
+<p>Some buttons with various combinations of text and icons, here specified via metadata.</p>
+
+</div><!-- End demo-description -->
+
+
+
+</body>
+</html>
diff --git a/demos/button/index.html b/demos/button/index.html
@@ -0,0 +1,22 @@
+<!doctype html>
+<html lang="en">
+<head>
+	<title>jQuery UI Button Demos</title>
+	<link type="text/css" href="../demos.css" rel="stylesheet" />
+</head>
+<body>
+
+<div class="demos-nav">
+	<h4>Examples</h4>
+	<ul>
+		<li class="demo-config-on"><a href="default.html">Default functionality</a></li>
+		<li><a href="radio.html">Radios</a></li>
+		<li><a href="checkbox.html">Checkboxes</a></li>
+		<li><a href="icons.html">Icons</a></li>
+		<li><a href="toolbar.html">Toolbar</a></li>
+		<li><a href="splitbutton.html">Split Button</a></li>
+	</ul>
+</div>
+
+</body>
+</html>
diff --git a/demos/button/radio.html b/demos/button/radio.html
@@ -0,0 +1,45 @@
+<!doctype html>
+<html lang="en">
+<head>
+	<title>jQuery UI Button - Radio Buttons demo</title>
+	<link type="text/css" href="../../themes/base/ui.all.css" rel="stylesheet" />
+	<script type="text/javascript" src="../../jquery-1.3.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.button.js"></script>
+	<link type="text/css" href="../demos.css" rel="stylesheet" />
+	<script type="text/javascript">
+	$(function() {
+		$("#radio1").buttonset();
+	});
+	</script>
+	<style>
+
+	</style>
+</head>
+<body>
+
+<div class="demo">
+
+	<form>
+		<div id="radio1">
+			<input type="radio" id="radio1" name="radio" /><label for="radio1">Choice 1</label>
+			<input type="radio" id="radio2" name="radio" checked="checked" /><label for="radio2">Choice 2</label>
+			<input type="radio" id="radio3" name="radio" /><label for="radio3">Choice 3</label>
+		</div>
+	</form>
+
+</div><!-- End demo -->
+
+
+
+<div class="demo-description">
+
+<p>A set of three radio buttons transformed into a button set.</p>
+
+</div><!-- End demo-description -->
+
+
+
+</body>
+</html>
diff --git a/demos/button/splitbutton.html b/demos/button/splitbutton.html
@@ -0,0 +1,57 @@
+<!doctype html>
+<html lang="en">
+<head>
+	<title>jQuery UI Button - Default demo</title>
+	<link type="text/css" href="../../themes/base/ui.all.css" rel="stylesheet" />
+	<script type="text/javascript" src="../../jquery-1.3.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.button.js"></script>
+	<link type="text/css" href="../demos.css" rel="stylesheet" />
+	<script type="text/javascript">
+	$(function() {
+		$("#rerun").button().click(function() {
+			alert("Running the last action");
+		})
+		.next()
+		.button({
+			text: false,
+			icons: {
+				primary: "ui-icon-triangle-1-s"
+			}
+		})
+		.click(function() {
+			alert("Could display a menu to select an action");
+		})
+		.parent()
+		.buttonset();
+	});
+	</script>
+	<style>
+
+	</style>
+</head>
+<body>
+
+<div class="demo">
+
+	<div>
+		<button id="rerun">Run last action</button>
+		<button id="select">Select an action</button>
+	</div>
+
+</div><!-- End demo -->
+
+
+
+<div class="demo-description">
+
+<p>An example of a split button built with two buttons: A plan button with just text, one with only a primary icon
+and no text. Both are grouped together in a set.</p>
+
+</div><!-- End demo-description -->
+
+
+
+</body>
+</html>