]> source.dussan.org Git - jquery-ui.git/commitdiff
Slider: Update demos to use AMD
authorAlexander Schmitz <arschmitz@gmail.com>
Wed, 1 Jul 2015 02:58:43 +0000 (22:58 -0400)
committerAlexander Schmitz <arschmitz@gmail.com>
Tue, 21 Jul 2015 15:00:42 +0000 (11:00 -0400)
Ref #10119

demos/slider/colorpicker.html
demos/slider/default.html
demos/slider/hotelrooms.html
demos/slider/multiple-vertical.html
demos/slider/range-vertical.html
demos/slider/range.html
demos/slider/rangemax.html
demos/slider/rangemin.html
demos/slider/slider-vertical.html
demos/slider/steps.html

index 6f438a2e5f90e6d5a85a9a5a53c7f795a667d517..32ea4f89e1f9169d904e61084af65df18f7278da 100644 (file)
@@ -4,11 +4,6 @@
        <meta charset="utf-8">
        <title>jQuery UI Slider - Colorpicker</title>
        <link rel="stylesheet" href="../../themes/base/all.css">
-       <script src="../../external/jquery/jquery.js"></script>
-       <script src="../../ui/core.js"></script>
-       <script src="../../ui/widget.js"></script>
-       <script src="../../ui/mouse.js"></script>
-       <script src="../../ui/slider.js"></script>
        <link rel="stylesheet" href="../demos.css">
        <style>
        #red, #green, #blue {
        #blue .ui-slider-range { background: #729fcf; }
        #blue .ui-slider-handle { border-color: #729fcf; }
        </style>
-       <script>
-       function hexFromRGB(r, g, b) {
-               var hex = [
-                       r.toString( 16 ),
-                       g.toString( 16 ),
-                       b.toString( 16 )
-               ];
-               $.each( hex, function( nr, val ) {
-                       if ( val.length === 1 ) {
-                               hex[ nr ] = "0" + val;
-                       }
-               });
-               return hex.join( "" ).toUpperCase();
-       }
-       function refreshSwatch() {
-               var red = $( "#red" ).slider( "value" ),
-                       green = $( "#green" ).slider( "value" ),
-                       blue = $( "#blue" ).slider( "value" ),
-                       hex = hexFromRGB( red, green, blue );
-               $( "#swatch" ).css( "background-color", "#" + hex );
-       }
-       $(function() {
+       <script src="../../external/requirejs/require.js"></script>
+       <script src="../bootstrap.js">
+               function hexFromRGB(r, g, b) {
+                       var hex = [
+                               r.toString( 16 ),
+                               g.toString( 16 ),
+                               b.toString( 16 )
+                       ];
+                       $.each( hex, function( nr, val ) {
+                               if ( val.length === 1 ) {
+                                       hex[ nr ] = "0" + val;
+                               }
+                       });
+                       return hex.join( "" ).toUpperCase();
+               }
+               function refreshSwatch() {
+                       var red = $( "#red" ).slider( "value" ),
+                               green = $( "#green" ).slider( "value" ),
+                               blue = $( "#blue" ).slider( "value" ),
+                               hex = hexFromRGB( red, green, blue );
+                       $( "#swatch" ).css( "background-color", "#" + hex );
+               }
+
                $( "#red, #green, #blue" ).slider({
                        orientation: "horizontal",
                        range: "min",
@@ -64,7 +60,6 @@
                $( "#red" ).slider( "value", 255 );
                $( "#green" ).slider( "value", 140 );
                $( "#blue" ).slider( "value", 60 );
-       });
        </script>
 </head>
 <body class="ui-widget-content" style="border:0;">
index 141fec23dfb2c7ec9d9076deb3979b355571101e..9fcd6d07d3df1a8c8eba08e117f7180ab2e11979 100644 (file)
@@ -4,16 +4,10 @@
        <meta charset="utf-8" >
        <title>jQuery UI Slider - Default functionality</title>
        <link rel="stylesheet" href="../../themes/base/all.css">
-       <script src="../../external/jquery/jquery.js"></script>
-       <script src="../../ui/core.js"></script>
-       <script src="../../ui/widget.js"></script>
-       <script src="../../ui/mouse.js"></script>
-       <script src="../../ui/slider.js"></script>
        <link rel="stylesheet" href="../demos.css">
-       <script>
-       $(function() {
+       <script src="../../external/requirejs/require.js"></script>
+       <script src="../bootstrap.js">
                $( "#slider" ).slider();
-       });
        </script>
 </head>
 <body>
index 0268d1dc0db6de50936d7ad0225f5515793bf8d3..05d16aa528cbee8e8c790772e06bf3225e2fb1be 100644 (file)
@@ -4,14 +4,9 @@
        <meta charset="utf-8">
        <title>jQuery UI Slider - Slider bound to select</title>
        <link rel="stylesheet" href="../../themes/base/all.css">
-       <script src="../../external/jquery/jquery.js"></script>
-       <script src="../../ui/core.js"></script>
-       <script src="../../ui/widget.js"></script>
-       <script src="../../ui/mouse.js"></script>
-       <script src="../../ui/slider.js"></script>
        <link rel="stylesheet" href="../demos.css">
-       <script>
-       $(function() {
+       <script src="../../external/requirejs/require.js"></script>
+       <script src="../bootstrap.js">
                var select = $( "#minbeds" );
                var slider = $( "<div id='slider'></div>" ).insertAfter( select ).slider({
                        min: 1,
@@ -25,7 +20,6 @@
                $( "#minbeds" ).on( "change", function() {
                        slider.slider( "value", this.selectedIndex + 1 );
                });
-       });
        </script>
 </head>
 <body>
index 5f23a2dd241aae89694f699c1852567c4614dc3a..97e2349d1814ac9810c457f6c52d3568cec9b229 100644 (file)
@@ -15,8 +15,8 @@
                height:120px; float:left; margin:15px
        }
        </style>
-       <script>
-       $(function() {
+       <script src="../../external/requirejs/require.js"></script>
+       <script src="../bootstrap.js">
                // setup master volume
                $( "#master" ).slider({
                        value: 60,
@@ -35,7 +35,6 @@
                                orientation: "vertical"
                        });
                });
-       });
        </script>
 </head>
 <body>
index a29737b90035d3ff42a5a5ec8cd85118916887ff..bed2e8cb2a9fa0c4106cbe4762613b1433304cc7 100644 (file)
@@ -4,14 +4,9 @@
        <meta charset="utf-8">
        <title>jQuery UI Slider - Vertical range slider</title>
        <link rel="stylesheet" href="../../themes/base/all.css">
-       <script src="../../external/jquery/jquery.js"></script>
-       <script src="../../ui/core.js"></script>
-       <script src="../../ui/widget.js"></script>
-       <script src="../../ui/mouse.js"></script>
-       <script src="../../ui/slider.js"></script>
        <link rel="stylesheet" href="../demos.css">
-       <script>
-       $(function() {
+       <script src="../../external/requirejs/require.js"></script>
+       <script src="../bootstrap.js">
                $( "#slider-range" ).slider({
                        orientation: "vertical",
                        range: true,
@@ -22,7 +17,6 @@
                });
                $( "#amount" ).val( "$" + $( "#slider-range" ).slider( "values", 0 ) +
                        " - $" + $( "#slider-range" ).slider( "values", 1 ) );
-       });
        </script>
 </head>
 <body>
index a923a6d1593eb3c2b21de7ff40661ed010410ba2..a660fee553cd52f911e5bb6e5dfd1607f54b8f35 100644 (file)
@@ -4,14 +4,9 @@
        <meta charset="utf-8">
        <title>jQuery UI Slider - Range slider</title>
        <link rel="stylesheet" href="../../themes/base/all.css">
-       <script src="../../external/jquery/jquery.js"></script>
-       <script src="../../ui/core.js"></script>
-       <script src="../../ui/widget.js"></script>
-       <script src="../../ui/mouse.js"></script>
-       <script src="../../ui/slider.js"></script>
        <link rel="stylesheet" href="../demos.css">
-       <script>
-       $(function() {
+       <script src="../../external/requirejs/require.js"></script>
+       <script src="../bootstrap.js">
                $( "#slider-range" ).slider({
                        range: true,
                        min: 0,
@@ -23,7 +18,6 @@
                });
                $( "#amount" ).val( "$" + $( "#slider-range" ).slider( "values", 0 ) +
                        " - $" + $( "#slider-range" ).slider( "values", 1 ) );
-       });
        </script>
 </head>
 <body>
index b96346b6fc7a7e59cac6e921c0caddc1606f1412..38bcf401631004b3beacbdd23e530cf6225533c5 100644 (file)
@@ -4,14 +4,9 @@
        <meta charset="utf-8">
        <title>jQuery UI Slider - Range with fixed maximum</title>
        <link rel="stylesheet" href="../../themes/base/all.css">
-       <script src="../../external/jquery/jquery.js"></script>
-       <script src="../../ui/core.js"></script>
-       <script src="../../ui/widget.js"></script>
-       <script src="../../ui/mouse.js"></script>
-       <script src="../../ui/slider.js"></script>
        <link rel="stylesheet" href="../demos.css">
-       <script>
-       $(function() {
+       <script src="../../external/requirejs/require.js"></script>
+       <script src="../bootstrap.js">
                $( "#slider-range-max" ).slider({
                        range: "max",
                        min: 1,
@@ -22,7 +17,6 @@
                        }
                });
                $( "#amount" ).val( $( "#slider-range-max" ).slider( "value" ) );
-       });
        </script>
 </head>
 <body>
index a3d1b0628e7315b5916b6653ff8fae456ae1adfa..1105ff71e049302e384a032fd47f41b5bdc4855c 100644 (file)
@@ -4,14 +4,9 @@
        <meta charset="utf-8">
        <title>jQuery UI Slider - Range with fixed minimum</title>
        <link rel="stylesheet" href="../../themes/base/all.css">
-       <script src="../../external/jquery/jquery.js"></script>
-       <script src="../../ui/core.js"></script>
-       <script src="../../ui/widget.js"></script>
-       <script src="../../ui/mouse.js"></script>
-       <script src="../../ui/slider.js"></script>
        <link rel="stylesheet" href="../demos.css">
-       <script>
-       $(function() {
+       <script src="../../external/requirejs/require.js"></script>
+       <script src="../bootstrap.js">
                $( "#slider-range-min" ).slider({
                        range: "min",
                        value: 37,
@@ -22,7 +17,6 @@
                        }
                });
                $( "#amount" ).val( "$" + $( "#slider-range-min" ).slider( "value" ) );
-       });
        </script>
 </head>
 <body>
index 0a5ecd97d6e40f97b4d2f68aa223e921badea819..f59f08a300cca160bf28ca48c622b8985a323bcd 100644 (file)
@@ -4,14 +4,9 @@
        <meta charset="utf-8">
        <title>jQuery UI Slider - Vertical slider</title>
        <link rel="stylesheet" href="../../themes/base/all.css">
-       <script src="../../external/jquery/jquery.js"></script>
-       <script src="../../ui/core.js"></script>
-       <script src="../../ui/widget.js"></script>
-       <script src="../../ui/mouse.js"></script>
-       <script src="../../ui/slider.js"></script>
        <link rel="stylesheet" href="../demos.css">
-       <script>
-       $(function() {
+       <script src="../../external/requirejs/require.js"></script>
+       <script src="../bootstrap.js">
                $( "#slider-vertical" ).slider({
                        orientation: "vertical",
                        range: "min",
@@ -23,7 +18,6 @@
                        }
                });
                $( "#amount" ).val( $( "#slider-vertical" ).slider( "value" ) );
-       });
        </script>
 </head>
 <body>
index 9b8ca2add6ec107a6dc7939bf21c8bd0f22b1307..deb05bbc07700835928abe486fddecbe1db8efda 100644 (file)
@@ -4,14 +4,9 @@
        <meta charset="utf-8">
        <title>jQuery UI Slider - Snap to increments</title>
        <link rel="stylesheet" href="../../themes/base/all.css">
-       <script src="../../external/jquery/jquery.js"></script>
-       <script src="../../ui/core.js"></script>
-       <script src="../../ui/widget.js"></script>
-       <script src="../../ui/mouse.js"></script>
-       <script src="../../ui/slider.js"></script>
        <link rel="stylesheet" href="../demos.css">
-       <script>
-       $(function() {
+       <script src="../../external/requirejs/require.js"></script>
+       <script src="../bootstrap.js">
                $( "#slider" ).slider({
                        value:100,
                        min: 0,
@@ -22,7 +17,6 @@
                        }
                });
                $( "#amount" ).val( "$" + $( "#slider" ).slider( "value" ) );
-       });
        </script>
 </head>
 <body>