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

demos/sortable/connect-lists.html
demos/sortable/default.html
demos/sortable/display-grid.html
demos/sortable/empty-lists.html
demos/sortable/items.html
demos/sortable/placeholder.html
demos/sortable/portlets.html

index 834cb560ad33aaa986cb0b43cfe54ee0085c90bf..4461e736433826ade8984d596a7e04fcf32d253c 100644 (file)
@@ -4,11 +4,6 @@
        <meta charset="utf-8">
        <title>jQuery UI Sortable - Connect lists</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/sortable.js"></script>
        <link rel="stylesheet" href="../demos.css">
        <style>
        #sortable1, #sortable2 {
                width: 120px;
        }
        </style>
-       <script>
-       $(function() {
+       <script src="../../external/requirejs/require.js"></script>
+       <script src="../bootstrap.js">
                $( "#sortable1, #sortable2" ).sortable({
                        connectWith: ".connectedSortable"
                }).disableSelection();
-       });
        </script>
 </head>
 <body>
index 6d3e742dbd48d165ccc0cb718725613df7a1400e..ff24e239c4c369109b3f65fb76b8244d101fe53e 100644 (file)
@@ -4,19 +4,14 @@
        <meta charset="utf-8">
        <title>jQuery UI Sortable - 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/sortable.js"></script>
        <link rel="stylesheet" href="../demos.css">
        <style>
        #sortable { list-style-type: none; margin: 0; padding: 0; width: 60%; }
        #sortable li { margin: 0 3px 3px 3px; padding: 0.4em; padding-left: 1.5em; font-size: 1.4em; height: 18px; }
        #sortable li span { position: absolute; margin-left: -1.3em; }
        </style>
-       <script>
-       $(function() {
+       <script src="../../external/requirejs/require.js"></script>
+       <script src="../bootstrap.js">
                $( "#sortable" ).sortable();
                $( "#sortable" ).disableSelection();
        });
index 3e8e5be751a32f584353a7eb707914fb240c76d5..8f0f6ae357ff74893031bf3a591b71750dc36b76 100644 (file)
@@ -4,21 +4,15 @@
        <meta charset="utf-8">
        <title>jQuery UI Sortable - Display as grid</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/sortable.js"></script>
        <link rel="stylesheet" href="../demos.css">
        <style>
        #sortable { list-style-type: none; margin: 0; padding: 0; width: 450px; }
        #sortable li { margin: 3px 3px 3px 0; padding: 1px; float: left; width: 100px; height: 90px; font-size: 4em; text-align: center; }
        </style>
-       <script>
-       $(function() {
+       <script src="../../external/requirejs/require.js"></script>
+       <script src="../bootstrap.js">
                $( "#sortable" ).sortable();
                $( "#sortable" ).disableSelection();
-       });
        </script>
 </head>
 <body>
index 1925446195a9df32018642b5c1f357fc1fc11c62..fa515b3778c0d53c270fe70b33cdab397aabcb22 100644 (file)
@@ -4,18 +4,13 @@
        <meta charset="utf-8">
        <title>jQuery UI Sortable - Handle empty lists</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/sortable.js"></script>
        <link rel="stylesheet" href="../demos.css">
        <style>
        #sortable1, #sortable2, #sortable3 { list-style-type: none; margin: 0; float: left; margin-right: 10px; background: #eee; padding: 5px; width: 143px;}
        #sortable1 li, #sortable2 li, #sortable3 li { margin: 5px; padding: 5px; font-size: 1.2em; width: 120px; }
        </style>
-       <script>
-       $(function() {
+       <script src="../../external/requirejs/require.js"></script>
+       <script src="../bootstrap.js">
                $( "ul.droptrue" ).sortable({
                        connectWith: "ul"
                });
@@ -26,7 +21,6 @@
                });
 
                $( "#sortable1, #sortable2, #sortable3" ).disableSelection();
-       });
        </script>
 </head>
 <body>
index b6ed392358f2c934a4b44541347ecdd28000cdd3..21a7230d51a9c1f74243d8f4aeb79b38dd71b35a 100644 (file)
@@ -4,18 +4,13 @@
        <meta charset="utf-8">
        <title>jQuery UI Sortable - Include / exclude items</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/sortable.js"></script>
        <link rel="stylesheet" href="../demos.css">
        <style>
        #sortable1, #sortable2 { list-style-type: none; margin: 0; padding: 0; zoom: 1; }
        #sortable1 li, #sortable2 li { margin: 0 5px 5px 5px; padding: 3px; width: 90%; }
        </style>
-       <script>
-       $(function() {
+       <script src="../../external/requirejs/require.js"></script>
+       <script src="../bootstrap.js">
                $( "#sortable1" ).sortable({
                        items: "li:not(.ui-state-disabled)"
                });
@@ -25,7 +20,6 @@
                });
 
                $( "#sortable1 li, #sortable2 li" ).disableSelection();
-       });
        </script>
 </head>
 <body>
index c925b77adc553d83088e662f7369d736f7c03446..7a17e6914406ae06aaa733423a409e112aea8f76 100644 (file)
@@ -4,11 +4,6 @@
        <meta charset="utf-8">
        <title>jQuery UI Sortable - Drop placeholder</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/sortable.js"></script>
        <link rel="stylesheet" href="../demos.css">
        <style>
        #sortable { list-style-type: none; margin: 0; padding: 0; width: 60%; }
        html>body #sortable li { height: 1.5em; line-height: 1.2em; }
        .ui-state-highlight { height: 1.5em; line-height: 1.2em; }
        </style>
-       <script>
-       $(function() {
+       <script src="../../external/requirejs/require.js"></script>
+       <script src="../bootstrap.js">
                $( "#sortable" ).sortable({
                        placeholder: "ui-state-highlight"
                });
                $( "#sortable" ).disableSelection();
-       });
        </script>
 </head>
 <body>
index 42ddb4444f8bc64eaa81b4142560bd4ba74cb97b..a3f42a254273a2b9efd25931d9dff4ef5608798a 100644 (file)
@@ -4,11 +4,6 @@
        <meta charset="utf-8">
        <title>jQuery UI Sortable - Portlets</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/sortable.js"></script>
        <link rel="stylesheet" href="../demos.css">
        <style>
        body {
@@ -43,8 +38,8 @@
                height: 50px;
        }
        </style>
-       <script>
-       $(function() {
+       <script src="../../external/requirejs/require.js"></script>
+       <script src="../bootstrap.js">
                $( ".column" ).sortable({
                        connectWith: ".column",
                        handle: ".portlet-header",
@@ -63,7 +58,6 @@
                        icon.toggleClass( "ui-icon-minusthick ui-icon-plusthick" );
                        icon.closest( ".portlet" ).find( ".portlet-content" ).toggle();
                });
-       });
        </script>
 </head>
 <body>