ui.mouse: Updated iPhone support to git HEAD. Partial fix for #4143 - Land iPhone support for all interactions

cscott · cscott · commit 3744712e1327 · 2010-07-08T12:50:29.000-04:00
Updated existing patch for #4143 to git HEAD (ui.mouse refactoring)
diff --git a/ui/jquery.ui.droppable.js b/ui/jquery.ui.droppable.js
@@ -215,7 +215,7 @@ $.ui.ddmanager = {
 			m[i].offset = m[i].element.offset();
 			m[i].proportions = { width: m[i].element[0].offsetWidth, height: m[i].element[0].offsetHeight };
 
-			if(type == "mousedown") m[i]._activate.call(m[i], event); //Activate the droppable if used directly from draggables
+			if(type == t._eventNames.start) m[i]._activate.call(m[i], event); //Activate the droppable if used directly from draggables
 
 		}
 
diff --git a/ui/jquery.ui.mouse.js b/ui/jquery.ui.mouse.js
@@ -12,18 +12,47 @@
  */
 (function($) {
 
+var iPhone = navigator.userAgent.indexOf('iPhone') != -1;
+
 $.widget("ui.mouse", {
 	options: {
 		cancel: ':input,option',
 		distance: 1,
 		delay: 0
 	},
+
+	_eventNames: {
+		start: 'mousedown',
+		drag: 'mousemove',
+		stop: 'mouseup'
+	},
+
+	_iPhoneEvent: function(event) {
+
+		if(event.type == 'touchend' && this._mouseStarted)
+			event = this._prevEvent;
+
+		var t = event.originalEvent.touches;
+		return !iPhone || (t.length == 1 ? (this._prevEvent = $.extend(event, {
+				target: t[0].target,
+				pageX: t[0].pageX,
+				pageY: t[0].pageY
+			})) : false);
+
+	},
+
 	_mouseInit: function() {
 		var self = this;
 
+		iPhone && (this._eventNames = {
+			start: 'touchstart',
+			drag: 'touchmove',
+			stop: 'touchend'
+		});
+
 		this.element
-			.bind('mousedown.'+this.widgetName, function(event) {
-				return self._mouseDown(event);
+			.bind(this._eventNames.start+'.'+this.widgetName, function(event) {
+				return self._iPhoneEvent(event) && self._mouseDown(event);
 			})
 			.bind('click.'+this.widgetName, function(event) {
 				if(self._preventClickEvent) {
@@ -54,7 +83,7 @@ $.widget("ui.mouse", {
 		this._mouseDownEvent = event;
 
 		var self = this,
-			btnIsLeft = (event.which == 1),
+			btnIsLeft = (event.which == 1 || iPhone),
 			elIsCancel = (typeof this.options.cancel == "string" ? $(event.target).parents().add(event.target).filter(this.options.cancel).length : false);
 		if (!btnIsLeft || elIsCancel || !this._mouseCapture(event)) {
 			return true;
@@ -77,19 +106,19 @@ $.widget("ui.mouse", {
 
 		// these delegates are required to keep context
 		this._mouseMoveDelegate = function(event) {
-			return self._mouseMove(event);
+			return self._iPhoneEvent(event) && self._mouseMove(event);
 		};
 		this._mouseUpDelegate = function(event) {
-			return self._mouseUp(event);
+			return self._iPhoneEvent(event) && self._mouseUp(event);
 		};
 		$(document)
-			.bind('mousemove.'+this.widgetName, this._mouseMoveDelegate)
-			.bind('mouseup.'+this.widgetName, this._mouseUpDelegate);
+			.bind(this._eventNames.drag+'.'+this.widgetName, this._mouseMoveDelegate)
+			.bind(this._eventNames.stop+'.'+this.widgetName, this._mouseUpDelegate);
 
 		// preventDefault() is used to prevent the selection of text here -
 		// however, in Safari, this causes select boxes not to be selectable
 		// anymore, so this fix is needed
-		($.browser.safari || event.preventDefault());
+		(($.browser.safari && !iPhone) || event.preventDefault());
 
 		event.originalEvent.mouseHandled = true;
 		return true;
@@ -117,8 +146,8 @@ $.widget("ui.mouse", {
 
 	_mouseUp: function(event) {
 		$(document)
-			.unbind('mousemove.'+this.widgetName, this._mouseMoveDelegate)
-			.unbind('mouseup.'+this.widgetName, this._mouseUpDelegate);
+			.unbind(this._eventNames.drag+'.'+this.widgetName, this._mouseMoveDelegate)
+			.unbind(this._eventNames.stop+'.'+this.widgetName, this._mouseUpDelegate);
 
 		if (this._mouseStarted) {
 			this._mouseStarted = false;

Original file line number	Diff line number	Diff line change
`@@ -215,7 +215,7 @@ $.ui.ddmanager = {`
`215`	`215`	`m[i].offset = m[i].element.offset();`
`216`	`216`	`m[i].proportions = { width: m[i].element[0].offsetWidth, height: m[i].element[0].offsetHeight };`
`217`	`217`
`218`		`- if(type == "mousedown") m[i]._activate.call(m[i], event); //Activate the droppable if used directly from draggables`
	`218`	`+ if(type == t._eventNames.start) m[i]._activate.call(m[i], event); //Activate the droppable if used directly from draggables`
`219`	`219`
`220`	`220`	`}`
`221`	`221`