From 6a56ee1730ddf4736b725815e545b31adc422a9a Mon Sep 17 00:00:00 2001
From: Eyre_S <sukazyo@outlook.com>
Date: Mon, 22 Nov 2021 23:31:05 +0800
Subject: [PATCH] =?UTF-8?q?=E6=B7=BB=E5=8A=A0=E5=B7=A6=E6=BB=91=E5=85=B3?=
 =?UTF-8?q?=E9=97=AD=E4=BE=A7=E8=BE=B9=E6=A0=8F=E6=94=AF=E6=8C=81?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 assets/main.js                    |   2 +
 assets/utils-touchscreen-event.js | 115 ++++++++++++++++++++++++++++++
 constant.php                      |   2 +-
 src/Data/SiteMeta.php             |   1 +
 4 files changed, 119 insertions(+), 1 deletion(-)
 create mode 100644 assets/utils-touchscreen-event.js

diff --git a/assets/main.js b/assets/main.js
index e38a95c..7c84172 100644
--- a/assets/main.js
+++ b/assets/main.js
@@ -57,6 +57,8 @@ function sidebarToggle() {
 }
 if (window.innerWidth > 1000) { sidebarToggle(); }
 
+EventUtil.bindEvent(itemSidebar, 'swipeleft', sidebarToggle)
+
 
 
 window.onload = function () {
diff --git a/assets/utils-touchscreen-event.js b/assets/utils-touchscreen-event.js
new file mode 100644
index 0000000..47e8bff
--- /dev/null
+++ b/assets/utils-touchscreen-event.js
@@ -0,0 +1,115 @@
+/**
+ * 用touch事件模拟点击、左滑、右滑、上拉、下拉等时间，
+ * 是利用touchstart和touchend两个事件发生的位置来确定是什么操作。
+ * 例如：
+ * 1、touchstart和touchend两个事件的位置基本一致，也就是没发生位移，那么可以确定用户是想点击按钮等。
+ * 2、touchend在touchstart正左侧，说明用户是向左滑动的。
+ * 利用上面的原理，可以模拟移动端的各类事件。
+ **/
+const EventUtil = (function() {
+	
+	//支持事件列表
+	let eventArr = ['eventswipeleft', 'eventswiperight', 'eventslideup', 'eventslidedown', 'eventclick', 'eventlongpress'];
+	
+	//touchstart事件，delta记录开始触摸位置
+	function touchStart(event) {
+		this.delta = {};
+		this.delta.x = event.touches[0].pageX;
+		this.delta.y = event.touches[0].pageY;
+		this.delta.time = new Date().getTime();
+	}
+	
+	/**
+	 * touchend事件，计算两个事件之间的位移量
+	 * 1、如果位移量很小或没有位移，看做点击事件
+	 * 2、如果位移量较大，x大于y，可以看做平移，x>0,向右滑，反之向左滑。
+	 * 3、如果位移量较大，x小于y，看做上下移动，y>0,向下滑，反之向上滑
+	 * 这样就模拟的移动端几个常见的时间。
+	 * */
+	function touchEnd(event) {
+		let delta = this.delta;
+		delete this.delta;
+		let timegap = new Date().getTime() - delta.time;
+		delta.x -= event.changedTouches[0].pageX;
+		delta.y -= event.changedTouches[0].pageY;
+		if (Math.abs(delta.x) < 5 && Math.abs(delta.y) < 5) {
+			if (timegap < 1000) {
+				if (this['eventclick']) {
+					this['eventclick'].map(function(fn){
+						fn(event);
+					});
+				}
+			} else {
+				if (this['eventlongpress']) {
+					this['eventlongpress'].map(function(fn){
+						fn(event);
+					});
+				}
+			}
+			return;
+		}
+		if (Math.abs(delta.x) > Math.abs(delta.y)) {
+			if (delta.x > 0) {
+				if (this['eventswipeleft']) {
+					this['eventswipeleft'].map(function(fn){
+						fn(event);
+					});
+				}
+			} else {
+				this['eventswiperight'].map(function(fn){
+					fn(event);
+				});
+			}
+		} else {
+			if (delta.y > 0) {
+				if (this['eventslidedown']) {
+					this['eventslidedown'].map(function(fn){
+						fn(event);
+					});
+				}
+			} else {
+				this['eventslideup'].map(function(fn){
+					fn(event);
+				});
+			}
+		}
+	}
+	
+	function bindEvent(dom, type, callback) {
+		if (!dom) {
+			console.error('dom is null or undefined');
+		}
+		let flag  = eventArr.some(key => dom[key]);
+		if (!flag) {
+			dom.addEventListener('touchstart', touchStart);
+			dom.addEventListener('touchend', touchEnd);
+		}
+		if (!dom['event' + type]) {
+			dom['event' + type] = [];
+		}
+		dom['event' + type].push(callback);
+	}
+	
+	function removeEvent(dom, type, callback) {
+		if (dom['event' + type]) {
+			for(let i = 0; i < dom['event' + type].length; i++) {
+				if (dom['event' + type][i] === callback) {
+					dom['event' + type].splice(i, 1);
+					i--;
+				}
+			}
+			if (dom['event' + type] && dom['event' + type].length === 0) {
+				delete dom['event' + type];
+				let flag  = eventArr.every(key => !dom[key]);
+				if (flag) {
+					dom.removeEventListener('touchstart', touchStart);
+					dom.removeEventListener('touchend', touchEnd);
+				}
+			}
+		}
+	}
+	return {
+		bindEvent,
+		removeEvent
+	}
+})();
diff --git a/constant.php b/constant.php
index 7f3b50b..421eed3 100644
--- a/constant.php
+++ b/constant.php
@@ -2,6 +2,6 @@
 
 const APP_NAME = "ph-Bookshelf";
 
-const VERSION = "0.3.0.3";
+const VERSION = "0.3.0.6";
 const CHANNEL = "suk-ws";
 const BRANCH = "master";
diff --git a/src/Data/SiteMeta.php b/src/Data/SiteMeta.php
index 0b567d7..a8c55b7 100644
--- a/src/Data/SiteMeta.php
+++ b/src/Data/SiteMeta.php
@@ -46,6 +46,7 @@ class SiteMeta {
 //			"/assets/gitbook-fix.js",
 //			"https://cdn.jsdelivr.net/npm/marked/marked.min.js",
 //			"/assets/ref.js",
+			"/assets/utils-touchscreen-event.js",
 			"/assets/main.js",
 		);
 	}