mp-darkmode 1.1.10 → 1.2.0-beta.1
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/dist/darkmode.js +588 -492
- package/dist/darkmode.js.map +1 -1
- package/dist/darkmode.min.js +1 -1
- package/package.json +2 -1
package/dist/darkmode.js
CHANGED
|
@@ -96,6 +96,37 @@ return /******/ (function(modules) { // webpackBootstrap
|
|
|
96
96
|
/************************************************************************/
|
|
97
97
|
/******/ ({
|
|
98
98
|
|
|
99
|
+
/***/ "./node_modules/color-blend/dist/index.modern.js":
|
|
100
|
+
/*!*******************************************************!*\
|
|
101
|
+
!*** ./node_modules/color-blend/dist/index.modern.js ***!
|
|
102
|
+
\*******************************************************/
|
|
103
|
+
/*! exports provided: color, colorBurn, colorDodge, darken, difference, exclusion, hardLight, hue, lighten, luminosity, multiply, normal, overlay, saturation, screen, softLight */
|
|
104
|
+
/***/ (function(module, __webpack_exports__, __webpack_require__) {
|
|
105
|
+
|
|
106
|
+
"use strict";
|
|
107
|
+
__webpack_require__.r(__webpack_exports__);
|
|
108
|
+
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "color", function() { return R; });
|
|
109
|
+
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "colorBurn", function() { return H; });
|
|
110
|
+
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "colorDodge", function() { return G; });
|
|
111
|
+
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "darken", function() { return E; });
|
|
112
|
+
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "difference", function() { return L; });
|
|
113
|
+
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "exclusion", function() { return N; });
|
|
114
|
+
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "hardLight", function() { return J; });
|
|
115
|
+
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "hue", function() { return P; });
|
|
116
|
+
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "lighten", function() { return F; });
|
|
117
|
+
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "luminosity", function() { return S; });
|
|
118
|
+
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "multiply", function() { return B; });
|
|
119
|
+
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "normal", function() { return A; });
|
|
120
|
+
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "overlay", function() { return D; });
|
|
121
|
+
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "saturation", function() { return Q; });
|
|
122
|
+
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "screen", function() { return C; });
|
|
123
|
+
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "softLight", function() { return K; });
|
|
124
|
+
function n(n,r,t){return{r:255*t(n.r/255,r.r/255),g:255*t(n.g/255,r.g/255),b:255*t(n.b/255,r.b/255)}}function r(n,r){return r}function t(n,r){return n*r}function u(n,r){return n+r-n*r}function i(n,r){return a(r,n)}function o(n,r){return Math.min(n,r)}function e(n,r){return Math.min(Math.max(n,r),1)}function c(n,r){return 0===n?0:1===r?1:Math.min(1,n/(1-r))}function f(n,r){return 1===n?1:0===r?0:1-Math.min(1,(1-n)/r)}function a(n,r){return r<=.5?t(n,2*r):u(n,2*r-1)}function b(n,r){return r<=.5?n-(1-2*r)*n*(1-n):n+(2*r-1)*((n<=.25?((16*n-12)*n+4)*n:Math.sqrt(n))-n)}function g(n,r){return Math.abs(n-r)}function h(n,r){return n+r-2*n*r}function M(n,r,t){return Math.min(Math.max(n||0,r),t)}function m(n){return{r:M(n.r,0,255),g:M(n.g,0,255),b:M(n.b,0,255),a:M(n.a,0,1)}}function d(n){return{r:255*n.r,g:255*n.g,b:255*n.b,a:n.a}}function p(n){return{r:n.r/255,g:n.g/255,b:n.b/255,a:n.a}}function v(n,r){void 0===r&&(r=0);var t=Math.pow(10,r);return{r:Math.round(n.r*t)/t,g:Math.round(n.g*t)/t,b:Math.round(n.b*t)/t,a:n.a}}function x(n,r,t,u,i,o){return(1-r/t)*u+r/t*Math.round((1-n)*i+n*o)}function O(n,r,t,u,i){void 0===i&&(i={unitInput:!1,unitOutput:!1,roundOutput:!0}),i.unitInput&&(n=d(n),r=d(r)),n=m(n);var o=(r=m(r)).a+n.a-r.a*n.a,e=t(n,r,u),c=m({r:x(n.a,r.a,o,n.r,r.r,e.r),g:x(n.a,r.a,o,n.g,r.g,e.g),b:x(n.a,r.a,o,n.b,r.b,e.b),a:o});return c=i.unitOutput?p(c):i.roundOutput?v(c):function(n){return v(n,9)}(c),c}function s(n,r,t){return d(t(p(n),p(r)))}function I(n){return.3*n.r+.59*n.g+.11*n.b}function q(n,r){var t=r-I(n);return function(n){var r=I(n),t=n.r,u=n.g,i=n.b,o=Math.min(t,u,i),e=Math.max(t,u,i);function c(n){return r+(n-r)*r/(r-o)}function f(n){return r+(n-r)*(1-r)/(e-r)}return o<0&&(t=c(t),u=c(u),i=c(i)),e>1&&(t=f(t),u=f(u),i=f(i)),{r:t,g:u,b:i}}({r:n.r+t,g:n.g+t,b:n.b+t})}function w(n){return Math.max(n.r,n.g,n.b)-Math.min(n.r,n.g,n.b)}function j(n,r){var t=["r","g","b"].sort(function(r,t){return n[r]-n[t]}),u=t[0],i=t[1],o=t[2],e={r:n.r,g:n.g,b:n.b};return e[o]>e[u]?(e[i]=(e[i]-e[u])*r/(e[o]-e[u]),e[o]=r):e[i]=e[o]=0,e[u]=0,e}function k(n,r){return q(j(r,w(n)),I(n))}function l(n,r){return q(j(n,w(r)),I(n))}function y(n,r){return q(r,I(n))}function z(n,r){return q(n,I(r))}function A(t,u){return O(t,u,n,r)}function B(r,u){return O(r,u,n,t)}function C(r,t){return O(r,t,n,u)}function D(r,t){return O(r,t,n,i)}function E(r,t){return O(r,t,n,o)}function F(r,t){return O(r,t,n,e)}function G(r,t){return O(r,t,n,c)}function H(r,t){return O(r,t,n,f)}function J(r,t){return O(r,t,n,a)}function K(r,t){return O(r,t,n,b)}function L(r,t){return O(r,t,n,g)}function N(r,t){return O(r,t,n,h)}function P(n,r){return O(n,r,s,k)}function Q(n,r){return O(n,r,s,l)}function R(n,r){return O(n,r,s,y)}function S(n,r){return O(n,r,s,z)}
|
|
125
|
+
//# sourceMappingURL=index.modern.js.map
|
|
126
|
+
|
|
127
|
+
|
|
128
|
+
/***/ }),
|
|
129
|
+
|
|
99
130
|
/***/ "./node_modules/color-convert/conversions.js":
|
|
100
131
|
/*!***************************************************!*\
|
|
101
132
|
!*** ./node_modules/color-convert/conversions.js ***!
|
|
@@ -2329,9 +2360,10 @@ __webpack_require__.r(__webpack_exports__);
|
|
|
2329
2360
|
/**
|
|
2330
2361
|
* @name Darkmode主入口
|
|
2331
2362
|
*
|
|
2332
|
-
* @function run
|
|
2363
|
+
* @function run 初始化Dark Mode配置并运行Dark Mode处理
|
|
2333
2364
|
* @param {DOM Object Array} nodes 要处理的节点列表
|
|
2334
2365
|
* @param {Object} opt Dark Mode配置，详见init配置说明
|
|
2366
|
+
* @return void
|
|
2335
2367
|
*
|
|
2336
2368
|
* @function init 初始化Dark Mode配置
|
|
2337
2369
|
* @param {Function} opt.begin 开始处理时触发的回调
|
|
@@ -2349,31 +2381,38 @@ __webpack_require__.r(__webpack_exports__);
|
|
|
2349
2381
|
* @param {string} opt.defaultLightBgColor 非Dark Mode下背景颜色
|
|
2350
2382
|
* @param {string} opt.defaultDarkTextColor Dark Mode下字体颜色
|
|
2351
2383
|
* @param {string} opt.defaultDarkBgColor Dark Mode下背景颜色
|
|
2384
|
+
* @return void
|
|
2352
2385
|
*
|
|
2353
2386
|
* @function convertBg 处理背景
|
|
2354
2387
|
* @param {DOM Object Array} nodes 要处理的节点列表
|
|
2388
|
+
* @return void
|
|
2355
2389
|
*
|
|
2356
2390
|
* @function updateStyle 更新节点Dark Mode样式
|
|
2357
2391
|
* @param {DOM Object} node 要更新的节点
|
|
2358
2392
|
* @param {Object} styles 更新的样式键值对对象，如：{ color: '#ddd' }
|
|
2393
|
+
* @return void
|
|
2359
2394
|
*
|
|
2360
2395
|
* @function getContrast 获取两个颜色的对比度
|
|
2361
2396
|
* @param {string} color1 要计算颜色对比度的颜色1，支持css颜色格式
|
|
2362
2397
|
* @param {string} color2 要计算颜色对比度的颜色2，支持css颜色格式
|
|
2363
|
-
* @return {number}
|
|
2398
|
+
* @return {number} 颜色对比度，取值范围为`[1, 21]`
|
|
2364
2399
|
*
|
|
2365
2400
|
* @function extend 挂载插件
|
|
2366
2401
|
* @param {Array} pluginList 插件列表
|
|
2402
|
+
* @return void
|
|
2367
2403
|
*
|
|
2368
2404
|
*/
|
|
2369
2405
|
|
|
2370
|
-
|
|
2406
|
+
// 常量
|
|
2371
2407
|
|
|
2408
|
+
var classReg = new RegExp("".concat(_modules_constant__WEBPACK_IMPORTED_MODULE_0__["CLASS_PREFIX"], "[^ ]+"), 'g');
|
|
2372
2409
|
|
|
2373
|
-
|
|
2410
|
+
// Darkmode配置
|
|
2374
2411
|
|
|
2375
|
-
var mql = null;
|
|
2376
2412
|
|
|
2413
|
+
|
|
2414
|
+
// Dark Mode切换
|
|
2415
|
+
var mql = null;
|
|
2377
2416
|
var switchToDarkmode = function switchToDarkmode(mqlObj) {
|
|
2378
2417
|
var opt = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {
|
|
2379
2418
|
type: 'dom'
|
|
@@ -2384,7 +2423,6 @@ var switchToDarkmode = function switchToDarkmode(mqlObj) {
|
|
|
2384
2423
|
|
|
2385
2424
|
try {
|
|
2386
2425
|
_modules_global__WEBPACK_IMPORTED_MODULE_2__["sdk"].isDarkmode = _modules_config__WEBPACK_IMPORTED_MODULE_1__["default"].mode ? _modules_config__WEBPACK_IMPORTED_MODULE_1__["default"].mode === 'dark' : mqlObj.matches;
|
|
2387
|
-
|
|
2388
2426
|
if (opt.type === 'dom') {
|
|
2389
2427
|
// 处理节点
|
|
2390
2428
|
_modules_global__WEBPACK_IMPORTED_MODULE_2__["sdk"].isDarkmode && typeof _modules_config__WEBPACK_IMPORTED_MODULE_1__["default"].begin === 'function' && _modules_config__WEBPACK_IMPORTED_MODULE_1__["default"].begin(_modules_global__WEBPACK_IMPORTED_MODULE_2__["domUtils"].hasDelay());
|
|
@@ -2402,24 +2440,20 @@ var switchToDarkmode = function switchToDarkmode(mqlObj) {
|
|
|
2402
2440
|
var rect = node.getBoundingClientRect();
|
|
2403
2441
|
var top = rect.top;
|
|
2404
2442
|
var bottom = rect.bottom;
|
|
2405
|
-
|
|
2406
2443
|
if (top <= 0 && bottom <= 0) {
|
|
2407
2444
|
// 首屏前面
|
|
2408
2445
|
_modules_global__WEBPACK_IMPORTED_MODULE_2__["cssUtils"].addCss(_modules_global__WEBPACK_IMPORTED_MODULE_2__["sdk"].convert(node)); // 写入非首屏样式
|
|
2409
2446
|
} else if (top > 0 && top < _modules_constant__WEBPACK_IMPORTED_MODULE_0__["PAGE_HEIGHT"] || bottom > 0 && bottom < _modules_constant__WEBPACK_IMPORTED_MODULE_0__["PAGE_HEIGHT"]) {
|
|
2410
2447
|
// 首屏
|
|
2411
2448
|
_modules_global__WEBPACK_IMPORTED_MODULE_2__["domUtils"].addFirstPageNode(node); // 记录首屏节点
|
|
2412
|
-
|
|
2413
2449
|
_modules_global__WEBPACK_IMPORTED_MODULE_2__["cssUtils"].addCss(_modules_global__WEBPACK_IMPORTED_MODULE_2__["sdk"].convert(node), true); // 写入首屏样式
|
|
2414
2450
|
} else {
|
|
2415
2451
|
// 首屏后面，理论上，这里最多只会进来一次
|
|
2416
2452
|
_modules_config__WEBPACK_IMPORTED_MODULE_1__["default"].needJudgeFirstPage = false; // 至此，不需要再判断首屏了
|
|
2417
|
-
// 显示首屏
|
|
2418
2453
|
|
|
2454
|
+
// 显示首屏
|
|
2419
2455
|
_modules_global__WEBPACK_IMPORTED_MODULE_2__["cssUtils"].writeStyle(true); // 写入首屏样式表
|
|
2420
|
-
|
|
2421
2456
|
_modules_global__WEBPACK_IMPORTED_MODULE_2__["domUtils"].showFirstPageNodes(); // 显示首屏节点
|
|
2422
|
-
|
|
2423
2457
|
typeof _modules_config__WEBPACK_IMPORTED_MODULE_1__["default"].showFirstPage === 'function' && _modules_config__WEBPACK_IMPORTED_MODULE_1__["default"].showFirstPage(); // 执行首屏回调
|
|
2424
2458
|
|
|
2425
2459
|
_modules_global__WEBPACK_IMPORTED_MODULE_2__["cssUtils"].addCss(_modules_global__WEBPACK_IMPORTED_MODULE_2__["sdk"].convert(node)); // 写入非首屏样式
|
|
@@ -2427,6 +2461,7 @@ var switchToDarkmode = function switchToDarkmode(mqlObj) {
|
|
|
2427
2461
|
}
|
|
2428
2462
|
}
|
|
2429
2463
|
});
|
|
2464
|
+
|
|
2430
2465
|
_modules_global__WEBPACK_IMPORTED_MODULE_2__["plugins"].loopTimes++;
|
|
2431
2466
|
} else if (opt.type === 'bg') {
|
|
2432
2467
|
// 处理背景
|
|
@@ -2444,16 +2479,15 @@ var switchToDarkmode = function switchToDarkmode(mqlObj) {
|
|
|
2444
2479
|
}
|
|
2445
2480
|
|
|
2446
2481
|
_modules_global__WEBPACK_IMPORTED_MODULE_2__["cssUtils"].writeStyle(); // 写入非首屏样式表
|
|
2447
|
-
|
|
2448
2482
|
_modules_global__WEBPACK_IMPORTED_MODULE_2__["domUtils"].emptyFirstPageNodes(); // 清空记录的首屏节点
|
|
2449
2483
|
|
|
2450
2484
|
if (!_modules_global__WEBPACK_IMPORTED_MODULE_2__["sdk"].isDarkmode) {
|
|
2451
2485
|
// 非Dark Mode
|
|
2452
2486
|
// 首次加载页面时为非Dark Mode，标记为不需要判断首屏
|
|
2453
|
-
_modules_config__WEBPACK_IMPORTED_MODULE_1__["default"].needJudgeFirstPage = false;
|
|
2487
|
+
_modules_config__WEBPACK_IMPORTED_MODULE_1__["default"].needJudgeFirstPage = false;
|
|
2454
2488
|
|
|
2489
|
+
// 首次加载页面时为非Dark Mode，标记为不延迟判断背景
|
|
2455
2490
|
_modules_config__WEBPACK_IMPORTED_MODULE_1__["default"].delayBgJudge = false;
|
|
2456
|
-
|
|
2457
2491
|
if (_modules_config__WEBPACK_IMPORTED_MODULE_1__["default"].container === null && opt.type === 'dom' && _modules_global__WEBPACK_IMPORTED_MODULE_2__["domUtils"].length) {
|
|
2458
2492
|
_modules_global__WEBPACK_IMPORTED_MODULE_2__["domUtils"].delay(); // 将节点转移到延迟处理队列里
|
|
2459
2493
|
}
|
|
@@ -2464,6 +2498,7 @@ var switchToDarkmode = function switchToDarkmode(mqlObj) {
|
|
|
2464
2498
|
}
|
|
2465
2499
|
};
|
|
2466
2500
|
|
|
2501
|
+
// 初始化Dark Mode配置并运行Dark Mode处理
|
|
2467
2502
|
function run(nodes, opt) {
|
|
2468
2503
|
init(opt); // 初始化配置
|
|
2469
2504
|
|
|
@@ -2474,6 +2509,8 @@ function run(nodes, opt) {
|
|
|
2474
2509
|
});
|
|
2475
2510
|
}
|
|
2476
2511
|
;
|
|
2512
|
+
|
|
2513
|
+
// 初始化Dark Mode配置
|
|
2477
2514
|
function init() {
|
|
2478
2515
|
var opt = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
|
|
2479
2516
|
if (_modules_config__WEBPACK_IMPORTED_MODULE_1__["default"].hasInit) return; // 只可设置一次配置
|
|
@@ -2482,7 +2519,6 @@ function init() {
|
|
|
2482
2519
|
|
|
2483
2520
|
var tagName = _modules_config__WEBPACK_IMPORTED_MODULE_1__["default"].whitelist.tagName;
|
|
2484
2521
|
var attribute = _modules_config__WEBPACK_IMPORTED_MODULE_1__["default"].whitelist.attribute;
|
|
2485
|
-
|
|
2486
2522
|
if (opt.whitelist) {
|
|
2487
2523
|
opt.whitelist.tagName instanceof Array && opt.whitelist.tagName.forEach(function (item) {
|
|
2488
2524
|
item = item.toUpperCase();
|
|
@@ -2492,12 +2528,10 @@ function init() {
|
|
|
2492
2528
|
attribute.indexOf(item) === -1 && attribute.push(item);
|
|
2493
2529
|
});
|
|
2494
2530
|
}
|
|
2495
|
-
|
|
2496
2531
|
if (['dark', 'light'].indexOf(opt.mode) > -1) {
|
|
2497
2532
|
_modules_config__WEBPACK_IMPORTED_MODULE_1__["default"].set('string', opt, 'mode');
|
|
2498
2533
|
opt.mode === 'dark' && document.getElementsByTagName('html')[0].classList.add(_modules_constant__WEBPACK_IMPORTED_MODULE_0__["HTML_CLASS"]);
|
|
2499
2534
|
}
|
|
2500
|
-
|
|
2501
2535
|
_modules_config__WEBPACK_IMPORTED_MODULE_1__["default"].set('function', opt, 'begin');
|
|
2502
2536
|
_modules_config__WEBPACK_IMPORTED_MODULE_1__["default"].set('function', opt, 'showFirstPage');
|
|
2503
2537
|
_modules_config__WEBPACK_IMPORTED_MODULE_1__["default"].set('function', opt, 'error');
|
|
@@ -2510,20 +2544,20 @@ function init() {
|
|
|
2510
2544
|
_modules_config__WEBPACK_IMPORTED_MODULE_1__["default"].set('string', opt, 'defaultDarkTextColor');
|
|
2511
2545
|
_modules_config__WEBPACK_IMPORTED_MODULE_1__["default"].set('string', opt, 'defaultDarkBgColor');
|
|
2512
2546
|
_modules_global__WEBPACK_IMPORTED_MODULE_2__["sdk"].init();
|
|
2513
|
-
|
|
2514
2547
|
if (!_modules_config__WEBPACK_IMPORTED_MODULE_1__["default"].mode && mql === null && window.matchMedia) {
|
|
2515
2548
|
// 匹配媒体查询
|
|
2516
2549
|
mql = window.matchMedia(_modules_constant__WEBPACK_IMPORTED_MODULE_0__["MEDIA_QUERY"]);
|
|
2517
2550
|
mql.addListener(switchToDarkmode); // 监听
|
|
2518
2551
|
}
|
|
2519
2552
|
}
|
|
2553
|
+
|
|
2520
2554
|
;
|
|
2555
|
+
|
|
2556
|
+
// 处理背景
|
|
2521
2557
|
function convertBg(nodes) {
|
|
2522
2558
|
_modules_global__WEBPACK_IMPORTED_MODULE_2__["domUtils"].set(nodes);
|
|
2523
|
-
|
|
2524
2559
|
if (_modules_config__WEBPACK_IMPORTED_MODULE_1__["default"].container !== null) {
|
|
2525
2560
|
_modules_global__WEBPACK_IMPORTED_MODULE_2__["bgStack"].update(nodes); // 更新背景堆栈
|
|
2526
|
-
|
|
2527
2561
|
_modules_global__WEBPACK_IMPORTED_MODULE_2__["tnQueue"].update(nodes); // 更新文字队列
|
|
2528
2562
|
}
|
|
2529
2563
|
|
|
@@ -2533,19 +2567,24 @@ function convertBg(nodes) {
|
|
|
2533
2567
|
});
|
|
2534
2568
|
}
|
|
2535
2569
|
;
|
|
2570
|
+
|
|
2571
|
+
// 更新节点Dark Mode样式
|
|
2536
2572
|
function updateStyle(node, styles) {
|
|
2537
2573
|
if (!_modules_global__WEBPACK_IMPORTED_MODULE_2__["cssUtils"].isFinish) return; // 没有运行过Dark Mode处理逻辑则无需运行
|
|
2538
|
-
|
|
2539
2574
|
_modules_global__WEBPACK_IMPORTED_MODULE_2__["cssUtils"].addCss(_modules_global__WEBPACK_IMPORTED_MODULE_2__["sdk"].convert(node, styles ? Object.keys(styles).map(function (key) {
|
|
2540
2575
|
return [key, styles[key]];
|
|
2541
2576
|
}) : undefined, true), false);
|
|
2542
2577
|
_modules_global__WEBPACK_IMPORTED_MODULE_2__["cssUtils"].writeStyle();
|
|
2543
2578
|
}
|
|
2544
2579
|
;
|
|
2580
|
+
|
|
2581
|
+
// 获取两个颜色的对比度
|
|
2545
2582
|
function getContrast(color1, color2) {
|
|
2546
2583
|
return _modules_global__WEBPACK_IMPORTED_MODULE_2__["sdk"].getContrast(color1, color2);
|
|
2547
2584
|
}
|
|
2548
2585
|
;
|
|
2586
|
+
|
|
2587
|
+
// 挂载插件
|
|
2549
2588
|
function extend(pluginList) {
|
|
2550
2589
|
pluginList.forEach(function (plugin) {
|
|
2551
2590
|
return _modules_global__WEBPACK_IMPORTED_MODULE_2__["plugins"].extend(plugin);
|
|
@@ -2567,13 +2606,9 @@ __webpack_require__.r(__webpack_exports__);
|
|
|
2567
2606
|
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "default", function() { return BgNodeStack; });
|
|
2568
2607
|
/* harmony import */ var _config__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./config */ "./src/modules/config.js");
|
|
2569
2608
|
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
|
|
2570
|
-
|
|
2571
2609
|
function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
|
|
2572
|
-
|
|
2573
2610
|
function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); Object.defineProperty(Constructor, "prototype", { writable: false }); return Constructor; }
|
|
2574
|
-
|
|
2575
2611
|
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
|
|
2576
|
-
|
|
2577
2612
|
/**
|
|
2578
2613
|
* @name 需要判断位置的背景节点堆栈
|
|
2579
2614
|
*
|
|
@@ -2585,69 +2620,71 @@ function _defineProperty(obj, key, value) { if (key in obj) { Object.definePrope
|
|
|
2585
2620
|
* @method push 背景节点入栈
|
|
2586
2621
|
* @param {DOM Object} el 背景节点对象
|
|
2587
2622
|
* @param {string} cssKV css键值对
|
|
2623
|
+
* @return void
|
|
2588
2624
|
*
|
|
2589
2625
|
* @method contains 判断节点是否在背景节点的区域
|
|
2590
2626
|
* @param {DOM Object} el 要判断的节点对象（非背景节点）
|
|
2591
2627
|
* @param {Function} callback 如果在背景节点区域内，则执行该回调函数
|
|
2628
|
+
* @return void
|
|
2592
2629
|
*
|
|
2593
2630
|
* @method update 更新堆栈的节点对象，主要解决前后节点不一致的问题
|
|
2594
2631
|
* @param {DOM Object Array} els 要更新的节点对象列表
|
|
2632
|
+
* @return void
|
|
2595
2633
|
*
|
|
2596
2634
|
*/
|
|
2597
|
-
// Darkmode配置
|
|
2598
2635
|
|
|
2636
|
+
// Darkmode配置
|
|
2599
2637
|
|
|
2600
2638
|
var BgNodeStack = /*#__PURE__*/function () {
|
|
2601
2639
|
// 需要判断位置的背景堆栈，{ el, className, cssKV, updated, rect }
|
|
2602
2640
|
// 索引值
|
|
2641
|
+
|
|
2603
2642
|
function BgNodeStack(prefix) {
|
|
2604
2643
|
_classCallCheck(this, BgNodeStack);
|
|
2605
|
-
|
|
2606
2644
|
_defineProperty(this, "_stack", []);
|
|
2607
|
-
|
|
2608
2645
|
_defineProperty(this, "_idx", 0);
|
|
2609
|
-
|
|
2610
2646
|
this._prefix = prefix;
|
|
2611
2647
|
this.classNameReg = new RegExp("".concat(this._prefix, "\\d+"));
|
|
2612
2648
|
}
|
|
2613
2649
|
|
|
2650
|
+
// 背景节点入栈
|
|
2614
2651
|
_createClass(BgNodeStack, [{
|
|
2615
2652
|
key: "push",
|
|
2616
|
-
value: function push(el, cssKV) {
|
|
2653
|
+
value: function push(el, cssKV, cb) {
|
|
2617
2654
|
var className = "".concat(this._prefix).concat(this._idx++);
|
|
2618
2655
|
el.classList.add(className);
|
|
2619
|
-
|
|
2620
2656
|
this._stack.unshift({
|
|
2621
2657
|
el: el,
|
|
2622
2658
|
className: className,
|
|
2623
2659
|
cssKV: cssKV,
|
|
2624
|
-
updated: !_config__WEBPACK_IMPORTED_MODULE_0__["default"].delayBgJudge
|
|
2660
|
+
updated: !_config__WEBPACK_IMPORTED_MODULE_0__["default"].delayBgJudge,
|
|
2661
|
+
cb: cb
|
|
2625
2662
|
});
|
|
2626
2663
|
}
|
|
2664
|
+
|
|
2665
|
+
// 判断节点是否在背景节点的区域
|
|
2627
2666
|
}, {
|
|
2628
2667
|
key: "contains",
|
|
2629
2668
|
value: function contains(el, callback) {
|
|
2630
2669
|
var rect = el.getBoundingClientRect();
|
|
2631
2670
|
var idxStack = [];
|
|
2632
|
-
|
|
2633
2671
|
this._stack.forEach(function (item, i) {
|
|
2634
2672
|
if (item.updated) {
|
|
2635
2673
|
if (!item.rect) item.rect = item.el.getBoundingClientRect();
|
|
2636
2674
|
var bgRect = item.rect;
|
|
2637
|
-
|
|
2638
2675
|
if (!(rect.top >= bgRect.bottom || rect.bottom <= bgRect.top || rect.left >= bgRect.right || rect.right <= bgRect.left)) {
|
|
2639
2676
|
// 表示节点在背景图内
|
|
2640
2677
|
idxStack.unshift(i);
|
|
2641
2678
|
}
|
|
2642
2679
|
}
|
|
2643
2680
|
});
|
|
2644
|
-
|
|
2645
2681
|
while (idxStack.length) {
|
|
2646
2682
|
var item = this._stack.splice(idxStack.shift(), 1)[0];
|
|
2647
|
-
|
|
2648
2683
|
typeof callback === 'function' && callback(item);
|
|
2649
2684
|
}
|
|
2650
2685
|
}
|
|
2686
|
+
|
|
2687
|
+
// 更新堆栈的节点对象，主要解决前后节点不一致的问题
|
|
2651
2688
|
}, {
|
|
2652
2689
|
key: "update",
|
|
2653
2690
|
value: function update(els) {
|
|
@@ -2659,22 +2696,175 @@ var BgNodeStack = /*#__PURE__*/function () {
|
|
|
2659
2696
|
item.updated = true;
|
|
2660
2697
|
return true;
|
|
2661
2698
|
}
|
|
2662
|
-
|
|
2663
2699
|
return false;
|
|
2664
2700
|
});
|
|
2665
2701
|
}
|
|
2666
2702
|
});
|
|
2667
2703
|
}
|
|
2668
2704
|
}]);
|
|
2669
|
-
|
|
2670
2705
|
return BgNodeStack;
|
|
2671
2706
|
}();
|
|
2672
2707
|
|
|
2673
|
-
|
|
2674
2708
|
;
|
|
2675
2709
|
|
|
2676
2710
|
/***/ }),
|
|
2677
2711
|
|
|
2712
|
+
/***/ "./src/modules/color.js":
|
|
2713
|
+
/*!******************************!*\
|
|
2714
|
+
!*** ./src/modules/color.js ***!
|
|
2715
|
+
\******************************/
|
|
2716
|
+
/*! exports provided: ColorParser, parseColorName, parseWebkitFillColorAndStrokeColor, mixColors, getColorPerceivedBrightness, adjustBrightnessTo */
|
|
2717
|
+
/***/ (function(module, __webpack_exports__, __webpack_require__) {
|
|
2718
|
+
|
|
2719
|
+
"use strict";
|
|
2720
|
+
__webpack_require__.r(__webpack_exports__);
|
|
2721
|
+
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "ColorParser", function() { return ColorParser; });
|
|
2722
|
+
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "parseColorName", function() { return parseColorName; });
|
|
2723
|
+
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "parseWebkitFillColorAndStrokeColor", function() { return parseWebkitFillColorAndStrokeColor; });
|
|
2724
|
+
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "mixColors", function() { return mixColors; });
|
|
2725
|
+
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "getColorPerceivedBrightness", function() { return getColorPerceivedBrightness; });
|
|
2726
|
+
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "adjustBrightnessTo", function() { return adjustBrightnessTo; });
|
|
2727
|
+
/* harmony import */ var color__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! color */ "./node_modules/color/index.js");
|
|
2728
|
+
/* harmony import */ var color__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(color__WEBPACK_IMPORTED_MODULE_0__);
|
|
2729
|
+
/* harmony import */ var color_name__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! color-name */ "./node_modules/color-name/index.js");
|
|
2730
|
+
/* harmony import */ var color_name__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(color_name__WEBPACK_IMPORTED_MODULE_1__);
|
|
2731
|
+
/* harmony import */ var color_blend__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! color-blend */ "./node_modules/color-blend/dist/index.modern.js");
|
|
2732
|
+
/* harmony import */ var _constant__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./constant */ "./src/modules/constant.js");
|
|
2733
|
+
/**
|
|
2734
|
+
* @name 颜色操作相关API
|
|
2735
|
+
*
|
|
2736
|
+
* @function ColorParser 实例化Color对象，传参非法时返回null
|
|
2737
|
+
* @param {string} color css色值
|
|
2738
|
+
* @return {Color Object | null} 实例化结果
|
|
2739
|
+
*
|
|
2740
|
+
* @function parseColorName 处理颜色，包括清除!important和转换英文定义颜色
|
|
2741
|
+
* @param {string} color css色值
|
|
2742
|
+
* @param {boolean} supportTransparent 是否支持转换transparent
|
|
2743
|
+
* @return {string} 处理后的rgb(a)格式css色值
|
|
2744
|
+
*
|
|
2745
|
+
* @function parseWebkitFillColorAndStrokeColor 处理-webkit-fill-color和-webkit-text-stroke-color，返回处理后的色值，无则返回空字符串
|
|
2746
|
+
* @param {string} color css色值
|
|
2747
|
+
* @return {string} 处理后的rgb(a)格式css色值，无则返回空字符串
|
|
2748
|
+
*
|
|
2749
|
+
* @function mixColors 计算混合颜色
|
|
2750
|
+
* @param {string} colors 用于计算的颜色数组
|
|
2751
|
+
* @param {string} type 使用的混合颜色算法，支持 mix(默认) | normal | multiply | screen | overlay | darken | lighten | colorDodge | colorBurn | hardLight | softLight | difference | exclusion | hue | saturation | color | luminosity
|
|
2752
|
+
* @return {Color Object | null} 混合结果
|
|
2753
|
+
*
|
|
2754
|
+
* @function getColorPerceivedBrightness 计算感知亮度
|
|
2755
|
+
* @param {RGB Array} rgb 要计算的颜色rgb数组，如：[255, 0, 0]
|
|
2756
|
+
* @return {number} 感知亮度
|
|
2757
|
+
*
|
|
2758
|
+
* @function adjustBrightnessTo 调整为指定感知亮度
|
|
2759
|
+
* @param {number} target 指定的感知亮度值
|
|
2760
|
+
* @param {RGB Array} rgb 要调整的颜色rgb数组，如：[255, 0, 0]
|
|
2761
|
+
* @return {Color Object} 调整后的颜色
|
|
2762
|
+
*
|
|
2763
|
+
*/
|
|
2764
|
+
|
|
2765
|
+
|
|
2766
|
+
|
|
2767
|
+
color_name__WEBPACK_IMPORTED_MODULE_1___default.a.windowtext = [0, 0, 0]; // 补上这个colorName
|
|
2768
|
+
color_name__WEBPACK_IMPORTED_MODULE_1___default.a.transparent = [255, 255, 255, 0]; // 支持透明，暂定用白色透明度0来表示
|
|
2769
|
+
|
|
2770
|
+
|
|
2771
|
+
// 常量
|
|
2772
|
+
|
|
2773
|
+
var COLOR_NAME_REG = new RegExp(Object.keys(color_name__WEBPACK_IMPORTED_MODULE_1___default.a).map(function (colorName) {
|
|
2774
|
+
return "\\b".concat(colorName, "\\b");
|
|
2775
|
+
}).join('|'), 'ig'); // 生成正则表达式来匹配这些colorName
|
|
2776
|
+
|
|
2777
|
+
// Color对象 => ColorBlend对象
|
|
2778
|
+
var color2ColorBlend = function color2ColorBlend(color) {
|
|
2779
|
+
var obj = color.object();
|
|
2780
|
+
obj.a = obj.alpha || 1;
|
|
2781
|
+
delete obj.alpha;
|
|
2782
|
+
return obj;
|
|
2783
|
+
};
|
|
2784
|
+
|
|
2785
|
+
// ColorBlend对象 => Color对象
|
|
2786
|
+
var colorBlend2Color = function colorBlend2Color(colorBlend) {
|
|
2787
|
+
colorBlend.alpha = colorBlend.a;
|
|
2788
|
+
delete colorBlend.a;
|
|
2789
|
+
return ColorParser(colorBlend);
|
|
2790
|
+
};
|
|
2791
|
+
|
|
2792
|
+
// 实例化Color对象，传参非法时返回null
|
|
2793
|
+
var ColorParser = function ColorParser(color) {
|
|
2794
|
+
var res = null;
|
|
2795
|
+
try {
|
|
2796
|
+
res = color instanceof color__WEBPACK_IMPORTED_MODULE_0___default.a ? color : color__WEBPACK_IMPORTED_MODULE_0___default()(color);
|
|
2797
|
+
} catch (e) {
|
|
2798
|
+
console.log("ignore the invalid color: `".concat(color, "`"));
|
|
2799
|
+
}
|
|
2800
|
+
return res;
|
|
2801
|
+
};
|
|
2802
|
+
|
|
2803
|
+
// 处理颜色，包括清除!important和转换英文定义颜色
|
|
2804
|
+
var parseColorName = function parseColorName(color, supportTransparent) {
|
|
2805
|
+
return color.replace(_constant__WEBPACK_IMPORTED_MODULE_3__["IMPORTANT_REGEXP"], '').replace(COLOR_NAME_REG, function (match) {
|
|
2806
|
+
if (!supportTransparent && match === 'transparent') return match; // 如果不支持转换transparent，直接返回transparent
|
|
2807
|
+
|
|
2808
|
+
var color = color_name__WEBPACK_IMPORTED_MODULE_1___default.a[match.toLowerCase()];
|
|
2809
|
+
return "".concat(color.length > 3 ? 'rgba' : 'rgb', "(").concat(color.toString(), ")");
|
|
2810
|
+
});
|
|
2811
|
+
};
|
|
2812
|
+
|
|
2813
|
+
// 处理-webkit-fill-color和-webkit-text-stroke-color，返回处理后的色值，无则返回空字符串
|
|
2814
|
+
var parseWebkitFillColorAndStrokeColor = function parseWebkitFillColorAndStrokeColor(color) {
|
|
2815
|
+
var newValue = parseColorName(color);
|
|
2816
|
+
return _constant__WEBPACK_IMPORTED_MODULE_3__["COLOR_REGEXP"].test(newValue) ? newValue : '';
|
|
2817
|
+
};
|
|
2818
|
+
|
|
2819
|
+
// 计算混合颜色
|
|
2820
|
+
var mixColors = function mixColors(colors) {
|
|
2821
|
+
var type = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 'mix';
|
|
2822
|
+
if (Object.prototype.toString.call(colors) !== '[object Array]' || colors.length < 1) return null;
|
|
2823
|
+
if (colors.length === 1) return colors[0];
|
|
2824
|
+
var color1 = ColorParser(colors.shift());
|
|
2825
|
+
var color2 = ColorParser(colors.shift());
|
|
2826
|
+
while (color2) {
|
|
2827
|
+
if (!color1 && color2) {
|
|
2828
|
+
// 如果当前色值非法，混入色值合法，则直接使用混入色值
|
|
2829
|
+
color1 = color2;
|
|
2830
|
+
} else if (!color1 && !color2) {
|
|
2831
|
+
// 如果两个色值都非法，则使用下一批色值
|
|
2832
|
+
if (colors.length === 0) break;
|
|
2833
|
+
color1 = ColorParser(colors.shift());
|
|
2834
|
+
} else if (color1 && color2) {
|
|
2835
|
+
// 如果两个色值都合法，执行mix
|
|
2836
|
+
color1 = type === 'mix' ? color1.mix(color2, color2.alpha()) : colorBlend2Color(color_blend__WEBPACK_IMPORTED_MODULE_2__[type](color2ColorBlend(color1), color2ColorBlend(color2)));
|
|
2837
|
+
} // 如果当前色值合法，混入色值非法，无需处理
|
|
2838
|
+
|
|
2839
|
+
if (colors.length === 0) break;
|
|
2840
|
+
color2 = ColorParser(colors.shift());
|
|
2841
|
+
}
|
|
2842
|
+
return color1 || null;
|
|
2843
|
+
};
|
|
2844
|
+
|
|
2845
|
+
// 计算感知亮度
|
|
2846
|
+
var getColorPerceivedBrightness = function getColorPerceivedBrightness(rgb) {
|
|
2847
|
+
return (rgb[0] * 299 + rgb[1] * 587 + rgb[2] * 114) / 1000;
|
|
2848
|
+
};
|
|
2849
|
+
|
|
2850
|
+
// 调整为指定感知亮度
|
|
2851
|
+
var adjustBrightnessTo = function adjustBrightnessTo(target, rgb) {
|
|
2852
|
+
var relativeBrightnessRatio = target / getColorPerceivedBrightness(rgb);
|
|
2853
|
+
var newTextR = Math.min(255, rgb[0] * relativeBrightnessRatio);
|
|
2854
|
+
var newTextG = Math.min(255, rgb[1] * relativeBrightnessRatio);
|
|
2855
|
+
var newTextB = Math.min(255, rgb[2] * relativeBrightnessRatio);
|
|
2856
|
+
if (newTextG === 0 || newTextR === 255 || newTextB === 255) {
|
|
2857
|
+
newTextG = (target * 1000 - newTextR * 299 - newTextB * 114) / 587;
|
|
2858
|
+
} else if (newTextR === 0) {
|
|
2859
|
+
newTextR = (target * 1000 - newTextG * 587 - newTextB * 114) / 299;
|
|
2860
|
+
} else if (newTextB === 0 || newTextG === 255) {
|
|
2861
|
+
newTextB = (target * 1000 - newTextR * 299 - newTextG * 587) / 114;
|
|
2862
|
+
}
|
|
2863
|
+
return color__WEBPACK_IMPORTED_MODULE_0___default.a.rgb(newTextR, newTextG, newTextB);
|
|
2864
|
+
};
|
|
2865
|
+
|
|
2866
|
+
/***/ }),
|
|
2867
|
+
|
|
2678
2868
|
/***/ "./src/modules/config.js":
|
|
2679
2869
|
/*!*******************************!*\
|
|
2680
2870
|
!*** ./src/modules/config.js ***!
|
|
@@ -2695,6 +2885,7 @@ __webpack_require__.r(__webpack_exports__);
|
|
|
2695
2885
|
* @attr {string} mode 强制指定的颜色模式(dark|light), 指定了就不监听系统颜色
|
|
2696
2886
|
* @attr {Object} whitelist 节点白名单
|
|
2697
2887
|
* @attr {string Array} whitelist.tagName 标签名列表
|
|
2888
|
+
* @attr {string Array} whitelist.attribute 属性列表
|
|
2698
2889
|
* @attr {boolean} needJudgeFirstPage 是否需要判断首屏
|
|
2699
2890
|
* @attr {boolean} delayBgJudge 是否延迟背景判断
|
|
2700
2891
|
* @attr {DOM Object} container 延迟运行js时使用的容器
|
|
@@ -2708,49 +2899,65 @@ __webpack_require__.r(__webpack_exports__);
|
|
|
2708
2899
|
* @param {string} type 要处理的节点
|
|
2709
2900
|
* @param {Object} opt 传入的配置对象
|
|
2710
2901
|
* @param {string} key 配置名
|
|
2902
|
+
* @return void
|
|
2711
2903
|
*
|
|
2712
2904
|
*/
|
|
2713
2905
|
|
|
2906
|
+
// 常量
|
|
2907
|
+
|
|
2714
2908
|
var config = {
|
|
2715
2909
|
hasInit: false,
|
|
2910
|
+
// 是否初始化过配置
|
|
2911
|
+
|
|
2716
2912
|
// hooks
|
|
2717
2913
|
begin: null,
|
|
2914
|
+
// 开始处理时触发的回调
|
|
2718
2915
|
showFirstPage: null,
|
|
2916
|
+
// 首屏处理完成时触发的回调
|
|
2719
2917
|
error: null,
|
|
2918
|
+
// 发生error时触发的回调
|
|
2919
|
+
|
|
2720
2920
|
mode: '',
|
|
2921
|
+
// 强制指定的颜色模式(dark|light), 指定了就不监听系统颜色
|
|
2721
2922
|
whitelist: {
|
|
2923
|
+
// 节点白名单
|
|
2722
2924
|
tagName: ['MPCPS', 'IFRAME'],
|
|
2723
|
-
|
|
2925
|
+
// 标签名列表
|
|
2926
|
+
attribute: [] // 属性列表
|
|
2724
2927
|
},
|
|
2928
|
+
|
|
2725
2929
|
needJudgeFirstPage: true,
|
|
2930
|
+
// 是否需要判断首屏
|
|
2726
2931
|
delayBgJudge: false,
|
|
2932
|
+
// 是否延迟背景判断
|
|
2727
2933
|
container: null,
|
|
2934
|
+
// 延迟运行js时使用的容器
|
|
2728
2935
|
cssSelectorsPrefix: '',
|
|
2936
|
+
// css选择器前缀
|
|
2729
2937
|
defaultLightTextColor: _constant__WEBPACK_IMPORTED_MODULE_0__["DEFAULT_LIGHT_TEXTCOLOR"],
|
|
2938
|
+
// 非Dark Mode下字体颜色
|
|
2730
2939
|
defaultLightBgColor: _constant__WEBPACK_IMPORTED_MODULE_0__["DEFAULT_LIGHT_BGCOLOR"],
|
|
2940
|
+
// 非Dark Mode下背景颜色
|
|
2731
2941
|
defaultDarkTextColor: _constant__WEBPACK_IMPORTED_MODULE_0__["DEFAULT_DARK_TEXTCOLOR"],
|
|
2942
|
+
// Dark Mode下字体颜色
|
|
2732
2943
|
defaultDarkBgColor: _constant__WEBPACK_IMPORTED_MODULE_0__["DEFAULT_DARK_BGCOLOR"],
|
|
2944
|
+
// Dark Mode下背景颜色
|
|
2733
2945
|
// 设置配置
|
|
2734
2946
|
set: function set(type, opt, key) {
|
|
2735
2947
|
var value = opt[key];
|
|
2736
|
-
|
|
2737
2948
|
switch (type) {
|
|
2738
2949
|
case 'boolean':
|
|
2739
2950
|
typeof value === 'boolean' && (this[key] = value);
|
|
2740
2951
|
break;
|
|
2741
|
-
|
|
2742
2952
|
case 'string':
|
|
2743
2953
|
typeof value === 'string' && value !== '' && (this[key] = value);
|
|
2744
2954
|
break;
|
|
2745
|
-
|
|
2746
2955
|
case 'function':
|
|
2747
2956
|
typeof value === 'function' && (this[key] = value);
|
|
2748
2957
|
break;
|
|
2749
|
-
|
|
2750
2958
|
case 'dom':
|
|
2751
2959
|
value instanceof HTMLElement && (this[key] = value);
|
|
2752
2960
|
break;
|
|
2753
|
-
|
|
2754
2961
|
default:
|
|
2755
2962
|
}
|
|
2756
2963
|
}
|
|
@@ -2763,7 +2970,7 @@ var config = {
|
|
|
2763
2970
|
/*!*********************************!*\
|
|
2764
2971
|
!*** ./src/modules/constant.js ***!
|
|
2765
2972
|
\*********************************/
|
|
2766
|
-
/*! exports provided: MEDIA_QUERY, CLASS_PREFIX, DM_CLASSNAME_REGEXP, HTML_CLASS, COLORATTR, BGCOLORATTR, ORIGINAL_COLORATTR, ORIGINAL_BGCOLORATTR, BGIMAGEATTR, BG_COLOR_DELIMITER, DEFAULT_LIGHT_TEXTCOLOR, DEFAULT_LIGHT_BGCOLOR, DEFAULT_DARK_TEXTCOLOR, DEFAULT_DARK_BGCOLOR, WHITE_LIKE_COLOR_BRIGHTNESS, MAX_LIMIT_BGCOLOR_BRIGHTNESS, MIN_LIMIT_OFFSET_BRIGHTNESS, HIGH_BGCOLOR_BRIGHTNESS, HIGH_BLACKWHITE_HSL_BRIGHTNESS, LOW_BLACKWHITE_HSL_BRIGHTNESS, IGNORE_ALPHA, PAGE_HEIGHT, CSS_PROP_SERIES, CSS_PROP_LIST, TABLE_NAME, IMPORTANT_REGEXP, SEMICOLON_PLACEHOLDER, SEMICOLON_PLACEHOLDER_REGEXP */
|
|
2973
|
+
/*! exports provided: MEDIA_QUERY, CLASS_PREFIX, DM_CLASSNAME_REGEXP, HTML_CLASS, COLORATTR, BGCOLORATTR, ORIGINAL_COLORATTR, ORIGINAL_BGCOLORATTR, BGIMAGEATTR, COMPLEMENTARY_BGIMAGECOLORATTR, BG_COLOR_DELIMITER, DEFAULT_LIGHT_TEXTCOLOR, DEFAULT_LIGHT_BGCOLOR, DEFAULT_DARK_TEXTCOLOR, DEFAULT_DARK_BGCOLOR, WHITE_LIKE_COLOR_BRIGHTNESS, MAX_LIMIT_BGCOLOR_BRIGHTNESS, MIN_LIMIT_OFFSET_BRIGHTNESS, HIGH_BGCOLOR_BRIGHTNESS, HIGH_BLACKWHITE_HSL_BRIGHTNESS, LOW_BLACKWHITE_HSL_BRIGHTNESS, IGNORE_ALPHA, PAGE_HEIGHT, CSS_PROP_SERIES, CSS_PROP_LIST, TABLE_NAME, IMPORTANT_REGEXP, SEMICOLON_PLACEHOLDER, SEMICOLON_PLACEHOLDER_REGEXP, COLOR_REGEXP, COLOR_REGEXP_GLOBAL */
|
|
2767
2974
|
/***/ (function(module, __webpack_exports__, __webpack_require__) {
|
|
2768
2975
|
|
|
2769
2976
|
"use strict";
|
|
@@ -2777,6 +2984,7 @@ __webpack_require__.r(__webpack_exports__);
|
|
|
2777
2984
|
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "ORIGINAL_COLORATTR", function() { return ORIGINAL_COLORATTR; });
|
|
2778
2985
|
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "ORIGINAL_BGCOLORATTR", function() { return ORIGINAL_BGCOLORATTR; });
|
|
2779
2986
|
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "BGIMAGEATTR", function() { return BGIMAGEATTR; });
|
|
2987
|
+
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "COMPLEMENTARY_BGIMAGECOLORATTR", function() { return COMPLEMENTARY_BGIMAGECOLORATTR; });
|
|
2780
2988
|
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "BG_COLOR_DELIMITER", function() { return BG_COLOR_DELIMITER; });
|
|
2781
2989
|
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "DEFAULT_LIGHT_TEXTCOLOR", function() { return DEFAULT_LIGHT_TEXTCOLOR; });
|
|
2782
2990
|
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "DEFAULT_LIGHT_BGCOLOR", function() { return DEFAULT_LIGHT_BGCOLOR; });
|
|
@@ -2796,39 +3004,33 @@ __webpack_require__.r(__webpack_exports__);
|
|
|
2796
3004
|
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "IMPORTANT_REGEXP", function() { return IMPORTANT_REGEXP; });
|
|
2797
3005
|
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "SEMICOLON_PLACEHOLDER", function() { return SEMICOLON_PLACEHOLDER; });
|
|
2798
3006
|
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "SEMICOLON_PLACEHOLDER_REGEXP", function() { return SEMICOLON_PLACEHOLDER_REGEXP; });
|
|
3007
|
+
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "COLOR_REGEXP", function() { return COLOR_REGEXP; });
|
|
3008
|
+
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "COLOR_REGEXP_GLOBAL", function() { return COLOR_REGEXP_GLOBAL; });
|
|
2799
3009
|
/**
|
|
2800
3010
|
* @name 常量
|
|
2801
3011
|
*
|
|
2802
3012
|
*/
|
|
3013
|
+
|
|
2803
3014
|
var MEDIA_QUERY = '(prefers-color-scheme: dark)'; // Dark Mode的CSS媒体查询
|
|
2804
3015
|
|
|
2805
3016
|
var CLASS_PREFIX = 'js_darkmode__'; // Dark Mode class前缀
|
|
2806
|
-
|
|
2807
3017
|
var DM_CLASSNAME_REGEXP = new RegExp("".concat(CLASS_PREFIX, "\\d+"));
|
|
2808
3018
|
var HTML_CLASS = 'data_color_scheme_dark'; // 强制设置暗黑模式时给html加的class
|
|
2809
3019
|
|
|
2810
3020
|
var RANDOM = "".concat(new Date() * 1).concat(Math.round(Math.random() * 10)); // 生成个随机数，格式为时间戳+随机数
|
|
2811
|
-
|
|
2812
3021
|
var COLORATTR = "data-darkmode-color-".concat(RANDOM); // dm color，即算法生成的新色值，单个
|
|
2813
|
-
|
|
2814
3022
|
var BGCOLORATTR = "data-darkmode-bgcolor-".concat(RANDOM); // dm bg-color，即算法生成的新色值，有多个，用BG_COLOR_DELIMITER分割
|
|
2815
|
-
|
|
2816
3023
|
var ORIGINAL_COLORATTR = "data-darkmode-original-color-".concat(RANDOM); // lm color，即原色值，单个
|
|
2817
|
-
|
|
2818
3024
|
var ORIGINAL_BGCOLORATTR = "data-darkmode-original-bgcolor-".concat(RANDOM); // lm bg-color，即原色值，有多个，用BG_COLOR_DELIMITER分割
|
|
2819
|
-
|
|
2820
3025
|
var BGIMAGEATTR = "data-darkmode-bgimage-".concat(RANDOM);
|
|
3026
|
+
var COMPLEMENTARY_BGIMAGECOLORATTR = "data-darkmode-complementary-bgimagecolor-".concat(RANDOM); // 背景图片的补色色值，单个
|
|
2821
3027
|
var BG_COLOR_DELIMITER = '|';
|
|
2822
3028
|
var DEFAULT_LIGHT_TEXTCOLOR = '#191919'; // 非Dark Mode下字体颜色
|
|
2823
|
-
|
|
2824
3029
|
var DEFAULT_LIGHT_BGCOLOR = '#fff'; // 非Dark Mode下背景颜色
|
|
2825
|
-
|
|
2826
3030
|
var DEFAULT_DARK_TEXTCOLOR = '#a3a3a3'; // Dark Mode下字体颜色，前景色：rgba(255,255,255,0.6) 背景色：#191919
|
|
2827
|
-
|
|
2828
3031
|
var DEFAULT_DARK_BGCOLOR = '#191919'; // Dark Mode下背景颜色
|
|
2829
3032
|
|
|
2830
3033
|
var WHITE_LIKE_COLOR_BRIGHTNESS = 250; // 接近白色的感知亮度阈值
|
|
2831
|
-
|
|
2832
3034
|
var MAX_LIMIT_BGCOLOR_BRIGHTNESS = 190;
|
|
2833
3035
|
var MIN_LIMIT_OFFSET_BRIGHTNESS = 65;
|
|
2834
3036
|
var HIGH_BGCOLOR_BRIGHTNESS = 100;
|
|
@@ -2842,8 +3044,10 @@ var CSS_PROP_SERIES = {
|
|
|
2842
3044
|
BG_COLOR: ['background-color', 'background-image', 'background'],
|
|
2843
3045
|
TEXT_SHADOW: ['text-shadow'],
|
|
2844
3046
|
TEXT_COLOR: ['-webkit-text-stroke', '-webkit-text-stroke-color', 'text-decoration', 'text-decoration-color', 'text-emphasis-color', 'color', '-webkit-text-fill-color'],
|
|
2845
|
-
BORDER_COLOR: ['border-image', '-webkit-border-image', 'border', 'border-top', 'border-right', 'border-bottom', 'border-left', 'border-color', 'border-top-color', 'border-right-color', 'border-bottom-color', 'border-left-color', 'border-block-color', 'border-block-start-color', 'border-block-end-color', 'border-inline-color', 'border-inline-start-color', 'border-inline-end-color', 'outline', 'outline-color', 'box-shadow',
|
|
2846
|
-
|
|
3047
|
+
BORDER_COLOR: ['border-image', '-webkit-border-image', 'border', 'border-top', 'border-right', 'border-bottom', 'border-left', 'border-color', 'border-top-color', 'border-right-color', 'border-bottom-color', 'border-left-color', 'border-block-color', 'border-block-start-color', 'border-block-end-color', 'border-inline-color', 'border-inline-start-color', 'border-inline-end-color', 'outline', 'outline-color', 'box-shadow',
|
|
3048
|
+
// TODO: 不知道为啥之前没处理，后面需要留意下
|
|
3049
|
+
'column-rule', 'column-rule-color']
|
|
3050
|
+
// SVG_COLOR: [ // TODO: SVG后面再处理
|
|
2847
3051
|
// 'fill',
|
|
2848
3052
|
// 'stroke',
|
|
2849
3053
|
// 'stop-color',
|
|
@@ -2853,19 +3057,19 @@ var CSS_PROP_SERIES = {
|
|
|
2853
3057
|
// FILTER: [ // TODO: filter后面再考虑要不要处理
|
|
2854
3058
|
// 'filter'
|
|
2855
3059
|
// ],
|
|
2856
|
-
|
|
2857
3060
|
};
|
|
3061
|
+
|
|
2858
3062
|
var CSS_PROP_LIST = Object.keys(CSS_PROP_SERIES).map(function (key) {
|
|
2859
3063
|
return CSS_PROP_SERIES[key].join('|');
|
|
2860
3064
|
}).join('|').split('|'); // 支持的css属性平铺列表
|
|
2861
|
-
|
|
2862
3065
|
var TABLE_NAME = ['TABLE', 'TR', 'TD', 'TH']; // 支持bgcolor属性的table标签列表
|
|
2863
3066
|
|
|
2864
3067
|
var IMPORTANT_REGEXP = / !important$/; // !important
|
|
2865
3068
|
|
|
2866
3069
|
var SEMICOLON_PLACEHOLDER = '<$#_SEMICOLON_#$>'; // 分号占位符
|
|
2867
|
-
|
|
2868
3070
|
var SEMICOLON_PLACEHOLDER_REGEXP = /<\$#_SEMICOLON_#\$>/g;
|
|
3071
|
+
var COLOR_REGEXP = /\brgba?\([^)]+\)/i;
|
|
3072
|
+
var COLOR_REGEXP_GLOBAL = /\brgba?\([^)]+\)/ig;
|
|
2869
3073
|
|
|
2870
3074
|
/***/ }),
|
|
2871
3075
|
|
|
@@ -2883,25 +3087,15 @@ __webpack_require__.r(__webpack_exports__);
|
|
|
2883
3087
|
/* harmony import */ var _config__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./config */ "./src/modules/config.js");
|
|
2884
3088
|
/* harmony import */ var _global__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./global */ "./src/modules/global.js");
|
|
2885
3089
|
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
|
|
2886
|
-
|
|
2887
3090
|
function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
|
|
2888
|
-
|
|
2889
3091
|
function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
|
|
2890
|
-
|
|
2891
3092
|
function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
|
|
2892
|
-
|
|
2893
3093
|
function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"]; if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
|
|
2894
|
-
|
|
2895
3094
|
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
|
|
2896
|
-
|
|
2897
3095
|
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
|
|
2898
|
-
|
|
2899
3096
|
function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
|
|
2900
|
-
|
|
2901
3097
|
function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); Object.defineProperty(Constructor, "prototype", { writable: false }); return Constructor; }
|
|
2902
|
-
|
|
2903
3098
|
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
|
|
2904
|
-
|
|
2905
3099
|
/**
|
|
2906
3100
|
* @name 样式相关操作工具对象
|
|
2907
3101
|
*
|
|
@@ -2922,39 +3116,48 @@ function _defineProperty(obj, key, value) { if (key in obj) { Object.definePrope
|
|
|
2922
3116
|
* @method addCss 加入css
|
|
2923
3117
|
* @param {string} css css样式
|
|
2924
3118
|
* @param {boolean} isFirstPageStyle 是否首屏样式
|
|
3119
|
+
* @return void
|
|
2925
3120
|
*
|
|
2926
3121
|
* @method writeStyle 写入样式表
|
|
2927
3122
|
* @param {boolean} isFirstPageStyle 是否首屏样式
|
|
3123
|
+
* @return void
|
|
2928
3124
|
*
|
|
2929
3125
|
*/
|
|
2930
|
-
// Darkmode配置
|
|
2931
3126
|
|
|
3127
|
+
// 常量
|
|
2932
3128
|
|
|
2933
3129
|
|
|
3130
|
+
// Darkmode配置
|
|
3131
|
+
|
|
2934
3132
|
|
|
2935
3133
|
var CssUtils = /*#__PURE__*/function () {
|
|
2936
3134
|
// 首屏样式
|
|
2937
3135
|
// 非首屏样式
|
|
3136
|
+
|
|
3137
|
+
// 是否运行过Dark Mode处理逻辑（写入过非首屏样式表则表示已运行过）
|
|
3138
|
+
|
|
2938
3139
|
function CssUtils() {
|
|
2939
3140
|
_classCallCheck(this, CssUtils);
|
|
2940
|
-
|
|
2941
3141
|
_defineProperty(this, "_firstPageStyle", '');
|
|
2942
|
-
|
|
2943
3142
|
_defineProperty(this, "_otherPageStyle", '');
|
|
2944
|
-
|
|
2945
3143
|
_defineProperty(this, "isFinish", false);
|
|
2946
3144
|
}
|
|
2947
3145
|
|
|
3146
|
+
// 生成css键值对
|
|
2948
3147
|
_createClass(CssUtils, [{
|
|
2949
3148
|
key: "genCssKV",
|
|
2950
3149
|
value: function genCssKV(key, val) {
|
|
2951
3150
|
return "".concat(key, ": ").concat(val, " !important;");
|
|
2952
3151
|
}
|
|
3152
|
+
|
|
3153
|
+
// 生成css，包括css选择器
|
|
2953
3154
|
}, {
|
|
2954
3155
|
key: "genCss",
|
|
2955
3156
|
value: function genCss(className, cssKV) {
|
|
2956
3157
|
return "".concat(_config__WEBPACK_IMPORTED_MODULE_1__["default"].mode === 'dark' ? "html.".concat(_constant__WEBPACK_IMPORTED_MODULE_0__["HTML_CLASS"], " ") : '').concat(_config__WEBPACK_IMPORTED_MODULE_1__["default"].cssSelectorsPrefix && "".concat(_config__WEBPACK_IMPORTED_MODULE_1__["default"].cssSelectorsPrefix, " "), ".").concat(className, "{").concat(cssKV, "}");
|
|
2957
3158
|
}
|
|
3159
|
+
|
|
3160
|
+
// 加入css
|
|
2958
3161
|
}, {
|
|
2959
3162
|
key: "addCss",
|
|
2960
3163
|
value: function addCss(css) {
|
|
@@ -2962,13 +3165,15 @@ var CssUtils = /*#__PURE__*/function () {
|
|
|
2962
3165
|
this[isFirstPageStyle ? '_firstPageStyle' : '_otherPageStyle'] += css;
|
|
2963
3166
|
_global__WEBPACK_IMPORTED_MODULE_2__["plugins"].addCss(isFirstPageStyle);
|
|
2964
3167
|
}
|
|
3168
|
+
|
|
3169
|
+
// 写入样式表
|
|
2965
3170
|
}, {
|
|
2966
3171
|
key: "writeStyle",
|
|
2967
3172
|
value: function writeStyle() {
|
|
2968
3173
|
var isFirstPageStyle = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : false;
|
|
2969
3174
|
!isFirstPageStyle && _global__WEBPACK_IMPORTED_MODULE_2__["sdk"].isDarkmode && (this.isFinish = true); // 在Dark Mode下一旦写入了非首屏样式表，则认为已经运行过Dark Mode处理逻辑
|
|
2970
|
-
// 获取样式表内容
|
|
2971
3175
|
|
|
3176
|
+
// 获取样式表内容
|
|
2972
3177
|
var styles = (_global__WEBPACK_IMPORTED_MODULE_2__["sdk"].isDarkmode ? [{
|
|
2973
3178
|
target: this,
|
|
2974
3179
|
key: ['_firstPageStyle', '_otherPageStyle'],
|
|
@@ -2983,13 +3188,11 @@ var CssUtils = /*#__PURE__*/function () {
|
|
|
2983
3188
|
needMediaQuery: false
|
|
2984
3189
|
}]).map(function (_ref) {
|
|
2985
3190
|
var target = _ref.target,
|
|
2986
|
-
|
|
2987
|
-
|
|
2988
|
-
|
|
2989
|
-
|
|
2990
|
-
|
|
3191
|
+
_ref$key = _slicedToArray(_ref.key, 2),
|
|
3192
|
+
first = _ref$key[0],
|
|
3193
|
+
other = _ref$key[1],
|
|
3194
|
+
needMediaQuery = _ref.needMediaQuery;
|
|
2991
3195
|
var styleKey = '';
|
|
2992
|
-
|
|
2993
3196
|
if (!isFirstPageStyle) {
|
|
2994
3197
|
// 如果是写入非首屏样式表，则连同首屏样式一起写入
|
|
2995
3198
|
target[other] = target[first] + target[other];
|
|
@@ -2998,26 +3201,21 @@ var CssUtils = /*#__PURE__*/function () {
|
|
|
2998
3201
|
} else {
|
|
2999
3202
|
styleKey = first;
|
|
3000
3203
|
}
|
|
3001
|
-
|
|
3002
3204
|
var style = target[styleKey];
|
|
3003
|
-
|
|
3004
3205
|
if (style) {
|
|
3005
3206
|
target[styleKey] = ''; // 写入样式表后清空内存中的数据
|
|
3006
|
-
|
|
3007
3207
|
return _config__WEBPACK_IMPORTED_MODULE_1__["default"].mode === 'dark' || !needMediaQuery ? style : "@media ".concat(_constant__WEBPACK_IMPORTED_MODULE_0__["MEDIA_QUERY"], " {").concat(style, "}");
|
|
3008
3208
|
}
|
|
3009
|
-
|
|
3010
3209
|
return '';
|
|
3011
|
-
}).join('');
|
|
3210
|
+
}).join('');
|
|
3012
3211
|
|
|
3212
|
+
// 写入样式表
|
|
3013
3213
|
styles && document.head.insertAdjacentHTML('beforeend', "<style type=\"text/css\">".concat(styles, "</style>"));
|
|
3014
3214
|
}
|
|
3015
3215
|
}]);
|
|
3016
|
-
|
|
3017
3216
|
return CssUtils;
|
|
3018
3217
|
}();
|
|
3019
3218
|
|
|
3020
|
-
|
|
3021
3219
|
;
|
|
3022
3220
|
|
|
3023
3221
|
/***/ }),
|
|
@@ -3038,25 +3236,15 @@ __webpack_require__.r(__webpack_exports__);
|
|
|
3038
3236
|
/* harmony import */ var _config__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./config */ "./src/modules/config.js");
|
|
3039
3237
|
/* harmony import */ var _global__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./global */ "./src/modules/global.js");
|
|
3040
3238
|
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
|
|
3041
|
-
|
|
3042
3239
|
function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
|
|
3043
|
-
|
|
3044
3240
|
function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); Object.defineProperty(Constructor, "prototype", { writable: false }); return Constructor; }
|
|
3045
|
-
|
|
3046
3241
|
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
|
|
3047
|
-
|
|
3048
3242
|
function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
|
|
3049
|
-
|
|
3050
3243
|
function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
|
|
3051
|
-
|
|
3052
3244
|
function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
|
|
3053
|
-
|
|
3054
3245
|
function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter); }
|
|
3055
|
-
|
|
3056
3246
|
function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
|
|
3057
|
-
|
|
3058
3247
|
function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
|
|
3059
|
-
|
|
3060
3248
|
/**
|
|
3061
3249
|
* @name 节点相关操作工具API
|
|
3062
3250
|
*
|
|
@@ -3073,30 +3261,37 @@ function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len
|
|
|
3073
3261
|
* @return {string | null} 判断结果，如果有，返回class对应的lm色值，否则返回null
|
|
3074
3262
|
*
|
|
3075
3263
|
*/
|
|
3264
|
+
|
|
3076
3265
|
// Darkmode配置
|
|
3077
3266
|
|
|
3078
3267
|
|
|
3268
|
+
|
|
3269
|
+
// 获取某个节点及它的所有子节点
|
|
3079
3270
|
function getChildrenAndIt(el) {
|
|
3080
3271
|
var _ref;
|
|
3081
|
-
|
|
3082
3272
|
return (_ref = [el]).concat.apply(_ref, _toConsumableArray(el.querySelectorAll('*')));
|
|
3083
3273
|
}
|
|
3084
3274
|
;
|
|
3275
|
+
|
|
3276
|
+
// 判断某个节点里是否包含文字节点
|
|
3085
3277
|
function hasTextNode(el) {
|
|
3086
|
-
|
|
3087
|
-
Array.prototype.forEach.call(el.childNodes,
|
|
3088
|
-
|
|
3089
|
-
|
|
3090
|
-
|
|
3091
|
-
});
|
|
3092
|
-
return cnt.length > 0;
|
|
3278
|
+
// let cnt = '';
|
|
3279
|
+
// Array.prototype.forEach.call(el.childNodes, child => {
|
|
3280
|
+
// if (child.nodeType === 3) {
|
|
3281
|
+
// cnt += child.nodeValue.replace(/\s/g, ''); // 不考虑空白字符
|
|
3282
|
+
// }
|
|
3283
|
+
// });
|
|
3284
|
+
// return cnt.length > 0;
|
|
3285
|
+
return el.textContent.replace(/\s/g, '').length > 0;
|
|
3093
3286
|
}
|
|
3094
|
-
;
|
|
3287
|
+
;
|
|
3095
3288
|
|
|
3289
|
+
// table的内部样式类对应的lm背景色
|
|
3096
3290
|
var tableClassObj = {
|
|
3097
3291
|
'ue-table-interlace-color-single': '#fcfcfc',
|
|
3098
3292
|
'ue-table-interlace-color-double': '#f7faff'
|
|
3099
3293
|
};
|
|
3294
|
+
// 判断table相关元素有没有指定class
|
|
3100
3295
|
function hasTableClass(el) {
|
|
3101
3296
|
var color = null;
|
|
3102
3297
|
Array.prototype.some.call(el.classList, function (className) {
|
|
@@ -3104,12 +3299,12 @@ function hasTableClass(el) {
|
|
|
3104
3299
|
color = tableClassObj[className];
|
|
3105
3300
|
return true;
|
|
3106
3301
|
}
|
|
3107
|
-
|
|
3108
3302
|
return false;
|
|
3109
3303
|
});
|
|
3110
3304
|
return color;
|
|
3111
3305
|
}
|
|
3112
3306
|
;
|
|
3307
|
+
|
|
3113
3308
|
/**
|
|
3114
3309
|
* @name 节点相关操作工具对象
|
|
3115
3310
|
*
|
|
@@ -3120,21 +3315,26 @@ function hasTableClass(el) {
|
|
|
3120
3315
|
*
|
|
3121
3316
|
* @method set 设置要处理的节点列表
|
|
3122
3317
|
* @param {DOM Object Array} els 要处理的节点列表
|
|
3318
|
+
* @return void
|
|
3123
3319
|
*
|
|
3124
3320
|
* @method get 获取要处理的节点列表（包含延迟节点、容器节点等逻辑）
|
|
3125
3321
|
* @return {DOM Object Array} 要处理的节点列表
|
|
3126
3322
|
*
|
|
3127
3323
|
* @method delay 将所有要处理的节点转移到延迟处理队列里
|
|
3324
|
+
* @return void
|
|
3128
3325
|
*
|
|
3129
3326
|
* @method hasDelay 判断是否包含延迟处理的节点
|
|
3130
3327
|
* @return {boolean} 判断结果
|
|
3131
3328
|
*
|
|
3132
3329
|
* @method addFirstPageNode 添加首屏节点
|
|
3133
3330
|
* @param {DOM Object} el 要添加的首屏节点
|
|
3331
|
+
* @return void
|
|
3134
3332
|
*
|
|
3135
3333
|
* @method showFirstPageNodes 显示所有首屏节点
|
|
3334
|
+
* @return void
|
|
3136
3335
|
*
|
|
3137
3336
|
* @method emptyFirstPageNodes 清空记录的首屏节点
|
|
3337
|
+
* @return void
|
|
3138
3338
|
*
|
|
3139
3339
|
*/
|
|
3140
3340
|
|
|
@@ -3142,35 +3342,37 @@ var DomUtils = /*#__PURE__*/function () {
|
|
|
3142
3342
|
// 要处理的节点列表
|
|
3143
3343
|
// 首屏节点列表
|
|
3144
3344
|
// 延迟处理的节点列表
|
|
3345
|
+
|
|
3145
3346
|
// 是否已显示首屏
|
|
3347
|
+
|
|
3146
3348
|
function DomUtils() {
|
|
3147
3349
|
_classCallCheck(this, DomUtils);
|
|
3148
|
-
|
|
3149
3350
|
_defineProperty(this, "_els", []);
|
|
3150
|
-
|
|
3151
3351
|
_defineProperty(this, "_firstPageEls", []);
|
|
3152
|
-
|
|
3153
3352
|
_defineProperty(this, "_delayEls", []);
|
|
3154
|
-
|
|
3155
3353
|
_defineProperty(this, "showFirstPage", false);
|
|
3156
3354
|
}
|
|
3157
3355
|
|
|
3356
|
+
// 要处理的节点列表长度
|
|
3158
3357
|
_createClass(DomUtils, [{
|
|
3159
3358
|
key: "length",
|
|
3160
3359
|
get: function get() {
|
|
3161
3360
|
return this._els.length;
|
|
3162
3361
|
}
|
|
3362
|
+
|
|
3363
|
+
// 设置要处理的节点列表
|
|
3163
3364
|
}, {
|
|
3164
3365
|
key: "set",
|
|
3165
3366
|
value: function set() {
|
|
3166
3367
|
var els = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : [];
|
|
3167
3368
|
this._els = els;
|
|
3168
3369
|
}
|
|
3370
|
+
|
|
3371
|
+
// 获取要处理的节点列表（包含延迟节点、容器节点等逻辑）
|
|
3169
3372
|
}, {
|
|
3170
3373
|
key: "get",
|
|
3171
3374
|
value: function get() {
|
|
3172
3375
|
var res = [];
|
|
3173
|
-
|
|
3174
3376
|
if (this._els.length) {
|
|
3175
3377
|
// 有节点
|
|
3176
3378
|
res = this._els;
|
|
@@ -3186,49 +3388,52 @@ var DomUtils = /*#__PURE__*/function () {
|
|
|
3186
3388
|
res = _config__WEBPACK_IMPORTED_MODULE_0__["default"].container.querySelectorAll('*');
|
|
3187
3389
|
}
|
|
3188
3390
|
}
|
|
3189
|
-
|
|
3190
3391
|
return res;
|
|
3191
3392
|
}
|
|
3393
|
+
|
|
3394
|
+
// 将所有要处理的节点转移到延迟处理队列里
|
|
3192
3395
|
}, {
|
|
3193
3396
|
key: "delay",
|
|
3194
3397
|
value: function delay() {
|
|
3195
3398
|
var _this = this;
|
|
3196
|
-
|
|
3197
3399
|
Array.prototype.forEach.call(this._els, function (el) {
|
|
3198
3400
|
return _this._delayEls.push(el);
|
|
3199
3401
|
}); // 转移到延迟处理的节点里
|
|
3200
|
-
|
|
3201
3402
|
this._els = []; // 转移后清空列表
|
|
3202
3403
|
}
|
|
3404
|
+
|
|
3405
|
+
// 判断是否包含延迟处理的节点
|
|
3203
3406
|
}, {
|
|
3204
3407
|
key: "hasDelay",
|
|
3205
3408
|
value: function hasDelay() {
|
|
3206
3409
|
if (this._els.length) return false; // 有节点，即不含延迟处理的节点
|
|
3207
|
-
|
|
3208
3410
|
return this._delayEls.length > 0 || _config__WEBPACK_IMPORTED_MODULE_0__["default"].container !== null; // 否则需要判断延迟节点的列表和容器
|
|
3209
3411
|
}
|
|
3412
|
+
|
|
3413
|
+
// 添加首屏节点
|
|
3210
3414
|
}, {
|
|
3211
3415
|
key: "addFirstPageNode",
|
|
3212
3416
|
value: function addFirstPageNode(el) {
|
|
3213
3417
|
this._firstPageEls.push(el);
|
|
3214
3418
|
}
|
|
3419
|
+
|
|
3420
|
+
// 显示所有首屏节点
|
|
3215
3421
|
}, {
|
|
3216
3422
|
key: "showFirstPageNodes",
|
|
3217
3423
|
value: function showFirstPageNodes() {
|
|
3218
3424
|
this._firstPageEls.forEach(function (el) {
|
|
3219
3425
|
return !el.style.visibility && (el.style.visibility = 'visible');
|
|
3220
3426
|
}); // 显示首屏节点
|
|
3221
|
-
|
|
3222
|
-
|
|
3223
3427
|
this.showFirstPage = true; // 记录为已显示首屏
|
|
3224
3428
|
}
|
|
3429
|
+
|
|
3430
|
+
// 清空记录的首屏节点
|
|
3225
3431
|
}, {
|
|
3226
3432
|
key: "emptyFirstPageNodes",
|
|
3227
3433
|
value: function emptyFirstPageNodes() {
|
|
3228
3434
|
this._firstPageEls = [];
|
|
3229
3435
|
}
|
|
3230
3436
|
}]);
|
|
3231
|
-
|
|
3232
3437
|
return DomUtils;
|
|
3233
3438
|
}();
|
|
3234
3439
|
;
|
|
@@ -3261,23 +3466,31 @@ __webpack_require__.r(__webpack_exports__);
|
|
|
3261
3466
|
* @name 全局作用域
|
|
3262
3467
|
*
|
|
3263
3468
|
*/
|
|
3264
|
-
// 插件系统
|
|
3265
3469
|
|
|
3470
|
+
// 常量
|
|
3266
3471
|
|
|
3267
|
-
var plugins = new _plugins__WEBPACK_IMPORTED_MODULE_1__["default"](); // 文本节点队列
|
|
3268
3472
|
|
|
3473
|
+
// 插件系统
|
|
3269
3474
|
|
|
3270
|
-
var
|
|
3475
|
+
var plugins = new _plugins__WEBPACK_IMPORTED_MODULE_1__["default"]();
|
|
3271
3476
|
|
|
3477
|
+
// 文本节点队列
|
|
3272
3478
|
|
|
3273
|
-
var
|
|
3479
|
+
var tnQueue = new _textNodeQueue__WEBPACK_IMPORTED_MODULE_2__["default"]("".concat(_constant__WEBPACK_IMPORTED_MODULE_0__["CLASS_PREFIX"], "text__"));
|
|
3274
3480
|
|
|
3481
|
+
// 需要判断位置的背景节点堆栈
|
|
3275
3482
|
|
|
3276
|
-
var
|
|
3483
|
+
var bgStack = new _bgNodeStack__WEBPACK_IMPORTED_MODULE_3__["default"]("".concat(_constant__WEBPACK_IMPORTED_MODULE_0__["CLASS_PREFIX"], "bg__"));
|
|
3277
3484
|
|
|
3485
|
+
// 样式相关操作工具对象
|
|
3278
3486
|
|
|
3279
|
-
var
|
|
3487
|
+
var cssUtils = new _cssUtils__WEBPACK_IMPORTED_MODULE_4__["default"]();
|
|
3280
3488
|
|
|
3489
|
+
// 节点相关操作工具对象
|
|
3490
|
+
|
|
3491
|
+
var domUtils = new _domUtils__WEBPACK_IMPORTED_MODULE_5__["DomUtils"]();
|
|
3492
|
+
|
|
3493
|
+
// sdk
|
|
3281
3494
|
|
|
3282
3495
|
var sdk = new _sdk__WEBPACK_IMPORTED_MODULE_6__["default"]();
|
|
3283
3496
|
|
|
@@ -3295,19 +3508,15 @@ __webpack_require__.r(__webpack_exports__);
|
|
|
3295
3508
|
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "default", function() { return Plugins; });
|
|
3296
3509
|
/* harmony import */ var _global__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./global */ "./src/modules/global.js");
|
|
3297
3510
|
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
|
|
3298
|
-
|
|
3299
3511
|
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
|
|
3300
|
-
|
|
3301
3512
|
function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
|
|
3302
|
-
|
|
3303
3513
|
function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); Object.defineProperty(Constructor, "prototype", { writable: false }); return Constructor; }
|
|
3304
|
-
|
|
3305
3514
|
/**
|
|
3306
3515
|
* @name 插件基类
|
|
3307
3516
|
*
|
|
3308
3517
|
* @class Plugin
|
|
3309
3518
|
*
|
|
3310
|
-
* @attr {number} loopTimes
|
|
3519
|
+
* @attr {number} loopTimes 已遍历次数（全部节点遍历结束算一次）
|
|
3311
3520
|
* @attr {boolean} isDarkmode 是否为Dark Mode
|
|
3312
3521
|
*
|
|
3313
3522
|
* @method addCss 添加样式
|
|
@@ -3319,36 +3528,40 @@ function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _d
|
|
|
3319
3528
|
*
|
|
3320
3529
|
*/
|
|
3321
3530
|
|
|
3531
|
+
|
|
3322
3532
|
var cssNeedMQ = [];
|
|
3323
3533
|
var cssNoMQ = [];
|
|
3324
|
-
|
|
3325
3534
|
var Plugin = /*#__PURE__*/function () {
|
|
3326
3535
|
function Plugin() {
|
|
3327
3536
|
_classCallCheck(this, Plugin);
|
|
3328
3537
|
}
|
|
3329
3538
|
|
|
3539
|
+
// 遍历次数（全部节点遍历结束算一次）
|
|
3330
3540
|
_createClass(Plugin, [{
|
|
3331
3541
|
key: "loopTimes",
|
|
3332
3542
|
get: function get() {
|
|
3333
3543
|
return _global__WEBPACK_IMPORTED_MODULE_0__["plugins"].loopTimes;
|
|
3334
3544
|
}
|
|
3545
|
+
|
|
3546
|
+
// 是否为Dark Mode
|
|
3335
3547
|
}, {
|
|
3336
3548
|
key: "isDarkmode",
|
|
3337
3549
|
get: function get() {
|
|
3338
3550
|
return _global__WEBPACK_IMPORTED_MODULE_0__["sdk"].isDarkmode;
|
|
3339
3551
|
}
|
|
3552
|
+
|
|
3553
|
+
// 添加样式
|
|
3340
3554
|
}, {
|
|
3341
3555
|
key: "addCss",
|
|
3342
3556
|
value: function addCss(className, kvList) {
|
|
3343
3557
|
var needMediaQuery = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : true;
|
|
3344
3558
|
(needMediaQuery ? cssNeedMQ : cssNoMQ).push(_global__WEBPACK_IMPORTED_MODULE_0__["cssUtils"].genCss(className, kvList.map(function (_ref) {
|
|
3345
3559
|
var key = _ref.key,
|
|
3346
|
-
|
|
3560
|
+
value = _ref.value;
|
|
3347
3561
|
return _global__WEBPACK_IMPORTED_MODULE_0__["cssUtils"].genCssKV(key, value);
|
|
3348
3562
|
}).join('')));
|
|
3349
3563
|
}
|
|
3350
3564
|
}]);
|
|
3351
|
-
|
|
3352
3565
|
return Plugin;
|
|
3353
3566
|
}();
|
|
3354
3567
|
/**
|
|
@@ -3357,6 +3570,7 @@ var Plugin = /*#__PURE__*/function () {
|
|
|
3357
3570
|
* @class Plugins
|
|
3358
3571
|
*
|
|
3359
3572
|
* @attr {number} length 已挂载的插件数量
|
|
3573
|
+
* @attr {number} loopTimes 已遍历次数（全部节点遍历结束算一次）
|
|
3360
3574
|
* @attr {string} firstPageStyle 首屏样式
|
|
3361
3575
|
* @attr {string} otherPageStyle 非首屏样式
|
|
3362
3576
|
* @attr {string} firstPageStyleNoMQ 首屏样式（不需要加媒体查询）
|
|
@@ -3364,63 +3578,63 @@ var Plugin = /*#__PURE__*/function () {
|
|
|
3364
3578
|
*
|
|
3365
3579
|
* @method extend 挂载插件
|
|
3366
3580
|
* @param {Function} plugin 插件构造函数
|
|
3581
|
+
* @return void
|
|
3367
3582
|
*
|
|
3368
3583
|
* @method emit 执行插件钩子
|
|
3369
3584
|
* @param {string} name 钩子名称
|
|
3370
3585
|
* @param {Any} args 钩子参数
|
|
3586
|
+
* @return void
|
|
3371
3587
|
*
|
|
3372
3588
|
* @method addCss 写入插件样式
|
|
3373
3589
|
* @param {boolean} isFirstPageStyle 是否首屏样式
|
|
3590
|
+
* @return void
|
|
3374
3591
|
*
|
|
3375
3592
|
* @method resetCss 重置插件样式
|
|
3593
|
+
* @return void
|
|
3376
3594
|
*
|
|
3377
3595
|
*/
|
|
3378
|
-
|
|
3379
|
-
|
|
3380
3596
|
var Plugins = /*#__PURE__*/function () {
|
|
3381
3597
|
// 已挂载的插件列表
|
|
3598
|
+
|
|
3382
3599
|
// 已挂载的插件数量
|
|
3383
|
-
//
|
|
3600
|
+
// 已遍历次数（全部节点遍历结束算一次）
|
|
3384
3601
|
// 首屏样式
|
|
3385
3602
|
// 非首屏样式
|
|
3386
3603
|
// 首屏样式（不需要加媒体查询）
|
|
3387
3604
|
// 非首屏样式（不需要加媒体查询）
|
|
3605
|
+
|
|
3388
3606
|
function Plugins() {
|
|
3389
3607
|
_classCallCheck(this, Plugins);
|
|
3390
|
-
|
|
3391
3608
|
_defineProperty(this, "_plugins", []);
|
|
3392
|
-
|
|
3393
3609
|
_defineProperty(this, "length", 0);
|
|
3394
|
-
|
|
3395
3610
|
_defineProperty(this, "loopTimes", 0);
|
|
3396
|
-
|
|
3397
3611
|
_defineProperty(this, "firstPageStyle", '');
|
|
3398
|
-
|
|
3399
3612
|
_defineProperty(this, "otherPageStyle", '');
|
|
3400
|
-
|
|
3401
3613
|
_defineProperty(this, "firstPageStyleNoMQ", '');
|
|
3402
|
-
|
|
3403
3614
|
_defineProperty(this, "otherPageStyleNoMQ", '');
|
|
3404
3615
|
}
|
|
3405
3616
|
|
|
3617
|
+
// 挂载插件
|
|
3406
3618
|
_createClass(Plugins, [{
|
|
3407
3619
|
key: "extend",
|
|
3408
3620
|
value: function extend(plugin) {
|
|
3409
3621
|
this._plugins.push(new (plugin(Plugin))());
|
|
3410
|
-
|
|
3411
3622
|
this.length++;
|
|
3412
3623
|
}
|
|
3624
|
+
|
|
3625
|
+
// 执行插件钩子
|
|
3413
3626
|
}, {
|
|
3414
3627
|
key: "emit",
|
|
3415
3628
|
value: function emit(name) {
|
|
3416
3629
|
for (var _len = arguments.length, args = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {
|
|
3417
3630
|
args[_key - 1] = arguments[_key];
|
|
3418
3631
|
}
|
|
3419
|
-
|
|
3420
3632
|
this._plugins.forEach(function (plugin) {
|
|
3421
3633
|
typeof plugin[name] === 'function' && plugin[name].apply(plugin, args);
|
|
3422
3634
|
});
|
|
3423
3635
|
}
|
|
3636
|
+
|
|
3637
|
+
// 写入插件样式
|
|
3424
3638
|
}, {
|
|
3425
3639
|
key: "addCss",
|
|
3426
3640
|
value: function addCss(isFirstPageStyle) {
|
|
@@ -3432,6 +3646,8 @@ var Plugins = /*#__PURE__*/function () {
|
|
|
3432
3646
|
this.otherPageStyleNoMQ += cssNoMQ.join('');
|
|
3433
3647
|
}
|
|
3434
3648
|
}
|
|
3649
|
+
|
|
3650
|
+
// 重置插件样式
|
|
3435
3651
|
}, {
|
|
3436
3652
|
key: "resetCss",
|
|
3437
3653
|
value: function resetCss() {
|
|
@@ -3439,11 +3655,9 @@ var Plugins = /*#__PURE__*/function () {
|
|
|
3439
3655
|
cssNoMQ = [];
|
|
3440
3656
|
}
|
|
3441
3657
|
}]);
|
|
3442
|
-
|
|
3443
3658
|
return Plugins;
|
|
3444
3659
|
}();
|
|
3445
3660
|
|
|
3446
|
-
|
|
3447
3661
|
;
|
|
3448
3662
|
|
|
3449
3663
|
/***/ }),
|
|
@@ -3460,272 +3674,79 @@ __webpack_require__.r(__webpack_exports__);
|
|
|
3460
3674
|
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "default", function() { return SDK; });
|
|
3461
3675
|
/* harmony import */ var color__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! color */ "./node_modules/color/index.js");
|
|
3462
3676
|
/* harmony import */ var color__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(color__WEBPACK_IMPORTED_MODULE_0__);
|
|
3463
|
-
/* harmony import */ var
|
|
3464
|
-
/* harmony import */ var color_name__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(color_name__WEBPACK_IMPORTED_MODULE_1__);
|
|
3677
|
+
/* harmony import */ var _color__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./color */ "./src/modules/color.js");
|
|
3465
3678
|
/* harmony import */ var _constant__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./constant */ "./src/modules/constant.js");
|
|
3466
3679
|
/* harmony import */ var _config__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./config */ "./src/modules/config.js");
|
|
3467
3680
|
/* harmony import */ var _global__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./global */ "./src/modules/global.js");
|
|
3468
3681
|
/* harmony import */ var _domUtils__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./domUtils */ "./src/modules/domUtils.js");
|
|
3469
3682
|
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
|
|
3470
|
-
|
|
3471
3683
|
function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
|
|
3472
|
-
|
|
3473
3684
|
function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"]; if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
|
|
3474
|
-
|
|
3475
3685
|
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
|
|
3476
|
-
|
|
3477
3686
|
function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
|
|
3478
|
-
|
|
3479
3687
|
function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
|
|
3480
|
-
|
|
3481
3688
|
function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
|
|
3482
|
-
|
|
3483
3689
|
function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter); }
|
|
3484
|
-
|
|
3485
3690
|
function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
|
|
3486
|
-
|
|
3487
3691
|
function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
|
|
3488
|
-
|
|
3489
3692
|
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
|
|
3490
|
-
|
|
3491
3693
|
function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
|
|
3492
|
-
|
|
3493
3694
|
function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); Object.defineProperty(Constructor, "prototype", { writable: false }); return Constructor; }
|
|
3494
|
-
|
|
3495
3695
|
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
|
|
3496
|
-
|
|
3497
3696
|
/**
|
|
3498
3697
|
* @name 算法SDK
|
|
3499
3698
|
*
|
|
3500
3699
|
* @class SDK
|
|
3501
3700
|
*
|
|
3701
|
+
* @attr {boolean} isDarkmode 当前是否需要运行Darkmode处理
|
|
3702
|
+
*
|
|
3703
|
+
* @method init 初始化
|
|
3704
|
+
* @return void
|
|
3705
|
+
*
|
|
3502
3706
|
* @method convert 处理节点
|
|
3503
3707
|
* @param {DOM Object} el 要处理的节点
|
|
3504
3708
|
* @return {string} 处理后的css，包含css选择器
|
|
3505
3709
|
*
|
|
3710
|
+
* @method getContrast 获取两个颜色的对比度
|
|
3711
|
+
* @param {string} colorStr1 颜色1
|
|
3712
|
+
* @param {string} colorStr2 颜色2
|
|
3713
|
+
* @return {number} 颜色对比度，取值范围为`[1, 21]`
|
|
3714
|
+
*
|
|
3506
3715
|
*/
|
|
3507
|
-
// dependencies
|
|
3508
|
-
|
|
3509
|
-
|
|
3510
|
-
var ColorParser = function ColorParser(color) {
|
|
3511
|
-
var res = null;
|
|
3512
|
-
|
|
3513
|
-
try {
|
|
3514
|
-
res = color__WEBPACK_IMPORTED_MODULE_0___default()(color);
|
|
3515
|
-
} catch (e) {
|
|
3516
|
-
console.log("ignore the invalid color: `".concat(color, "`"));
|
|
3517
|
-
}
|
|
3518
|
-
|
|
3519
|
-
return res;
|
|
3520
|
-
};
|
|
3521
|
-
|
|
3522
|
-
|
|
3523
|
-
color_name__WEBPACK_IMPORTED_MODULE_1___default.a.windowtext = [0, 0, 0]; // 补上这个colorName
|
|
3524
|
-
|
|
3525
|
-
color_name__WEBPACK_IMPORTED_MODULE_1___default.a.transparent = [255, 255, 255, 0]; // 支持透明，暂定用白色透明度0来表示
|
|
3526
|
-
|
|
3527
|
-
// Darkmode配置
|
|
3528
|
-
|
|
3529
|
-
|
|
3530
|
-
// 节点相关操作工具API
|
|
3531
|
-
|
|
3532
|
-
|
|
3533
|
-
var colorNameReg = new RegExp(Object.keys(color_name__WEBPACK_IMPORTED_MODULE_1___default.a).map(function (colorName) {
|
|
3534
|
-
return "\\b".concat(colorName, "\\b");
|
|
3535
|
-
}).join('|'), 'ig'); // 生成正则表达式来匹配这些colorName
|
|
3536
3716
|
|
|
3537
|
-
|
|
3538
|
-
var colorRegGlobal = /\brgba?\([^)]+\)/ig;
|
|
3717
|
+
// 颜色操作相关API
|
|
3539
3718
|
|
|
3540
|
-
var removeImportant = function removeImportant(value) {
|
|
3541
|
-
return value.replace(_constant__WEBPACK_IMPORTED_MODULE_2__["IMPORTANT_REGEXP"], '');
|
|
3542
|
-
}; // 清除!important
|
|
3543
3719
|
|
|
3544
3720
|
|
|
3545
|
-
|
|
3546
|
-
return removeImportant(value).replace(colorNameReg, function (match) {
|
|
3547
|
-
// 处理颜色，包括清除!important和转换英文定义颜色
|
|
3548
|
-
if (!parseTransparent && match === 'transparent') return match; // 如果不转换transparent，直接返回transparent
|
|
3549
|
-
|
|
3550
|
-
var color = color_name__WEBPACK_IMPORTED_MODULE_1___default.a[match.toLowerCase()];
|
|
3551
|
-
return "".concat(color.length > 3 ? 'rgba' : 'rgb', "(").concat(color.toString(), ")");
|
|
3552
|
-
});
|
|
3553
|
-
}; // 计算mix颜色
|
|
3554
|
-
|
|
3555
|
-
|
|
3556
|
-
var mixColor = function mixColor(colors) {
|
|
3557
|
-
if (!colors || colors.length < 1) return '';
|
|
3558
|
-
if (colors.length === 1) return colors[0];
|
|
3559
|
-
var retColorStr = colors.shift();
|
|
3560
|
-
var nextColorStr = colors.shift();
|
|
3561
|
-
|
|
3562
|
-
while (nextColorStr) {
|
|
3563
|
-
var retColor = ColorParser(retColorStr);
|
|
3564
|
-
var nextColor = ColorParser(nextColorStr);
|
|
3565
|
-
|
|
3566
|
-
if (!retColor && nextColor) {
|
|
3567
|
-
// 如果当前色值非法，混入色值合法，则直接使用混入色值
|
|
3568
|
-
retColorStr = nextColorStr;
|
|
3569
|
-
} else if (!retColor && !nextColor) {
|
|
3570
|
-
// 如果两个色值都非法，则使用下一批色值
|
|
3571
|
-
retColorStr = colors.shift() || '';
|
|
3572
|
-
} else if (retColor && nextColor) {
|
|
3573
|
-
// 如果两个色值都合法，执行mix
|
|
3574
|
-
retColorStr = retColor.mix(nextColor, nextColor.alpha());
|
|
3575
|
-
} // 如果当前色值合法，混入色值非法，无需处理
|
|
3576
|
-
|
|
3577
|
-
|
|
3578
|
-
nextColorStr = colors.shift();
|
|
3579
|
-
}
|
|
3580
|
-
|
|
3581
|
-
return retColorStr;
|
|
3582
|
-
}; // 处理-webkit-fill-color和-webkit-text-stroke-color，返回处理后的色值，无则返回空字符串
|
|
3583
|
-
|
|
3584
|
-
|
|
3585
|
-
var parseWebkitFillColorAndStrokeColor = function parseWebkitFillColorAndStrokeColor(value) {
|
|
3586
|
-
var newValue = parseColor(value);
|
|
3587
|
-
return colorReg.test(newValue) ? newValue : '';
|
|
3588
|
-
}; // 计算感知亮度
|
|
3589
|
-
|
|
3590
|
-
|
|
3591
|
-
var getColorPerceivedBrightness = function getColorPerceivedBrightness(rgb) {
|
|
3592
|
-
return (rgb[0] * 299 + rgb[1] * 587 + rgb[2] * 114) / 1000;
|
|
3593
|
-
}; // 调整为指定感知亮度
|
|
3594
|
-
|
|
3595
|
-
|
|
3596
|
-
var adjustBrightnessByLimit = function adjustBrightnessByLimit(limitBright, rgb) {
|
|
3597
|
-
var relativeBrightnessRatio = limitBright / getColorPerceivedBrightness(rgb);
|
|
3598
|
-
var newTextR = Math.min(255, rgb[0] * relativeBrightnessRatio);
|
|
3599
|
-
var newTextG = Math.min(255, rgb[1] * relativeBrightnessRatio);
|
|
3600
|
-
var newTextB = Math.min(255, rgb[2] * relativeBrightnessRatio);
|
|
3601
|
-
|
|
3602
|
-
if (newTextG === 0 || newTextR === 255 || newTextB === 255) {
|
|
3603
|
-
newTextG = (limitBright * 1000 - newTextR * 299 - newTextB * 114) / 587;
|
|
3604
|
-
} else if (newTextR === 0) {
|
|
3605
|
-
newTextR = (limitBright * 1000 - newTextG * 587 - newTextB * 114) / 299;
|
|
3606
|
-
} else if (newTextB === 0 || newTextG === 255) {
|
|
3607
|
-
newTextB = (limitBright * 1000 - newTextR * 299 - newTextG * 587) / 114;
|
|
3608
|
-
}
|
|
3609
|
-
|
|
3610
|
-
return color__WEBPACK_IMPORTED_MODULE_0___default.a.rgb(newTextR, newTextG, newTextB);
|
|
3611
|
-
}; // 计算亮度，用作对比度计算
|
|
3721
|
+
// 常量
|
|
3612
3722
|
|
|
3613
3723
|
|
|
3614
|
-
|
|
3615
|
-
var srgb = rgb.map(function (val) {
|
|
3616
|
-
val /= 255;
|
|
3617
|
-
return val <= 0.03928 ? val / 12.92 : Math.pow((val + 0.055) / 1.055, 2.4);
|
|
3618
|
-
});
|
|
3619
|
-
return srgb[0] * 0.2126 + srgb[1] * 0.7152 + srgb[2] * 0.0722;
|
|
3620
|
-
}; // 计算对比度 https://www.w3.org/TR/WCAG20-TECHS/G17.html#G17-procedure
|
|
3724
|
+
// Darkmode配置
|
|
3621
3725
|
|
|
3622
3726
|
|
|
3623
|
-
var _getContrast = function getContrast(rgb1, rgb2) {
|
|
3624
|
-
var lum1 = getLuminanace(rgb1);
|
|
3625
|
-
var lum2 = getLuminanace(rgb2); // 亮色 / 暗色
|
|
3626
3727
|
|
|
3627
|
-
|
|
3628
|
-
return (lum1 + 0.05) / (lum2 + 0.05);
|
|
3629
|
-
};
|
|
3728
|
+
// 节点相关操作工具API
|
|
3630
3729
|
|
|
3631
3730
|
var SDK = /*#__PURE__*/function () {
|
|
3632
3731
|
// 索引值
|
|
3732
|
+
|
|
3633
3733
|
// 当前是否需要运行Darkmode处理
|
|
3734
|
+
|
|
3634
3735
|
function SDK() {
|
|
3635
3736
|
_classCallCheck(this, SDK);
|
|
3636
|
-
|
|
3637
3737
|
_defineProperty(this, "_idx", 0);
|
|
3638
|
-
|
|
3639
3738
|
_defineProperty(this, "_defaultDarkTextColorRgb", null);
|
|
3640
|
-
|
|
3641
3739
|
_defineProperty(this, "_defaultDarkBgColorRgb", null);
|
|
3642
|
-
|
|
3643
3740
|
_defineProperty(this, "_defaultDarkBgColorHSL", null);
|
|
3644
|
-
|
|
3645
3741
|
_defineProperty(this, "_defaultDarkTextColorBrightness", null);
|
|
3646
|
-
|
|
3647
3742
|
_defineProperty(this, "_defaultDarkBgColorBrightness", null);
|
|
3648
|
-
|
|
3649
3743
|
_defineProperty(this, "_defaultDarkBgColorHslBrightness", null);
|
|
3650
|
-
|
|
3651
3744
|
_defineProperty(this, "_maxLimitOffsetBrightness", null);
|
|
3652
|
-
|
|
3653
3745
|
_defineProperty(this, "isDarkmode", false);
|
|
3654
3746
|
}
|
|
3655
3747
|
|
|
3748
|
+
// 调整明度
|
|
3656
3749
|
_createClass(SDK, [{
|
|
3657
|
-
key: "_adjustTextBrightness",
|
|
3658
|
-
value: function _adjustTextBrightness(textColor, bgColor) {
|
|
3659
|
-
var bgColorRgb = bgColor.rgb().array();
|
|
3660
|
-
var bgColorAlpha = bgColor.alpha();
|
|
3661
|
-
var bgColorPerceivedBrightness = getColorPerceivedBrightness(bgColorRgb);
|
|
3662
|
-
var bgColorWithOpacityPerceivedBrightness = bgColorPerceivedBrightness * bgColorAlpha + this._defaultDarkBgColorBrightness * (1 - bgColorAlpha);
|
|
3663
|
-
var textColorRgb = textColor.rgb().array();
|
|
3664
|
-
var textColorHSL = textColor.hsl().array();
|
|
3665
|
-
var textColorAlpha = textColor.alpha();
|
|
3666
|
-
var textPerceivedBrightness = getColorPerceivedBrightness(textColorRgb);
|
|
3667
|
-
var offsetPerceivedBrightness = Math.abs(bgColorWithOpacityPerceivedBrightness - textPerceivedBrightness); // 用户设置为高亮字体颜色（接近白色亮度），不处理，保持高亮
|
|
3668
|
-
|
|
3669
|
-
if (textPerceivedBrightness >= _constant__WEBPACK_IMPORTED_MODULE_2__["WHITE_LIKE_COLOR_BRIGHTNESS"]) return textColor;
|
|
3670
|
-
|
|
3671
|
-
if (offsetPerceivedBrightness > this._maxLimitOffsetBrightness && bgColorWithOpacityPerceivedBrightness <= this._defaultDarkBgColorBrightness + 2) {
|
|
3672
|
-
return adjustBrightnessByLimit(this._maxLimitOffsetBrightness + bgColorWithOpacityPerceivedBrightness, textColorRgb).alpha(textColorAlpha);
|
|
3673
|
-
} // 如果感知亮度差大于阈值，无需调整
|
|
3674
|
-
|
|
3675
|
-
|
|
3676
|
-
if (offsetPerceivedBrightness >= _constant__WEBPACK_IMPORTED_MODULE_2__["MIN_LIMIT_OFFSET_BRIGHTNESS"]) return textColor;
|
|
3677
|
-
|
|
3678
|
-
if (bgColorWithOpacityPerceivedBrightness >= _constant__WEBPACK_IMPORTED_MODULE_2__["HIGH_BGCOLOR_BRIGHTNESS"]) {
|
|
3679
|
-
// 亮背景，调暗字体
|
|
3680
|
-
if (textColorHSL[2] > 90 - _constant__WEBPACK_IMPORTED_MODULE_2__["HIGH_BLACKWHITE_HSL_BRIGHTNESS"]) {
|
|
3681
|
-
// 优先调字体的亮度已带到降低感知亮度的目的
|
|
3682
|
-
textColorHSL[2] = 90 - textColorHSL[2];
|
|
3683
|
-
var tmpTextColor = color__WEBPACK_IMPORTED_MODULE_0___default.a.hsl.apply(color__WEBPACK_IMPORTED_MODULE_0___default.a, _toConsumableArray(textColorHSL)).alpha(textColorAlpha);
|
|
3684
|
-
return this._adjustTextBrightness(tmpTextColor, bgColor);
|
|
3685
|
-
}
|
|
3686
|
-
|
|
3687
|
-
return adjustBrightnessByLimit(Math.min(this._maxLimitOffsetBrightness, bgColorWithOpacityPerceivedBrightness - _constant__WEBPACK_IMPORTED_MODULE_2__["MIN_LIMIT_OFFSET_BRIGHTNESS"]), textColorRgb).alpha(textColorAlpha);
|
|
3688
|
-
} else {
|
|
3689
|
-
// 暗背景，调亮字体
|
|
3690
|
-
if (textColorHSL[2] <= _constant__WEBPACK_IMPORTED_MODULE_2__["HIGH_BLACKWHITE_HSL_BRIGHTNESS"]) {
|
|
3691
|
-
// 优先调字体的亮度已带到提高感知亮度的目的
|
|
3692
|
-
textColorHSL[2] = 90 - textColorHSL[2];
|
|
3693
|
-
|
|
3694
|
-
var _tmpTextColor = color__WEBPACK_IMPORTED_MODULE_0___default.a.hsl.apply(color__WEBPACK_IMPORTED_MODULE_0___default.a, _toConsumableArray(textColorHSL)).alpha(textColorAlpha);
|
|
3695
|
-
|
|
3696
|
-
return this._adjustTextBrightness(_tmpTextColor, bgColor);
|
|
3697
|
-
}
|
|
3698
|
-
|
|
3699
|
-
return adjustBrightnessByLimit(Math.min(this._maxLimitOffsetBrightness, bgColorWithOpacityPerceivedBrightness + _constant__WEBPACK_IMPORTED_MODULE_2__["MIN_LIMIT_OFFSET_BRIGHTNESS"]), textColorRgb).alpha(textColorAlpha);
|
|
3700
|
-
}
|
|
3701
|
-
}
|
|
3702
|
-
}, {
|
|
3703
|
-
key: "_adjustBackgroundBrightness",
|
|
3704
|
-
value: function _adjustBackgroundBrightness(bgColor) {
|
|
3705
|
-
var bgColorRgb = bgColor.rgb().array();
|
|
3706
|
-
var bgColorHsl = bgColor.hsl().array();
|
|
3707
|
-
var bgColorAlpha = bgColor.alpha();
|
|
3708
|
-
var bgColorPerceivedBrightness = getColorPerceivedBrightness(bgColorRgb);
|
|
3709
|
-
var newColor = bgColor;
|
|
3710
|
-
|
|
3711
|
-
if (bgColorHsl[1] === 0 && bgColorHsl[2] > _constant__WEBPACK_IMPORTED_MODULE_2__["HIGH_BLACKWHITE_HSL_BRIGHTNESS"] || bgColorPerceivedBrightness > _constant__WEBPACK_IMPORTED_MODULE_2__["WHITE_LIKE_COLOR_BRIGHTNESS"]) {
|
|
3712
|
-
// 饱和度为0（黑白灰色），亮度大于HIGH_BLACKWHITE_HSL_BRIGHTNESS或感知亮度大于WHITE_LIKE_COLOR_BRIGHTNESS（白色）时，做亮度取反处理
|
|
3713
|
-
newColor = color__WEBPACK_IMPORTED_MODULE_0___default.a.hsl(0, 0, Math.min(100, 100 + this._defaultDarkBgColorHslBrightness - bgColorHsl[2]));
|
|
3714
|
-
} else if (bgColorPerceivedBrightness > _constant__WEBPACK_IMPORTED_MODULE_2__["MAX_LIMIT_BGCOLOR_BRIGHTNESS"]) {
|
|
3715
|
-
// 感知亮度大于MAX_LIMIT_BGCOLOR_BRIGHTNESS，将感知亮度设为MAX_LIMIT_BGCOLOR_BRIGHTNESS
|
|
3716
|
-
newColor = adjustBrightnessByLimit(_constant__WEBPACK_IMPORTED_MODULE_2__["MAX_LIMIT_BGCOLOR_BRIGHTNESS"], bgColorRgb).alpha(bgColorAlpha); // const ratio = (MAX_LIMIT_BGCOLOR_BRIGHTNESS * 1000)
|
|
3717
|
-
// / (bgColorRgb[0] * 299 + bgColorRgb[1] * 587 + bgColorRgb[2] * 114);
|
|
3718
|
-
// newColor = Color.rgb(bgColorRgb[0] * ratio, bgColorRgb[1] * ratio, bgColorRgb[2] * ratio);
|
|
3719
|
-
} else if (bgColorHsl[2] < _constant__WEBPACK_IMPORTED_MODULE_2__["LOW_BLACKWHITE_HSL_BRIGHTNESS"]) {
|
|
3720
|
-
// 亮度小于LOW_BLACKWHITE_HSL_BRIGHTNESS，将亮度设为LOW_BLACKWHITE_HSL_BRIGHTNESS，适当提高亮度
|
|
3721
|
-
bgColorHsl[2] = _constant__WEBPACK_IMPORTED_MODULE_2__["LOW_BLACKWHITE_HSL_BRIGHTNESS"];
|
|
3722
|
-
newColor = color__WEBPACK_IMPORTED_MODULE_0___default.a.hsl.apply(color__WEBPACK_IMPORTED_MODULE_0___default.a, _toConsumableArray(bgColorHsl));
|
|
3723
|
-
}
|
|
3724
|
-
|
|
3725
|
-
return newColor.alpha(bgColorAlpha).rgb();
|
|
3726
|
-
} // 调整明度
|
|
3727
|
-
|
|
3728
|
-
}, {
|
|
3729
3750
|
key: "_adjustBrightness",
|
|
3730
3751
|
value: function _adjustBrightness(color, el, options, isUpdate) {
|
|
3731
3752
|
// 背景：
|
|
@@ -3734,34 +3755,46 @@ var SDK = /*#__PURE__*/function () {
|
|
|
3734
3755
|
// 黑白灰色（h=0，s=0）亮度大于HIGH_BLACKWHITE_HSL_BRIGHTNESS时，做取反处理；
|
|
3735
3756
|
// 感知亮度大于MAX_LIMIT_BGCOLOR_BRIGHTNESS，取MAX_LIMIT_BGCOLOR_BRIGHTNESS；
|
|
3736
3757
|
// 其他亮度小于LOW_BLACKWHITE_HSL_BRIGHTNESS时，设为LOW_BLACKWHITE_HSL_BRIGHTNESS。
|
|
3758
|
+
|
|
3737
3759
|
// 字体、边框：
|
|
3738
3760
|
// 处理原则：根据调整后的背景颜色和最小亮度差值算出字体颜色，接近白色字体颜色保持不变，带背景图片子元素字体颜色不变
|
|
3739
3761
|
// 处理方法：亮度小于HIGH_BLACKWHITE_HSL_BRIGHTNESS时，用（90%-该亮度），大于等于HIGH_BLACKWHITE_HSL_BRIGHTNESS则保持不变；
|
|
3762
|
+
|
|
3740
3763
|
// 字体阴影
|
|
3741
3764
|
// 处理方法：按照背景的处理方法来处理
|
|
3765
|
+
|
|
3742
3766
|
var alpha = color.alpha();
|
|
3743
3767
|
var newColor;
|
|
3744
3768
|
var extStyle = '';
|
|
3745
|
-
|
|
3746
3769
|
if (options.isBgColor) {
|
|
3747
3770
|
// 背景色
|
|
3748
|
-
|
|
3749
|
-
|
|
3750
|
-
delete el[_constant__WEBPACK_IMPORTED_MODULE_2__["BGIMAGEATTR"]];
|
|
3771
|
+
if (alpha >= _constant__WEBPACK_IMPORTED_MODULE_2__["IGNORE_ALPHA"]) {
|
|
3772
|
+
// 如果设置背景颜色，取消背景图片的影响
|
|
3773
|
+
if (el[_constant__WEBPACK_IMPORTED_MODULE_2__["BGIMAGEATTR"]]) delete el[_constant__WEBPACK_IMPORTED_MODULE_2__["BGIMAGEATTR"]];
|
|
3774
|
+
|
|
3775
|
+
// 如果有背景图片补色
|
|
3776
|
+
if (el[_constant__WEBPACK_IMPORTED_MODULE_2__["COMPLEMENTARY_BGIMAGECOLORATTR"]]) {
|
|
3777
|
+
// 背景图片补色和当前背景色一致，则无需处理
|
|
3778
|
+
if (el[_constant__WEBPACK_IMPORTED_MODULE_2__["COMPLEMENTARY_BGIMAGECOLORATTR"]] === color.toString()) return {
|
|
3779
|
+
newColor: '',
|
|
3780
|
+
extStyle: extStyle
|
|
3781
|
+
};
|
|
3782
|
+
|
|
3783
|
+
// 否则取消背景图片补色的影响
|
|
3784
|
+
Object(_domUtils__WEBPACK_IMPORTED_MODULE_5__["getChildrenAndIt"])(el).forEach(function (dom) {
|
|
3785
|
+
delete dom[_constant__WEBPACK_IMPORTED_MODULE_2__["COMPLEMENTARY_BGIMAGECOLORATTR"]];
|
|
3786
|
+
});
|
|
3787
|
+
}
|
|
3751
3788
|
}
|
|
3752
|
-
|
|
3753
3789
|
newColor = this._adjustBackgroundBrightness(color);
|
|
3754
|
-
|
|
3755
3790
|
if (!options.hasInlineColor) {
|
|
3756
3791
|
var parentTextColorStr = el[_constant__WEBPACK_IMPORTED_MODULE_2__["ORIGINAL_COLORATTR"]] || _config__WEBPACK_IMPORTED_MODULE_3__["default"].defaultLightTextColor;
|
|
3757
|
-
var parentTextColor = ColorParser(parentTextColorStr);
|
|
3758
|
-
|
|
3792
|
+
var parentTextColor = Object(_color__WEBPACK_IMPORTED_MODULE_1__["ColorParser"])(parentTextColorStr);
|
|
3759
3793
|
if (parentTextColor) {
|
|
3760
3794
|
var ret = this._adjustBrightness(parentTextColor, el, {
|
|
3761
3795
|
isTextColor: true,
|
|
3762
3796
|
parentElementBgColorStr: newColor || color
|
|
3763
3797
|
}, isUpdate);
|
|
3764
|
-
|
|
3765
3798
|
if (ret.newColor) {
|
|
3766
3799
|
extStyle += _global__WEBPACK_IMPORTED_MODULE_4__["cssUtils"].genCssKV('color', ret.newColor);
|
|
3767
3800
|
} else {
|
|
@@ -3772,8 +3805,9 @@ var SDK = /*#__PURE__*/function () {
|
|
|
3772
3805
|
} else if (options.isTextColor || options.isBorderColor) {
|
|
3773
3806
|
// 字体色、边框色
|
|
3774
3807
|
var parentElementBgColorStr = options.parentElementBgColorStr || options.isTextColor && el[_constant__WEBPACK_IMPORTED_MODULE_2__["BGCOLORATTR"]] || _config__WEBPACK_IMPORTED_MODULE_3__["default"].defaultDarkBgColor;
|
|
3775
|
-
var parentElementBgColor = ColorParser(parentElementBgColorStr);
|
|
3808
|
+
var parentElementBgColor = Object(_color__WEBPACK_IMPORTED_MODULE_1__["ColorParser"])(parentElementBgColorStr);
|
|
3776
3809
|
|
|
3810
|
+
// 无背景图片
|
|
3777
3811
|
if (parentElementBgColor && !el[_constant__WEBPACK_IMPORTED_MODULE_2__["BGIMAGEATTR"]]) {
|
|
3778
3812
|
newColor = this._adjustTextBrightness(color, parentElementBgColor);
|
|
3779
3813
|
_global__WEBPACK_IMPORTED_MODULE_4__["plugins"].emit("afterConvertTextColor".concat(isUpdate ? 'ByUpdateStyle' : ''), el, {
|
|
@@ -3795,6 +3829,99 @@ var SDK = /*#__PURE__*/function () {
|
|
|
3795
3829
|
extStyle: extStyle
|
|
3796
3830
|
};
|
|
3797
3831
|
}
|
|
3832
|
+
|
|
3833
|
+
// 调整文本明度
|
|
3834
|
+
}, {
|
|
3835
|
+
key: "_adjustTextBrightness",
|
|
3836
|
+
value: function _adjustTextBrightness(textColor, bgColor) {
|
|
3837
|
+
var bgColorRgb = bgColor.rgb().array();
|
|
3838
|
+
var bgColorAlpha = bgColor.alpha();
|
|
3839
|
+
var bgColorPerceivedBrightness = Object(_color__WEBPACK_IMPORTED_MODULE_1__["getColorPerceivedBrightness"])(bgColorRgb);
|
|
3840
|
+
var bgColorWithOpacityPerceivedBrightness = bgColorPerceivedBrightness * bgColorAlpha + this._defaultDarkBgColorBrightness * (1 - bgColorAlpha);
|
|
3841
|
+
var textColorRgb = textColor.rgb().array();
|
|
3842
|
+
var textColorHSL = textColor.hsl().array();
|
|
3843
|
+
var textColorAlpha = textColor.alpha();
|
|
3844
|
+
var textPerceivedBrightness = Object(_color__WEBPACK_IMPORTED_MODULE_1__["getColorPerceivedBrightness"])(textColorRgb);
|
|
3845
|
+
var offsetPerceivedBrightness = Math.abs(bgColorWithOpacityPerceivedBrightness - textPerceivedBrightness);
|
|
3846
|
+
|
|
3847
|
+
// 用户设置为高亮字体颜色（接近白色亮度），不处理，保持高亮
|
|
3848
|
+
if (textPerceivedBrightness >= _constant__WEBPACK_IMPORTED_MODULE_2__["WHITE_LIKE_COLOR_BRIGHTNESS"]) return textColor;
|
|
3849
|
+
if (offsetPerceivedBrightness > this._maxLimitOffsetBrightness && bgColorWithOpacityPerceivedBrightness <= this._defaultDarkBgColorBrightness + 2) {
|
|
3850
|
+
return Object(_color__WEBPACK_IMPORTED_MODULE_1__["adjustBrightnessTo"])(this._maxLimitOffsetBrightness + bgColorWithOpacityPerceivedBrightness, textColorRgb).alpha(textColorAlpha);
|
|
3851
|
+
}
|
|
3852
|
+
|
|
3853
|
+
// 如果感知亮度差大于阈值，无需调整
|
|
3854
|
+
if (offsetPerceivedBrightness >= _constant__WEBPACK_IMPORTED_MODULE_2__["MIN_LIMIT_OFFSET_BRIGHTNESS"]) return textColor;
|
|
3855
|
+
if (bgColorWithOpacityPerceivedBrightness >= _constant__WEBPACK_IMPORTED_MODULE_2__["HIGH_BGCOLOR_BRIGHTNESS"]) {
|
|
3856
|
+
// 亮背景，调暗字体
|
|
3857
|
+
if (textColorHSL[2] > 90 - _constant__WEBPACK_IMPORTED_MODULE_2__["HIGH_BLACKWHITE_HSL_BRIGHTNESS"]) {
|
|
3858
|
+
// 优先调字体的亮度已带到降低感知亮度的目的
|
|
3859
|
+
textColorHSL[2] = 90 - textColorHSL[2];
|
|
3860
|
+
var tmpTextColor = color__WEBPACK_IMPORTED_MODULE_0___default.a.hsl.apply(color__WEBPACK_IMPORTED_MODULE_0___default.a, _toConsumableArray(textColorHSL)).alpha(textColorAlpha);
|
|
3861
|
+
return this._adjustTextBrightness(tmpTextColor, bgColor);
|
|
3862
|
+
}
|
|
3863
|
+
return Object(_color__WEBPACK_IMPORTED_MODULE_1__["adjustBrightnessTo"])(Math.min(this._maxLimitOffsetBrightness, bgColorWithOpacityPerceivedBrightness - _constant__WEBPACK_IMPORTED_MODULE_2__["MIN_LIMIT_OFFSET_BRIGHTNESS"]), textColorRgb).alpha(textColorAlpha);
|
|
3864
|
+
} else {
|
|
3865
|
+
// 暗背景，调亮字体
|
|
3866
|
+
if (textColorHSL[2] <= _constant__WEBPACK_IMPORTED_MODULE_2__["HIGH_BLACKWHITE_HSL_BRIGHTNESS"]) {
|
|
3867
|
+
// 优先调字体的亮度已带到提高感知亮度的目的
|
|
3868
|
+
textColorHSL[2] = 90 - textColorHSL[2];
|
|
3869
|
+
var _tmpTextColor = color__WEBPACK_IMPORTED_MODULE_0___default.a.hsl.apply(color__WEBPACK_IMPORTED_MODULE_0___default.a, _toConsumableArray(textColorHSL)).alpha(textColorAlpha);
|
|
3870
|
+
return this._adjustTextBrightness(_tmpTextColor, bgColor);
|
|
3871
|
+
}
|
|
3872
|
+
return Object(_color__WEBPACK_IMPORTED_MODULE_1__["adjustBrightnessTo"])(Math.min(this._maxLimitOffsetBrightness, bgColorWithOpacityPerceivedBrightness + _constant__WEBPACK_IMPORTED_MODULE_2__["MIN_LIMIT_OFFSET_BRIGHTNESS"]), textColorRgb).alpha(textColorAlpha);
|
|
3873
|
+
}
|
|
3874
|
+
}
|
|
3875
|
+
|
|
3876
|
+
// 调整背景明度
|
|
3877
|
+
}, {
|
|
3878
|
+
key: "_adjustBackgroundBrightness",
|
|
3879
|
+
value: function _adjustBackgroundBrightness(bgColor) {
|
|
3880
|
+
var bgColorRgb = bgColor.rgb().array();
|
|
3881
|
+
var bgColorHsl = bgColor.hsl().array();
|
|
3882
|
+
var bgColorAlpha = bgColor.alpha();
|
|
3883
|
+
var bgColorPerceivedBrightness = Object(_color__WEBPACK_IMPORTED_MODULE_1__["getColorPerceivedBrightness"])(bgColorRgb);
|
|
3884
|
+
var newColor = bgColor;
|
|
3885
|
+
if (bgColorHsl[1] === 0 && bgColorHsl[2] > _constant__WEBPACK_IMPORTED_MODULE_2__["HIGH_BLACKWHITE_HSL_BRIGHTNESS"] || bgColorPerceivedBrightness > _constant__WEBPACK_IMPORTED_MODULE_2__["WHITE_LIKE_COLOR_BRIGHTNESS"]) {
|
|
3886
|
+
// 饱和度为0（黑白灰色），亮度大于HIGH_BLACKWHITE_HSL_BRIGHTNESS或感知亮度大于WHITE_LIKE_COLOR_BRIGHTNESS（白色）时，做亮度取反处理
|
|
3887
|
+
newColor = color__WEBPACK_IMPORTED_MODULE_0___default.a.hsl(0, 0, Math.min(100, 100 + this._defaultDarkBgColorHslBrightness - bgColorHsl[2]));
|
|
3888
|
+
} else if (bgColorPerceivedBrightness > _constant__WEBPACK_IMPORTED_MODULE_2__["MAX_LIMIT_BGCOLOR_BRIGHTNESS"]) {
|
|
3889
|
+
// 感知亮度大于MAX_LIMIT_BGCOLOR_BRIGHTNESS，将感知亮度设为MAX_LIMIT_BGCOLOR_BRIGHTNESS
|
|
3890
|
+
newColor = Object(_color__WEBPACK_IMPORTED_MODULE_1__["adjustBrightnessTo"])(_constant__WEBPACK_IMPORTED_MODULE_2__["MAX_LIMIT_BGCOLOR_BRIGHTNESS"], bgColorRgb).alpha(bgColorAlpha);
|
|
3891
|
+
// const ratio = (MAX_LIMIT_BGCOLOR_BRIGHTNESS * 1000)
|
|
3892
|
+
// / (bgColorRgb[0] * 299 + bgColorRgb[1] * 587 + bgColorRgb[2] * 114);
|
|
3893
|
+
// newColor = Color.rgb(bgColorRgb[0] * ratio, bgColorRgb[1] * ratio, bgColorRgb[2] * ratio);
|
|
3894
|
+
} else if (bgColorHsl[2] < _constant__WEBPACK_IMPORTED_MODULE_2__["LOW_BLACKWHITE_HSL_BRIGHTNESS"]) {
|
|
3895
|
+
// 亮度小于LOW_BLACKWHITE_HSL_BRIGHTNESS，将亮度设为LOW_BLACKWHITE_HSL_BRIGHTNESS，适当提高亮度
|
|
3896
|
+
bgColorHsl[2] = _constant__WEBPACK_IMPORTED_MODULE_2__["LOW_BLACKWHITE_HSL_BRIGHTNESS"];
|
|
3897
|
+
newColor = color__WEBPACK_IMPORTED_MODULE_0___default.a.hsl.apply(color__WEBPACK_IMPORTED_MODULE_0___default.a, _toConsumableArray(bgColorHsl));
|
|
3898
|
+
}
|
|
3899
|
+
return newColor.alpha(bgColorAlpha).rgb();
|
|
3900
|
+
}
|
|
3901
|
+
|
|
3902
|
+
// 叠加渐变色到背景色中，并更新背景色相关属性值以及文本颜色
|
|
3903
|
+
}, {
|
|
3904
|
+
key: "_updateBgWithGradient",
|
|
3905
|
+
value: function _updateBgWithGradient(gradientColor, el, className, cssKVList, hasInlineColor, isUpdate) {
|
|
3906
|
+
var newBgColor = Object(_color__WEBPACK_IMPORTED_MODULE_1__["mixColors"])([el[_constant__WEBPACK_IMPORTED_MODULE_2__["BGCOLORATTR"]] || _config__WEBPACK_IMPORTED_MODULE_3__["default"].defaultDarkBgColor, gradientColor], 'normal');
|
|
3907
|
+
var newOriginalBgColor = (el[_constant__WEBPACK_IMPORTED_MODULE_2__["ORIGINAL_BGCOLORATTR"]] || _config__WEBPACK_IMPORTED_MODULE_3__["default"].defaultLightBgColor).split(_constant__WEBPACK_IMPORTED_MODULE_2__["BG_COLOR_DELIMITER"]).concat(gradientColor.toString()).join(_constant__WEBPACK_IMPORTED_MODULE_2__["BG_COLOR_DELIMITER"]);
|
|
3908
|
+
Object(_domUtils__WEBPACK_IMPORTED_MODULE_5__["getChildrenAndIt"])(el).forEach(function (dom) {
|
|
3909
|
+
dom[_constant__WEBPACK_IMPORTED_MODULE_2__["BGCOLORATTR"]] = newBgColor;
|
|
3910
|
+
dom[_constant__WEBPACK_IMPORTED_MODULE_2__["ORIGINAL_BGCOLORATTR"]] = newOriginalBgColor;
|
|
3911
|
+
});
|
|
3912
|
+
var lastKV = cssKVList.slice(-1)[0];
|
|
3913
|
+
if (lastKV[0] === 'color') {
|
|
3914
|
+
var ret = this._adjustBrightness(Object(_color__WEBPACK_IMPORTED_MODULE_1__["ColorParser"])(Object(_color__WEBPACK_IMPORTED_MODULE_1__["parseColorName"])(lastKV[1])), el, {
|
|
3915
|
+
isBgColor: false,
|
|
3916
|
+
isTextShadow: false,
|
|
3917
|
+
isTextColor: true,
|
|
3918
|
+
isBorderColor: false,
|
|
3919
|
+
hasInlineColor: hasInlineColor
|
|
3920
|
+
}, isUpdate);
|
|
3921
|
+
if (ret.newColor) return _global__WEBPACK_IMPORTED_MODULE_4__["cssUtils"].genCss(className, _global__WEBPACK_IMPORTED_MODULE_4__["cssUtils"].genCssKV('color', ret.newColor));
|
|
3922
|
+
}
|
|
3923
|
+
return '';
|
|
3924
|
+
}
|
|
3798
3925
|
}, {
|
|
3799
3926
|
key: "_try",
|
|
3800
3927
|
value: function _try(func) {
|
|
@@ -3805,26 +3932,28 @@ var SDK = /*#__PURE__*/function () {
|
|
|
3805
3932
|
typeof _config__WEBPACK_IMPORTED_MODULE_3__["default"].error === 'function' && _config__WEBPACK_IMPORTED_MODULE_3__["default"].error(e);
|
|
3806
3933
|
}
|
|
3807
3934
|
}
|
|
3935
|
+
|
|
3936
|
+
// 初始化
|
|
3808
3937
|
}, {
|
|
3809
3938
|
key: "init",
|
|
3810
3939
|
value: function init() {
|
|
3811
|
-
this._defaultDarkTextColorRgb = ColorParser(_config__WEBPACK_IMPORTED_MODULE_3__["default"].defaultDarkTextColor).rgb().array();
|
|
3812
|
-
this._defaultDarkBgColorRgb = ColorParser(_config__WEBPACK_IMPORTED_MODULE_3__["default"].defaultDarkBgColor).rgb().array();
|
|
3813
|
-
this._defaultDarkBgColorHSL = ColorParser(_config__WEBPACK_IMPORTED_MODULE_3__["default"].defaultDarkBgColor).hsl().array();
|
|
3814
|
-
this._defaultDarkTextColorBrightness = getColorPerceivedBrightness(this._defaultDarkTextColorRgb);
|
|
3815
|
-
this._defaultDarkBgColorBrightness = getColorPerceivedBrightness(this._defaultDarkBgColorRgb);
|
|
3940
|
+
this._defaultDarkTextColorRgb = Object(_color__WEBPACK_IMPORTED_MODULE_1__["ColorParser"])(_config__WEBPACK_IMPORTED_MODULE_3__["default"].defaultDarkTextColor).rgb().array();
|
|
3941
|
+
this._defaultDarkBgColorRgb = Object(_color__WEBPACK_IMPORTED_MODULE_1__["ColorParser"])(_config__WEBPACK_IMPORTED_MODULE_3__["default"].defaultDarkBgColor).rgb().array();
|
|
3942
|
+
this._defaultDarkBgColorHSL = Object(_color__WEBPACK_IMPORTED_MODULE_1__["ColorParser"])(_config__WEBPACK_IMPORTED_MODULE_3__["default"].defaultDarkBgColor).hsl().array();
|
|
3943
|
+
this._defaultDarkTextColorBrightness = Object(_color__WEBPACK_IMPORTED_MODULE_1__["getColorPerceivedBrightness"])(this._defaultDarkTextColorRgb);
|
|
3944
|
+
this._defaultDarkBgColorBrightness = Object(_color__WEBPACK_IMPORTED_MODULE_1__["getColorPerceivedBrightness"])(this._defaultDarkBgColorRgb);
|
|
3816
3945
|
this._defaultDarkBgColorHslBrightness = this._defaultDarkBgColorHSL[2];
|
|
3817
3946
|
this._maxLimitOffsetBrightness = this._defaultDarkTextColorBrightness - this._defaultDarkBgColorBrightness;
|
|
3818
3947
|
}
|
|
3948
|
+
|
|
3949
|
+
// 处理节点
|
|
3819
3950
|
}, {
|
|
3820
3951
|
key: "convert",
|
|
3821
3952
|
value: function convert(el, cssKVList, isUpdate) {
|
|
3822
3953
|
var _this = this;
|
|
3823
|
-
|
|
3824
3954
|
_global__WEBPACK_IMPORTED_MODULE_4__["plugins"].resetCss();
|
|
3825
3955
|
_global__WEBPACK_IMPORTED_MODULE_4__["plugins"].emit("beforeConvertNode".concat(isUpdate ? 'ByUpdateStyle' : ''), el);
|
|
3826
3956
|
var css = ''; // css
|
|
3827
|
-
|
|
3828
3957
|
var bgCss = ''; // 文字底图css
|
|
3829
3958
|
|
|
3830
3959
|
if (this.isDarkmode || isUpdate) {
|
|
@@ -3834,7 +3963,6 @@ var SDK = /*#__PURE__*/function () {
|
|
|
3834
3963
|
return el.hasAttribute(attribute);
|
|
3835
3964
|
})) return '';
|
|
3836
3965
|
var styles = el.style;
|
|
3837
|
-
|
|
3838
3966
|
if (!cssKVList) {
|
|
3839
3967
|
// 没有传入cssKVList就从内联样式中提取
|
|
3840
3968
|
// styles.cssText 读出来的颜色统一是rgba格式，除了用英文定义颜色（如：black、white）
|
|
@@ -3846,43 +3974,36 @@ var SDK = /*#__PURE__*/function () {
|
|
|
3846
3974
|
});
|
|
3847
3975
|
});
|
|
3848
3976
|
}
|
|
3849
|
-
|
|
3850
3977
|
var hasInlineColor = false; // 是否有自定义字体颜色
|
|
3851
|
-
|
|
3852
3978
|
var hasInlineBackground = false;
|
|
3853
3979
|
var hasInlineBackgroundImage = false;
|
|
3854
3980
|
var elBackgroundPositionAttr = null;
|
|
3855
3981
|
var elBackgroundSizeAttr = null;
|
|
3856
3982
|
cssKVList = cssKVList.filter(function (_ref) {
|
|
3857
3983
|
var _ref2 = _slicedToArray(_ref, 2),
|
|
3858
|
-
|
|
3859
|
-
|
|
3860
|
-
|
|
3984
|
+
key = _ref2[0],
|
|
3985
|
+
value = _ref2[1];
|
|
3861
3986
|
if (key === 'color') {
|
|
3862
3987
|
hasInlineColor = true;
|
|
3863
3988
|
} else if (/background/i.test(key)) {
|
|
3864
3989
|
hasInlineBackground = true;
|
|
3865
|
-
|
|
3866
3990
|
if (key === 'background-position') {
|
|
3867
3991
|
elBackgroundPositionAttr = value;
|
|
3868
3992
|
} else if (key === 'background-size') {
|
|
3869
3993
|
elBackgroundSizeAttr = value;
|
|
3870
3994
|
}
|
|
3871
3995
|
}
|
|
3872
|
-
|
|
3873
3996
|
if ((/background/i.test(key) || /^(-webkit-)?border-image/.test(key)) && /url\([^)]*\)/i.test(value)) {
|
|
3874
3997
|
hasInlineBackgroundImage = true;
|
|
3875
|
-
}
|
|
3876
|
-
|
|
3998
|
+
}
|
|
3877
3999
|
|
|
4000
|
+
// 过滤掉一些key
|
|
3878
4001
|
return _constant__WEBPACK_IMPORTED_MODULE_2__["CSS_PROP_LIST"].indexOf(key) > -1;
|
|
3879
4002
|
}).sort(function (_ref3, _ref4) {
|
|
3880
4003
|
var _ref5 = _slicedToArray(_ref3, 1),
|
|
3881
|
-
|
|
3882
|
-
|
|
4004
|
+
key1 = _ref5[0];
|
|
3883
4005
|
var _ref6 = _slicedToArray(_ref4, 1),
|
|
3884
|
-
|
|
3885
|
-
|
|
4006
|
+
key2 = _ref6[0];
|
|
3886
4007
|
// color属性放在最后
|
|
3887
4008
|
if (key1 === 'color') {
|
|
3888
4009
|
return 1;
|
|
@@ -3893,21 +4014,16 @@ var SDK = /*#__PURE__*/function () {
|
|
|
3893
4014
|
// 把-webkit-text的属性放在最前面
|
|
3894
4015
|
return 1;
|
|
3895
4016
|
}
|
|
3896
|
-
|
|
3897
4017
|
return -1;
|
|
3898
4018
|
});
|
|
3899
|
-
|
|
3900
4019
|
if (_constant__WEBPACK_IMPORTED_MODULE_2__["TABLE_NAME"].indexOf(nodeName) > -1 && !hasInlineBackground) {
|
|
3901
4020
|
// 如果table没有内联样式
|
|
3902
4021
|
this._try(function () {
|
|
3903
4022
|
var colorStr = Object(_domUtils__WEBPACK_IMPORTED_MODULE_5__["hasTableClass"])(el); // 获取class对应的lm色值
|
|
3904
|
-
|
|
3905
4023
|
if (!colorStr) colorStr = el.getAttribute('bgcolor'); // 如果没有class则获取bgcolor的色值
|
|
3906
|
-
|
|
3907
4024
|
if (colorStr) {
|
|
3908
4025
|
// 有色值（class对应的lm色值或者是bgcolor色值），则当做内联样式来处理
|
|
3909
|
-
var color = ColorParser(colorStr);
|
|
3910
|
-
|
|
4026
|
+
var color = Object(_color__WEBPACK_IMPORTED_MODULE_1__["ColorParser"])(colorStr);
|
|
3911
4027
|
if (color) {
|
|
3912
4028
|
cssKVList.unshift(['background-color', color.toString()]);
|
|
3913
4029
|
hasInlineBackground = true;
|
|
@@ -3915,60 +4031,52 @@ var SDK = /*#__PURE__*/function () {
|
|
|
3915
4031
|
}
|
|
3916
4032
|
});
|
|
3917
4033
|
}
|
|
3918
|
-
|
|
3919
4034
|
if (nodeName === 'FONT' && !hasInlineColor) {
|
|
3920
4035
|
// 如果是font标签且没有内联文本颜色样式
|
|
3921
4036
|
this._try(function () {
|
|
3922
4037
|
var colorStr = el.getAttribute('color'); // 获取color的色值
|
|
3923
|
-
|
|
3924
4038
|
if (colorStr) {
|
|
3925
4039
|
// 有色值，则当做内联样式来处理
|
|
3926
|
-
var color = ColorParser(colorStr);
|
|
3927
|
-
|
|
4040
|
+
var color = Object(_color__WEBPACK_IMPORTED_MODULE_1__["ColorParser"])(colorStr);
|
|
3928
4041
|
if (color) {
|
|
3929
4042
|
cssKVList.push(['color', color.toString()]);
|
|
3930
4043
|
hasInlineColor = true;
|
|
3931
4044
|
}
|
|
3932
4045
|
}
|
|
3933
4046
|
});
|
|
3934
|
-
}
|
|
3935
|
-
|
|
4047
|
+
}
|
|
3936
4048
|
|
|
4049
|
+
// 处理-webkit-text相关样式
|
|
3937
4050
|
var webkitFillColor = '';
|
|
3938
4051
|
var webkitStrokeColor = '';
|
|
3939
4052
|
var webkitTextLen = 0;
|
|
3940
4053
|
cssKVList.some(function (_ref7, idx) {
|
|
3941
4054
|
var _ref8 = _slicedToArray(_ref7, 2),
|
|
3942
|
-
|
|
3943
|
-
|
|
3944
|
-
|
|
4055
|
+
key = _ref8[0],
|
|
4056
|
+
value = _ref8[1];
|
|
3945
4057
|
return _this._try(function () {
|
|
3946
4058
|
if (key.indexOf('-webkit-text') !== 0) {
|
|
3947
4059
|
// 遍历到非-webkit-text样式
|
|
3948
4060
|
webkitTextLen = idx; // 记录-webkit-text相关样式的长度
|
|
3949
|
-
|
|
3950
4061
|
return true; // 结束遍历
|
|
3951
4062
|
}
|
|
3952
4063
|
|
|
3953
4064
|
switch (key) {
|
|
3954
4065
|
case '-webkit-text-fill-color':
|
|
3955
|
-
webkitFillColor = parseWebkitFillColorAndStrokeColor(value);
|
|
4066
|
+
webkitFillColor = Object(_color__WEBPACK_IMPORTED_MODULE_1__["parseWebkitFillColorAndStrokeColor"])(value);
|
|
3956
4067
|
break;
|
|
3957
|
-
|
|
3958
4068
|
case '-webkit-text-stroke':
|
|
3959
4069
|
{
|
|
3960
4070
|
// 有-webkit-text-stroke时就不会有-webkit-text-stroke-color
|
|
3961
4071
|
var newValue = value.split(' ');
|
|
3962
|
-
newValue.length === 2 && (webkitStrokeColor = parseWebkitFillColorAndStrokeColor(newValue[1]));
|
|
4072
|
+
newValue.length === 2 && (webkitStrokeColor = Object(_color__WEBPACK_IMPORTED_MODULE_1__["parseWebkitFillColorAndStrokeColor"])(newValue[1]));
|
|
3963
4073
|
break;
|
|
3964
4074
|
}
|
|
3965
|
-
|
|
3966
4075
|
case '-webkit-text-stroke-color':
|
|
3967
4076
|
// 有-webkit-text-stroke-color时就不会有-webkit-text-stroke
|
|
3968
|
-
webkitStrokeColor = parseWebkitFillColorAndStrokeColor(value);
|
|
4077
|
+
webkitStrokeColor = Object(_color__WEBPACK_IMPORTED_MODULE_1__["parseWebkitFillColorAndStrokeColor"])(value);
|
|
3969
4078
|
break;
|
|
3970
4079
|
}
|
|
3971
|
-
|
|
3972
4080
|
return false; // 继续遍历
|
|
3973
4081
|
});
|
|
3974
4082
|
});
|
|
@@ -3984,43 +4092,36 @@ var SDK = /*#__PURE__*/function () {
|
|
|
3984
4092
|
hasInlineColor = true;
|
|
3985
4093
|
}
|
|
3986
4094
|
}
|
|
3987
|
-
|
|
3988
4095
|
if (webkitTextLen) {
|
|
3989
4096
|
cssKVList.splice(0, webkitTextLen); // 删掉-webkit-text相关样式
|
|
3990
|
-
|
|
3991
4097
|
webkitStrokeColor && cssKVList.unshift(['-webkit-text-stroke-color', webkitStrokeColor]); // 如果有-webkit-text-stroke-color，则插入到最前面
|
|
3992
4098
|
}
|
|
3993
4099
|
|
|
3994
4100
|
var dmClassName = '';
|
|
3995
4101
|
var dmBgClassName = '';
|
|
3996
|
-
|
|
3997
4102
|
if (isUpdate && el.className && typeof el.className === 'string') {
|
|
3998
4103
|
// 先提取dm className
|
|
3999
4104
|
var matches = el.className.match(_constant__WEBPACK_IMPORTED_MODULE_2__["DM_CLASSNAME_REGEXP"]);
|
|
4000
|
-
|
|
4001
4105
|
if (matches) {
|
|
4002
4106
|
dmClassName = matches[0];
|
|
4003
|
-
}
|
|
4004
|
-
|
|
4107
|
+
}
|
|
4005
4108
|
|
|
4109
|
+
// 再提取dm bg className
|
|
4006
4110
|
matches = el.className.match(_global__WEBPACK_IMPORTED_MODULE_4__["bgStack"].classNameReg);
|
|
4007
|
-
|
|
4008
4111
|
if (matches) {
|
|
4009
4112
|
dmBgClassName = matches[0];
|
|
4010
4113
|
}
|
|
4011
4114
|
}
|
|
4012
|
-
|
|
4013
4115
|
var cssKV = ''; // css键值对
|
|
4014
|
-
|
|
4015
4116
|
cssKVList.forEach(function (_ref9) {
|
|
4016
4117
|
var _ref10 = _slicedToArray(_ref9, 2),
|
|
4017
|
-
|
|
4018
|
-
|
|
4019
|
-
|
|
4118
|
+
key = _ref10[0],
|
|
4119
|
+
value = _ref10[1];
|
|
4020
4120
|
return _this._try(function () {
|
|
4021
4121
|
var oldValue = value;
|
|
4022
|
-
var cssChange = false;
|
|
4122
|
+
var cssChange = false;
|
|
4023
4123
|
|
|
4124
|
+
// 找出色值来处理
|
|
4024
4125
|
var isBgColor = _constant__WEBPACK_IMPORTED_MODULE_2__["CSS_PROP_SERIES"].BG_COLOR.indexOf(key) > -1;
|
|
4025
4126
|
var isTextShadow = _constant__WEBPACK_IMPORTED_MODULE_2__["CSS_PROP_SERIES"].TEXT_SHADOW.indexOf(key) > -1;
|
|
4026
4127
|
var textColorIdx = _constant__WEBPACK_IMPORTED_MODULE_2__["CSS_PROP_SERIES"].TEXT_COLOR.indexOf(key);
|
|
@@ -4028,34 +4129,31 @@ var SDK = /*#__PURE__*/function () {
|
|
|
4028
4129
|
var isGradient = /gradient/.test(value);
|
|
4029
4130
|
var gradientColors = [];
|
|
4030
4131
|
var extStyle = '';
|
|
4031
|
-
var gradientMixColor;
|
|
4132
|
+
var gradientMixColor;
|
|
4032
4133
|
|
|
4033
|
-
|
|
4134
|
+
// 将英文定义颜色转换为rgb格式
|
|
4135
|
+
value = Object(_color__WEBPACK_IMPORTED_MODULE_1__["parseColorName"])(value, isGradient); // 渐变需要处理透明
|
|
4034
4136
|
|
|
4035
|
-
if (
|
|
4137
|
+
if (_constant__WEBPACK_IMPORTED_MODULE_2__["COLOR_REGEXP"].test(value)) {
|
|
4036
4138
|
if (isGradient) {
|
|
4037
4139
|
// 把原渐变色取出来
|
|
4038
|
-
var _matches =
|
|
4039
|
-
|
|
4140
|
+
var _matches = _constant__WEBPACK_IMPORTED_MODULE_2__["COLOR_REGEXP_GLOBAL"].exec(value);
|
|
4040
4141
|
while (_matches) {
|
|
4041
4142
|
gradientColors.push(_matches[0]);
|
|
4042
|
-
_matches =
|
|
4043
|
-
}
|
|
4044
|
-
|
|
4143
|
+
_matches = _constant__WEBPACK_IMPORTED_MODULE_2__["COLOR_REGEXP_GLOBAL"].exec(value);
|
|
4144
|
+
}
|
|
4045
4145
|
|
|
4046
|
-
|
|
4146
|
+
// 计算出一个mix颜色
|
|
4147
|
+
gradientMixColor = Object(_color__WEBPACK_IMPORTED_MODULE_1__["mixColors"])(gradientColors);
|
|
4047
4148
|
}
|
|
4048
|
-
|
|
4049
4149
|
var replaceIndex = 0;
|
|
4050
|
-
value = value.replace(
|
|
4150
|
+
value = value.replace(_constant__WEBPACK_IMPORTED_MODULE_2__["COLOR_REGEXP_GLOBAL"], function (match) {
|
|
4051
4151
|
// 渐变色统一改成mix纯色
|
|
4052
4152
|
if (isGradient) {
|
|
4053
4153
|
match = gradientMixColor;
|
|
4054
4154
|
cssChange = true;
|
|
4055
4155
|
}
|
|
4056
|
-
|
|
4057
|
-
var matchColor = ColorParser(match);
|
|
4058
|
-
|
|
4156
|
+
var matchColor = Object(_color__WEBPACK_IMPORTED_MODULE_1__["ColorParser"])(match);
|
|
4059
4157
|
if ((matchColor === null || matchColor === void 0 ? void 0 : matchColor.alpha()) >= _constant__WEBPACK_IMPORTED_MODULE_2__["IGNORE_ALPHA"]) {
|
|
4060
4158
|
// 忽略透明度低的色值
|
|
4061
4159
|
// 使用颜色处理算法
|
|
@@ -4066,10 +4164,10 @@ var SDK = /*#__PURE__*/function () {
|
|
|
4066
4164
|
isBorderColor: isBorderColor,
|
|
4067
4165
|
hasInlineColor: hasInlineColor
|
|
4068
4166
|
}, isUpdate);
|
|
4069
|
-
|
|
4070
4167
|
var retColor = !hasInlineBackgroundImage && ret.newColor;
|
|
4071
|
-
extStyle += ret.extStyle;
|
|
4168
|
+
extStyle += ret.extStyle;
|
|
4072
4169
|
|
|
4170
|
+
// 对背景颜色和文字颜色做继承传递，用于文字亮度计算
|
|
4073
4171
|
if (isBgColor || textColorIdx >= 5) {
|
|
4074
4172
|
// 只处理color及之后的属性
|
|
4075
4173
|
var retColorStr = retColor ? retColor.toString() : match;
|
|
@@ -4080,78 +4178,75 @@ var SDK = /*#__PURE__*/function () {
|
|
|
4080
4178
|
} else {
|
|
4081
4179
|
dom[_constant__WEBPACK_IMPORTED_MODULE_2__["COLORATTR"]] = retColorStr;
|
|
4082
4180
|
dom[_constant__WEBPACK_IMPORTED_MODULE_2__["ORIGINAL_COLORATTR"]] = match;
|
|
4083
|
-
}
|
|
4084
|
-
|
|
4085
|
-
|
|
4086
|
-
var retColor = ColorParser(retColorStr);
|
|
4181
|
+
}
|
|
4087
4182
|
|
|
4183
|
+
// 如果设置背景颜色，取消背景图片的影响
|
|
4184
|
+
var retColor = Object(_color__WEBPACK_IMPORTED_MODULE_1__["ColorParser"])(retColorStr);
|
|
4088
4185
|
if (isBgColor && (retColor === null || retColor === void 0 ? void 0 : retColor.alpha()) >= _constant__WEBPACK_IMPORTED_MODULE_2__["IGNORE_ALPHA"] && dom[_constant__WEBPACK_IMPORTED_MODULE_2__["BGIMAGEATTR"]]) {
|
|
4089
4186
|
delete dom[_constant__WEBPACK_IMPORTED_MODULE_2__["BGIMAGEATTR"]];
|
|
4090
4187
|
}
|
|
4091
4188
|
});
|
|
4092
4189
|
}
|
|
4093
|
-
|
|
4094
4190
|
retColor && (cssChange = true);
|
|
4095
4191
|
replaceIndex++;
|
|
4096
4192
|
return retColor || match;
|
|
4097
4193
|
}
|
|
4098
|
-
|
|
4099
4194
|
return match;
|
|
4100
4195
|
}).replace(/\s?!\s?important/ig, '');
|
|
4101
4196
|
}
|
|
4102
|
-
|
|
4103
4197
|
extStyle && (cssKV += extStyle);
|
|
4104
|
-
|
|
4105
4198
|
if (!(el instanceof SVGElement)) {
|
|
4106
4199
|
// 先不处理SVG
|
|
4107
4200
|
// 背景图片、边框图片
|
|
4108
4201
|
var isBackgroundAttr = /^background/.test(key);
|
|
4109
4202
|
var isBorderImageAttr = /^(-webkit-)?border-image/.test(key);
|
|
4110
|
-
|
|
4111
4203
|
if ((isBackgroundAttr || isBorderImageAttr) && /url\([^)]*\)/i.test(value)) {
|
|
4112
4204
|
cssChange = true;
|
|
4113
|
-
var imgBgColor =
|
|
4205
|
+
var imgBgColor = Object(_color__WEBPACK_IMPORTED_MODULE_1__["mixColors"])((el[_constant__WEBPACK_IMPORTED_MODULE_2__["ORIGINAL_BGCOLORATTR"]] || _config__WEBPACK_IMPORTED_MODULE_3__["default"].defaultLightBgColor).split(_constant__WEBPACK_IMPORTED_MODULE_2__["BG_COLOR_DELIMITER"]), 'normal').toString();
|
|
4206
|
+
// const imgBgColor = el[BGCOLORATTR] || config.defaultLightBgColor;
|
|
4207
|
+
|
|
4114
4208
|
// 在背景图片下加一层原背景颜色：
|
|
4115
4209
|
// background-image使用多层背景(注意background-position也要多加一层 https://www.w3.org/TR/css-backgrounds-3/#layering)；
|
|
4116
4210
|
// border-image不支持多层背景，需要添加background-color
|
|
4117
|
-
|
|
4118
4211
|
value = value.replace(/^(.*?)url\(([^)]*)\)(.*)$/i, function (matches) {
|
|
4119
4212
|
var newValue = matches;
|
|
4120
4213
|
var tmpCssKvStr = '';
|
|
4121
|
-
|
|
4122
4214
|
if (!el[_constant__WEBPACK_IMPORTED_MODULE_2__["BGIMAGEATTR"]]) {
|
|
4123
4215
|
// 避免重复set
|
|
4124
4216
|
Object(_domUtils__WEBPACK_IMPORTED_MODULE_5__["getChildrenAndIt"])(el).forEach(function (dom) {
|
|
4125
4217
|
dom[_constant__WEBPACK_IMPORTED_MODULE_2__["BGIMAGEATTR"]] = true;
|
|
4126
4218
|
});
|
|
4127
|
-
}
|
|
4128
|
-
|
|
4219
|
+
}
|
|
4129
4220
|
|
|
4221
|
+
// background-image
|
|
4130
4222
|
if (isBackgroundAttr) {
|
|
4131
4223
|
tmpCssKvStr = _global__WEBPACK_IMPORTED_MODULE_4__["cssUtils"].genCssKV(key, imgBgColor ? "".concat(newValue, ",linear-gradient(").concat(imgBgColor, ", ").concat(imgBgColor, ")") : newValue);
|
|
4132
|
-
|
|
4133
4224
|
if (elBackgroundPositionAttr) {
|
|
4134
4225
|
cssKV += _global__WEBPACK_IMPORTED_MODULE_4__["cssUtils"].genCssKV('background-position', elBackgroundPositionAttr);
|
|
4135
4226
|
tmpCssKvStr += _global__WEBPACK_IMPORTED_MODULE_4__["cssUtils"].genCssKV('background-position', imgBgColor ? "".concat(elBackgroundPositionAttr, ",top left") : elBackgroundPositionAttr);
|
|
4136
4227
|
}
|
|
4137
|
-
|
|
4138
4228
|
if (elBackgroundSizeAttr) {
|
|
4139
4229
|
cssKV += _global__WEBPACK_IMPORTED_MODULE_4__["cssUtils"].genCssKV('background-size', elBackgroundSizeAttr);
|
|
4140
4230
|
tmpCssKvStr += _global__WEBPACK_IMPORTED_MODULE_4__["cssUtils"].genCssKV('background-size', imgBgColor ? "".concat(elBackgroundSizeAttr, ",100%") : elBackgroundSizeAttr);
|
|
4141
4231
|
}
|
|
4142
|
-
|
|
4143
4232
|
if (dmBgClassName) {
|
|
4144
4233
|
// 如果是文字底图，则直接加样式
|
|
4145
4234
|
bgCss += _global__WEBPACK_IMPORTED_MODULE_4__["cssUtils"].genCss(dmBgClassName, tmpCssKvStr);
|
|
4235
|
+
Object(_domUtils__WEBPACK_IMPORTED_MODULE_5__["getChildrenAndIt"])(el).forEach(function (dom) {
|
|
4236
|
+
dom[_constant__WEBPACK_IMPORTED_MODULE_2__["COMPLEMENTARY_BGIMAGECOLORATTR"]] = imgBgColor || newValue;
|
|
4237
|
+
});
|
|
4146
4238
|
} else {
|
|
4147
4239
|
// 否则背景图入栈
|
|
4148
|
-
_global__WEBPACK_IMPORTED_MODULE_4__["bgStack"].push(el, tmpCssKvStr)
|
|
4240
|
+
_global__WEBPACK_IMPORTED_MODULE_4__["bgStack"].push(el, tmpCssKvStr, function () {
|
|
4241
|
+
Object(_domUtils__WEBPACK_IMPORTED_MODULE_5__["getChildrenAndIt"])(el).forEach(function (dom) {
|
|
4242
|
+
dom[_constant__WEBPACK_IMPORTED_MODULE_2__["COMPLEMENTARY_BGIMAGECOLORATTR"]] = imgBgColor || newValue;
|
|
4243
|
+
});
|
|
4244
|
+
});
|
|
4149
4245
|
}
|
|
4150
4246
|
} else {
|
|
4151
4247
|
// border-image元素，如果当前元素没有背景颜色，补背景颜色
|
|
4152
4248
|
if (imgBgColor && !hasInlineBackground) {
|
|
4153
4249
|
tmpCssKvStr = _global__WEBPACK_IMPORTED_MODULE_4__["cssUtils"].genCssKV('background-image', "linear-gradient(".concat(imgBgColor, ", ").concat(imgBgColor, ")"));
|
|
4154
|
-
|
|
4155
4250
|
if (dmBgClassName) {
|
|
4156
4251
|
// 如果是文字底图，则直接加样式
|
|
4157
4252
|
bgCss += _global__WEBPACK_IMPORTED_MODULE_4__["cssUtils"].genCss(dmBgClassName, tmpCssKvStr);
|
|
@@ -4163,8 +4258,9 @@ var SDK = /*#__PURE__*/function () {
|
|
|
4163
4258
|
}
|
|
4164
4259
|
|
|
4165
4260
|
return newValue;
|
|
4166
|
-
});
|
|
4261
|
+
});
|
|
4167
4262
|
|
|
4263
|
+
// 没有设置自定义字体颜色，则使用非 Dark Mode 下默认字体颜色
|
|
4168
4264
|
if (!hasInlineColor) {
|
|
4169
4265
|
var textColor = el[_constant__WEBPACK_IMPORTED_MODULE_2__["ORIGINAL_COLORATTR"]] || _config__WEBPACK_IMPORTED_MODULE_3__["default"].defaultLightTextColor;
|
|
4170
4266
|
cssKV += _global__WEBPACK_IMPORTED_MODULE_4__["cssUtils"].genCssKV('color', textColor);
|
|
@@ -4174,17 +4270,25 @@ var SDK = /*#__PURE__*/function () {
|
|
|
4174
4270
|
}
|
|
4175
4271
|
}
|
|
4176
4272
|
}
|
|
4177
|
-
|
|
4178
4273
|
if (cssChange) {
|
|
4179
|
-
!isUpdate && _constant__WEBPACK_IMPORTED_MODULE_2__["IMPORTANT_REGEXP"].test(oldValue) && (styles[key] =
|
|
4180
|
-
|
|
4274
|
+
!isUpdate && _constant__WEBPACK_IMPORTED_MODULE_2__["IMPORTANT_REGEXP"].test(oldValue) && (styles[key] = oldValue.replace(_constant__WEBPACK_IMPORTED_MODULE_2__["IMPORTANT_REGEXP"], '')); // 清除inline style的!important
|
|
4181
4275
|
if (isGradient) {
|
|
4182
4276
|
if (dmBgClassName) {
|
|
4183
|
-
//
|
|
4277
|
+
// 如果是文字底图，则直接加样式（其实理论上不会走到这里）
|
|
4184
4278
|
bgCss += _global__WEBPACK_IMPORTED_MODULE_4__["cssUtils"].genCss(dmBgClassName, _global__WEBPACK_IMPORTED_MODULE_4__["cssUtils"].genCssKV(key, value));
|
|
4279
|
+
if (/^background/.test(key) && !/url\([^)]*\)/i.test(value)) {
|
|
4280
|
+
// 是无背景图的渐变，需要重新计算背景色
|
|
4281
|
+
css += _this._updateBgWithGradient(gradientMixColor, el, dmBgClassName, cssKVList, hasInlineColor, isUpdate);
|
|
4282
|
+
}
|
|
4185
4283
|
} else {
|
|
4186
|
-
//
|
|
4187
|
-
_global__WEBPACK_IMPORTED_MODULE_4__["bgStack"].push(el, _global__WEBPACK_IMPORTED_MODULE_4__["cssUtils"].genCssKV(key, value))
|
|
4284
|
+
// 否则渐变入栈
|
|
4285
|
+
_global__WEBPACK_IMPORTED_MODULE_4__["bgStack"].push(el, _global__WEBPACK_IMPORTED_MODULE_4__["cssUtils"].genCssKV(key, value), function (item) {
|
|
4286
|
+
// 渐变入栈
|
|
4287
|
+
if (/^background/.test(key) && !/url\([^)]*\)/i.test(value)) {
|
|
4288
|
+
// 是无背景图的渐变，需要重新计算背景色
|
|
4289
|
+
css += _this._updateBgWithGradient(gradientMixColor, el, item.className, cssKVList, hasInlineColor, isUpdate);
|
|
4290
|
+
}
|
|
4291
|
+
});
|
|
4188
4292
|
}
|
|
4189
4293
|
} else {
|
|
4190
4294
|
cssKV += _global__WEBPACK_IMPORTED_MODULE_4__["cssUtils"].genCssKV(key, value);
|
|
@@ -4192,17 +4296,14 @@ var SDK = /*#__PURE__*/function () {
|
|
|
4192
4296
|
}
|
|
4193
4297
|
});
|
|
4194
4298
|
});
|
|
4195
|
-
|
|
4196
4299
|
if (cssKV) {
|
|
4197
4300
|
// 有处理过或者是背景图片就加class以及css
|
|
4198
4301
|
if (!dmClassName) {
|
|
4199
4302
|
dmClassName = "".concat(_constant__WEBPACK_IMPORTED_MODULE_2__["CLASS_PREFIX"]).concat(this._idx++);
|
|
4200
4303
|
el.classList.add(dmClassName);
|
|
4201
4304
|
}
|
|
4202
|
-
|
|
4203
4305
|
css += cssKV ? _global__WEBPACK_IMPORTED_MODULE_4__["cssUtils"].genCss(dmClassName, cssKV) : '';
|
|
4204
4306
|
}
|
|
4205
|
-
|
|
4206
4307
|
css += bgCss; // 追加文字底图样式，要在添加cssKV之后添加，避免被覆盖
|
|
4207
4308
|
|
|
4208
4309
|
if (!isUpdate && Object(_domUtils__WEBPACK_IMPORTED_MODULE_5__["hasTextNode"])(el)) {
|
|
@@ -4213,27 +4314,27 @@ var SDK = /*#__PURE__*/function () {
|
|
|
4213
4314
|
} else {
|
|
4214
4315
|
_global__WEBPACK_IMPORTED_MODULE_4__["bgStack"].contains(el, function (item) {
|
|
4215
4316
|
css += _global__WEBPACK_IMPORTED_MODULE_4__["cssUtils"].genCss(item.className, item.cssKV);
|
|
4317
|
+
typeof item.cb === 'function' && item.cb(item);
|
|
4216
4318
|
});
|
|
4217
4319
|
}
|
|
4218
4320
|
}
|
|
4219
4321
|
}
|
|
4220
|
-
|
|
4221
4322
|
_global__WEBPACK_IMPORTED_MODULE_4__["plugins"].emit("afterConvertNode".concat(isUpdate ? 'ByUpdateStyle' : ''), el);
|
|
4222
4323
|
return css;
|
|
4223
4324
|
}
|
|
4325
|
+
|
|
4326
|
+
// 获取两个颜色的对比度
|
|
4224
4327
|
}, {
|
|
4225
4328
|
key: "getContrast",
|
|
4226
4329
|
value: function getContrast(colorStr1, colorStr2) {
|
|
4227
|
-
var color1 = ColorParser(colorStr1);
|
|
4228
|
-
var color2 = ColorParser(colorStr2);
|
|
4229
|
-
return color1 && color2 ?
|
|
4330
|
+
var color1 = Object(_color__WEBPACK_IMPORTED_MODULE_1__["ColorParser"])(colorStr1);
|
|
4331
|
+
var color2 = Object(_color__WEBPACK_IMPORTED_MODULE_1__["ColorParser"])(colorStr2);
|
|
4332
|
+
return color1 && color2 ? color1.contrast(color2) : 0;
|
|
4230
4333
|
}
|
|
4231
4334
|
}]);
|
|
4232
|
-
|
|
4233
4335
|
return SDK;
|
|
4234
4336
|
}();
|
|
4235
4337
|
|
|
4236
|
-
|
|
4237
4338
|
;
|
|
4238
4339
|
|
|
4239
4340
|
/***/ }),
|
|
@@ -4250,15 +4351,10 @@ __webpack_require__.r(__webpack_exports__);
|
|
|
4250
4351
|
/* harmony export (binding) */ __webpack_require__.d(__webpack_exports__, "default", function() { return TextNodeQueue; });
|
|
4251
4352
|
/* harmony import */ var _config__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./config */ "./src/modules/config.js");
|
|
4252
4353
|
function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
|
|
4253
|
-
|
|
4254
4354
|
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
|
|
4255
|
-
|
|
4256
4355
|
function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
|
|
4257
|
-
|
|
4258
4356
|
function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); Object.defineProperty(Constructor, "prototype", { writable: false }); return Constructor; }
|
|
4259
|
-
|
|
4260
4357
|
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
|
|
4261
|
-
|
|
4262
4358
|
/**
|
|
4263
4359
|
* @name 文本节点队列
|
|
4264
4360
|
*
|
|
@@ -4269,59 +4365,62 @@ function _defineProperty(obj, key, value) { if (key in obj) { Object.definePrope
|
|
|
4269
4365
|
*
|
|
4270
4366
|
* @method push 文本节点入队
|
|
4271
4367
|
* @param {DOM Object} el 文本节点对象
|
|
4368
|
+
* @return void
|
|
4272
4369
|
*
|
|
4273
4370
|
* @method forEach 遍历，遍历过的文本节点出队
|
|
4274
4371
|
* @param {Function} callback 回调
|
|
4372
|
+
* @return void
|
|
4275
4373
|
*
|
|
4276
4374
|
* @method update 更新队列的节点对象，主要解决前后节点不一致的问题
|
|
4277
4375
|
* @param {DOM Object Array} els 要更新的节点对象列表
|
|
4376
|
+
* @return void
|
|
4278
4377
|
*
|
|
4279
4378
|
*/
|
|
4280
|
-
// Darkmode配置
|
|
4281
4379
|
|
|
4380
|
+
// Darkmode配置
|
|
4282
4381
|
|
|
4283
4382
|
var TextNodeQueue = /*#__PURE__*/function () {
|
|
4284
4383
|
// 文本节点队列，{ el, className, updated }
|
|
4285
4384
|
// 索引值
|
|
4385
|
+
|
|
4286
4386
|
function TextNodeQueue(prefix) {
|
|
4287
4387
|
_classCallCheck(this, TextNodeQueue);
|
|
4288
|
-
|
|
4289
4388
|
_defineProperty(this, "_queue", []);
|
|
4290
|
-
|
|
4291
4389
|
_defineProperty(this, "_idx", 0);
|
|
4292
|
-
|
|
4293
4390
|
this._prefix = prefix;
|
|
4294
4391
|
}
|
|
4295
4392
|
|
|
4393
|
+
// 文本节点入队
|
|
4296
4394
|
_createClass(TextNodeQueue, [{
|
|
4297
4395
|
key: "push",
|
|
4298
4396
|
value: function push(el) {
|
|
4299
4397
|
var className = "".concat(this._prefix).concat(this._idx++);
|
|
4300
4398
|
el.classList.add(className);
|
|
4301
|
-
|
|
4302
4399
|
this._queue.push({
|
|
4303
4400
|
el: el,
|
|
4304
4401
|
className: className,
|
|
4305
4402
|
updated: !_config__WEBPACK_IMPORTED_MODULE_0__["default"].delayBgJudge
|
|
4306
4403
|
});
|
|
4307
4404
|
}
|
|
4405
|
+
|
|
4406
|
+
// 遍历，遍历过的文本节点出队
|
|
4308
4407
|
}, {
|
|
4309
4408
|
key: "forEach",
|
|
4310
4409
|
value: function forEach(callback) {
|
|
4311
4410
|
var idxStack = [];
|
|
4312
|
-
|
|
4313
4411
|
this._queue.forEach(function (item, idx) {
|
|
4314
4412
|
if (item.updated) {
|
|
4315
4413
|
idxStack.unshift(idx);
|
|
4316
4414
|
_typeof(callback) && callback(item.el);
|
|
4317
4415
|
}
|
|
4318
4416
|
});
|
|
4319
|
-
|
|
4320
4417
|
while (idxStack.length) {
|
|
4321
4418
|
// 处理完之后删除部分节点
|
|
4322
4419
|
this._queue.splice(idxStack.shift(), 1);
|
|
4323
4420
|
}
|
|
4324
4421
|
}
|
|
4422
|
+
|
|
4423
|
+
// 更新队列的节点对象，主要解决前后节点不一致的问题
|
|
4325
4424
|
}, {
|
|
4326
4425
|
key: "update",
|
|
4327
4426
|
value: function update(els) {
|
|
@@ -4333,18 +4432,15 @@ var TextNodeQueue = /*#__PURE__*/function () {
|
|
|
4333
4432
|
item.updated = true;
|
|
4334
4433
|
return true;
|
|
4335
4434
|
}
|
|
4336
|
-
|
|
4337
4435
|
return false;
|
|
4338
4436
|
});
|
|
4339
4437
|
}
|
|
4340
4438
|
});
|
|
4341
4439
|
}
|
|
4342
4440
|
}]);
|
|
4343
|
-
|
|
4344
4441
|
return TextNodeQueue;
|
|
4345
4442
|
}();
|
|
4346
4443
|
|
|
4347
|
-
|
|
4348
4444
|
;
|
|
4349
4445
|
|
|
4350
4446
|
/***/ })
|