github/siyuan
4
0
Fork 0
mirror of https://github.com/siyuan-note/siyuan.git synced 2025-05-16 17:10:53 +08:00
Code Issues Packages Projects Releases Wiki Activity

📱 https://github.com/siyuan-note/siyuan/issues/7688

Browse Source
This commit is contained in:
Vanessa 2023-03-30 18:12:09 +08:00
parent 0fe1f05262
commit a12cd505bd
3 changed files with 80 additions and 27 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
app/src/mobile/index.ts
View File

@ -19,6 +19,7 @@ import {hideKeyboardToolbar, showKeyboardToolbar} from "./util/keyboardToolbar";
import {getLocalStorage} from "../protyle/util/compatibility";
import {openMobileFileById} from "./editor";
import {getSearch} from "../util/functions";
import {initRightMenu} from "./menu";
class App {
constructor() {
@ -63,15 +64,14 @@ class App {
fetchPost("/api/system/getEmojiConf", {}, emojiResponse => {
window.siyuan.emojis = emojiResponse.data as IEmoji[];
initFramework();
initRightMenu();
});
});
addGA();
});
});
if (navigator.userAgent.indexOf("iPhone") > -1) {
document.addEventListener("touchstart", handleTouchStart, false);
document.addEventListener("touchmove", handleTouchMove, false);
}
document.addEventListener("touchend", handleTouchEnd, false);
});
setNoteBook();

11
app/src/mobile/menu/index.ts
View File

@ -18,11 +18,11 @@ import {getRecentDocs} from "./getRecentDocs";
export const popMenu = () => {
activeBlur();
hideKeyboardToolbar();
document.getElementById("menu").style.right = "0";
};
export const initRightMenu = () => {
const menuElement = document.getElementById("menu");
if (menuElement.innerHTML !== "") {
menuElement.style.right = "0";
return;
}
let accountHTML = "";
if (window.siyuan.user && !window.siyuan.config.readonly) {
accountHTML = `<div class="b3-menu__item" id="menuAccount">
@ -203,5 +203,4 @@ ${accountHTML}
target = target.parentElement;
}
});
menuElement.style.right = "0";
};
}

86
app/src/mobile/util/touch.ts
View File

@ -1,11 +1,14 @@
import {goBack, goForward} from "./MobileBackFoward";
import {hasClosestByAttribute} from "../../protyle/util/hasClosest";
import {closePanel} from "./closePanel";
import {popMenu} from "../menu";
let clientX: number;
let clientY: number;
let xDiff: number;
let yDiff: number;
let time: number;
export const handleTouchEnd = () => {
export const handleTouchEnd = (event: TouchEvent) => {
if (window.siyuan.mobile.editor) {
document.querySelectorAll(".protyle-breadcrumb__bar--hide").forEach(item => {
item.classList.remove("protyle-breadcrumb__bar--hide");
@ -13,46 +16,97 @@ export const handleTouchEnd = () => {
window.siyuan.hideBreadcrumb = false;
}
if (!clientX || !clientY || navigator.userAgent.indexOf("iPhone") === -1) {
if (!clientX || !clientY || xDiff === 0) {
return;
}
if (Math.abs(xDiff) > Math.abs(yDiff) && Math.abs(xDiff) > window.innerWidth / 4) {
if (xDiff > 0) {
goForward();
} else {
// 后退
goBack();
const target = event.target as HTMLElement
let scrollElement = hasClosestByAttribute(target, "data-type", "NodeCodeBlock") || hasClosestByAttribute(target, "data-type", "NodeTable")
if (scrollElement) {
scrollElement = scrollElement.classList.contains("table") ? (scrollElement.firstElementChild as HTMLElement) : (scrollElement.firstElementChild.nextElementSibling as HTMLElement)
if ((xDiff < 0 && scrollElement.scrollLeft > 0) ||
(xDiff > 0 && scrollElement.clientWidth + scrollElement.scrollLeft < scrollElement.scrollWidth)) {
return;
}
}
clientX = null;
clientY = null;
let show = false
if (new Date().getTime() - time < 1000) {
show = true
} else if (Math.abs(xDiff) > window.innerWidth / 3) {
show = true
}
const menuElement = hasClosestByAttribute(target, "id", "menu")
if (show && menuElement && xDiff < 0) {
closePanel();
return;
}
const sideElement = hasClosestByAttribute(target, "id", "sidebar")
if (show && sideElement && xDiff > 0) {
closePanel();
return;
}
if (!show) {
closePanel();
return;
}
if (Math.abs(xDiff) > Math.abs(yDiff)) {
if (xDiff > 0) {
popMenu();
} else {
document.getElementById("toolbarFile").dispatchEvent(new CustomEvent("click"))
}
}
};
export const handleTouchStart = (event: TouchEvent) => {
xDiff = 0;
yDiff = 0;
if (navigator.userAgent.indexOf("iPhone") > -1 ||
(event.touches[0].clientX > 8 && event.touches[0].clientX < window.innerWidth - 8)) {
clientX = event.touches[0].clientX;
if ((clientX < 48 || clientX > window.innerWidth - 24)) {
clientY = event.touches[0].clientY;
time = new Date().getTime();
} else {
clientX = null;
clientY = null;
time = 0;
event.stopImmediatePropagation();
}
};
export const handleTouchMove = (event: TouchEvent) => {
if (!clientX || !clientY) return;
if (!clientX || !clientY) {
return;
}
xDiff = Math.floor(clientX - event.touches[0].clientX);
yDiff = Math.floor(clientY - event.touches[0].clientY);
// TODO 动画效果
if (Math.abs(xDiff) > Math.abs(yDiff)) {
const target = event.target as HTMLElement
let scrollElement = hasClosestByAttribute(target, "data-type", "NodeCodeBlock") || hasClosestByAttribute(target, "data-type", "NodeTable")
if (scrollElement) {
scrollElement = scrollElement.classList.contains("table") ? (scrollElement.firstElementChild as HTMLElement) : (scrollElement.firstElementChild.nextElementSibling as HTMLElement)
if ((xDiff < 0 && scrollElement.scrollLeft > 0) ||
(xDiff > 0 && scrollElement.clientWidth + scrollElement.scrollLeft < scrollElement.scrollWidth)) {
return;
}
}
const menuElement = hasClosestByAttribute(target, "id", "menu")
if (menuElement && xDiff < 0) {
menuElement.style.right = xDiff + "px"
return;
}
const sideElement = hasClosestByAttribute(target, "id", "sidebar")
if (sideElement && xDiff > 0) {
sideElement.style.left = -xDiff + "px"
return;
}
console.log(event);
if (xDiff < 0) {
// "left->right"
document.getElementById("sidebar").style.left = -window.innerWidth - xDiff + "px"
} else {
// "right->left"
document.getElementById("menu").style.right = -window.innerWidth + xDiff + "px"
}
}
};