summaryrefslogtreecommitdiff
path: root/src/main/webapp/jquery-ui-1.9pre/demos/spinner/time.html
diff options
context:
space:
mode:
authorLeif Johansson <leifj@sunet.se>2011-11-25 21:18:19 +0100
committerLeif Johansson <leifj@sunet.se>2011-11-25 21:18:19 +0100
commit3909e6d89e01e4cd8777377c63037896bb95aa2f (patch)
tree59679df287c2bee55087fb5afb8d42e7f93a44fb /src/main/webapp/jquery-ui-1.9pre/demos/spinner/time.html
parente5f94e9be5017f627c1ccd8c6306c5cc2e200432 (diff)
new jq layout
Diffstat (limited to 'src/main/webapp/jquery-ui-1.9pre/demos/spinner/time.html')
-rw-r--r--src/main/webapp/jquery-ui-1.9pre/demos/spinner/time.html79
1 files changed, 79 insertions, 0 deletions
diff --git a/src/main/webapp/jquery-ui-1.9pre/demos/spinner/time.html b/src/main/webapp/jquery-ui-1.9pre/demos/spinner/time.html
new file mode 100644
index 0000000..4c83844
--- /dev/null
+++ b/src/main/webapp/jquery-ui-1.9pre/demos/spinner/time.html
@@ -0,0 +1,79 @@
+<!doctype html>
+<html lang="en">
+<head>
+ <meta charset="utf-8">
+ <title>jQuery UI Spinner - Time</title>
+ <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css">
+ <script src="../../jquery-1.7.1.js"></script>
+ <script src="../../external/jquery.mousewheel-3.0.4.js"></script>
+ <script src="../../external/globalize.js"></script>
+ <script src="../../external/globalize.culture.de-DE.js"></script>
+ <script src="../../ui/jquery.ui.core.js"></script>
+ <script src="../../ui/jquery.ui.widget.js"></script>
+ <script src="../../ui/jquery.ui.button.js"></script>
+ <script src="../../ui/jquery.ui.spinner.js"></script>
+ <link rel="stylesheet" href="../demos.css">
+ <script>
+ $.widget( "ui.timespinner", $.ui.spinner, {
+ options: {
+ // seconds
+ step: 60 * 1000,
+ // hours
+ page: 60
+ },
+
+ _parse: function( value ) {
+ if ( typeof value === "string" ) {
+ // already a timestamp
+ if ( Number( value ) == value ) {
+ return Number( value );
+ }
+ return +Globalize.parseDate( value );
+ }
+ return value;
+ },
+
+ _format: function( value ) {
+ return Globalize.format( new Date(value), "t" );
+ }
+ });
+
+ $(function() {
+ $( "#spinner" ).timespinner();
+
+ $( "#culture" ).change(function() {
+ var current = $( "#spinner" ).timespinner( "value" );
+ Globalize.culture( $(this).val() );
+ $( "#spinner" ).timespinner( "value", current );
+ });
+ });
+ </script>
+</head>
+<body>
+
+<div class="demo">
+<p>
+ <label for="spinner">Time spinner:</label>
+ <input id="spinner" name="spinner" value="08:30 PM">
+</p>
+<p>
+ <label for="culture">Select a culture to use for formatting:</label>
+ <select id="culture">
+ <option value="en-EN" selected="selected">English</option>
+ <option value="de-DE">German</option>
+ </select>
+</p>
+</div><!-- End demo -->
+
+
+
+<div class="demo-description">
+<p>
+ A custom widget extending spinner. Use the Globalization plugin to parse and output
+ a timestamp, with custom step and page options. Cursor up/down spins minutes, page up/down
+ spins hours.
+</p>
+</div><!-- End demo-description -->
+
+</body>
+</html>