mazey 1.4.35 → 1.4.39

package/src/scss/mixin/index.scss

@@ -1,41 +1,41 @@
-@mixin m-icon ($w: auto, $h: auto, $url: "") {
-    display: inline-block;
-    width: $w;
-    height: $h;
-    background: url($url) no-repeat;
-    vertical-align: middle;
-}
-
-@mixin m-circle ($len, $color) {
-    display: inline-block;
-    width: $len;
-    height: $len;
-    background-color: $color;
-    border-radius: 50%;
-    vertical-align: middle;
-}
-
-@mixin m-row {
-    display: flex;
-    flex-wrap: wrap;
-}
-
-@mixin m-col ($percent) {
-    display: block;
-    position: relative;
-    max-width: $percent;
-    flex: 0 0 $percent;
-}
-
-@mixin m-hr ($w, $color) {
-    width: $w;
-    height: 1px;
-    background-color: $color;
-    display: inline-block;
-    text-align: center;
-}
-
-@mixin m-triangle ($w, $color, $dir) {
-    border: $w solid transparent;
-    border-#{$dir}-color: $color;
-}
+@mixin m-icon ($w: auto, $h: auto, $url: "") {
+    display: inline-block;
+    width: $w;
+    height: $h;
+    background: url($url) no-repeat;
+    vertical-align: middle;
+}
+
+@mixin m-circle ($len, $color) {
+    display: inline-block;
+    width: $len;
+    height: $len;
+    background-color: $color;
+    border-radius: 50%;
+    vertical-align: middle;
+}
+
+@mixin m-row {
+    display: flex;
+    flex-wrap: wrap;
+}
+
+@mixin m-col ($percent) {
+    display: block;
+    position: relative;
+    max-width: $percent;
+    flex: 0 0 $percent;
+}
+
+@mixin m-hr ($w, $color) {
+    width: $w;
+    height: 1px;
+    background-color: $color;
+    display: inline-block;
+    text-align: center;
+}
+
+@mixin m-triangle ($w, $color, $dir) {
+    border: $w solid transparent;
+    border-#{$dir}-color: $color;
+}

package/src/scss/variate/index.scss

@@ -1,28 +1,28 @@
-// 颜色
-$color-white: #ffffff;
-$color-green: #2ECC40;
-$color-red: #FF4136;
-$color-black: #111111;
-$color-orange: #FF851B;
-$color-yellow: #FFDC00;
-$color-blue: #0074D9;
-$color-purple: #B10DC9;
-
-// 背景图
-$bgc-navy: #001F3F;
-$bgc-blue: #0074D9;
-$bgc-aqua: #7FDBFF;
-$bgc-teal: #39CCCC;
-$bgc-olive: #3D9970;
-$bgc-green: #2ECC40;
-$bgc-lime: #01FF70;
-$bgc-yellow: #FFDC00;
-$bgc-orange: #FF851B;
-$bgc-red: #FF4136;
-$bgc-fuchsia: #F012BE;
-$bgc-purple: #B10DC9;
-$bgc-maroon: #85144B;
-$bgc-white: #FFFFFF;
-$bgc-gray: #AAAAAA;
-$bgc-silver: #DDDDDD;
+// 颜色
+$color-white: #ffffff;
+$color-green: #2ECC40;
+$color-red: #FF4136;
+$color-black: #111111;
+$color-orange: #FF851B;
+$color-yellow: #FFDC00;
+$color-blue: #0074D9;
+$color-purple: #B10DC9;
+
+// 背景图
+$bgc-navy: #001F3F;
+$bgc-blue: #0074D9;
+$bgc-aqua: #7FDBFF;
+$bgc-teal: #39CCCC;
+$bgc-olive: #3D9970;
+$bgc-green: #2ECC40;
+$bgc-lime: #01FF70;
+$bgc-yellow: #FFDC00;
+$bgc-orange: #FF851B;
+$bgc-red: #FF4136;
+$bgc-fuchsia: #F012BE;
+$bgc-purple: #B10DC9;
+$bgc-maroon: #85144B;
+$bgc-white: #FFFFFF;
+$bgc-gray: #AAAAAA;
+$bgc-silver: #DDDDDD;
 $bgc-black: #111111;

package/src/test.html

@@ -1,33 +1,33 @@
-<!DOCTYPE html>
-<html lang="en">
-<head>
-  <meta charset="UTF-8">
-  <title>Mazey's Test.</title>
-  <style>
-    .container {
-      position: absolute;
-      top: 0;
-      bottom: 0;
-      left: 0;
-      right: 0;
-      background-color: #999;
-      overflow: hidden;
-    }
-    .box {
-      transform: translate3d(0, 500px, 0px) scale(1);
-    }
-    .img {
-      width: 30%;
-      height: 90vh;
-    }
-  </style>
-</head>
-<body>
-    <div class="container">
-      <div class="box">
-        <img class="img" src="https://i.mazey.net/asset/WechatIMG14200.jpeg" />
-      </div>
-      <div class="s"></div>
-    </div>
-</body>
-</html>
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="UTF-8">
+  <title>Mazey's Test.</title>
+  <style>
+    .container {
+      position: absolute;
+      top: 0;
+      bottom: 0;
+      left: 0;
+      right: 0;
+      background-color: #999;
+      overflow: hidden;
+    }
+    .box {
+      transform: translate3d(0, 500px, 0px) scale(1);
+    }
+    .img {
+      width: 30%;
+      height: 90vh;
+    }
+  </style>
+</head>
+<body>
+    <div class="container">
+      <div class="box">
+        <img class="img" src="https://i.mazey.net/asset/WechatIMG14200.jpeg" />
+      </div>
+      <div class="s"></div>
+    </div>
+</body>
+</html>

package/src/test.ts

@@ -1,197 +1,52 @@
-import {
-  calLongestCommonSubstring,
-  calLongestCommonSubsequence,
-  getPerformance,
-  camelCaseToKebabCase,
-  camelCase2Underscore,
-  deepCopyObject,
-  inRate,
-  getUrlParam,
-  loadScript,
-  isSafePWAEnv,
-  getBrowserType,
-  debounce,
-  windowLoaded,
-  isNumber,
-  addInlineStyle,
-  floatToPercent,
-  customScrollBarForTransformEle,
-  // getPerformance,
- } from './index';
-
-// 数字测试
-console.log('数字测试：', isNumber(Infinity, { isUnFiniteAsNumber: true }));
-
-// 添加有 id 的内联样式，重复添加会更新内联样式而不是新增
-addInlineStyle({
-  inlineStyle: `
-    body {
-      background-color: #;
-    }
-  `,
-  id: 'test',
-});
-
-// <style id="test">
-//   body {
-//     background-color: #333;
-//   }
-// </style>
-
-// 添加无 id 的内联样式，重复添加会新增内联样式
-// addInlineStyle({
-//   inlineStyle: `
-//     body {
-//       background-color: #444;
-//     }
-//   `,
-// });
-
-// <style>
-//   body {
-//     background-color: #444;
-//   }
-// </style>
-
-(window as any).addInlineStyle = addInlineStyle;
-
-customScrollBarForTransformEle({
-  containerClassName: 'container',
-  imgBoxClassName: 'box',
-  imgClassName: 'img',
-  imgDom: null,
-});
-
-setTimeout(() => {
-// 变量
-const containerClassName = 'container';
-const imgBoxClassName = 'box';
-const imgClassName = 'img';
-const imgDom = document.querySelectorAll('.img')[0];
-// 样式初始化
-addInlineStyle({
-  inlineStyle: `
-    .${containerClassName}::after {
-      content: ' ';
-      position: fixed;
-      top: 0;
-      right: 5px;
-      min-height: 0vh;
-      max-height: 100vh;
-      width: 12px;
-      border-radius: 10px;
-      box-shadow: inset 0 0 6px rgba(0,0,0,.3);
-      -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.3);
-      background-color: #555;
-    }
-  `,
-  id: 'bar-init'
-});
-// 获取图片距离顶部的距离
-function getBox2To () {
-  const translates = window.getComputedStyle(document.querySelector(`.${imgBoxClassName}`) as any, null).transform;
-  const tanslateY = parseFloat(translates.substring(6).split(',')[5]);
-  return tanslateY;
-}
-const Box2ToRes = getBox2To();
-console.log('获取图片距离顶部的距离', Box2ToRes);
-// 获取图片的高度
-function getImgHeight () {
-  return (imgDom || document.querySelector(`.${imgClassName}`))?.clientHeight;
-}
-const ImgHeightRes = getImgHeight();
-console.log('获取图片的高度', ImgHeightRes);
-// 获取窗口的高度
-function getWindowHeight () {
-  return (document.querySelector(`.${containerClassName}`) as any).clientHeight; // window.outerHeight;
-}
-const WindowHeightRes = getWindowHeight();
-console.log('获取窗口的高度', WindowHeightRes);
-// 获取顶部溢出的百分比
-function getTopOverflowPercent () {
-  let box2To = Box2ToRes;
-  if (box2To >= 0) {
-    box2To = 0;
-  }
-  box2To = Math.abs(box2To);
-  // 图片高度
-  const imgHeight = ImgHeightRes;
-  const per = floatToPercent(box2To/(imgHeight as any), 2);
-  return {
-    box2To,
-    per,
-  };
-}
-const TopOverflowPercentRes = getTopOverflowPercent();
-console.log('获取顶部溢出的百分比', TopOverflowPercentRes);
-// 获取底部溢出的百分比
-function getBottomOverflowPercent () {
-  // 窗口高度
-  const windowHeight = WindowHeightRes;
-  // 图片高度
-  const imgHeight = ImgHeightRes;
-  // 上面溢出的高度
-  const box2To = Box2ToRes;
-  // 底部
-  const remindImageHeight = windowHeight - box2To;
-  let box2ToBottom = (imgHeight as any) - remindImageHeight;
-  if (box2ToBottom <= 0) {
-    box2ToBottom = 0;
-  }
-  const per = floatToPercent(box2ToBottom/(imgHeight as any), 2);
-  return {
-    box2ToBottom,
-    per,
-  };
-}
-const BottomOverflowPercentRes = getBottomOverflowPercent();
-console.log('获取顶部溢出的百分比', BottomOverflowPercentRes);
-// 如果都是 0 ，隐藏滚动条
-function hideBar () {
-  const { box2To } = TopOverflowPercentRes;
-  const { box2ToBottom } = BottomOverflowPercentRes;
-  if (!box2To && !box2ToBottom) {
-    return addInlineStyle({
-      inlineStyle: `
-        .${containerClassName}::after {
-          display: none;
-        }
-      `,
-      id: 'bar-hide'
-    });
-  }
-  return false;
-}
-const hideBarRes = hideBar();
-console.log('如果都是 0 ，隐藏滚动条', hideBarRes);
-// 设置顶部状态栏
-function setBarTop () {
-  const { box2To, per } = TopOverflowPercentRes;
-  return addInlineStyle({
-    inlineStyle: `
-      .${containerClassName}::after {
-        top: ${per};
-      }
-    `,
-    id: 'bar-top'
-  });
-}
-// 设置底部状态栏
-function setBarBottom () {
-  const { box2ToBottom, per } = BottomOverflowPercentRes;
-  return addInlineStyle({
-    inlineStyle: `
-      .${containerClassName}::after {
-        bottom: ${per};
-      }
-    `,
-    id: 'bar-bottom'
-  });
-}
-if (!hideBarRes) {
-  const setBarTopRes = setBarTop();
-  console.log('设置顶部状态栏', setBarTopRes);
-  const setBarBottomRes = setBarBottom();
-  console.log('设置底部状态栏', setBarBottomRes);
-}
-}, 10000000000000);
+import {
+  calLongestCommonSubstring,
+  calLongestCommonSubsequence,
+  getPerformance,
+  camelCaseToKebabCase,
+  camelCase2Underscore,
+  deepCopyObject,
+  inRate,
+  getUrlParam,
+  loadScript,
+  isSafePWAEnv,
+  getBrowserType,
+  debounce,
+  windowLoaded,
+  isNumber,
+  addInlineStyle,
+  floatToPercent,
+  customScrollBarForTransformEle,
+  // getPerformance,
+  calcContainImageSizeAndPosition,
+  genCustomConsole,
+ } from './index';
+
+// 数字测试
+console.log('数字测试：', isNumber(Infinity, { isUnFiniteAsNumber: true }));
+
+console.log('计算适配屏幕宽度的图片尺寸和位置：', JSON.stringify(calcContainImageSizeAndPosition({ oriImageWidth: 300, oriImageHeight: 300, viewportWidth: 375, viewportHeight: 812 })));
+
+const aaa = genCustomConsole({ prefix: 'aaa' });
+const bbb = genCustomConsole({ prefix: 'bbb:' });
+const ccc = genCustomConsole({ prefix: '' });
+const myConsole = genCustomConsole({ prefix: 'MazeyLog:' });
+
+aaa.log(123);
+aaa.info(123, 456);
+aaa.warn(123, 456, 789);
+aaa.error(123, 456, 789, 0);
+
+bbb.log(123);
+bbb.info(123, 456);
+bbb.warn(123, 456, 789);
+bbb.error(123, 456, 789, 0);
+
+ccc.log(123);
+ccc.info(123, 456);
+ccc.warn(123, 456, 789);
+ccc.error(123, 456, 789, 0);
+
+myConsole.log('I am string.'); // MazeyLog: I am string.
+myConsole.info('I am boolean.', true); // MazeyLog: I am boolean. true
+myConsole.info('I am number.', 123, 456); // MazeyLog: I am number. 123 456
+myConsole.info('I am object.', { a: 123, b: 456}); // MazeyLog: I am object. {a: 123, b: 456}

package/tsconfig.json

@@ -1,73 +1,73 @@
-{
-  "$schema": "http://json.schemastore.org/tsconfig",
-  "compilerOptions": {
-    /* Visit https://aka.ms/tsconfig.json to read more about this file */
-
-    /* Basic Options */
-    // "incremental": true,                   /* Enable incremental compilation */
-    "target": "es5",                          /* Specify ECMAScript target version: 'ES3' (default), 'ES5', 'ES2015', 'ES2016', 'ES2017', 'ES2018', 'ES2019', 'ES2020', or 'ESNEXT'. */
-    "module": "es2015",                     /* Specify module code generation: 'none', 'commonjs', 'amd', 'system', 'umd', 'es2015', 'es2020', or 'ESNext'. */
-    "lib": ["es5", "DOM", "ScriptHost", "ESNext"],                             /* Specify library files to be included in the compilation. */
-    // "allowJs": true,                       /* Allow javascript files to be compiled. */
-    // "checkJs": true,                       /* Report errors in .js files. */
-    // "jsx": "preserve",                     /* Specify JSX code generation: 'preserve', 'react-native', or 'react'. */
-    "declaration": true,                   /* Generates corresponding '.d.ts' file. */
-    "declarationMap": true,                /* Generates a sourcemap for each corresponding '.d.ts' file. */
-    "sourceMap": true,                     /* Generates corresponding '.map' file. */
-    // "outFile": "./",                       /* Concatenate and emit output to single file. */
-    "outDir": "lib",                        /* Redirect output structure to the directory. */
-    // "rootDir": "./",                       /* Specify the root directory of input files. Use to control the output directory structure with --outDir. */
-    // "composite": true,                     /* Enable project compilation */
-    // "tsBuildInfoFile": "./",               /* Specify file to store incremental compilation information */
-    // "removeComments": true,                /* Do not emit comments to output. */
-    // "noEmit": true,                        /* Do not emit outputs. */
-    // "importHelpers": true,                 /* Import emit helpers from 'tslib'. */
-    // "downlevelIteration": true,            /* Provide full support for iterables in 'for-of', spread, and destructuring when targeting 'ES5' or 'ES3'. */
-    // "isolatedModules": true,               /* Transpile each file as a separate module (similar to 'ts.transpileModule'). */
-
-    /* Strict Type-Checking Options */
-    "strict": true,                           /* Enable all strict type-checking options. */
-    // "noImplicitAny": true,                 /* Raise error on expressions and declarations with an implied 'any' type. */
-    // "strictNullChecks": true,              /* Enable strict null checks. */
-    // "strictFunctionTypes": true,           /* Enable strict checking of function types. */
-    // "strictBindCallApply": true,           /* Enable strict 'bind', 'call', and 'apply' methods on functions. */
-    // "strictPropertyInitialization": true,  /* Enable strict checking of property initialization in classes. */
-    "noImplicitThis": false,                /* Raise error on 'this' expressions with an implied 'any' type. */
-    // "alwaysStrict": true,                  /* Parse in strict mode and emit "use strict" for each source file. */
-
-    /* Additional Checks */
-    // "noUnusedLocals": true,                /* Report errors on unused locals. */
-    // "noUnusedParameters": true,            /* Report errors on unused parameters. */
-    // "noImplicitReturns": true,             /* Report error when not all code paths in function return a value. */
-    // "noFallthroughCasesInSwitch": true,    /* Report errors for fallthrough cases in switch statement. */
-
-    /* Module Resolution Options */
-    // "moduleResolution": "node",            /* Specify module resolution strategy: 'node' (Node.js) or 'classic' (TypeScript pre-1.6). */
-    // "baseUrl": "./",                       /* Base directory to resolve non-absolute module names. */
-    // "paths": {},                           /* A series of entries which re-map imports to lookup locations relative to the 'baseUrl'. */
-    // "rootDirs": [],                        /* List of root folders whose combined content represents the structure of the project at runtime. */
-    // "typeRoots": [],                       /* List of folders to include type definitions from. */
-    // "types": [],                           /* Type declaration files to be included in compilation. */
-    "allowSyntheticDefaultImports": true,  /* Allow default imports from modules with no default export. This does not affect code emit, just typechecking. */
-    "esModuleInterop": true,                  /* Enables emit interoperability between CommonJS and ES Modules via creation of namespace objects for all imports. Implies 'allowSyntheticDefaultImports'. */
-    // "preserveSymlinks": true,              /* Do not resolve the real path of symlinks. */
-    // "allowUmdGlobalAccess": true,          /* Allow accessing UMD globals from modules. */
-
-    /* Source Map Options */
-    // "sourceRoot": "",                      /* Specify the location where debugger should locate TypeScript files instead of source locations. */
-    // "mapRoot": "",                         /* Specify the location where debugger should locate map files instead of generated locations. */
-    // "inlineSourceMap": true,               /* Emit a single file with source maps instead of having a separate file. */
-    // "inlineSources": true,                 /* Emit the source alongside the sourcemaps within a single file; requires '--inlineSourceMap' or '--sourceMap' to be set. */
-
-    /* Experimental Options */
-    // "experimentalDecorators": true,        /* Enables experimental support for ES7 decorators. */
-    // "emitDecoratorMetadata": true,         /* Enables experimental support for emitting type metadata for decorators. */
-
-    /* Advanced Options */
-    "skipLibCheck": true,                     /* Skip type checking of declaration files. */
-    "forceConsistentCasingInFileNames": true  /* Disallow inconsistently-cased references to the same file. */
-  },
-  "include": [
-    "src/**/*.ts"
-  ]
-}
+{
+  "$schema": "http://json.schemastore.org/tsconfig",
+  "compilerOptions": {
+    /* Visit https://aka.ms/tsconfig.json to read more about this file */
+
+    /* Basic Options */
+    // "incremental": true,                   /* Enable incremental compilation */
+    "target": "es5",                          /* Specify ECMAScript target version: 'ES3' (default), 'ES5', 'ES2015', 'ES2016', 'ES2017', 'ES2018', 'ES2019', 'ES2020', or 'ESNEXT'. */
+    "module": "es2015",                     /* Specify module code generation: 'none', 'commonjs', 'amd', 'system', 'umd', 'es2015', 'es2020', or 'ESNext'. */
+    "lib": ["es5", "DOM", "ScriptHost", "ESNext"],                             /* Specify library files to be included in the compilation. */
+    // "allowJs": true,                       /* Allow javascript files to be compiled. */
+    // "checkJs": true,                       /* Report errors in .js files. */
+    // "jsx": "preserve",                     /* Specify JSX code generation: 'preserve', 'react-native', or 'react'. */
+    "declaration": true,                   /* Generates corresponding '.d.ts' file. */
+    "declarationMap": true,                /* Generates a sourcemap for each corresponding '.d.ts' file. */
+    "sourceMap": true,                     /* Generates corresponding '.map' file. */
+    // "outFile": "./",                       /* Concatenate and emit output to single file. */
+    "outDir": "lib",                        /* Redirect output structure to the directory. */
+    // "rootDir": "./",                       /* Specify the root directory of input files. Use to control the output directory structure with --outDir. */
+    // "composite": true,                     /* Enable project compilation */
+    // "tsBuildInfoFile": "./",               /* Specify file to store incremental compilation information */
+    // "removeComments": true,                /* Do not emit comments to output. */
+    // "noEmit": true,                        /* Do not emit outputs. */
+    // "importHelpers": true,                 /* Import emit helpers from 'tslib'. */
+    // "downlevelIteration": true,            /* Provide full support for iterables in 'for-of', spread, and destructuring when targeting 'ES5' or 'ES3'. */
+    // "isolatedModules": true,               /* Transpile each file as a separate module (similar to 'ts.transpileModule'). */
+
+    /* Strict Type-Checking Options */
+    "strict": true,                           /* Enable all strict type-checking options. */
+    // "noImplicitAny": true,                 /* Raise error on expressions and declarations with an implied 'any' type. */
+    // "strictNullChecks": true,              /* Enable strict null checks. */
+    // "strictFunctionTypes": true,           /* Enable strict checking of function types. */
+    // "strictBindCallApply": true,           /* Enable strict 'bind', 'call', and 'apply' methods on functions. */
+    // "strictPropertyInitialization": true,  /* Enable strict checking of property initialization in classes. */
+    "noImplicitThis": false,                /* Raise error on 'this' expressions with an implied 'any' type. */
+    // "alwaysStrict": true,                  /* Parse in strict mode and emit "use strict" for each source file. */
+
+    /* Additional Checks */
+    // "noUnusedLocals": true,                /* Report errors on unused locals. */
+    // "noUnusedParameters": true,            /* Report errors on unused parameters. */
+    // "noImplicitReturns": true,             /* Report error when not all code paths in function return a value. */
+    // "noFallthroughCasesInSwitch": true,    /* Report errors for fallthrough cases in switch statement. */
+
+    /* Module Resolution Options */
+    // "moduleResolution": "node",            /* Specify module resolution strategy: 'node' (Node.js) or 'classic' (TypeScript pre-1.6). */
+    // "baseUrl": "./",                       /* Base directory to resolve non-absolute module names. */
+    // "paths": {},                           /* A series of entries which re-map imports to lookup locations relative to the 'baseUrl'. */
+    // "rootDirs": [],                        /* List of root folders whose combined content represents the structure of the project at runtime. */
+    // "typeRoots": [],                       /* List of folders to include type definitions from. */
+    // "types": [],                           /* Type declaration files to be included in compilation. */
+    "allowSyntheticDefaultImports": true,  /* Allow default imports from modules with no default export. This does not affect code emit, just typechecking. */
+    "esModuleInterop": true,                  /* Enables emit interoperability between CommonJS and ES Modules via creation of namespace objects for all imports. Implies 'allowSyntheticDefaultImports'. */
+    // "preserveSymlinks": true,              /* Do not resolve the real path of symlinks. */
+    // "allowUmdGlobalAccess": true,          /* Allow accessing UMD globals from modules. */
+
+    /* Source Map Options */
+    // "sourceRoot": "",                      /* Specify the location where debugger should locate TypeScript files instead of source locations. */
+    // "mapRoot": "",                         /* Specify the location where debugger should locate map files instead of generated locations. */
+    // "inlineSourceMap": true,               /* Emit a single file with source maps instead of having a separate file. */
+    // "inlineSources": true,                 /* Emit the source alongside the sourcemaps within a single file; requires '--inlineSourceMap' or '--sourceMap' to be set. */
+
+    /* Experimental Options */
+    // "experimentalDecorators": true,        /* Enables experimental support for ES7 decorators. */
+    // "emitDecoratorMetadata": true,         /* Enables experimental support for emitting type metadata for decorators. */
+
+    /* Advanced Options */
+    "skipLibCheck": true,                     /* Skip type checking of declaration files. */
+    "forceConsistentCasingInFileNames": true  /* Disallow inconsistently-cased references to the same file. */
+  },
+  "include": [
+    "src/**/*.ts"
+  ]
+}

package/typing.d.ts

@@ -1,4 +1,4 @@
-// declare const navigator any;
-declare namespace navigator {
-  let connection: string;
+// declare const navigator any;
+declare namespace navigator {
+  let connection: string;
 }