Skip to content

U
uni-app

wzj-java / uni-app
与 Fork 源项目一致

Fork自 DCloud / uni-app

通知 1
Star 1
Fork 0
U
uni-app

前往新版Gitcode，体验更适合开发者的 AI 搜索 >>

提交 b660c94e 编写于 作者: fxy060608's avatar fxy060608
浏览文件
操作

fix(h5): remove touch emulator

上级 25bba0c9
隐藏空白更改
内联 并排
Showing with 1 addition and 373 deletion
packages/vue-cli-plugin-uni/lib/h5/index.js
浏览文件 @ b660c94e
......@@ -106,7 +106,6 @@ module.exports = {
const qihooCode = process.env.UNI_SUB_PLATFORM === 'mp-360'
? `
import 'uni-touch-emulator';
import qh from 'uni-qh';
global.qh = qh;
global.onAppShow = function(){};
......@@ -119,8 +118,7 @@ global.onAppShow = function(){};
alias: {
'vue-router': resolve('packages/h5-vue-router'),
'uni-h5': require.resolve('@dcloudio/uni-h5'),
'uni-qh': path.resolve(__dirname, 'qh-api.js'),
'uni-touch-emulator': path.resolve(__dirname, 'touch-emulator.js')
'uni-qh': path.resolve(__dirname, 'qh-api.js')
}
},
module: {
......
packages/vue-cli-plugin-uni/lib/h5/touch-emulator.js 已删除 100644 → 0
浏览文件 @ 25bba0c9
(function (window, document, exportName, undefined) {
'use strict'
var isMultiTouch = false
var multiTouchStartPos
var eventTarget
var touchElements = {}
// polyfills
if (!document.createTouch) {
document.createTouch = function (view, target, identifier, pageX, pageY, screenX, screenY, clientX, clientY) {
// auto set
if (clientX == undefined || clientY == undefined) {
clientX = pageX - window.pageXOffset
clientY = pageY - window.pageYOffset
}
return new Touch(target, identifier, {
pageX: pageX,
pageY: pageY,
screenX: screenX,
screenY: screenY,
clientX: clientX,
clientY: clientY
})
}
}
if (!document.createTouchList) {
document.createTouchList = function () {
var touchList = new TouchList()
for (var i = 0; i < arguments.length; i++) {
touchList[i] = arguments[i]
}
touchList.length = arguments.length
return touchList
}
}
/**
* create an touch point
* @constructor
* @param target
* @param identifier
* @param pos
* @param deltaX
* @param deltaY
* @returns {Object} touchPoint
*/
function Touch (target, identifier, pos, deltaX, deltaY) {
deltaX = deltaX || 0
deltaY = deltaY || 0
this.identifier = identifier
this.target = target
this.clientX = pos.clientX + deltaX
this.clientY = pos.clientY + deltaY
this.screenX = pos.screenX + deltaX
this.screenY = pos.screenY + deltaY
this.pageX = pos.pageX + deltaX
this.pageY = pos.pageY + deltaY
}
/**
* create empty touchlist with the methods
* @constructor
* @returns touchList
*/
function TouchList () {
var touchList = []
touchList.item = function (index) {
return this[index] || null
}
// specified by Mozilla
touchList.identifiedTouch = function (id) {
return this[id + 1] || null
}
return touchList
}
/**
* Simple trick to fake touch event support
* this is enough for most libraries like Modernizr and Hammer
*/
function fakeTouchSupport () {
var objs = [window, document.documentElement]
var props = ['ontouchstart', 'ontouchmove', 'ontouchcancel', 'ontouchend']
for (var o = 0; o < objs.length; o++) {
for (var p = 0; p < props.length; p++) {
if (objs[o] && objs[o][props[p]] == undefined) {
objs[o][props[p]] = null
}
}
}
}
/**
* we don't have to emulate on a touch device
* @returns {boolean}
*/
function hasTouchSupport () {
return ('ontouchstart' in window) || // touch events
(window.Modernizr && window.Modernizr.touch) || // modernizr
(navigator.msMaxTouchPoints || navigator.maxTouchPoints) > 2 // pointer events
}
/**
* disable mouseevents on the page
* @param ev
*/
function preventMouseEvents (ev) {
ev.preventDefault()
ev.stopPropagation()
}
/**
* only trigger touches when the left mousebutton has been pressed
* @param touchType
* @returns {Function}
*/
function onMouse (touchType) {
return function (ev) {
// prevent mouse events
// 过滤 输入框 和 可编辑元素
// preventMouseEvents(ev);
ev.stopPropagation()
var computedStyle
var target = ev.target
if (target.tagName !== 'INPUT' && target.tagName !== 'TEXTAREA' && (computedStyle = window.getComputedStyle(target)) && (computedStyle['user-modify'] || computedStyle['-webkit-user-modify']).indexOf('write') < 0) {
ev.preventDefault()
}
if (ev.which !== 1) {
return
}
// The EventTarget on which the touch point started when it was first placed on the surface,
// even if the touch point has since moved outside the interactive area of that element.
// also, when the target doesnt exist anymore, we update it
if (ev.type == 'mousedown' || !eventTarget || (eventTarget && !eventTarget.dispatchEvent)) {
eventTarget = ev.target
}
// shiftKey has been lost, so trigger a touchend
if (isMultiTouch && !ev.shiftKey) {
triggerTouch('touchend', ev)
isMultiTouch = false
}
triggerTouch(touchType, ev)
// we're entering the multi-touch mode!
if (!isMultiTouch && ev.shiftKey) {
isMultiTouch = true
multiTouchStartPos = {
pageX: ev.pageX,
pageY: ev.pageY,
clientX: ev.clientX,
clientY: ev.clientY,
screenX: ev.screenX,
screenY: ev.screenY
}
triggerTouch('touchstart', ev)
}
// reset
if (ev.type == 'mouseup') {
multiTouchStartPos = null
isMultiTouch = false
eventTarget = null
}
}
}
/**
* trigger a touch event
* @param eventName
* @param mouseEv
*/
function triggerTouch (eventName, mouseEv) {
var touchEvent = document.createEvent('Event')
touchEvent.initEvent(eventName, true, true)
touchEvent.altKey = mouseEv.altKey
touchEvent.ctrlKey = mouseEv.ctrlKey
touchEvent.metaKey = mouseEv.metaKey
touchEvent.shiftKey = mouseEv.shiftKey
touchEvent.touches = getActiveTouches(mouseEv, eventName)
touchEvent.targetTouches = getActiveTouches(mouseEv, eventName)
touchEvent.changedTouches = getChangedTouches(mouseEv, eventName)
eventTarget.dispatchEvent(touchEvent)
}
/**
* create a touchList based on the mouse event
* @param mouseEv
* @returns {TouchList}
*/
function createTouchList (mouseEv) {
var touchList = new TouchList()
if (isMultiTouch) {
var f = TouchEmulator.multiTouchOffset
var deltaX = multiTouchStartPos.pageX - mouseEv.pageX
var deltaY = multiTouchStartPos.pageY - mouseEv.pageY
touchList.push(new Touch(eventTarget, 1, multiTouchStartPos, (deltaX * -1) - f, (deltaY * -1) + f))
touchList.push(new Touch(eventTarget, 2, multiTouchStartPos, deltaX + f, deltaY - f))
} else {
touchList.push(new Touch(eventTarget, 1, mouseEv, 0, 0))
}
return touchList
}
/**
* receive all active touches
* @param mouseEv
* @returns {TouchList}
*/
function getActiveTouches (mouseEv, eventName) {
// empty list
if (mouseEv.type == 'mouseup') {
return new TouchList()
}
var touchList = createTouchList(mouseEv)
if (isMultiTouch && mouseEv.type != 'mouseup' && eventName == 'touchend') {
touchList.splice(1, 1)
}
return touchList
}
/**
* receive a filtered set of touches with only the changed pointers
* @param mouseEv
* @param eventName
* @returns {TouchList}
*/
function getChangedTouches (mouseEv, eventName) {
var touchList = createTouchList(mouseEv)
// we only want to return the added/removed item on multitouch
// which is the second pointer, so remove the first pointer from the touchList
//
// but when the mouseEv.type is mouseup, we want to send all touches because then
// no new input will be possible
if (isMultiTouch && mouseEv.type != 'mouseup' &&
(eventName == 'touchstart' || eventName == 'touchend')) {
touchList.splice(0, 1)
}
return touchList
}
/**
* show the touchpoints on the screen
*/
function showTouches (ev) {
var touch, i, el, styles
// first all visible touches
for (i = 0; i < ev.touches.length; i++) {
touch = ev.touches[i]
el = touchElements[touch.identifier]
if (!el) {
el = touchElements[touch.identifier] = document.createElement('div')
document.body.appendChild(el)
}
styles = TouchEmulator.template(touch)
for (var prop in styles) {
el.style[prop] = styles[prop]
}
}
// remove all ended touches
if (ev.type == 'touchend' || ev.type == 'touchcancel') {
for (i = 0; i < ev.changedTouches.length; i++) {
touch = ev.changedTouches[i]
el = touchElements[touch.identifier]
if (el) {
el.parentNode.removeChild(el)
delete touchElements[touch.identifier]
}
}
}
}
/**
* TouchEmulator initializer
*/
function TouchEmulator () {
if (hasTouchSupport()) {
return
}
fakeTouchSupport()
window.addEventListener('mousedown', onMouse('touchstart'), true)
window.addEventListener('mousemove', onMouse('touchmove'), true)
window.addEventListener('mouseup', onMouse('touchend'), true)
window.addEventListener('mouseenter', preventMouseEvents, true)
window.addEventListener('mouseleave', preventMouseEvents, true)
window.addEventListener('mouseout', preventMouseEvents, true)
window.addEventListener('mouseover', preventMouseEvents, true)
// it uses itself!
// 关闭触摸显示
// window.addEventListener("touchstart", showTouches, false);
// window.addEventListener("touchmove", showTouches, false);
// window.addEventListener("touchend", showTouches, false);
// window.addEventListener("touchcancel", showTouches, false);
}
// start distance when entering the multitouch mode
TouchEmulator.multiTouchOffset = 75
/**
* css template for the touch rendering
* @param touch
* @returns object
*/
TouchEmulator.template = function (touch) {
var size = 30
var transform = 'translate(' + (touch.clientX - (size / 2)) + 'px, ' + (touch.clientY - (size / 2)) + 'px)'
return {
position: 'fixed',
left: 0,
top: 0,
background: '#fff',
border: 'solid 1px #999',
opacity: 0.6,
borderRadius: '100%',
height: size + 'px',
width: size + 'px',
padding: 0,
margin: 0,
display: 'block',
overflow: 'hidden',
pointerEvents: 'none',
webkitUserSelect: 'none',
mozUserSelect: 'none',
userSelect: 'none',
webkitTransform: transform,
mozTransform: transform,
transform: transform
}
}
// export
// 直接启用
// if (typeof define == "function" && define.amd) {
// define(function() {
// return TouchEmulator;
// });
// } else if (typeof module != "undefined" && module.exports) {
// module.exports = TouchEmulator;
// } else {
// window[exportName] = TouchEmulator;
// }
TouchEmulator()
})(window, document, 'TouchEmulator')
Markdown is supported
0% 或 .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑！
想要评论请 注册 或