From b7617b01c37574f98ab846b1845e13d5abda3e8b Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E5=AE=87=E5=A4=A9?= Date: Thu, 21 Dec 2017 22:39:45 +0800 Subject: [PATCH] =?UTF-8?q?=E5=AE=8C=E6=88=90=E5=AF=B9=E7=BB=84=E4=BB=B6?= =?UTF-8?q?=E7=9A=84=E9=87=8D=E6=9E=84?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- build.dev.js | 39 +- build.prod.js | 21 +- package-lock.json | 1041 ++++++++++++++++++++++++++++++++++++- package.json | 6 +- src/js/anot.shim.js | 174 +++---- src/js/lib/pages/main.htm | 34 +- src/js/lib/pages/main.js | 278 +++++----- 7 files changed, 1327 insertions(+), 266 deletions(-) diff --git a/build.dev.js b/build.dev.js index f433ef7..68a1e20 100755 --- a/build.dev.js +++ b/build.dev.js @@ -6,6 +6,7 @@ const babel = require('babel-core') const scss = require('node-sass') const chokidar = require('chokidar') const log = console.log +const chalk = require('chalk') const sourceDir = path.resolve(__dirname, 'src') const buildDir = path.resolve(__dirname, 'dist') @@ -28,24 +29,44 @@ const compileJs = (entry, output) => { fs.cp(entry, output) }, 100) } else { - const { code } = babel.transformFileSync(entry, jsOpt) - fs.echo(code, output) + try { + const { code } = babel.transformFileSync(entry, jsOpt) + fs.echo(code, output) + } catch (err) { + return log(err) + } } - log('编译JS: %s, 耗时 %d ms', entry, Date.now() - t1) + log( + '编译JS: %s, 耗时 %s ms', + chalk.green(entry), + chalk.yellow(Date.now() - t1) + ) } const compileCss = (entry, output) => { - let t1 = Date.now() - const { css } = scss.renderSync({ ...cssOpt, file: entry }) - log('编译scss: %s, 耗时 %d ms', entry, Date.now() - t1) - fs.echo(css, output) + try { + let t1 = Date.now() + const { css } = scss.renderSync({ ...cssOpt, file: entry }) + log( + '编译scss: %s, 耗时 %s ms', + chalk.green(entry), + chalk.yellow(Date.now() - t1) + ) + fs.echo(css, output) + } catch (err) { + log(err) + } } const compileHtm = (entry, output) => { let t1 = Date.now() let htm = fs.cat(entry).toString('utf8') htm = htm.replace(/[\r\n\t]+/g, ' ').replace(/\s{2,}/g, ' ') - log('压缩HTML: %s, 耗时 %d ms', entry, Date.now() - t1) + log( + '压缩HTML: %s, 耗时 %s ms', + chalk.green(entry), + chalk.yellow(Date.now() - t1) + ) fs.echo(htm, output) } @@ -102,5 +123,5 @@ chokidar } }) .on('ready', () => { - log('预处理完成,监听文件变化中,请勿关闭本窗口...') + log(chalk.red('预处理完成,监听文件变化中,请勿关闭本窗口...')) }) diff --git a/build.prod.js b/build.prod.js index 4ec8ea3..19bdd6f 100755 --- a/build.prod.js +++ b/build.prod.js @@ -5,6 +5,7 @@ const path = require('path') const babel = require('babel-core') const scss = require('node-sass') const log = console.log +const chalk = require('chalk') const sourceDir = path.resolve(__dirname, 'src') const buildDir = path.resolve(__dirname, 'dist') @@ -27,14 +28,22 @@ const compileJs = (entry, output) => { tmpOpt = Object.assign({}, jsOpt, { plugins: [] }) } const { code } = babel.transformFileSync(entry, tmpOpt) - log('编译JS: %s, 耗时 %d ms', entry, Date.now() - t1) + log( + '编译JS: %s, 耗时 %s ms', + chalk.green(entry), + chalk.yellow(Date.now() - t1) + ) fs.echo(code, output) } const compileCss = (entry, output) => { let t1 = Date.now() const { css } = scss.renderSync({ ...cssOpt, file: entry }) - log('编译scss: %s, 耗时 %d ms', entry, Date.now() - t1) + log( + '编译scss: %s, 耗时 %s ms', + chalk.green(entry), + chalk.yellow(Date.now() - t1) + ) fs.echo(css, output) } @@ -42,7 +51,11 @@ const compileHtm = (entry, output) => { let t1 = Date.now() let htm = fs.cat(entry).toString('utf8') htm = htm.replace(/[\r\n\t]+/g, ' ').replace(/\s{2,}/g, ' ') - log('压缩HTML: %s, 耗时 %d ms', entry, Date.now() - t1) + log( + '压缩HTML: %s, 耗时 %s ms', + chalk.green(entry), + chalk.yellow(Date.now() - t1) + ) fs.echo(htm, output) } @@ -56,7 +69,7 @@ const cssFiles = fs.ls('./src/css/', true) if (fs.isdir(buildDir)) { fs.rm(buildDir, true) - log('清除旧目录 dist/') + log(chalk.cyan('清除旧目录 dist/')) } // 字体文件直接复制 diff --git a/package-lock.json b/package-lock.json index 5599d6c..05e5c41 100644 --- a/package-lock.json +++ b/package-lock.json @@ -23,10 +23,13 @@ "dev": true }, "ansi-styles": { - "version": "2.2.1", - "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-2.2.1.tgz", - "integrity": "sha1-tDLdM1i2NM914eRmQ2gkBTPB3b4=", - "dev": true + "version": "3.2.0", + "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-3.2.0.tgz", + "integrity": "sha512-NnSOmMEYtVR2JVMIGTzynRkkaxtiq1xnFBcdQD/DnNCYPoEPsVJhM98BDyaoNOQIi7p4okdi3E27eN7GQbsUug==", + "dev": true, + "requires": { + "color-convert": "1.9.1" + } }, "anymatch": { "version": "1.3.2", @@ -132,6 +135,33 @@ "chalk": "1.1.3", "esutils": "2.0.2", "js-tokens": "3.0.2" + }, + "dependencies": { + "ansi-styles": { + "version": "2.2.1", + "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-2.2.1.tgz", + "integrity": "sha1-tDLdM1i2NM914eRmQ2gkBTPB3b4=", + "dev": true + }, + "chalk": { + "version": "1.1.3", + "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz", + "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg=", + "dev": true, + "requires": { + "ansi-styles": "2.2.1", + "escape-string-regexp": "1.0.5", + "has-ansi": "2.0.0", + "strip-ansi": "3.0.1", + "supports-color": "2.0.0" + } + }, + "supports-color": { + "version": "2.0.0", + "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz", + "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc=", + "dev": true + } } }, "babel-core": { @@ -985,16 +1015,14 @@ "dev": true }, "chalk": { - "version": "1.1.3", - "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz", - "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg=", + "version": "2.3.0", + "resolved": "https://registry.npmjs.org/chalk/-/chalk-2.3.0.tgz", + "integrity": "sha512-Az5zJR2CBujap2rqXGaJKaPHyJ0IrUimvYNX+ncCy8PJP4ltOGTrHUIo097ZaL2zMeKYpiCdqDvS6zdrTFok3Q==", "dev": true, "requires": { - "ansi-styles": "2.2.1", + "ansi-styles": "3.2.0", "escape-string-regexp": "1.0.5", - "has-ansi": "2.0.0", - "strip-ansi": "3.0.1", - "supports-color": "2.0.0" + "supports-color": "4.5.0" } }, "chokidar": { @@ -1005,6 +1033,7 @@ "requires": { "anymatch": "1.3.2", "async-each": "1.0.1", + "fsevents": "1.1.3", "glob-parent": "2.0.0", "inherits": "2.0.3", "is-binary-path": "1.0.1", @@ -1030,6 +1059,21 @@ "integrity": "sha1-DQcLTQQ6W+ozovGkDi7bPZpMz3c=", "dev": true }, + "color-convert": { + "version": "1.9.1", + "resolved": "https://registry.npmjs.org/color-convert/-/color-convert-1.9.1.tgz", + "integrity": "sha512-mjGanIiwQJskCC18rPR6OmrZ6fm2Lc7PeGFYwCmy5J34wC6F1PzdGL6xeMfmgicfYcNLGuVFA3WzXtIDCQSZxQ==", + "dev": true, + "requires": { + "color-name": "1.1.3" + } + }, + "color-name": { + "version": "1.1.3", + "resolved": "https://registry.npmjs.org/color-name/-/color-name-1.1.3.tgz", + "integrity": "sha1-p9BVi9icQveV3UIyj3QIMcpTvCU=", + "dev": true + }, "combined-stream": { "version": "1.0.5", "resolved": "https://registry.npmjs.org/combined-stream/-/combined-stream-1.0.5.tgz", @@ -1293,6 +1337,910 @@ "integrity": "sha1-FQStJSMVjKpA20onh8sBQRmU6k8=", "dev": true }, + "fsevents": { + "version": "1.1.3", + "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-1.1.3.tgz", + "integrity": "sha512-WIr7iDkdmdbxu/Gh6eKEZJL6KPE74/5MEsf2whTOFNxbIoIixogroLdKYqB6FDav4Wavh/lZdzzd3b2KxIXC5Q==", + "dev": true, + "optional": true, + "requires": { + "nan": "2.8.0", + "node-pre-gyp": "0.6.39" + }, + "dependencies": { + "abbrev": { + "version": "1.1.0", + "bundled": true, + "dev": true, + "optional": true + }, + "ajv": { + "version": "4.11.8", + "bundled": true, + "dev": true, + "optional": true, + "requires": { + "co": "4.6.0", + "json-stable-stringify": "1.0.1" + } + }, + "ansi-regex": { + "version": "2.1.1", + "bundled": true, + "dev": true + }, + "aproba": { + "version": "1.1.1", + "bundled": true, + "dev": true, + "optional": true + }, + "are-we-there-yet": { + "version": "1.1.4", + "bundled": true, + "dev": true, + "optional": true, + "requires": { + "delegates": "1.0.0", + "readable-stream": "2.2.9" + } + }, + "asn1": { + "version": "0.2.3", + "bundled": true, + "dev": true, + "optional": true + }, + "assert-plus": { + "version": "0.2.0", + "bundled": true, + "dev": true, + "optional": true + }, + "asynckit": { + "version": "0.4.0", + "bundled": true, + "dev": true, + "optional": true + }, + "aws-sign2": { + "version": "0.6.0", + "bundled": true, + "dev": true, + "optional": true + }, + "aws4": { + "version": "1.6.0", + "bundled": true, + "dev": true, + "optional": true + }, + "balanced-match": { + "version": "0.4.2", + "bundled": true, + "dev": true + }, + "bcrypt-pbkdf": { + "version": "1.0.1", + "bundled": true, + "dev": true, + "optional": true, + "requires": { + "tweetnacl": "0.14.5" + } + }, + "block-stream": { + "version": "0.0.9", + "bundled": true, + "dev": true, + "requires": { + "inherits": "2.0.3" + } + }, + "boom": { + "version": "2.10.1", + "bundled": true, + "dev": true, + "requires": { + "hoek": "2.16.3" + } + }, + "brace-expansion": { + "version": "1.1.7", + "bundled": true, + "dev": true, + "requires": { + "balanced-match": "0.4.2", + "concat-map": "0.0.1" + } + }, + "buffer-shims": { + "version": "1.0.0", + "bundled": true, + "dev": true + }, + "caseless": { + "version": "0.12.0", + "bundled": true, + "dev": true, + "optional": true + }, + "co": { + "version": "4.6.0", + "bundled": true, + "dev": true, + "optional": true + }, + "code-point-at": { + "version": "1.1.0", + "bundled": true, + "dev": true + }, + "combined-stream": { + "version": "1.0.5", + "bundled": true, + "dev": true, + "requires": { + "delayed-stream": "1.0.0" + } + }, + "concat-map": { + "version": "0.0.1", + "bundled": true, + "dev": true + }, + "console-control-strings": { + "version": "1.1.0", + "bundled": true, + "dev": true + }, + "core-util-is": { + "version": "1.0.2", + "bundled": true, + "dev": true + }, + "cryptiles": { + "version": "2.0.5", + "bundled": true, + "dev": true, + "requires": { + "boom": "2.10.1" + } + }, + "dashdash": { + "version": "1.14.1", + "bundled": true, + "dev": true, + "optional": true, + "requires": { + "assert-plus": "1.0.0" + }, + "dependencies": { + "assert-plus": { + "version": "1.0.0", + "bundled": true, + "dev": true, + "optional": true + } + } + }, + "debug": { + "version": "2.6.8", + "bundled": true, + "dev": true, + "optional": true, + "requires": { + "ms": "2.0.0" + } + }, + "deep-extend": { + "version": "0.4.2", + "bundled": true, + "dev": true, + "optional": true + }, + "delayed-stream": { + "version": "1.0.0", + "bundled": true, + "dev": true + }, + "delegates": { + "version": "1.0.0", + "bundled": true, + "dev": true, + "optional": true + }, + "detect-libc": { + "version": "1.0.2", + "bundled": true, + "dev": true, + "optional": true + }, + "ecc-jsbn": { + "version": "0.1.1", + "bundled": true, + "dev": true, + "optional": true, + "requires": { + "jsbn": "0.1.1" + } + }, + "extend": { + "version": "3.0.1", + "bundled": true, + "dev": true, + "optional": true + }, + "extsprintf": { + "version": "1.0.2", + "bundled": true, + "dev": true + }, + "forever-agent": { + "version": "0.6.1", + "bundled": true, + "dev": true, + "optional": true + }, + "form-data": { + "version": "2.1.4", + "bundled": true, + "dev": true, + "optional": true, + "requires": { + "asynckit": "0.4.0", + "combined-stream": "1.0.5", + "mime-types": "2.1.15" + } + }, + "fs.realpath": { + "version": "1.0.0", + "bundled": true, + "dev": true + }, + "fstream": { + "version": "1.0.11", + "bundled": true, + "dev": true, + "requires": { + "graceful-fs": "4.1.11", + "inherits": "2.0.3", + "mkdirp": "0.5.1", + "rimraf": "2.6.1" + } + }, + "fstream-ignore": { + "version": "1.0.5", + "bundled": true, + "dev": true, + "optional": true, + "requires": { + "fstream": "1.0.11", + "inherits": "2.0.3", + "minimatch": "3.0.4" + } + }, + "gauge": { + "version": "2.7.4", + "bundled": true, + "dev": true, + "optional": true, + "requires": { + "aproba": "1.1.1", + "console-control-strings": "1.1.0", + "has-unicode": "2.0.1", + "object-assign": "4.1.1", + "signal-exit": "3.0.2", + "string-width": "1.0.2", + "strip-ansi": "3.0.1", + "wide-align": "1.1.2" + } + }, + "getpass": { + "version": "0.1.7", + "bundled": true, + "dev": true, + "optional": true, + "requires": { + "assert-plus": "1.0.0" + }, + "dependencies": { + "assert-plus": { + "version": "1.0.0", + "bundled": true, + "dev": true, + "optional": true + } + } + }, + "glob": { + "version": "7.1.2", + "bundled": true, + "dev": true, + "requires": { + "fs.realpath": "1.0.0", + "inflight": "1.0.6", + "inherits": "2.0.3", + "minimatch": "3.0.4", + "once": "1.4.0", + "path-is-absolute": "1.0.1" + } + }, + "graceful-fs": { + "version": "4.1.11", + "bundled": true, + "dev": true + }, + "har-schema": { + "version": "1.0.5", + "bundled": true, + "dev": true, + "optional": true + }, + "har-validator": { + "version": "4.2.1", + "bundled": true, + "dev": true, + "optional": true, + "requires": { + "ajv": "4.11.8", + "har-schema": "1.0.5" + } + }, + "has-unicode": { + "version": "2.0.1", + "bundled": true, + "dev": true, + "optional": true + }, + "hawk": { + "version": "3.1.3", + "bundled": true, + "dev": true, + "requires": { + "boom": "2.10.1", + "cryptiles": "2.0.5", + "hoek": "2.16.3", + "sntp": "1.0.9" + } + }, + "hoek": { + "version": "2.16.3", + "bundled": true, + "dev": true + }, + "http-signature": { + "version": "1.1.1", + "bundled": true, + "dev": true, + "optional": true, + "requires": { + "assert-plus": "0.2.0", + "jsprim": "1.4.0", + "sshpk": "1.13.0" + } + }, + "inflight": { + "version": "1.0.6", + "bundled": true, + "dev": true, + "requires": { + "once": "1.4.0", + "wrappy": "1.0.2" + } + }, + "inherits": { + "version": "2.0.3", + "bundled": true, + "dev": true + }, + "ini": { + "version": "1.3.4", + "bundled": true, + "dev": true, + "optional": true + }, + "is-fullwidth-code-point": { + "version": "1.0.0", + "bundled": true, + "dev": true, + "requires": { + "number-is-nan": "1.0.1" + } + }, + "is-typedarray": { + "version": "1.0.0", + "bundled": true, + "dev": true, + "optional": true + }, + "isarray": { + "version": "1.0.0", + "bundled": true, + "dev": true + }, + "isstream": { + "version": "0.1.2", + "bundled": true, + "dev": true, + "optional": true + }, + "jodid25519": { + "version": "1.0.2", + "bundled": true, + "dev": true, + "optional": true, + "requires": { + "jsbn": "0.1.1" + } + }, + "jsbn": { + "version": "0.1.1", + "bundled": true, + "dev": true, + "optional": true + }, + "json-schema": { + "version": "0.2.3", + "bundled": true, + "dev": true, + "optional": true + }, + "json-stable-stringify": { + "version": "1.0.1", + "bundled": true, + "dev": true, + "optional": true, + "requires": { + "jsonify": "0.0.0" + } + }, + "json-stringify-safe": { + "version": "5.0.1", + "bundled": true, + "dev": true, + "optional": true + }, + "jsonify": { + "version": "0.0.0", + "bundled": true, + "dev": true, + "optional": true + }, + "jsprim": { + "version": "1.4.0", + "bundled": true, + "dev": true, + "optional": true, + "requires": { + "assert-plus": "1.0.0", + "extsprintf": "1.0.2", + "json-schema": "0.2.3", + "verror": "1.3.6" + }, + "dependencies": { + "assert-plus": { + "version": "1.0.0", + "bundled": true, + "dev": true, + "optional": true + } + } + }, + "mime-db": { + "version": "1.27.0", + "bundled": true, + "dev": true + }, + "mime-types": { + "version": "2.1.15", + "bundled": true, + "dev": true, + "requires": { + "mime-db": "1.27.0" + } + }, + "minimatch": { + "version": "3.0.4", + "bundled": true, + "dev": true, + "requires": { + "brace-expansion": "1.1.7" + } + }, + "minimist": { + "version": "0.0.8", + "bundled": true, + "dev": true + }, + "mkdirp": { + "version": "0.5.1", + "bundled": true, + "dev": true, + "requires": { + "minimist": "0.0.8" + } + }, + "ms": { + "version": "2.0.0", + "bundled": true, + "dev": true, + "optional": true + }, + "node-pre-gyp": { + "version": "0.6.39", + "bundled": true, + "dev": true, + "optional": true, + "requires": { + "detect-libc": "1.0.2", + "hawk": "3.1.3", + "mkdirp": "0.5.1", + "nopt": "4.0.1", + "npmlog": "4.1.0", + "rc": "1.2.1", + "request": "2.81.0", + "rimraf": "2.6.1", + "semver": "5.3.0", + "tar": "2.2.1", + "tar-pack": "3.4.0" + } + }, + "nopt": { + "version": "4.0.1", + "bundled": true, + "dev": true, + "optional": true, + "requires": { + "abbrev": "1.1.0", + "osenv": "0.1.4" + } + }, + "npmlog": { + "version": "4.1.0", + "bundled": true, + "dev": true, + "optional": true, + "requires": { + "are-we-there-yet": "1.1.4", + "console-control-strings": "1.1.0", + "gauge": "2.7.4", + "set-blocking": "2.0.0" + } + }, + "number-is-nan": { + "version": "1.0.1", + "bundled": true, + "dev": true + }, + "oauth-sign": { + "version": "0.8.2", + "bundled": true, + "dev": true, + "optional": true + }, + "object-assign": { + "version": "4.1.1", + "bundled": true, + "dev": true, + "optional": true + }, + "once": { + "version": "1.4.0", + "bundled": true, + "dev": true, + "requires": { + "wrappy": "1.0.2" + } + }, + "os-homedir": { + "version": "1.0.2", + "bundled": true, + "dev": true, + "optional": true + }, + "os-tmpdir": { + "version": "1.0.2", + "bundled": true, + "dev": true, + "optional": true + }, + "osenv": { + "version": "0.1.4", + "bundled": true, + "dev": true, + "optional": true, + "requires": { + "os-homedir": "1.0.2", + "os-tmpdir": "1.0.2" + } + }, + "path-is-absolute": { + "version": "1.0.1", + "bundled": true, + "dev": true + }, + "performance-now": { + "version": "0.2.0", + "bundled": true, + "dev": true, + "optional": true + }, + "process-nextick-args": { + "version": "1.0.7", + "bundled": true, + "dev": true + }, + "punycode": { + "version": "1.4.1", + "bundled": true, + "dev": true, + "optional": true + }, + "qs": { + "version": "6.4.0", + "bundled": true, + "dev": true, + "optional": true + }, + "rc": { + "version": "1.2.1", + "bundled": true, + "dev": true, + "optional": true, + "requires": { + "deep-extend": "0.4.2", + "ini": "1.3.4", + "minimist": "1.2.0", + "strip-json-comments": "2.0.1" + }, + "dependencies": { + "minimist": { + "version": "1.2.0", + "bundled": true, + "dev": true, + "optional": true + } + } + }, + "readable-stream": { + "version": "2.2.9", + "bundled": true, + "dev": true, + "requires": { + "buffer-shims": "1.0.0", + "core-util-is": "1.0.2", + "inherits": "2.0.3", + "isarray": "1.0.0", + "process-nextick-args": "1.0.7", + "string_decoder": "1.0.1", + "util-deprecate": "1.0.2" + } + }, + "request": { + "version": "2.81.0", + "bundled": true, + "dev": true, + "optional": true, + "requires": { + "aws-sign2": "0.6.0", + "aws4": "1.6.0", + "caseless": "0.12.0", + "combined-stream": "1.0.5", + "extend": "3.0.1", + "forever-agent": "0.6.1", + "form-data": "2.1.4", + "har-validator": "4.2.1", + "hawk": "3.1.3", + "http-signature": "1.1.1", + "is-typedarray": "1.0.0", + "isstream": "0.1.2", + "json-stringify-safe": "5.0.1", + "mime-types": "2.1.15", + "oauth-sign": "0.8.2", + "performance-now": "0.2.0", + "qs": "6.4.0", + "safe-buffer": "5.0.1", + "stringstream": "0.0.5", + "tough-cookie": "2.3.2", + "tunnel-agent": "0.6.0", + "uuid": "3.0.1" + } + }, + "rimraf": { + "version": "2.6.1", + "bundled": true, + "dev": true, + "requires": { + "glob": "7.1.2" + } + }, + "safe-buffer": { + "version": "5.0.1", + "bundled": true, + "dev": true + }, + "semver": { + "version": "5.3.0", + "bundled": true, + "dev": true, + "optional": true + }, + "set-blocking": { + "version": "2.0.0", + "bundled": true, + "dev": true, + "optional": true + }, + "signal-exit": { + "version": "3.0.2", + "bundled": true, + "dev": true, + "optional": true + }, + "sntp": { + "version": "1.0.9", + "bundled": true, + "dev": true, + "requires": { + "hoek": "2.16.3" + } + }, + "sshpk": { + "version": "1.13.0", + "bundled": true, + "dev": true, + "optional": true, + "requires": { + "asn1": "0.2.3", + "assert-plus": "1.0.0", + "bcrypt-pbkdf": "1.0.1", + "dashdash": "1.14.1", + "ecc-jsbn": "0.1.1", + "getpass": "0.1.7", + "jodid25519": "1.0.2", + "jsbn": "0.1.1", + "tweetnacl": "0.14.5" + }, + "dependencies": { + "assert-plus": { + "version": "1.0.0", + "bundled": true, + "dev": true, + "optional": true + } + } + }, + "string-width": { + "version": "1.0.2", + "bundled": true, + "dev": true, + "requires": { + "code-point-at": "1.1.0", + "is-fullwidth-code-point": "1.0.0", + "strip-ansi": "3.0.1" + } + }, + "string_decoder": { + "version": "1.0.1", + "bundled": true, + "dev": true, + "requires": { + "safe-buffer": "5.0.1" + } + }, + "stringstream": { + "version": "0.0.5", + "bundled": true, + "dev": true, + "optional": true + }, + "strip-ansi": { + "version": "3.0.1", + "bundled": true, + "dev": true, + "requires": { + "ansi-regex": "2.1.1" + } + }, + "strip-json-comments": { + "version": "2.0.1", + "bundled": true, + "dev": true, + "optional": true + }, + "tar": { + "version": "2.2.1", + "bundled": true, + "dev": true, + "requires": { + "block-stream": "0.0.9", + "fstream": "1.0.11", + "inherits": "2.0.3" + } + }, + "tar-pack": { + "version": "3.4.0", + "bundled": true, + "dev": true, + "optional": true, + "requires": { + "debug": "2.6.8", + "fstream": "1.0.11", + "fstream-ignore": "1.0.5", + "once": "1.4.0", + "readable-stream": "2.2.9", + "rimraf": "2.6.1", + "tar": "2.2.1", + "uid-number": "0.0.6" + } + }, + "tough-cookie": { + "version": "2.3.2", + "bundled": true, + "dev": true, + "optional": true, + "requires": { + "punycode": "1.4.1" + } + }, + "tunnel-agent": { + "version": "0.6.0", + "bundled": true, + "dev": true, + "optional": true, + "requires": { + "safe-buffer": "5.0.1" + } + }, + "tweetnacl": { + "version": "0.14.5", + "bundled": true, + "dev": true, + "optional": true + }, + "uid-number": { + "version": "0.0.6", + "bundled": true, + "dev": true, + "optional": true + }, + "util-deprecate": { + "version": "1.0.2", + "bundled": true, + "dev": true + }, + "uuid": { + "version": "3.0.1", + "bundled": true, + "dev": true, + "optional": true + }, + "verror": { + "version": "1.3.6", + "bundled": true, + "dev": true, + "optional": true, + "requires": { + "extsprintf": "1.0.2" + } + }, + "wide-align": { + "version": "1.1.2", + "bundled": true, + "dev": true, + "optional": true, + "requires": { + "string-width": "1.0.2" + } + }, + "wrappy": { + "version": "1.0.2", + "bundled": true, + "dev": true + } + } + }, "fstream": { "version": "1.0.11", "resolved": "https://registry.npmjs.org/fstream/-/fstream-1.0.11.tgz", @@ -1440,6 +2388,33 @@ "commander": "2.12.2", "is-my-json-valid": "2.16.1", "pinkie-promise": "2.0.1" + }, + "dependencies": { + "ansi-styles": { + "version": "2.2.1", + "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-2.2.1.tgz", + "integrity": "sha1-tDLdM1i2NM914eRmQ2gkBTPB3b4=", + "dev": true + }, + "chalk": { + "version": "1.1.3", + "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz", + "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg=", + "dev": true, + "requires": { + "ansi-styles": "2.2.1", + "escape-string-regexp": "1.0.5", + "has-ansi": "2.0.0", + "strip-ansi": "3.0.1", + "supports-color": "2.0.0" + } + }, + "supports-color": { + "version": "2.0.0", + "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz", + "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc=", + "dev": true + } } }, "has-ansi": { @@ -1451,6 +2426,12 @@ "ansi-regex": "2.1.1" } }, + "has-flag": { + "version": "2.0.0", + "resolved": "https://registry.npmjs.org/has-flag/-/has-flag-2.0.0.tgz", + "integrity": "sha1-6CB68cx7MNRGzHC3NLXovhj4jVE=", + "dev": true + }, "has-unicode": { "version": "2.0.1", "resolved": "https://registry.npmjs.org/has-unicode/-/has-unicode-2.0.1.tgz", @@ -2039,6 +3020,33 @@ "sass-graph": "2.2.4", "stdout-stream": "1.4.0", "true-case-path": "1.0.2" + }, + "dependencies": { + "ansi-styles": { + "version": "2.2.1", + "resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-2.2.1.tgz", + "integrity": "sha1-tDLdM1i2NM914eRmQ2gkBTPB3b4=", + "dev": true + }, + "chalk": { + "version": "1.1.3", + "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz", + "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg=", + "dev": true, + "requires": { + "ansi-styles": "2.2.1", + "escape-string-regexp": "1.0.5", + "has-ansi": "2.0.0", + "strip-ansi": "3.0.1", + "supports-color": "2.0.0" + } + }, + "supports-color": { + "version": "2.0.0", + "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz", + "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc=", + "dev": true + } } }, "nopt": { @@ -2697,10 +3705,13 @@ } }, "supports-color": { - "version": "2.0.0", - "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz", - "integrity": "sha1-U10EXOa2Nj+kARcIRimZXp3zJMc=", - "dev": true + "version": "4.5.0", + "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-4.5.0.tgz", + "integrity": "sha1-vnoN5ITexcXN34s9WRJQRJEvY1s=", + "dev": true, + "requires": { + "has-flag": "2.0.0" + } }, "tar": { "version": "2.2.1", diff --git a/package.json b/package.json index ff501ab..eb9ca41 100644 --- a/package.json +++ b/package.json @@ -11,7 +11,10 @@ "type": "git", "url": "git+https://github.com/yutent/doui.git" }, - "keywords": ["doui", "yua"], + "keywords": [ + "doui", + "yua" + ], "author": "yutent", "license": "MIT", "devDependencies": { @@ -19,6 +22,7 @@ "babel-plugin-transform-es2015-modules-umd": "^6.24.1", "babel-preset-es2015": "^6.24.1", "babel-preset-minify": "^0.2.0", + "chalk": "^2.3.0", "chokidar": "^1.7.0", "iofs": "^1.0.2", "node-sass": "^4.7.2" diff --git a/src/js/anot.shim.js b/src/js/anot.shim.js index ae59b6e..a8113e4 100644 --- a/src/js/anot.shim.js +++ b/src/js/anot.shim.js @@ -24,7 +24,11 @@ /********************************************************************* * 全局变量及方法 * **********************************************************************/ - + var bindingID = 1024 + var IEVersion = 0 + if (window.VBArray) { + IEVersion = document.documentMode || (window.XMLHttpRequest ? 7 : 6) + } var expose = generateID() //http://stackoverflow.com/questions/7290086/javascript-use-strict-and-nicks-find-global-function var DOC = window.document @@ -83,11 +87,6 @@ '[object Generator]': 'generator', '[object GeneratorFunction]': 'generatorfunction' } - var bindingID = 1024 - var IEVersion = 0 - if (window.VBArray) { - IEVersion = document.documentMode || (window.XMLHttpRequest ? 7 : 6) - } function noop() {} function scpCompile(array) { @@ -190,6 +189,26 @@ return new this('string') } + Anot.PropsTypes.isNumber = function() { + return new this('number') + } + + Anot.PropsTypes.isFunction = function() { + return new this('function') + } + + Anot.PropsTypes.isArray = function() { + return new this('array') + } + + Anot.PropsTypes.isObject = function() { + return new this('object') + } + + Anot.PropsTypes.isBoolean = function() { + return new this('boolean') + } + /*判定是否是一个朴素的javascript对象(Object),不是DOM对象,不是BOM对象,不是自定义类的实例*/ Anot.isPlainObject = function(obj) { // 简单的 typeof obj === "object"检测,会致使用isPlainObject(window)在opera下通不过 @@ -3394,15 +3413,14 @@ var componentQueue = [] var widgetList = [] var componentHooks = { - $construct: function() { - return Anot.mix.apply(null, arguments) + construct: function(props, next) { + next(props) }, - $ready: noop, - $init: noop, - $dispose: noop, - $container: null, - $childReady: noop, - $$template: function(str) { + componentWillMount: noop, + componentDidMount: noop, + childComponentDidMount: noop, + componentWillUnmount: noop, + render: function(str) { return str } } @@ -3416,6 +3434,7 @@ if (name === obj.name) { componentQueue.splice(i, 1) i-- + // (obj, Anot.components[name], obj.element, obj.name) ;(function(host, hooks, elem, widget) { //如果elem已从Document里移除,直接返回 if (!Anot.contains(DOC, elem) || elem.msResolved) { @@ -3424,74 +3443,59 @@ } var dependencies = 1 - var global = componentHooks + var globalHooks = componentHooks //===========收集各种配置======= - if (elem.getAttribute(':attr-identifier')) { + if (elem.getAttribute(':attr-uuid')) { //如果还没有解析完,就延迟一下 #1155 return } - var elemOpts = getOptionsFromTag(elem, host.vmodels) - var vmOpts = getOptionsFromVM( - host.vmodels, - elemOpts.config || host.name - ) - var $id = elemOpts.$id || elemOpts.identifier || generateID(widget) - delete elemOpts.config - delete elemOpts.$id - delete elemOpts.identifier - var componentDefinition = { - $up: host.vmodels[0], - $ups: host.vmodels - } + var props = getOptionsFromTag(elem, host.vmodels) + var vmOpts = getOptionsFromVM(host.vmodels, props.config) + var $id = props.uuid || generateID(widget) + var componentDefinition = {} - Anot.mix(true, componentDefinition, hooks) - - componentDefinition = Anot.components[name].$construct.call( - elem, - componentDefinition, - vmOpts, - elemOpts - ) + props = Object.assign({}, vmOpts, props) + vmOpts = void 0 + delete props.config + delete props.uuid + hooks.construct.call(elem, props, function next(val) { + Object.assign(hooks.props, val) + Object.assign(componentDefinition, hooks) + }) componentDefinition.$refs = {} componentDefinition.$id = $id //==========构建VM========= - var keepContainer = componentDefinition.$container - var keepTemplate = componentDefinition.$template - delete componentDefinition.$up - delete componentDefinition.$ups - delete componentDefinition.$slot - delete componentDefinition.$replace - delete componentDefinition.$container - delete componentDefinition.$construct + var { + componentWillMount, + componentDidMount, + childComponentDidMount, + componentWillUnmount, + render + } = componentDefinition + + delete componentDefinition.construct + delete componentDefinition.componentWillMount + delete componentDefinition.componentDidMount + delete componentDefinition.childComponentDidMount + delete componentDefinition.componentWillUnmount + + var vmodel = Anot(componentDefinition) - var vmodel = Anot(componentDefinition) || {} - vmodel.$ups = host.vmodels - vmodel.$up = host.vmodels[0] elem.msResolved = 1 //防止二进扫描此元素 - vmodel.$init(vmodel, elem) - global.$init(vmodel, elem) - var nodes = elem.childNodes - if (vmodel.$$template) { + componentWillMount.call(vmodel) + globalHooks.componentWillMount.call(null, vmodel) + + if (!elem.content.firstElementChild) { Anot.clearHTML(elem) - elem.innerHTML = vmodel.$$template(keepTemplate) + elem.innerHTML = render() } // 组件所使用的标签是temlate,所以必须要要用子元素替换掉 - var child = elem.content.firstChild - - if (!child || serialize.call(child) === '[object Text]') { - var tmpDom = document.createElement('div') - if (child) { - tmpDom.appendChild(child) - } - child = tmpDom - tmpDom = null - } - + var child = elem.content.firstElementChild elem.parentNode.replaceChild(child, elem) child.msResolved = 1 @@ -3503,40 +3507,39 @@ if (className) { Anot(elem).addClass(className) } - //指定了组件的容器的话,则把组件节点转过去 - if (keepContainer) { - keepContainer.appendChild(elem) - } + + hideProperty(vmodel, '$elem', elem) + Anot.fireDom(elem, 'datasetchanged', { vm: vmodel, childReady: 1 }) var children = 0 - var removeFn = Anot.bind(elem, 'datasetchanged', function(e) { - if (e.childReady) { - dependencies += e.childReady - if (vmodel !== e.vm) { - vmodel.$refs[e.vm.$id] = e.vm - if (e.childReady === -1) { + var removeFn = Anot.bind(elem, 'datasetchanged', function(ev) { + if (ev.childReady) { + dependencies += ev.childReady + if (vmodel !== ev.vm) { + vmodel.$refs[ev.vm.$id] = ev.vm + if (ev.childReady === -1) { children++ - vmodel.$childReady(vmodel, elem, e) + childComponentDidMount.call(vmodel, elem, ev) } - e.stopPropagation() + ev.stopPropagation() } } if (dependencies === 0) { - var id1 = setTimeout(function() { - clearTimeout(id1) - - vmodel.$ready(vmodel, elem, host.vmodels) - global.$ready(vmodel, elem, host.vmodels) + var timer = setTimeout(function() { + clearTimeout(timer) + componentDidMount.call(vmodel) + globalHooks.componentDidMount(null, vmodel) }, children ? Math.max(children * 17, 100) : 17) + Anot.unbind(elem, 'datasetchanged', removeFn) //================== host.rollback = function() { try { - vmodel.$dispose(vmodel, elem) - global.$dispose(vmodel, elem) + componentWillUnmount.call(vmodel) + globalHooks.componentWillUnmount.call(null, vmodel) } catch (e) {} delete Anot.vmodels[vmodel.$id] } @@ -3548,7 +3551,7 @@ } } }) - scanTag(elem, [vmodel].concat(host.vmodels)) + scanTag(elem, [vmodel]) Anot.vmodels[vmodel.$id] = vmodel if (!elem.childNodes.length) { Anot.fireDom(elem, 'datasetchanged', { @@ -6457,9 +6460,6 @@ Anot.config({ loader: true }) - Anot.ready(function() { - scanTag(DOC.body, []) - }) if (typeof define === 'function' && define.amd) { define('Anot', [], function() { diff --git a/src/js/lib/pages/main.htm b/src/js/lib/pages/main.htm index 6054bae..38913a0 100644 --- a/src/js/lib/pages/main.htm +++ b/src/js/lib/pages/main.htm @@ -1,32 +1,32 @@ -
+
- + {{btns.next}} + :if="currPage < totalPages" + :attr="{href: $setUrl(currPage + 1)}" + :click="$jump($event, currPage + 1)">{{props.btns.next}} {{btns.end}} + :if="currPage < totalPages && !simpleMode" + :attr="{href: $setUrl(totalPages)}" + :click="$jump($event, totalPages)">{{props.btns.end}}
- 共{{total}}页,跳转到第 - + 共{{totalPages}}页 {{totalItems}}条,跳转到第 + 确定
diff --git a/src/js/lib/pages/main.js b/src/js/lib/pages/main.js index 31b5df8..f01cfbc 100644 --- a/src/js/lib/pages/main.js +++ b/src/js/lib/pages/main.js @@ -1,139 +1,151 @@ -"use strict"; -define(["yua","text!./main.htm", "css!./main"], function(yua, tpl) { +'use strict' +import 'Anot' +import tpl from 'text!./main.htm' +import 'css!./main.css' - yua.ui.pages = '1.0.0' - var colors = {plain: 1, green: 1, blue: 1, red: 1, orange: 1, grey: 1}, - themes = ['skin-1 ', 'skin-2 ']; - //计算页码列表 - function calculate(vm){ - if (vm.total < 2) - return vm.pageList.clear(); +Anot.ui.pages = '1.0.0' +var colors = { plain: 1, green: 1, blue: 1, red: 1, orange: 1, grey: 1 }, + themes = ['skin-1 ', 'skin-2 '] +//计算页码列表 +function calculate({ currPage, maxPageShow, totalPages }) { + let arr = [] + let midPage = + currPage < maxPageShow / 2 + ? maxPageShow - currPage + : Math.floor(maxPageShow / 2) - var arr = [], - mid = vm.curr < vm.max / 2 ? vm.max - vm.curr : Math.floor(vm.max / 2); - - if(vm.curr - mid > 1){ - arr.push('...') - } - for (var i = vm.curr - mid; i < vm.curr + mid + 1 && i <= vm.total; i++){ - if(i > 0){ - arr.push(i) - } - } - if(vm.curr + mid < vm.total){ - arr.push('...') - } - vm.pageList.clear() - vm.pageList.pushArray(arr) + if (currPage - midPage > 1) { + arr.push('...') + } + for ( + var i = currPage - midPage; + i < currPage + midPage + 1 && i <= totalPages; + i++ + ) { + if (i > 0) { + arr.push(i) } + } + if (currPage + midPage < totalPages) { + arr.push('...') + } + return arr +} - function update(pid, vm) { - if(pid < 1){ - pid = vm.input = 1 - } - if(pid > vm.total){ - pid = vm.input = vm.total - } - if(pid !== vm.curr){ - vm.curr = vm.input = pid - vm.$onJump(pid) - } +function update(pid, vm) { + if (pid < 1) { + pid = vm.input = 1 + } + if (pid > vm.total) { + pid = vm.input = vm.total + } + if (pid !== vm.curr) { + vm.curr = vm.input = pid + vm.$onJump(pid) + } +} + +export default Anot.component('pages', { + construct: function(props, next) { + // console.log(props, this) + next(props) + }, + render: function() { + return tpl + }, + componentWillMount: function(vm) { + if (this.totalPages < 2) { + return } + const { currPage, totalPages, props } = this + this.pageList.clear() + this.pageList.pushArray( + calculate({ currPage, totalPages, maxPageShow: props.maxPageShow }) + ) + }, + componentDidMount: function() { + this.props.onSuccess(this) + }, + state: { + currPage: 1, + totalItems: 100, + perPage: 20, + inputJump: !1, + simpleMode: !1, + inputPage: 1, + pageList: [] + }, + computed: { + totalPages: function() { + return Math.ceil(this.totalItems / this.perPage) + } + }, + props: { + url: 'javascript:;', + btns: { + prev: '<<', + next: '>>', + home: '首页', + end: '末页' + }, + maxPageShow: 5, + theme: 'skin-2 red', + onPageChange: Anot.noop, + onSuccess: Anot.noop + }, + watch: { + curr: function(val, old) { + val = val >>> 0 || 1 + old = old >>> 0 + if (val !== old) { + calculate(vm) + } + }, + total: function(val, old) { + val = val >>> 0 || 1 + old = old >>> 0 + if (val !== old) { + calculate(vm) + } + } + }, + methods: { + $setUrl: function(val) { + if ( + !this.props.url || + '...' === val || + this.curr === val || + val > this.total || + 1 > val + ) { + return 'javascript:;' + } else { + return this.props.url.replace('{id}', val) + } + }, + $jump: function(ev, val) { + if ('...' !== val) { + var link = this.getAttribute('href') || this.getAttribute('xlink:href') - return yua.component('pages', { - $template: tpl, - $construct: function(a, b, c){ - yua.mix(a, b, c) - a.theme = themes[a.theme>>0] - if(!a.theme){ - a.theme = themes[0] - } - if(a.color && colors[a.color]){ - a.theme += a.color - }else{ - a.theme += 'plain' - } - delete a.color - return a - }, - $init: function(vm) { - - calculate(vm) - - vm.$setUrl = function(val) { - if(!vm.url - || '...' === val - || vm.curr === val - || val > vm.total - || 1 > val) { - - return 'javascript:;' - }else{ - return vm.url.replace('{id}', val) - } - } - vm.$forceReset = function(){ - vm.curr = 1 - calculate(vm) - } - - vm.$jump = function(ev, val) { - if ('...' !== val) { - var link = this.getAttribute('href') || this.getAttribute('xlink:href') - - if (val !== void 0){ - if('javascript:;' !== link){ - location.href = link - } - var pid = val >> 0; - update(pid, vm) - } else { - vm.input = vm.input >>> 0 || 1; - if(13 == ev.keyCode){ - update(vm.input, vm) - } - } - } - } - vm.$watch('curr', function(val, old) { - val = (val >>> 0) || 1 - old = old >>> 0 - if(val !== old){ - calculate(vm) - } - }) - - vm.$watch('total', function(val, old) { - val = (val >>> 0) || 1 - old = old >>> 0 - if(val !== old){ - calculate(vm) - } - }) - }, - $ready: function(vm){ - vm.$onSuccess(vm) - }, - curr: 1, - total: 1, - max: 5, - url: "javascript:;", - inputJump: !1, - simpleMode: !1, - input: 1, - pageList: [], - btns: { - prev: "<<", - next: ">>", - home: "首页", - end: "末页" - }, - theme: '', - $skipArray: ['max', 'btns', 'url', 'theme'], - $setUrl: yua.noop, - $jump: yua.noop, - $onJump: yua.noop, - $onSuccess: yua.noop, - $forceReset: yua.noop, - }) -}); \ No newline at end of file + if (val !== void 0) { + if ('javascript:;' !== link) { + location.href = link + } + var pid = val >> 0 + update(pid, this) + } else { + this.input = this.input >>> 0 || 1 + if (13 == ev.keyCode) { + update(this.input, this) + } + } + } + }, + $onJump: Anot.noop, + $onSuccess: Anot.noop, + $forceReset: function() { + this.curr = 1 + calculate(this) + } + } +})