您需要先安装一个扩展,例如 篡改猴、Greasemonkey 或 暴力猴,之后才能安装此脚本。
您需要先安装一个扩展,例如 篡改猴 或 暴力猴,之后才能安装此脚本。
您需要先安装一个扩展,例如 篡改猴 或 暴力猴,之后才能安装此脚本。
您需要先安装一个扩展,例如 篡改猴 或 Userscripts ,之后才能安装此脚本。
您需要先安装一款用户脚本管理器扩展,例如 Tampermonkey,才能安装此脚本。
您需要先安装用户脚本管理器扩展后才能安装此脚本。
簡単なタッチ操作のイベントを追加します
此脚本不应直接安装。它是供其他脚本使用的外部库,要使用该库请加入元指令 // @require https://update.cn-greasyfork.org/scripts/419806/894991/touchActionEx.js
- // ==UserScript==
- // @name touchActionEx
- // @version 0.3
- // @description 簡単なタッチ操作のイベントを追加します
- // @author y_kahou
- // ==/UserScript==
- function addTap(ele, {interval = 200} = {}) {
- // すでにtapかdoubletapを設定していたら何もしない
- if (ele.getAttribute('tap') != null || ele.getAttribute('doubletap') != null)
- return
- ele.setAttribute('tap','')
- ele.addEventListener('touchstart', e => {
- if (e.targetTouches.length > 1) {
- ele.dataset.tap = 0
- return
- }
- ele.dataset.tap = 1
- let to = setTimeout(() => {
- ele.dataset.tap = 0
- ele.dispatchEvent(new CustomEvent('hold', {detail: {touch: e.targetTouches[0]}}))
- }, interval)
- ele.dataset.tap_to = to
- })
- ele.addEventListener('touchmove', e => {
- if (ele.dataset.tap == 0)
- return
- ele.dispatchEvent(new Event('subfocus'))
- ele.dataset.tap = 0
- clearTimeout(ele.dataset.tap_to)
- })
- ele.addEventListener('touchend', e => {
- if (ele.dataset.tap == 0)
- return
- ele.dataset.tap = 0
- clearTimeout(ele.dataset.tap_to)
- ele.dispatchEvent(new CustomEvent('tap', {detail: {touch: e.changedTouches[0]}}))
- e.preventDefault()
- })
- }
- function addDoubletap(ele, {interval = 200} = {}) {
- // すでにtapかdoubletapを設定していたら何もしない
- if (ele.getAttribute('tap') != null || ele.getAttribute('doubletap') != null)
- return
- ele.setAttribute('doubletap', '')
- ele.addEventListener('touchstart', e => {
- if (e.targetTouches.length > 1) {
- ele.dataset.tap = 0
- return
- }
- ele.dataset.tap = 1
- let to = setTimeout(() => {
- ele.dataset.tap = 0
- ele.dispatchEvent(new CustomEvent('hold', {detail: {touch: e.targetTouches[0]}}))
- }, interval)
- ele.dataset.tap_to = to
- })
- ele.addEventListener('touchmove', e => {
- if (ele.dataset.tap == 0)
- return
- ele.dispatchEvent(new Event('subfocus'))
- ele.dataset.tap = 0
- clearTimeout(ele.dataset.tap_to)
- })
- ele.addEventListener('touchend', e => {
- if (ele.dataset.tap == 0)
- return
- ele.dataset.tap = 0
- clearTimeout(ele.dataset.tap_to)
- let event = new CustomEvent('temp', {detail: {touch: e.changedTouches[0]}})
- ele.dispatchEvent(event)
- e.preventDefault()
- })
- ele.addEventListener('temp', e => {
- if (ele.dataset.dbltap == 1) {
- ele.dataset.dbltap = 0
- clearTimeout(ele.dataset.dbltap_to)
- ele.dispatchEvent(new CustomEvent('doubletap', {detail: e.detail}))
- } else {
- ele.dataset.dbltap = 1
- var to = setTimeout(() => {
- ele.dataset.dbltap = 0
- ele.dispatchEvent(new CustomEvent('tap', {detail: e.detail}))
- }, interval)
- ele.dataset.dbltap_to = to
- }
- })
- }
- function addSwipe(ele, {min_dist = 50} = {}) {
- // すでにswipeかswipe_wayを設定していたら何もしない
- if (ele.getAttribute('swipe') != null || ele.getAttribute('swipe_way') != null)
- return
- ele.setAttribute('swipe','')
- ele.addEventListener('touchstart', e => {
- if (e.touches.length > 1) {
- ele.dataset.start_point = ''
- return
- }
- var x = Math.floor(e.touches[0].screenX)
- var y = Math.floor(e.touches[0].screenY)
- ele.dataset.start_point = `${x},${y}`
- })
- ele.addEventListener('touchmove', e => {
- if (e.touches.length > 1) {
- ele.dataset.start_point = ''
- return
- }
- })
- ele.addEventListener('touchend', e => {
- if (e.changedTouches.length > 1)
- return
- var p = ele.dataset.start_point
- if (!p)
- return
- var x1 = Number(p.split(',')[0])
- var y1 = Number(p.split(',')[1])
- var x2 = Math.floor(e.changedTouches[0].screenX)
- var y2 = Math.floor(e.changedTouches[0].screenY)
- var ang = Math.atan2(y2 - y1, x2 - x1) * 180 / Math.PI
- if (ang < 0) ang += 360
- var dist = Math.sqrt(Math.pow(x2 - x1, 2) + Math.pow(y2 - y1, 2))
- if (min_dist < dist) {
- var dt = {
- from: { x: x1, y: y1 },
- dest: { x: x2, y: y2 },
- angle: ang, distance: dist
- }
- ele.dispatchEvent(new CustomEvent('swipe', {detail: dt}))
- }
- })
- }
- function addSwipeWay(ele, {range = 90, min_dist = 50} = {}) {
- // すでにswipe_wayを設定していたら何もしない
- if (ele.getAttribute('swipe_way') != null)
- return
- // swipe未設定なら設定
- if (ele.getAttribute('swipe') == null) {
- addSwipe(ele, min_dist)
- }
- ele.removeAttribute('swipe')
- ele.setAttribute('swipe_way', '')
- ele.addEventListener('swipe', e => {
- const ways = ['right', 'down', 'left', 'up']
- let ang = e.detail.angle
- let dist = e.detail.distance
- for (var i in ways) {
- var ang_ = (i==0 && 270<ang ? ang-360 : ang)
- if (Math.abs(90 * i - ang_) <= range / 2) {
- ele.dispatchEvent(new CustomEvent('swipe' + ways[i], { detail: e.detail}))
- break
- }
- }
- })
- }