]> source.dussan.org Git - jquery-ui.git/commitdiff
Slider & Interactions: Add Windows 8 touch support
authorTJ VanToll <tj.vantoll@gmail.com>
Fri, 13 Dec 2013 03:10:06 +0000 (22:10 -0500)
committerTJ VanToll <tj.vantoll@gmail.com>
Wed, 15 Jan 2014 20:38:10 +0000 (15:38 -0500)
Fixes #9709
Fixes #9710
Closes gh-1152

tests/unit/draggable/draggable_core.js
tests/unit/sortable/sortable_core.js
themes/base/jquery.ui.base.css
themes/base/jquery.ui.draggable.css [new file with mode: 0644]
themes/base/jquery.ui.resizable.css
themes/base/jquery.ui.selectable.css
themes/base/jquery.ui.slider.css
themes/base/jquery.ui.sortable.css [new file with mode: 0644]
ui/jquery.ui.draggable.js
ui/jquery.ui.sortable.js

index c9cdde2606bd56a9d89ec7f2b793461e93d6757b..7df0969b1a584d644184a0d3f0cb6bd3066878d8 100644 (file)
@@ -273,4 +273,18 @@ asyncTest( "#4261: active element should blur when mousing down on a draggable",
        });
 });
 
+test( "ui-draggable-handle assigned to appropriate element", function() {
+       expect( 4 );
+
+       var element = $( "<div><p></p></div>" ).appendTo( "#qunit-fixture" ).draggable();
+       ok( element.hasClass( "ui-draggable-handle" ), "handle is element by default" );
+
+       element.draggable( "option", "handle", "p" );
+       ok( !element.hasClass( "ui-draggable-handle" ), "removed from element" );
+       ok( element.find( "p" ).hasClass( "ui-draggable-handle" ), "added to handle" );
+
+       element.draggable( "destroy" );
+       ok( !element.find( "p" ).hasClass( "ui-draggable-handle" ), "removed in destroy()" );
+});
+
 })( jQuery );
index 18e7dae0864f12610848870dbcab416631539673..54069a9bfbdaa21a2e4279c3e234da5a914aa0f3 100644 (file)
@@ -16,4 +16,25 @@ test( "#9314: Sortable: Items cannot be dragged directly into bottom position",
        TestHelpers.sortable.sort( $( "li", el[ 1 ] )[ 0 ], 0, -12, 5, "Dragging the sortable into connected sortable" );
 });
 
+test( "ui-sortable-handle applied to appropriate element", function() {
+       expect( 6 );
+       var item = "<li><p></p></li>",
+               el = $( "<ul>" + item + item + "</ul>" )
+                       .sortable()
+                       .appendTo( "#qunit-fixture" );
+
+       ok( el.find( "li:first" ).hasClass( "ui-sortable-handle" ), "defaults to item" );
+       ok( el.find( "li:last" ).hasClass( "ui-sortable-handle" ), "both items received class name" );
+
+       el.sortable( "option", "handle", "p" );
+       ok( !el.find( "li" ).hasClass( "ui-sortable-handle" ), "removed on change" );
+       ok( el.find( "p" ).hasClass( "ui-sortable-handle" ), "applied to handle" );
+
+       el.append( item ).sortable( "refresh" );
+       ok( el.find( "p:last" ).hasClass( "ui-sortable-handle" ), "class name applied on refresh" );
+
+       el.sortable( "destroy" );
+       equal( el.find( ".ui-sortable-handle" ).length, 0, "class name removed on destroy" );
+});
+
 })( jQuery );
index aefa81de41444372195f35bcd25c51daf814aa05..8ff61a51189db2bb0a53a10f58cfe455d8ba3a73 100644 (file)
 @import url("jquery.ui.button.css");
 @import url("jquery.ui.datepicker.css");
 @import url("jquery.ui.dialog.css");
+@import url("jquery.ui.draggable.css");
 @import url("jquery.ui.menu.css");
 @import url("jquery.ui.progressbar.css");
 @import url("jquery.ui.resizable.css");
 @import url("jquery.ui.selectable.css");
 @import url("jquery.ui.selectmenu.css");
+@import url("jquery.ui.sortable.css");
 @import url("jquery.ui.slider.css");
 @import url("jquery.ui.spinner.css");
 @import url("jquery.ui.tabs.css");
diff --git a/themes/base/jquery.ui.draggable.css b/themes/base/jquery.ui.draggable.css
new file mode 100644 (file)
index 0000000..707134e
--- /dev/null
@@ -0,0 +1,12 @@
+/*!
+ * jQuery UI Draggable @VERSION
+ * http://jqueryui.com
+ *
+ * Copyright 2013 jQuery Foundation and other contributors
+ * Released under the MIT license.
+ * http://jquery.org/license
+ */
+.ui-draggable-handle {
+       -ms-touch-action: none;
+       touch-action: none;
+}
index f0f8c474de042f6006a0f4c5bfa62b51c61126b9..23ec832ebf139387b8e192f3f6125f1e5a0590d8 100644 (file)
@@ -13,6 +13,8 @@
        position: absolute;
        font-size: 0.1px;
        display: block;
+       -ms-touch-action: none;
+       touch-action: none;
 }
 .ui-resizable-disabled .ui-resizable-handle,
 .ui-resizable-autohide .ui-resizable-handle {
index d44ad46cf65fc4496743d15226ff1f2535a5a414..4fae8d149b9c2a0cf5d1957fda7a2484fa14857b 100644 (file)
@@ -6,6 +6,10 @@
  * Released under the MIT license.
  * http://jquery.org/license
  */
+.ui-selectable {
+       -ms-touch-action: none;
+       touch-action: none;
+}
 .ui-selectable-helper {
        position: absolute;
        z-index: 100;
index b6b68b8b0e83bdbcc88e2bc27d3c4c459d07da57..91bc1a048fadbcd0798948e9547aa934b24e928e 100644 (file)
@@ -18,6 +18,8 @@
        width: 1.2em;
        height: 1.2em;
        cursor: default;
+       -ms-touch-action: none;
+       touch-action: none;
 }
 .ui-slider .ui-slider-range {
        position: absolute;
diff --git a/themes/base/jquery.ui.sortable.css b/themes/base/jquery.ui.sortable.css
new file mode 100644 (file)
index 0000000..139c705
--- /dev/null
@@ -0,0 +1,12 @@
+/*!
+ * jQuery UI Sortable @VERSION
+ * http://jqueryui.com
+ *
+ * Copyright 2013 jQuery Foundation and other contributors
+ * Released under the MIT license.
+ * http://jquery.org/license
+ */
+.ui-sortable-handle {
+       -ms-touch-action: none;
+       touch-action: none;
+}
index f18b383d39dc39289a03b28c58bb962bd465e853..5cbe92fced7eef39c7f36d65def3222b6070154d 100644 (file)
@@ -60,9 +60,16 @@ $.widget("ui.draggable", $.ui.mouse, {
                if (this.options.disabled){
                        this.element.addClass("ui-draggable-disabled");
                }
+               this._setHandleClassName();
 
                this._mouseInit();
+       },
 
+       _setOption: function( key, value ) {
+               this._super( key, value );
+               if ( key === "handle" ) {
+                       this._setHandleClassName();
+               }
        },
 
        _destroy: function() {
@@ -71,6 +78,7 @@ $.widget("ui.draggable", $.ui.mouse, {
                        return;
                }
                this.element.removeClass( "ui-draggable ui-draggable-dragging ui-draggable-disabled" );
+               this._removeHandleClassName();
                this._mouseDestroy();
        },
 
@@ -296,6 +304,17 @@ $.widget("ui.draggable", $.ui.mouse, {
                        true;
        },
 
+       _setHandleClassName: function() {
+               this._removeHandleClassName();
+               $( this.options.handle || this.element ).addClass( "ui-draggable-handle" );
+       },
+
+       _removeHandleClassName: function() {
+               this.element.find( ".ui-draggable-handle" )
+                       .addBack()
+                       .removeClass( "ui-draggable-handle" );
+       },
+
        _createHelper: function(event) {
 
                var o = this.options,
index 29c25f390175caccb465a457d8aa7679a9851fa7..01e644f44ec12486053a892131911523abcff560 100644 (file)
@@ -84,14 +84,35 @@ $.widget("ui.sortable", $.ui.mouse, {
                //Initialize mouse events for interaction
                this._mouseInit();
 
+               this._setHandleClassName();
+
                //We're ready to go
                this.ready = true;
 
        },
 
+       _setOption: function( key, value ) {
+               this._super( key, value );
+
+               if ( key === "handle" ) {
+                       this._setHandleClassName();
+               }
+       },
+
+       _setHandleClassName: function() {
+               this.element.find( ".ui-sortable-handle" ).removeClass( "ui-sortable-handle" );
+               $.each( this.items, function() {
+                       ( this.instance.options.handle ?
+                               this.item.find( this.instance.options.handle ) : this.item )
+                               .addClass( "ui-sortable-handle" );
+               });
+       },
+
        _destroy: function() {
                this.element
-                       .removeClass("ui-sortable ui-sortable-disabled");
+                       .removeClass( "ui-sortable ui-sortable-disabled" )
+                       .find( ".ui-sortable-handle" )
+                               .removeClass( "ui-sortable-handle" );
                this._mouseDestroy();
 
                for ( var i = this.items.length - 1; i >= 0; i-- ) {
@@ -598,6 +619,7 @@ $.widget("ui.sortable", $.ui.mouse, {
 
        refresh: function(event) {
                this._refreshItems(event);
+               this._setHandleClassName();
                this.refreshPositions();
                return this;
        },