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

add:本地测试跳转

Browse Source
This commit is contained in:
shaoyongjun 2024-11-01 09:52:52 +08:00
parent ba6491650c
commit c497e02416
5 changed files with 81 additions and 96 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

62
static/css/myEdit.css
View File

@ -35,17 +35,29 @@ body {
}
header {
position: relative;
top: 0;
/* height: 8rem; */
z-index: 9999;
left: 0;
right: 0;
width: 100%;
/*position: relative;*/
/*top: 0;*/
/*border: 1px yellow solid;*/
/*!* height: 8rem; *!*/
/*z-index: 9999;*/
/*left: 0;*/
/*right: 0;*/
/*width: 100%;*/
/*响应式*/
/*display: flex;*/
/*flex-direction:column;*/
/*flex-wrap: nowrap;*/
}
main {
display: flex;
flex-direction: column;
align-items: center;
}
#noteshare {
width: 90%;
width: 80%;
/* width: 21cm; */
min-height: 2000rem;
/* font-size: 1.5rem; */
@ -104,7 +116,7 @@ header {
.childStyleU {
text-decoration: underline;
/*/ / 中划线 / / text-decoration: line-through;*/
/*/ / 中划线 / / text-decoration: line-through;*/
}
.childStyleDel {
@ -121,9 +133,9 @@ header {
position: fixed;
z-index: 99;
width: auto;
height: 200rem;
/*height: 200rem;*/
padding: 30rem 30rem;
padding: 20rem 30rem;
/*padding: 0.6rem 1rem 0.6rem 1rem;*/
justify-content: center;
align-items: center;
@ -139,8 +151,8 @@ header {
/*border: 1px blue solid;*/
margin: 0 0;
width: auto;
height: 130rem;
padding: 20rem 20rem;
/*height: 130rem;*/
/*padding: 20rem 20rem;*/
display: flex;
justify-content: center;
@ -151,3 +163,27 @@ header {
.fixStyleInnerSpan {
margin: 0 80rem;
}
@media screen and ( max-width: 768px ) {
/*当屏幕尺寸小于768px时，应用下面的css样式*/
.fixStylePosition {
display: block;
z-index: 99;
top: 0;
width: 100%;
min-height: 200rem;
margin-bottom: 3rem;
}
body{
top: 1%;
}
#_style_utils svg{
width:400rem;
height:400rem;
margin: 50rem 0;
}
main {
margin-top: 500rem;
}
}

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

@ -299,13 +299,13 @@ export class MyUtils {
console.log("curClientW :", curClientW, "designWidth: ", designWidth, "-> ", nowFrontSize);
let testDiv = document.getElementById("testDevice")
testDiv.innerText = testDiv.innerText +
"\n navigator_userAgent :" + navigator.userAgent.toLocaleLowerCase() +
// "\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 -> " + nowFrontSize
"\n 1rem = " + nowFrontSize
}
@ -331,72 +331,17 @@ export class MyUtils {
}
}
let myEditFrontSize = document.getElementById("noteshare");
let myEditFrontSize = document.getElementById("myEdit_main");
if (document.documentElement.clientWidth <= 720) {
myEditFrontSize.style.fontSize = window.myEdit.ctx.editFrontSize + 'px';
myEditFrontSize.style.fontSize = (window.myEdit.ctx.editFrontSize + 6) + 'px';
} else {
myEditFrontSize.style.fontSize = window.myEdit.ctx.editFrontSize * dpr + 'px';
}
// myEditFrontSize.style.fontSize = window.myEdit.ctx.editFrontSize * dpr + 'px';
console.log("body-frontSize: ", myEditFrontSize.style.fontSize);
if (window.myEdit.ctx.isMobile) {
let testDiv = document.getElementById("testDevice");
var resizeHeight = document.documentElement.clientHeight || document.body.clientHeight;
if (window.myEdit.ctx.originHeight < resizeHeight) {
console.log('Android 键盘收起啦！');
testDiv.innerText = "\nmobile: " + 'Android 键盘收起啦！' +
"\noriginHeight " + window.myEdit.ctx.originHeight +
"\nresizeHeight:" + resizeHeight +
"\ninnerHeight:" + window.innerHeight +
"\nvisualViewport.height: " + window.visualViewport.height
// Android 键盘收起后操作
let styleUtils = document.getElementById("_style_utils");
styleUtils.style.display = "none";
setTimeout(() => {
this.keyBoardHeight = window.innerHeight - window.visualViewport.height;
// console.log("mobile: ", this.keyBoardHeight);
testDiv.innerText = "\n键盘收起啦mobile: " + this.keyBoardHeight +
"\noriginHeight " + window.myEdit.ctx.originHeight +
"\nresizeHeight " + resizeHeight +
"\ninnerHeight:" + window.innerHeight +
"\nvisualViewport.height: " + window.visualViewport.height
let styleUtils = document.getElementById("_style_utils");
styleUtils.style.display = "none";
}, 800);
} else {
console.log('Android 键盘弹起啦！');
testDiv.innerText = "\nmobile: " + 'Android 键盘弹起啦！' +
"\noriginHeight " + window.myEdit.ctx.originHeight +
"\nresizeHeight " + resizeHeight +
"\ninnerHeight:" + window.innerHeight +
"\nvisualViewport.height: " + window.visualViewport.height
// Android 键盘弹起后操作
setTimeout(() => {
this.keyBoardHeight = window.innerHeight - window.visualViewport.height;
// console.log("mobile: ", this.keyBoardHeight);
testDiv.innerText = "\n键盘弹起啦mobile: " + this.keyBoardHeight +
"\noriginHeight " + window.myEdit.ctx.originHeight +
"\nresizeHeight " + resizeHeight +
"\ninnerHeight:" + window.innerHeight +
"\nvisualViewport.height: " + window.visualViewport.height
// styleUtils.style.left = 0;
let styleUtils = document.getElementById("_style_utils");
styleUtils.style.display = "block";
styleUtils.style.bottom = "500px";
}, 800);
}
window.myEdit.ctx.originHeight = resizeHeight;
}
console.log("myEditFrontSize: ", myEditFrontSize.style.fontSize);
let testDiv = document.getElementById("testDevice");
testDiv.innerText += "\nmyEditFrontSize:" + myEditFrontSize.style.fontSize;
}
/**

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

@ -72,9 +72,9 @@ export class MyEventListener {
const keyCode = window.myEdit.utils.GetKeyCode(event);
const metaKey = event.metaKey;
let testDiv = document.getElementById("testDevice")
testDiv.innerText = "键盘输入: keyCode:" + keyCode +
"\nmetaKey:" + metaKey;
// let testDiv = document.getElementById("testDevice")
// testDiv.innerText = "键盘输入: keyCode:" + keyCode +
// "\nmetaKey:" + metaKey;
//支持全屏撤销
if (metaKey && keyCode === 90) {
@ -102,8 +102,8 @@ export class MyEventListener {
const event = window.myEdit.utils.ParseEvent(e);
// console.log("input : ", event, " text: '", event.data + "'")
let testDiv = document.getElementById("testDevice")
testDiv.innerText = testDiv.innerText +
"\n输入内容: '" + (event.data === " ") + "'";
testDiv.innerText =
"\ninput: " + event.data + " isEmpty: " + (event.data === " ");
window.myEdit.biz.inputHandle(event);
//处理空行转换

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

@ -31,11 +31,11 @@ import {MyEventListener} from "./event/MyEventListener.js";
/**
* 默认body front-size 单位px
*/
editFrontSize: 14,
editFrontSize: 12,
/**
* 设计稿宽度 375
*/
designWith: 1280,
designWith: 375,
/**
* 文档的根节点
*/
@ -120,7 +120,6 @@ import {MyEventListener} from "./event/MyEventListener.js";
*
*/
window.addEventListener('keydown', window.myEdit.eventListener.WindowsKeydownOrTouchendHandle, true);
window.addEventListener('touchend', window.myEdit.eventListener.WindowsKeydownOrTouchendHandle, true);
}());
/**
@ -162,8 +161,6 @@ window.onload = function () {
//监听鼠标抬起事件
document.getElementById("noteshare").addEventListener("mouseup", window.myEdit.eventListener.MouseUpOrTouchend, true);
//监听手指抬起事件
document.getElementById("noteshare").addEventListener("touchend", window.myEdit.eventListener.MouseUpOrTouchend, true);
//这里监听鼠标按下事件
document.getElementById("_style_utils").addEventListener("mousedown", function (e) {
const event = window.myEdit.utils.ParseEvent(e);

27
static/yanxuelu.html
View File

@ -7,7 +7,8 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>📒</title>
<meta name="viewport"
content="width=device-width, height=device-height,initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no">
content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no">
<!-- content="width=device-width, height=device-height,initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no">-->
<link rel="stylesheet" type="text/css" href="./css/normalize.css">
<link rel="stylesheet" type="text/css" href="./css/myEdit.css">
<script type="module" src="./js/lib/main.js"></script>
@ -16,15 +17,7 @@
<body style="display: flex; flex-direction:column; background-color: #ffebc3">
<header>
</header>
<main style="margin-top: 90rem; display: flex; flex-direction:column; align-items:center;">
<h3>测试编辑</h3>
<div id="noteshare" spellcheck="false" translate="no">
</div>
</main>
<footer>
<!-- 顶部 -->
<div class="fixStylePosition" id="_style_utils">
<div class="fixStyleOut">
<div style="display: flex;">
@ -124,6 +117,20 @@
<!-- </div>-->
</div>
</div>
</header>
<main id="myEdit_main">
<!-- 标题 -->
<h3 style=" border: 1px blanchedalmond solid;">
测试编辑
</h3>
<!-- 内容 -->
<div id="noteshare" spellcheck="false" translate="no">
</div>
</main>
<footer>
</footer>
<div id="testDevice" style="font-size: 16px; width: 300px;margin-left: 10%;"></div>