aboutsummaryrefslogtreecommitdiffstats
diff options
context:
space:
mode:
authorRafael Xavier de Souza <rxaviers@gmail.com>2014-06-24 21:50:13 -0700
committerRafael Xavier de Souza <rxaviers@gmail.com>2014-06-24 21:51:01 -0700
commitd877e1d088db43a2a7583bbb099519b5753b2456 (patch)
tree83a306505f7d69914cd6d6e9c37468640d1445e8
parente1b0a2777a0c1a12344e7cd1dd0d8be19f49b040 (diff)
downloadjquery-ui-spinner-globalize-1.x.tar.gz
jquery-ui-spinner-globalize-1.x.zip
Spinner: Update demos FIXMEspinner-globalize-1.x
-rw-r--r--bower.json36
-rw-r--r--demos/spinner/currency.html10
-rw-r--r--demos/spinner/decimal.html80
-rw-r--r--demos/spinner/default.html97
-rw-r--r--demos/spinner/latlong.html86
-rw-r--r--demos/spinner/overflow.html71
-rw-r--r--demos/spinner/time.html107
7 files changed, 316 insertions, 171 deletions
diff --git a/bower.json b/bower.json
index ef8f57736..34b2852d4 100644
--- a/bower.json
+++ b/bower.json
@@ -1,18 +1,22 @@
{
- "name": "jquery-ui",
- "ignore": [
- "**/.*",
- "build",
- "demos",
- "external",
- "tests"
- ],
- "dependencies": {
- "jquery": ">=1.6 <1.11"
- },
- "devDependencies": {
- "jquery-mousewheel": "3.1.11",
- "jshint": "2.4.4",
- "qunit": "1.14.0"
- }
+ "name": "jquery-ui",
+ "ignore": [
+ "**/.*",
+ "build",
+ "demos",
+ "external",
+ "tests"
+ ],
+ "dependencies": {
+ "jquery": ">1.6",
+ "requirejs": "~2.1.14",
+ "globalize": "1.x",
+ "requirejs-plugins": "~1.0.2",
+ "requirejs-text": "~2.0.12"
+ },
+ "devDependencies": {
+ "jquery-mousewheel": "3.1.11",
+ "jshint": "2.4.4",
+ "qunit": "1.14.0"
+ }
}
diff --git a/demos/spinner/currency.html b/demos/spinner/currency.html
index 19e0c2396..efd9edffd 100644
--- a/demos/spinner/currency.html
+++ b/demos/spinner/currency.html
@@ -4,15 +4,6 @@
<meta charset="utf-8">
<title>jQuery UI Spinner - Currency</title>
<link rel="stylesheet" href="../../themes/base/all.css">
- <script src="../../jquery.js"></script>
- <script src="../../external/jquery.mousewheel.js"></script>
- <script src="../../external/globalize.js"></script>
- <script src="../../external/globalize.culture.de-DE.js"></script>
- <script src="../../external/globalize.culture.ja-JP.js"></script>
- <script src="../../ui/core.js"></script>
- <script src="../../ui/widget.js"></script>
- <script src="../../ui/button.js"></script>
- <script src="../../ui/spinner.js"></script>
<link rel="stylesheet" href="../demos.css">
<script>
$(function() {
@@ -49,5 +40,6 @@
<div class="demo-description">
<p>Example of a donation form, with currency selection and amount spinner.</p>
</div>
+
</body>
</html>
diff --git a/demos/spinner/decimal.html b/demos/spinner/decimal.html
index 682e2f994..27fd9e7d9 100644
--- a/demos/spinner/decimal.html
+++ b/demos/spinner/decimal.html
@@ -4,30 +4,7 @@
<meta charset="utf-8">
<title>jQuery UI Spinner - Decimal</title>
<link rel="stylesheet" href="../../themes/base/all.css">
- <script src="../../jquery.js"></script>
- <script src="../../external/jquery.mousewheel.js"></script>
- <script src="../../external/globalize.js"></script>
- <script src="../../external/globalize.culture.de-DE.js"></script>
- <script src="../../external/globalize.culture.ja-JP.js"></script>
- <script src="../../ui/core.js"></script>
- <script src="../../ui/widget.js"></script>
- <script src="../../ui/button.js"></script>
- <script src="../../ui/spinner.js"></script>
<link rel="stylesheet" href="../demos.css">
- <script>
- $(function() {
- $( "#spinner" ).spinner({
- step: 0.01,
- numberFormat: "n"
- });
-
- $( "#culture" ).change(function() {
- var current = $( "#spinner" ).spinner( "value" );
- Globalize.culture( $(this).val() );
- $( "#spinner" ).spinner( "value", current );
- });
- });
- </script>
</head>
<body>
@@ -38,9 +15,9 @@
<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>
- <option value="ja-JP">Japanese</option>
+ <option value="en" selected="selected">English</option>
+ <option value="es">Spanish</option>
+ <option value="ar">Arabic</option>
</select>
</p>
@@ -52,5 +29,56 @@
formatting, based on the new culture.
</p>
</div>
+
+<script src="../../deleteme/requirejs/require.js"></script>
+<script>
+
+require.config({
+ paths: {
+ cldr: "../../deleteme/cldrjs/dist/cldr",
+ "cldr-data": "../../deleteme/cldr",
+ globalize: "../../deleteme/globalize/dist/globalize",
+ jquery: "../../deleteme/jquery/dist/jquery",
+ json: "../../deleteme/requirejs-plugins/src/json",
+ text: "../../deleteme/requirejs-text/text",
+ ui: "../../ui"
+ }
+});
+
+require([
+ "jquery",
+ "globalize",
+ "json!cldr-data/main/ar/numbers.json",
+ "json!cldr-data/main/en/numbers.json",
+ "json!cldr-data/main/es/numbers.json",
+ "json!cldr-data/supplemental/likelySubtags.json",
+ "globalize/number",
+ "ui/spinner"
+], function( $, Globalize, arNumbers, enNumbers, esNumbers, likelySubtags ) {
+
+ Globalize.load( arNumbers );
+ Globalize.load( enNumbers );
+ Globalize.load( esNumbers );
+ Globalize.load( likelySubtags );
+ Globalize.locale( "en" );
+
+ $( "#spinner" ).spinner({
+ step: 0.01,
+ numberFormat: {
+ maximumFractionDigits: 2,
+ minimumFractionDigits: 2
+ }
+ });
+
+ $( "#culture" ).change(function() {
+ var current = $( "#spinner" ).spinner( "value" );
+ Globalize.locale( $(this).val() );
+ $( "#spinner" ).spinner( "value", current );
+ });
+
+});
+
+</script>
+
</body>
</html>
diff --git a/demos/spinner/default.html b/demos/spinner/default.html
index a127374b2..941ae486f 100644
--- a/demos/spinner/default.html
+++ b/demos/spinner/default.html
@@ -4,41 +4,7 @@
<meta charset="utf-8">
<title>jQuery UI Spinner - Default functionality</title>
<link rel="stylesheet" href="../../themes/base/all.css">
- <script src="../../jquery.js"></script>
- <script src="../../external/jquery.mousewheel.js"></script>
- <script src="../../ui/core.js"></script>
- <script src="../../ui/widget.js"></script>
- <script src="../../ui/button.js"></script>
- <script src="../../ui/spinner.js"></script>
<link rel="stylesheet" href="../demos.css">
- <script>
- $(function() {
- var spinner = $( "#spinner" ).spinner();
-
- $( "#disable" ).click(function() {
- if ( spinner.spinner( "option", "disabled" ) ) {
- spinner.spinner( "enable" );
- } else {
- spinner.spinner( "disable" );
- }
- });
- $( "#destroy" ).click(function() {
- if ( spinner.spinner( "instance" ) ) {
- spinner.spinner( "destroy" );
- } else {
- spinner.spinner();
- }
- });
- $( "#getvalue" ).click(function() {
- alert( spinner.spinner( "value" ) );
- });
- $( "#setvalue" ).click(function() {
- spinner.spinner( "value", 5 );
- });
-
- $( "button" ).button();
- });
- </script>
</head>
<body>
@@ -60,5 +26,68 @@
<div class="demo-description">
<p>Default spinner.</p>
</div>
+
+<script src="../../deleteme/requirejs/require.js"></script>
+<script>
+
+require.config({
+ paths: {
+ cldr: "../../deleteme/cldrjs/dist/cldr",
+ "cldr-data": "../../deleteme/cldr",
+ globalize: "../../deleteme/globalize/dist/globalize",
+ jquery: "../../deleteme/jquery/dist/jquery",
+ "jquery-mousewheel": "../../deleteme/jquery-mousewheel/jquery.mousewheel",
+ json: "../../deleteme/requirejs-plugins/src/json",
+ text: "../../deleteme/requirejs-text/text",
+ ui: "../../ui"
+ }
+});
+
+require([
+ "jquery",
+ "globalize",
+ "json!cldr-data/main/ar/numbers.json",
+ "json!cldr-data/main/en/numbers.json",
+ "json!cldr-data/main/es/numbers.json",
+ "json!cldr-data/supplemental/likelySubtags.json",
+ "globalize/number",
+ "ui/spinner"
+], function( $, Globalize, arNumbers, enNumbers, esNumbers, likelySubtags ) {
+
+ Globalize.load( arNumbers );
+ Globalize.load( enNumbers );
+ Globalize.load( esNumbers );
+ Globalize.load( likelySubtags );
+ Globalize.locale( "en" );
+
+ var spinner = $( "#spinner" ).spinner();
+
+ $( "#disable" ).click(function() {
+ if ( spinner.spinner( "option", "disabled" ) ) {
+ spinner.spinner( "enable" );
+ } else {
+ spinner.spinner( "disable" );
+ }
+ });
+ $( "#destroy" ).click(function() {
+ if ( spinner.spinner( "instance" ) ) {
+ spinner.spinner( "destroy" );
+ } else {
+ spinner.spinner();
+ }
+ });
+ $( "#getvalue" ).click(function() {
+ alert( spinner.spinner( "value" ) );
+ });
+ $( "#setvalue" ).click(function() {
+ spinner.spinner( "value", 5 );
+ });
+
+ $( "button" ).button();
+
+});
+
+</script>
+
</body>
</html>
diff --git a/demos/spinner/latlong.html b/demos/spinner/latlong.html
index 432501c8b..015a362dc 100644
--- a/demos/spinner/latlong.html
+++ b/demos/spinner/latlong.html
@@ -5,34 +5,7 @@
<title>jQuery UI Spinner - Map</title>
<link rel="stylesheet" href="../../themes/base/all.css">
<script src="http://maps.google.com/maps/api/js?sensor=false"></script>
- <script src="../../jquery.js"></script>
- <script src="../../external/jquery.mousewheel.js"></script>
- <script src="../../ui/core.js"></script>
- <script src="../../ui/widget.js"></script>
- <script src="../../ui/button.js"></script>
- <script src="../../ui/spinner.js"></script>
<link rel="stylesheet" href="../demos.css">
- <script>
- $(function() {
- function latlong() {
- return new google.maps.LatLng( $("#lat").val(), $("#lng").val() );
- }
- function position() {
- map.setCenter( latlong() );
- }
- $( "#lat, #lng" ).spinner({
- step: .001,
- change: position,
- stop: position
- });
-
- var map = new google.maps.Map( $("#map")[0], {
- zoom: 8,
- center: latlong(),
- mapTypeId: google.maps.MapTypeId.ROADMAP
- });
- });
- </script>
<style>
#map {
width:500px;
@@ -53,5 +26,64 @@
<div class="demo-description">
<p>Google Maps integration, using spinners to change latitude and longitude.</p>
</div>
+
+<script src="../../deleteme/requirejs/require.js"></script>
+<script>
+
+require.config({
+ paths: {
+ cldr: "../../deleteme/cldrjs/dist/cldr",
+ "cldr-data": "../../deleteme/cldr",
+ globalize: "../../deleteme/globalize/dist/globalize",
+ jquery: "../../deleteme/jquery/dist/jquery",
+ "jquery-mousewheel": "../../deleteme/jquery-mousewheel/jquery.mousewheel",
+ json: "../../deleteme/requirejs-plugins/src/json",
+ text: "../../deleteme/requirejs-text/text",
+ ui: "../../ui"
+ }
+});
+
+require([
+ "jquery",
+ "globalize",
+ "json!cldr-data/main/ar/numbers.json",
+ "json!cldr-data/main/en/numbers.json",
+ "json!cldr-data/main/es/numbers.json",
+ "json!cldr-data/supplemental/likelySubtags.json",
+ "globalize/number",
+ "ui/spinner"
+], function( $, Globalize, arNumbers, enNumbers, esNumbers, likelySubtags ) {
+
+ Globalize.load( arNumbers );
+ Globalize.load( enNumbers );
+ Globalize.load( esNumbers );
+ Globalize.load( likelySubtags );
+ Globalize.locale( "en" );
+
+ function latlong() {
+ return new google.maps.LatLng( $("#lat").val(), $("#lng").val() );
+ }
+ function position() {
+ map.setCenter( latlong() );
+ }
+ $( "#lat, #lng" ).spinner({
+ step: .001,
+ change: position,
+ stop: position,
+ numberFormat: {
+ minimumFractionDigits: 3
+ }
+ });
+
+ var map = new google.maps.Map( $("#map")[0], {
+ zoom: 8,
+ center: latlong(),
+ mapTypeId: google.maps.MapTypeId.ROADMAP
+ });
+
+});
+
+</script>
+
</body>
</html>
diff --git a/demos/spinner/overflow.html b/demos/spinner/overflow.html
index 6ca14e7b6..e79881d5f 100644
--- a/demos/spinner/overflow.html
+++ b/demos/spinner/overflow.html
@@ -4,28 +4,7 @@
<meta charset="utf-8">
<title>jQuery UI Spinner - Overflow</title>
<link rel="stylesheet" href="../../themes/base/all.css">
- <script src="../../jquery.js"></script>
- <script src="../../external/jquery.mousewheel.js"></script>
- <script src="../../ui/core.js"></script>
- <script src="../../ui/widget.js"></script>
- <script src="../../ui/button.js"></script>
- <script src="../../ui/spinner.js"></script>
<link rel="stylesheet" href="../demos.css">
- <script>
- $(function() {
- $( "#spinner" ).spinner({
- spin: function( event, ui ) {
- if ( ui.value > 10 ) {
- $( this ).spinner( "value", -10 );
- return false;
- } else if ( ui.value < -10 ) {
- $( this ).spinner( "value", 10 );
- return false;
- }
- }
- });
- });
- </script>
</head>
<body>
@@ -40,5 +19,55 @@ Overflowing spinner restricted to a range of -10 to 10.
For anything above 10, it'll overflow to -10, and the other way round.
</p>
</div>
+
+<script src="../../deleteme/requirejs/require.js"></script>
+<script>
+
+require.config({
+ paths: {
+ cldr: "../../deleteme/cldrjs/dist/cldr",
+ "cldr-data": "../../deleteme/cldr",
+ globalize: "../../deleteme/globalize/dist/globalize",
+ jquery: "../../deleteme/jquery/dist/jquery",
+ "jquery-mousewheel": "../../deleteme/jquery-mousewheel/jquery.mousewheel",
+ json: "../../deleteme/requirejs-plugins/src/json",
+ text: "../../deleteme/requirejs-text/text",
+ ui: "../../ui"
+ }
+});
+
+require([
+ "jquery",
+ "globalize",
+ "json!cldr-data/main/ar/numbers.json",
+ "json!cldr-data/main/en/numbers.json",
+ "json!cldr-data/main/es/numbers.json",
+ "json!cldr-data/supplemental/likelySubtags.json",
+ "globalize/number",
+ "ui/spinner"
+], function( $, Globalize, arNumbers, enNumbers, esNumbers, likelySubtags ) {
+
+ Globalize.load( arNumbers );
+ Globalize.load( enNumbers );
+ Globalize.load( esNumbers );
+ Globalize.load( likelySubtags );
+ Globalize.locale( "en" );
+
+ $( "#spinner" ).spinner({
+ spin: function( event, ui ) {
+ if ( ui.value > 10 ) {
+ $( this ).spinner( "value", -10 );
+ return false;
+ } else if ( ui.value < -10 ) {
+ $( this ).spinner( "value", 10 );
+ return false;
+ }
+ }
+ });
+
+});
+
+</script>
+
</body>
</html>
diff --git a/demos/spinner/time.html b/demos/spinner/time.html
index e1235e914..87db07e38 100644
--- a/demos/spinner/time.html
+++ b/demos/spinner/time.html
@@ -4,16 +4,68 @@
<meta charset="utf-8">
<title>jQuery UI Spinner - Time</title>
<link rel="stylesheet" href="../../themes/base/all.css">
- <script src="../../jquery.js"></script>
- <script src="../../external/jquery.mousewheel.js"></script>
- <script src="../../external/globalize.js"></script>
- <script src="../../external/globalize.culture.de-DE.js"></script>
- <script src="../../ui/core.js"></script>
- <script src="../../ui/widget.js"></script>
- <script src="../../ui/button.js"></script>
- <script src="../../ui/spinner.js"></script>
<link rel="stylesheet" href="../demos.css">
<script>
+ </script>
+</head>
+<body>
+
+<p>
+ <label for="spinner">Time spinner:</label>
+ <input id="spinner" name="spinner" value="08:30 PM">
+</p>
+<p>
+ <label for="locale">Select a locale to use for formatting:</label>
+ <select id="locale">
+ <option value="en" selected="selected">English</option>
+ <option value="de">German</option>
+ </select>
+</p>
+
+<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>
+
+<script src="../../deleteme/requirejs/require.js"></script>
+<script>
+
+require.config({
+ paths: {
+ cldr: "../../deleteme/cldrjs/dist/cldr",
+ "cldr-data": "../../deleteme/cldr",
+ globalize: "../../deleteme/globalize/dist/globalize",
+ jquery: "../../deleteme/jquery/dist/jquery",
+ "jquery-mousewheel": "../../deleteme/jquery-mousewheel/jquery.mousewheel",
+ json: "../../deleteme/requirejs-plugins/src/json",
+ text: "../../deleteme/requirejs-text/text",
+ ui: "../../ui"
+ }
+});
+
+require([
+ "jquery",
+ "globalize",
+ "json!cldr-data/main/de/ca-gregorian.json",
+ "json!cldr-data/main/de/numbers.json",
+ "json!cldr-data/main/en/ca-gregorian.json",
+ "json!cldr-data/main/en/numbers.json",
+ "json!cldr-data/supplemental/likelySubtags.json",
+ "globalize/date",
+ "globalize/number",
+ "ui/spinner"
+], function( $, Globalize, deCaGregorian, deNumbers, enCaGregorian, enNumbers, likelySubtags ) {
+
+ Globalize.load( deCaGregorian );
+ Globalize.load( deNumbers );
+ Globalize.load( enCaGregorian );
+ Globalize.load( enNumbers );
+ Globalize.load( likelySubtags );
+ Globalize.locale( "en" );
+
$.widget( "ui.timespinner", $.ui.spinner, {
options: {
// seconds
@@ -28,47 +80,26 @@
if ( Number( value ) == value ) {
return Number( value );
}
- return +Globalize.parseDate( value );
+ return Globalize.parseDate( value, { time: "short" } ).getTime();
}
return value;
},
_format: function( value ) {
- return Globalize.format( new Date(value), "t" );
+ return Globalize.formatDate( new Date( value ), { time: "short" } );
}
});
- $(function() {
- $( "#spinner" ).timespinner();
+ $( "#spinner" ).timespinner();
- $( "#culture" ).change(function() {
- var current = $( "#spinner" ).timespinner( "value" );
- Globalize.culture( $(this).val() );
- $( "#spinner" ).timespinner( "value", current );
- });
+ $( "#locale" ).change(function() {
+ var current = $( "#spinner" ).timespinner( "value" );
+ Globalize.locale( $(this).val() );
+ $( "#spinner" ).timespinner( "value", current );
});
- </script>
-</head>
-<body>
+});
-<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>
+</script>
-<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>
</body>
</html>