|
|
@ -1,10 +1,12 @@ |
|
|
|
// FINGERBLAST.js
|
|
|
|
// FINGERBLAST.js
|
|
|
|
// --------------
|
|
|
|
// --------------
|
|
|
|
// Adapted from phantom limb by brian cartensen
|
|
|
|
// Adapted from phantom limb by Brian Cartensen
|
|
|
|
|
|
|
|
|
|
|
|
/* global GLOBAL: true */ |
|
|
|
/* global GLOBAL: true */ |
|
|
|
|
|
|
|
|
|
|
|
function FingerBlast(element) { |
|
|
|
function FingerBlast(element) { |
|
|
|
|
|
|
|
'use strict'; |
|
|
|
|
|
|
|
|
|
|
|
this.element = typeof element === 'string' ? document.querySelector(element) : element; |
|
|
|
this.element = typeof element === 'string' ? document.querySelector(element) : element; |
|
|
|
this.listen(); |
|
|
|
this.listen(); |
|
|
|
} |
|
|
|
} |
|
|
@ -19,6 +21,7 @@ FingerBlast.prototype = { |
|
|
|
mouseIsDown: false, |
|
|
|
mouseIsDown: false, |
|
|
|
|
|
|
|
|
|
|
|
listen: function () { |
|
|
|
listen: function () { |
|
|
|
|
|
|
|
'use strict'; |
|
|
|
|
|
|
|
|
|
|
|
var activate = this.activate.bind(this); |
|
|
|
var activate = this.activate.bind(this); |
|
|
|
var deactivate = this.deactivate.bind(this); |
|
|
|
var deactivate = this.deactivate.bind(this); |
|
|
@ -49,6 +52,8 @@ FingerBlast.prototype = { |
|
|
|
}, |
|
|
|
}, |
|
|
|
|
|
|
|
|
|
|
|
activate: function () { |
|
|
|
activate: function () { |
|
|
|
|
|
|
|
'use strict'; |
|
|
|
|
|
|
|
|
|
|
|
if (this.active) return; |
|
|
|
if (this.active) return; |
|
|
|
this.element.addEventListener('mousedown', (this.touchStart = this.touchStart.bind(this)), true); |
|
|
|
this.element.addEventListener('mousedown', (this.touchStart = this.touchStart.bind(this)), true); |
|
|
|
this.element.addEventListener('mousemove', (this.touchMove = this.touchMove.bind(this)), true); |
|
|
|
this.element.addEventListener('mousemove', (this.touchMove = this.touchMove.bind(this)), true); |
|
|
@ -58,6 +63,8 @@ FingerBlast.prototype = { |
|
|
|
}, |
|
|
|
}, |
|
|
|
|
|
|
|
|
|
|
|
deactivate: function (e) { |
|
|
|
deactivate: function (e) { |
|
|
|
|
|
|
|
'use strict'; |
|
|
|
|
|
|
|
|
|
|
|
this.active = false; |
|
|
|
this.active = false; |
|
|
|
if (this.mouseIsDown) this.touchEnd(e); |
|
|
|
if (this.mouseIsDown) this.touchEnd(e); |
|
|
|
this.element.removeEventListener('mousedown', this.touchStart, true); |
|
|
|
this.element.removeEventListener('mousedown', this.touchStart, true); |
|
|
@ -67,12 +74,16 @@ FingerBlast.prototype = { |
|
|
|
}, |
|
|
|
}, |
|
|
|
|
|
|
|
|
|
|
|
click: function (e) { |
|
|
|
click: function (e) { |
|
|
|
|
|
|
|
'use strict'; |
|
|
|
|
|
|
|
|
|
|
|
if (e.synthetic) return; |
|
|
|
if (e.synthetic) return; |
|
|
|
e.preventDefault(); |
|
|
|
e.preventDefault(); |
|
|
|
e.stopPropagation(); |
|
|
|
e.stopPropagation(); |
|
|
|
}, |
|
|
|
}, |
|
|
|
|
|
|
|
|
|
|
|
touchStart: function (e) { |
|
|
|
touchStart: function (e) { |
|
|
|
|
|
|
|
'use strict'; |
|
|
|
|
|
|
|
|
|
|
|
if (e.synthetic || /input|textarea/.test(e.target.tagName.toLowerCase())) return; |
|
|
|
if (e.synthetic || /input|textarea/.test(e.target.tagName.toLowerCase())) return; |
|
|
|
|
|
|
|
|
|
|
|
this.mouseIsDown = true; |
|
|
|
this.mouseIsDown = true; |
|
|
@ -84,6 +95,8 @@ FingerBlast.prototype = { |
|
|
|
}, |
|
|
|
}, |
|
|
|
|
|
|
|
|
|
|
|
touchMove: function (e) { |
|
|
|
touchMove: function (e) { |
|
|
|
|
|
|
|
'use strict'; |
|
|
|
|
|
|
|
|
|
|
|
if (e.synthetic) return; |
|
|
|
if (e.synthetic) return; |
|
|
|
|
|
|
|
|
|
|
|
e.preventDefault(); |
|
|
|
e.preventDefault(); |
|
|
@ -95,6 +108,8 @@ FingerBlast.prototype = { |
|
|
|
}, |
|
|
|
}, |
|
|
|
|
|
|
|
|
|
|
|
touchEnd: function (e) { |
|
|
|
touchEnd: function (e) { |
|
|
|
|
|
|
|
'use strict'; |
|
|
|
|
|
|
|
|
|
|
|
if (e.synthetic) return; |
|
|
|
if (e.synthetic) return; |
|
|
|
|
|
|
|
|
|
|
|
this.mouseIsDown = false; |
|
|
|
this.mouseIsDown = false; |
|
|
@ -113,6 +128,8 @@ FingerBlast.prototype = { |
|
|
|
}, |
|
|
|
}, |
|
|
|
|
|
|
|
|
|
|
|
fireTouchEvents: function (eventName, originalEvent) { |
|
|
|
fireTouchEvents: function (eventName, originalEvent) { |
|
|
|
|
|
|
|
'use strict'; |
|
|
|
|
|
|
|
|
|
|
|
var events = []; |
|
|
|
var events = []; |
|
|
|
var gestures = []; |
|
|
|
var gestures = []; |
|
|
|
|
|
|
|
|
|
|
@ -191,6 +208,8 @@ FingerBlast.prototype = { |
|
|
|
}, |
|
|
|
}, |
|
|
|
|
|
|
|
|
|
|
|
createMouseEvent: function (eventName, originalEvent) { |
|
|
|
createMouseEvent: function (eventName, originalEvent) { |
|
|
|
|
|
|
|
'use strict'; |
|
|
|
|
|
|
|
|
|
|
|
var e = document.createEvent('MouseEvent'); |
|
|
|
var e = document.createEvent('MouseEvent'); |
|
|
|
|
|
|
|
|
|
|
|
e.initMouseEvent(eventName, true, true, |
|
|
|
e.initMouseEvent(eventName, true, true, |
|
|
@ -209,6 +228,8 @@ FingerBlast.prototype = { |
|
|
|
}, |
|
|
|
}, |
|
|
|
|
|
|
|
|
|
|
|
move: function (x, y) { |
|
|
|
move: function (x, y) { |
|
|
|
|
|
|
|
'use strict'; |
|
|
|
|
|
|
|
|
|
|
|
if (isNaN(x) || isNaN(y)) { |
|
|
|
if (isNaN(x) || isNaN(y)) { |
|
|
|
this.target = null; |
|
|
|
this.target = null; |
|
|
|
} else { |
|
|
|
} else { |
|
|
|