mirror of
https://github.com/photonstorm/phaser
synced 2024-11-22 20:53:39 +00:00
Added Touch support. Doesn't handle multi-touch yet, but single touch works perfectly with all current input tests.
This commit is contained in:
parent
7cc5a61d50
commit
9e10fca98d
5 changed files with 159 additions and 1 deletions
|
@ -58,6 +58,9 @@ var Config = new Class({
|
|||
this.inputMouse = GetValue(config, 'input.mouse', true);
|
||||
this.inputMouseEventTarget = GetValue(config, 'input.mouse.target', null);
|
||||
|
||||
this.inputTouch = GetValue(config, 'input.touch', true);
|
||||
this.inputTouchEventTarget = GetValue(config, 'input.touch.target', null);
|
||||
|
||||
this.disableContextMenu = GetValue(config, 'disableContextMenu', false);
|
||||
|
||||
// If you do: { banner: false } it won't display any banner at all
|
||||
|
|
|
@ -1,4 +1,4 @@
|
|||
var CHECKSUM = {
|
||||
build: 'fe5bfd50-7332-11e7-902d-a936c8f38615'
|
||||
build: 'f30debd0-733b-11e7-b23c-ef3e3e85b72b'
|
||||
};
|
||||
module.exports = CHECKSUM;
|
|
@ -73,6 +73,18 @@ var Pointer = new Class({
|
|||
this.justMoved = false;
|
||||
},
|
||||
|
||||
touchmove: function (event, time)
|
||||
{
|
||||
this.event = event;
|
||||
|
||||
this.x = this.manager.transformX(event.changedTouches[0].pageX);
|
||||
this.y = this.manager.transformY(event.changedTouches[0].pageY);
|
||||
|
||||
this.justMoved = true;
|
||||
|
||||
this.dirty = true;
|
||||
},
|
||||
|
||||
move: function (event, time)
|
||||
{
|
||||
if (event.buttons)
|
||||
|
@ -117,6 +129,26 @@ var Pointer = new Class({
|
|||
this.dirty = true;
|
||||
},
|
||||
|
||||
touchstart: function (event, time)
|
||||
{
|
||||
this.buttons = 1;
|
||||
|
||||
this.event = event;
|
||||
|
||||
this.x = this.manager.transformX(event.changedTouches[0].pageX);
|
||||
this.y = this.manager.transformY(event.changedTouches[0].pageY);
|
||||
|
||||
this.primaryDown = true;
|
||||
this.downX = this.x;
|
||||
this.downY = this.y;
|
||||
this.downTime = time;
|
||||
|
||||
this.justDown = true;
|
||||
this.isDown = true;
|
||||
|
||||
this.dirty = true;
|
||||
},
|
||||
|
||||
up: function (event, time)
|
||||
{
|
||||
if (event.buttons)
|
||||
|
@ -144,6 +176,26 @@ var Pointer = new Class({
|
|||
this.dirty = true;
|
||||
},
|
||||
|
||||
touchend: function (event, time)
|
||||
{
|
||||
this.buttons = 0;
|
||||
|
||||
this.event = event;
|
||||
|
||||
this.x = this.manager.transformX(event.changedTouches[0].pageX);
|
||||
this.y = this.manager.transformY(event.changedTouches[0].pageY);
|
||||
|
||||
this.primaryDown = false;
|
||||
this.upX = this.x;
|
||||
this.upY = this.y;
|
||||
this.upTime = time;
|
||||
|
||||
this.justUp = true;
|
||||
this.isDown = false;
|
||||
|
||||
this.dirty = true;
|
||||
},
|
||||
|
||||
noButtonDown: function ()
|
||||
{
|
||||
return (this.buttons === 0);
|
||||
|
|
|
@ -6,6 +6,7 @@ var GetTransformedPoint = require('./components/GetTransformedPoint');
|
|||
var Keyboard = require('../keyboard/KeyboardManager');
|
||||
var Mouse = require('../mouse/MouseManager');
|
||||
var MouseEvent = require('../mouse/events/');
|
||||
var Touch = require('../touch/TouchManager');
|
||||
var Pointer = require('../Pointer');
|
||||
var PointScreenToWorldHitTest = require('./components/PointScreenToWorldHitTest');
|
||||
var HitTest = require('./components/HitTest');
|
||||
|
@ -34,6 +35,7 @@ var GlobalInputManager = new Class({
|
|||
// Listeners
|
||||
this.keyboard = new Keyboard(this);
|
||||
this.mouse = new Mouse(this);
|
||||
this.touch = new Touch(this);
|
||||
|
||||
this.activePointer = new Pointer(this, 0);
|
||||
|
||||
|
@ -57,6 +59,7 @@ var GlobalInputManager = new Class({
|
|||
|
||||
this.keyboard.boot();
|
||||
this.mouse.boot();
|
||||
this.touch.boot();
|
||||
},
|
||||
|
||||
update: function (time, delta)
|
||||
|
@ -108,6 +111,21 @@ var GlobalInputManager = new Class({
|
|||
pointer.up(event, time);
|
||||
this.events.dispatch(new MouseEvent.UP(event));
|
||||
break;
|
||||
|
||||
case 'touchmove':
|
||||
|
||||
pointer.touchmove(event, time);
|
||||
break;
|
||||
|
||||
case 'touchstart':
|
||||
|
||||
pointer.touchstart(event, time);
|
||||
break;
|
||||
|
||||
case 'touchend':
|
||||
|
||||
pointer.touchend(event, time);
|
||||
break;
|
||||
}
|
||||
}
|
||||
},
|
||||
|
|
85
v3/src/input/touch/TouchManager.js
Normal file
85
v3/src/input/touch/TouchManager.js
Normal file
|
@ -0,0 +1,85 @@
|
|||
var Class = require('../../utils/Class');
|
||||
|
||||
// https://developer.mozilla.org/en-US/docs/Web/API/Touch_events
|
||||
// https://patrickhlauke.github.io/touch/tests/results/
|
||||
// https://www.html5rocks.com/en/mobile/touch/
|
||||
|
||||
var TouchManager = new Class({
|
||||
|
||||
initialize:
|
||||
|
||||
function TouchManager (inputManager)
|
||||
{
|
||||
this.manager = inputManager;
|
||||
|
||||
/**
|
||||
* @property {boolean} capture - If true the DOM events will have event.preventDefault applied to them, if false they will propagate fully.
|
||||
*/
|
||||
this.capture = false;
|
||||
|
||||
this.enabled = false;
|
||||
|
||||
this.target;
|
||||
|
||||
this.handler;
|
||||
},
|
||||
|
||||
boot: function ()
|
||||
{
|
||||
var config = this.manager.config;
|
||||
|
||||
this.enabled = config.inputTouch;
|
||||
this.target = config.inputTouchEventTarget;
|
||||
|
||||
if (!this.target)
|
||||
{
|
||||
this.target = this.manager.game.canvas;
|
||||
}
|
||||
|
||||
if (this.enabled)
|
||||
{
|
||||
this.startListeners();
|
||||
}
|
||||
},
|
||||
|
||||
startListeners: function ()
|
||||
{
|
||||
var queue = this.manager.queue;
|
||||
|
||||
var _this = this;
|
||||
|
||||
var handler = function (event)
|
||||
{
|
||||
if (event.preventDefaulted)
|
||||
{
|
||||
// Do nothing if event already handled
|
||||
return;
|
||||
}
|
||||
|
||||
// console.log(event);
|
||||
|
||||
queue.push(event);
|
||||
|
||||
if (_this.capture)
|
||||
{
|
||||
event.preventDefault();
|
||||
}
|
||||
};
|
||||
|
||||
this.handler = handler;
|
||||
|
||||
this.target.addEventListener('touchstart', handler, false);
|
||||
this.target.addEventListener('touchmove', handler, false);
|
||||
this.target.addEventListener('touchend', handler, false);
|
||||
},
|
||||
|
||||
stopListeners: function ()
|
||||
{
|
||||
this.target.removeEventListener('touchstart', this.handler);
|
||||
this.target.removeEventListener('touchmove', this.handler);
|
||||
this.target.removeEventListener('touchend', this.handler);
|
||||
}
|
||||
|
||||
});
|
||||
|
||||
module.exports = TouchManager;
|
Loading…
Reference in a new issue