server/mylomen-server
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

to:sync

Browse Source
This commit is contained in:
shaoyongjun 2024-11-01 13:53:56 +08:00
parent 159abbe799
commit e262655dec
5 changed files with 106 additions and 22 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
static/css/myEdit.css
View File

@ -167,7 +167,7 @@ main {
margin: 0 80rem;
}
@media screen and ( max-width: 768px ) {
@media screen and ( max-width: 1024px ) {
/*当屏幕尺寸小于768px时，应用下面的css样式*/
.fixStylePosition {
display: block;

46
static/js/lib/common/MyUtils.js
View File

@ -287,7 +287,7 @@ export class MyUtils {
*/
RefreshRootFrontSize() {
let curDoc = document.documentElement;//当前文档的 root 元素
let curClientW = curDoc.clientWidth;
let curClientW = document.documentElement.clientWidth || document.body.clientWidth;
if (!curClientW) {
return
}
@ -299,14 +299,34 @@ export class MyUtils {
console.log("curClientW :", curClientW, "designWidth: ", designWidth, "-> ", nowFrontSize);
let testDiv = document.getElementById("testDevice");
testDiv.innerText += "\nnowFrontSize: " + nowFrontSize;
// testDiv.innerText = testDiv.innerText +
// // "\n navigator_userAgent :" + navigator.userAgent.toLocaleLowerCase() +
// "\n isMobile :" + /mobi|android|iphone|ipad|ipod/i.test(navigator.userAgent.toLocaleLowerCase()) +
// "\n isIOS :" + /iphone|ipad|ipod/.test(window.navigator.userAgent.toLocaleLowerCase()) +
// "\n isAndroid :" + /android/.test(window.navigator.userAgent.toLocaleLowerCase()) +
// "\n curClientW :" + curClientW +
// " \n designWidth: " + designWidth +
// "\n 1rem = " + nowFrontSize
testDiv.innerText = testDiv.innerText +
"\n navigator_userAgent :" + navigator.userAgent.toLocaleLowerCase() +
"\n isMobile :" + /mobi|android|iphone|ipad|ipod/i.test(navigator.userAgent.toLocaleLowerCase()) +
"\n isIOS :" + /iphone|ipad|ipod/.test(window.navigator.userAgent.toLocaleLowerCase()) +
"\n isAndroid :" + /android/.test(window.navigator.userAgent.toLocaleLowerCase()) +
"\n curClientW :" + curClientW +
" \n designWidth: " + designWidth +
"\n 1rem = " + nowFrontSize;
// 获取 User-Agent 字符串
const userAgent = window.navigator.userAgent;
// 获取屏幕宽度
// const screenWidth = window.innerWidth || document.documentElement.clientWidth || document.body.clientWidth;;
const screenWidth = document.documentElement.clientWidth || document.body.clientWidth;
// 判断是否是手机
const isMobile = /Mobile/i.test(userAgent) || screenWidth < 768;
// 判断是否是平板电脑
const isTablet = /Tablet/i.test(userAgent) || (screenWidth >= 768 && screenWidth < 1024);
if (isMobile) {
console.log("您正在使用手机访问");
testDiv.innerText = testDiv.innerText + "\n您正在使用手机访问 " + window.myEdit.ctx.screenWidth + "*" + window.myEdit.ctx.screenHeight;
} else if (isTablet) {
console.log("您正在使用平板电脑访问");
testDiv.innerText = testDiv.innerText + "\n您正在使用平板电脑访问 " + window.myEdit.ctx.screenWidth + "*" + window.myEdit.ctx.screenHeight;
} else {
console.log("您正在使用桌面电脑访问");
testDiv.innerText = testDiv.innerText + "\n您正在使用桌面电脑访问 " + window.myEdit.ctx.screenWidth + "*" + window.myEdit.ctx.screenHeight;
}
}
@ -349,12 +369,16 @@ export class MyUtils {
// myEditFrontSize.style.fontSize = window.myEdit.ctx.editFrontSize * dpr + 'px';
// }
// myEditFrontSize.style.fontSize = window.myEdit.ctx.editFrontSize * dpr + 'px';
myEditFrontSize.style.fontSize = window.myEdit.ctx.editFrontSize + 'px';
if (window.myEdit.ctx.isTablet) {
myEditFrontSize.style.fontSize = window.myEdit.ctx.editFrontSize * dpr + 'px';
} else {
myEditFrontSize.style.fontSize = window.myEdit.ctx.editFrontSize + 'px';
}
// console.log("myEditFrontSize: ", myEditFrontSize.style.fontSize);
let testDiv = document.getElementById("testDevice");
testDiv.innerText = "\ndpr: " + dpr + "\nmyEditFrontSize: " + myEditFrontSize.style.fontSize;
testDiv.innerText += "\ndpr: " + dpr + "\nmyEditFrontSize: " + myEditFrontSize.style.fontSize;
}
/**

29
static/js/lib/event/MyEventListener.js
View File

@ -151,7 +151,7 @@ export class MyEventListener {
let styleUtils = document.getElementById("_style_utils");
if (window.myEdit.utils.GetSelection().isCollapsed) {
// console.log("none")
if (!window.myEdit.ctx.isMobile) {
if (!window.myEdit.ctx.isMobile && !window.myEdit.ctx.isTablet) {
styleUtils.style.display = "none";
}
return
@ -197,5 +197,32 @@ export class MyEventListener {
// window.myEdit.utils.ProhibitDefaultEvent(event);
}
RefreshRootFrontSize(e) {
const event = window.myEdit.utils.ParseEvent(e);
//忽略高度变化
let curClientW = document.documentElement.clientWidth || document.body.clientWidth;
if (!curClientW) {
return
}
if (window.myEdit.ctx.screenWidth === curClientW) {
window.myEdit.utils.ProhibitDefaultEvent(event);
return;
}
}
RefreshEditFrontSize(e) {
const event = window.myEdit.utils.ParseEvent(e);
//忽略高度变化
let curClientW = document.documentElement.clientWidth || document.body.clientWidth;
if (!curClientW) {
return
}
if (window.myEdit.ctx.screenWidth === curClientW) {
window.myEdit.utils.ProhibitDefaultEvent(event);
return;
}
}
}

48
static/js/lib/main.js
View File

@ -4,6 +4,17 @@ import {MyUtils} from './common/MyUtils.js'
import {MyEventListener} from "./event/MyEventListener.js";
(function () {
// 获取 User-Agent 字符串
const userAgent = window.navigator.userAgent;
// 获取屏幕宽度
// const screenWidth = window.innerWidth || document.documentElement.clientWidth || document.body.clientWidth;
const screenWidth = document.documentElement.clientWidth || document.body.clientWidth;
// 判断是否是手机
const isMobile = /mobi|android|iphone|ipad|ipod/i.test(userAgent.toLocaleLowerCase()) || screenWidth < 768;
const isIOS = /iphone|ipad|ipod/i.test(userAgent.toLocaleLowerCase()) || screenWidth < 768;
const isAndroid = /android/i.test(userAgent.toLocaleLowerCase()) || screenWidth < 768;
// 判断是否是平板电脑
const isTablet = /tablet/i.test(userAgent.toLocaleLowerCase()) || (screenWidth >= 768 && screenWidth < 1024);
//init
window.myEdit = {
/**
@ -23,11 +34,14 @@ import {MyEventListener} from "./event/MyEventListener.js";
/**
* 是否是手机端
*/
isMobile: /mobi|android|iphone|ipad|ipod/i.test(navigator.userAgent.toLocaleLowerCase()),
isIOS: /iphone|ipad|ipod/.test(window.navigator.userAgent.toLocaleLowerCase()),
isAndroid: /android/.test(window.navigator.userAgent.toLocaleLowerCase()),
isMobile: isMobile,
isIOS: isIOS,
isAndroid: isAndroid,
//判断是否是平板电脑
isTablet: isTablet,
screenWidth: document.documentElement.clientWidth || document.body.clientWidth,
//高度 for android
originHeight: document.documentElement.clientHeight || document.body.clientHeight,
screenHeight: document.documentElement.clientHeight || document.body.clientHeight,
/**
* 默认body front-size 单位px
*/
@ -104,16 +118,16 @@ import {MyEventListener} from "./event/MyEventListener.js";
*/
window.myEdit.utils.RefreshRootFrontSize();
window.myEdit.utils.RefreshEditFrontSize();
document.addEventListener('DOMContentLoaded', window.myEdit.utils.RefreshRootFrontSize);
document.addEventListener('DOMContentLoaded', window.myEdit.utils.RefreshEditFrontSize);
document.addEventListener('DOMContentLoaded', window.myEdit.eventListener.RefreshRootFrontSize);
document.addEventListener('DOMContentLoaded', window.myEdit.eventListener.RefreshEditFrontSize);
window.addEventListener('pageshow', function (e) {
if (e.persisted) {
window.myEdit.utils.RefreshRootFrontSize();
window.myEdit.utils.RefreshEditFrontSize();
}
});
window.addEventListener('resize', window.myEdit.utils.RefreshRootFrontSize);
window.addEventListener('resize', window.myEdit.utils.RefreshEditFrontSize);
window.addEventListener('resize', window.myEdit.eventListener.RefreshRootFrontSize);
window.addEventListener('resize', window.myEdit.eventListener.RefreshEditFrontSize);
/**
* 窗口撤销事件.
* js中的键盘事件只有三种：keydown、keyup、keypress。它们触发的顺序是：keydown -> keypress -> keyup。当按下一个键不放开，一般会重复地触发 keydown+keypress，直到放开后触发一个 keyup 事件。
@ -168,6 +182,24 @@ window.onload = function () {
window.myEdit.utils.ProhibitDefaultEvent(event);
}, false);
// 阻止双击放大
var lastTouchEnd = 0;
document.addEventListener('touchstart', function (event) {
if (event.touches.length > 1) {
event.preventDefault();
}
});
document.addEventListener('touchend', function (event) {
let now = (new Date()).getTime();
if (now - lastTouchEnd <= 300) {
event.preventDefault();
}
lastTouchEnd = now;
}, false);
// 阻止双指放大
document.addEventListener('gesturestart', function (event) {
event.preventDefault();
});
/**
* 使用说明

3
static/js/lib/todolist
View File

@ -1,2 +1,3 @@
选择文字 第一次添加样式的时候 丢失选区问题
☑️选择文字 第一次添加样式的时候 丢失选区问题
pad 上键盘事件 - 无法选择一行字某几个子添加样式