103 lines
3.9 KiB
JavaScript
103 lines
3.9 KiB
JavaScript
|
"use strict";
|
|||
|
|
define(function (require, exports, module) {
|
|||
|
|
|
|||
|
|
function handle(e) {
|
|||
|
|
const ctx = require("../../common/ctx");
|
|||
|
|
let historyScreenW = ctx.screenWidth;
|
|||
|
|
let curScreenW = ctx.getScreenWidth();
|
|||
|
|
if (historyScreenW === curScreenW) {
|
|||
|
|
return
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
//调整
|
|||
|
|
refreshEditFrontSize()
|
|||
|
|
refreshRootFrontSize();
|
|||
|
|
|
|||
|
|
//更新
|
|||
|
|
ctx.screenWidth = ctx.getScreenWidth();
|
|||
|
|
ctx.screenHeight = ctx.getScreenHeight();
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
/**
|
|||
|
|
* 刷新跟节点 front-size
|
|||
|
|
* @constructor
|
|||
|
|
*/
|
|||
|
|
function refreshRootFrontSize() {
|
|||
|
|
const ctx = require("../../common/ctx");
|
|||
|
|
let curDoc = document.documentElement;//当前文档的 root 元素
|
|||
|
|
let curClientW = ctx.getScreenWidth();
|
|||
|
|
if (!curClientW) {
|
|||
|
|
return
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
let designWidth = ctx.designWith;
|
|||
|
|
//set 1rem = viewWidth/10 (支持响应式)
|
|||
|
|
let nowFrontSize = ((curClientW / designWidth) / 10) + 'px';
|
|||
|
|
curDoc.style.fontSize = nowFrontSize;
|
|||
|
|
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 window.width :" + window.innerWidth +
|
|||
|
|
// "\n curClientW :" + curClientW +
|
|||
|
|
// " \n designWidth: " + designWidth +
|
|||
|
|
// "\n 1rem = " + nowFrontSize;
|
|||
|
|
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
|
|||
|
|
function refreshEditFrontSize() {
|
|||
|
|
const ctx = require("../../common/ctx");
|
|||
|
|
let curClientW = ctx.getScreenWidth();
|
|||
|
|
if (!curClientW) {
|
|||
|
|
return
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
let dpr = window.devicePixelRatio || 1;//当前设置下 物理像素和虚拟像素的比值
|
|||
|
|
if (!dpr) {
|
|||
|
|
//devicePixelRatio这个属性是可以获取到设备的dpr
|
|||
|
|
let devicePixelRatio = win?.devicePixelRatio;
|
|||
|
|
//判断dpr是否为整数
|
|||
|
|
let isRegularDpr = devicePixelRatio.toString().match(/^[1-9]\d*$/g)
|
|||
|
|
if (isRegularDpr) {
|
|||
|
|
// 对于是整数的dpr，对dpr进行操作
|
|||
|
|
if (devicePixelRatio >= 3 && (!dpr || dpr >= 3)) {
|
|||
|
|
dpr = 3;
|
|||
|
|
} else if (devicePixelRatio >= 2 && (!dpr || dpr >= 2)) {
|
|||
|
|
dpr = 2;
|
|||
|
|
} else {
|
|||
|
|
dpr = 1;
|
|||
|
|
}
|
|||
|
|
} else {
|
|||
|
|
// 其他设备下，仍旧使用1倍的方案
|
|||
|
|
dpr = 1;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
let myEditFrontSize = document.getElementById("myEdit_main");
|
|||
|
|
// if (document.documentElement.clientWidth <= 720) {
|
|||
|
|
// 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';
|
|||
|
|
if (ctx.isTablet) {
|
|||
|
|
myEditFrontSize.style.fontSize = ctx.editFrontSize * dpr + 'px';
|
|||
|
|
} else {
|
|||
|
|
myEditFrontSize.style.fontSize = ctx.editFrontSize + 'px';
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
// console.log("myEditFrontSize: ", myEditFrontSize.style.fontSize);
|
|||
|
|
let testDiv = document.getElementById("testDevice");
|
|||
|
|
testDiv.innerText = "\ndpr: " + dpr + "\nmyEditFrontSize: " + myEditFrontSize.style.fontSize;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
|
|||
|
|
//导出
|
|||
|
|
exports.handle = handle;
|
|||
|
|
exports.refreshEditFrontSize = refreshEditFrontSize;
|
|||
|
|
});
|