@dobot-plus/template 1.2.11 → 1.2.12
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/.dobot/utils/rem.js +105 -2
- package/package.json +1 -1
package/.dobot/utils/rem.js
CHANGED
|
@@ -1,4 +1,97 @@
|
|
|
1
|
-
|
|
1
|
+
/**
|
|
2
|
+
* 判断当前浏览器是否是PC端浏览器
|
|
3
|
+
* @returns {boolean} 是PC浏览器返回true，否则返回false
|
|
4
|
+
*/
|
|
5
|
+
export function isPCBrowser() {
|
|
6
|
+
// 检测用户代理字符串
|
|
7
|
+
const userAgent = window.navigator.userAgent
|
|
8
|
+
|
|
9
|
+
// 检查是否有移动设备的特征
|
|
10
|
+
const mobileKeywords = [
|
|
11
|
+
'Android',
|
|
12
|
+
'iPhone',
|
|
13
|
+
'iPad',
|
|
14
|
+
'iPod',
|
|
15
|
+
'BlackBerry',
|
|
16
|
+
'Windows Phone',
|
|
17
|
+
'MeeGo',
|
|
18
|
+
'SymbianOS',
|
|
19
|
+
'IEMobile',
|
|
20
|
+
'Mobile',
|
|
21
|
+
'Opera Mini',
|
|
22
|
+
'Opera Mobi',
|
|
23
|
+
'webOS',
|
|
24
|
+
'Tablet',
|
|
25
|
+
'Pad'
|
|
26
|
+
]
|
|
27
|
+
|
|
28
|
+
const hasMobileKeyword = mobileKeywords.some(
|
|
29
|
+
(keyword) => userAgent.indexOf(keyword) !== -1
|
|
30
|
+
)
|
|
31
|
+
|
|
32
|
+
// 检测是否是常见的PC操作系统
|
|
33
|
+
const isPCOS =
|
|
34
|
+
(userAgent.indexOf('Windows') !== -1 &&
|
|
35
|
+
userAgent.indexOf('Windows Phone') === -1) ||
|
|
36
|
+
userAgent.indexOf('Macintosh') !== -1 ||
|
|
37
|
+
(userAgent.indexOf('Linux') !== -1 && userAgent.indexOf('Android') === -1)
|
|
38
|
+
|
|
39
|
+
// 检测屏幕尺寸（一般PC屏幕较大）
|
|
40
|
+
const hasLargeScreen =
|
|
41
|
+
window.screen.width >= 1024 && window.screen.height >= 768
|
|
42
|
+
|
|
43
|
+
// 检测是否支持鼠标事件但不支持触摸事件
|
|
44
|
+
// 注意：许多现代PC也支持触摸事件，所以这个检测不是非常可靠
|
|
45
|
+
const hasTouchSupport =
|
|
46
|
+
'ontouchstart' in window ||
|
|
47
|
+
navigator.maxTouchPoints > 0 ||
|
|
48
|
+
navigator.msMaxTouchPoints > 0
|
|
49
|
+
|
|
50
|
+
// 精确检测是否是平板
|
|
51
|
+
const isTablet =
|
|
52
|
+
/Tablet|iPad/i.test(userAgent) || (hasTouchSupport && hasLargeScreen)
|
|
53
|
+
|
|
54
|
+
// 综合判断
|
|
55
|
+
// 1. 没有移动设备关键词 且 是PC操作系统
|
|
56
|
+
// 2. 或者有大屏幕但不是平板设备
|
|
57
|
+
return (!hasMobileKeyword && isPCOS) || (hasLargeScreen && !isTablet)
|
|
58
|
+
}
|
|
59
|
+
|
|
60
|
+
const DOBOT_STUDIO_PRO_CONFIG = {
|
|
61
|
+
DEFAULT_WIDTH: 1920, // 默认屏幕宽度
|
|
62
|
+
MIN_WIDTH: 1440, // 16px 字体大小的最小屏幕宽度
|
|
63
|
+
DOBOT_PLUS_ROOT_FONT_SIZE: 100 // Dobot Plus 根元素字体大小
|
|
64
|
+
}
|
|
65
|
+
|
|
66
|
+
function setFontSize() {
|
|
67
|
+
const innerWidth = window.parent
|
|
68
|
+
? window.parent.window.innerWidth
|
|
69
|
+
: window.innerWidth
|
|
70
|
+
if (!innerWidth) return
|
|
71
|
+
let scale = 1
|
|
72
|
+
// 窗口宽度小于最小宽度时，缩放比例为当前窗口宽度与最小宽度的比值
|
|
73
|
+
if (innerWidth < DOBOT_STUDIO_PRO_CONFIG.MIN_WIDTH) {
|
|
74
|
+
scale = innerWidth / DOBOT_STUDIO_PRO_CONFIG.MIN_WIDTH
|
|
75
|
+
}
|
|
76
|
+
if (
|
|
77
|
+
innerWidth >= DOBOT_STUDIO_PRO_CONFIG.MIN_WIDTH &&
|
|
78
|
+
innerWidth <= DOBOT_STUDIO_PRO_CONFIG.DEFAULT_WIDTH
|
|
79
|
+
) {
|
|
80
|
+
// 窗口宽度在最小宽度和默认宽度之间时，按比例缩放，1440-1920 屏幕区间，上位机字体范围 14px ~ 16px
|
|
81
|
+
scale = Math.min(
|
|
82
|
+
1,
|
|
83
|
+
Math.max(innerWidth / DOBOT_STUDIO_PRO_CONFIG.DEFAULT_WIDTH, 14 / 16)
|
|
84
|
+
)
|
|
85
|
+
}
|
|
86
|
+
// 窗口宽度大于默认宽度时，缩放比例为当前窗口宽度与默认宽度的比值
|
|
87
|
+
if (innerWidth > DOBOT_STUDIO_PRO_CONFIG.DEFAULT_WIDTH) {
|
|
88
|
+
scale = innerWidth / DOBOT_STUDIO_PRO_CONFIG.DEFAULT_WIDTH
|
|
89
|
+
}
|
|
90
|
+
|
|
91
|
+
document.documentElement.style.fontSize = `${scale * DOBOT_STUDIO_PRO_CONFIG.DOBOT_PLUS_ROOT_FONT_SIZE}px`
|
|
92
|
+
}
|
|
93
|
+
|
|
94
|
+
function reSize(doc, win) {
|
|
2
95
|
var docEl = doc.documentElement,
|
|
3
96
|
resizeEvt = 'orientationchange' in window ? 'orientationchange' : 'resize',
|
|
4
97
|
recalc = function () {
|
|
@@ -18,4 +111,14 @@
|
|
|
18
111
|
if (!doc.addEventListener) return
|
|
19
112
|
win.addEventListener(resizeEvt, recalc, false)
|
|
20
113
|
doc.addEventListener('DOMContentLoaded', recalc, false)
|
|
21
|
-
}
|
|
114
|
+
}
|
|
115
|
+
|
|
116
|
+
// 判断是否是PC端浏览器
|
|
117
|
+
if (isPCBrowser()) {
|
|
118
|
+
setFontSize()
|
|
119
|
+
window.onresize = function () {
|
|
120
|
+
setFontSize()
|
|
121
|
+
}
|
|
122
|
+
} else {
|
|
123
|
+
reSize(document, window)
|
|
124
|
+
}
|