This repository has been archived on 2023-08-29. You can view files and clone it, but cannot push or open issues/pull-requests.
yutent
/
anot.js
Archived
1
0
Fork 0

Compare commits

...

10 Commits

Author SHA1 Message Date
宇天 ce9c8542a9 fix 2021-07-30 11:57:49 +08:00
宇天 328a7ca6d5 fix 2021-07-30 11:52:50 +08:00
宇天 33429266f3 修复search() 2021-01-08 10:30:48 +08:00
宇天 542ebfc496 更新打包脚本 2021-01-08 10:20:18 +08:00
宇天 3f8361af05 更新依赖 2021-01-08 10:14:44 +08:00
宇天 1786724598 优化search方法 2021-01-08 10:09:42 +08:00
宇天 d1f3cd7a10 精简nextTick 2020-08-19 15:05:04 +08:00
宇天 02ccc30e23 更新打包脚本 2020-07-27 15:20:22 +08:00
宇天 275f6700a2 优化xlink 2020-07-06 14:46:15 +08:00
宇天 ccfd33529c 修复svg的支持 2020-07-06 14:38:22 +08:00
7 changed files with 92 additions and 101 deletions

View File

@ -1,19 +1,18 @@
/** /**
* *
* @authors yutent (yutent@doui.cc) * @authors yutent (yutent.io@gmail.com)
* @date 2018-08-04 01:00:06 * @date 2018-08-04 01:00:06
*/ */
'use strict'
require('es.shim') require('es.shim')
const fs = require('iofs') const fs = require('iofs')
const path = require('path') const path = require('path')
const chokidar = require('chokidar') const chokidar = require('chokidar')
const uglify = require('uglify-es') const { minify } = require('terser')
const chalk = require('chalk') const chalk = require('chalk')
const config = require('./package.json')
const log = console.log const log = console.log
const VERSION = '2.0.0' const VERSION = config.version
const PACK_DIR = path.resolve('./dist') const PACK_DIR = path.resolve('./dist')
const SOURCE_DIR = path.resolve('./src/') const SOURCE_DIR = path.resolve('./src/')
@ -59,9 +58,9 @@ export default _Anot
function comment({ touch } = {}) { function comment({ touch } = {}) {
return `/*================================================== return `/*==================================================
* Anot ${touch ? 'touch' : 'normal'} version for future browsers * Anot ${touch ? 'touch' : 'normal'} version for future browsers
* @authors yutent (yutent@doui.cc) * @authors yutent<yutent.io@gmail.com>
* @date 2017-03-21 21:05:57 * @date ${new Date().format()}
* V${VERSION} * @version v${VERSION}
* *
==================================================*/ ==================================================*/
` `
@ -115,8 +114,8 @@ function packNoCompress(file) {
* 打包带触摸事件的未来版的 anot * 打包带触摸事件的未来版的 anot
* -------------------------------------------------------- * --------------------------------------------------------
*/ */
fs.echo(Buffer.concat([PAD_START, touchVer, PAD_END]), './dist/anot-touch.js') fs.echo(Buffer.concat([PAD_START, touchVer, PAD_END]), './dist/anot.touch.js')
log('%s 打包完成...', chalk.green('anot-touch.js')) log('%s 打包完成...', chalk.green('anot.touch.js'))
} }
// 打包并压缩 // 打包并压缩
@ -136,22 +135,24 @@ function packAndCompress() {
*/ */
log('正在打包 anot.js...') log('正在打包 anot.js...')
let normalVerPack = Buffer.concat([PAD_START, normalVer, PAD_END]).toString() let normalVerPack = Buffer.concat([PAD_START, normalVer, PAD_END]).toString()
fs.echo(comment() + uglify.minify(normalVerPack).code, './dist/anot.js')
minify(normalVerPack, { sourceMap: false }).then(res => {
fs.echo(comment() + res.code, './dist/anot.js')
log(chalk.green('anot.js 打包压缩完成!')) log(chalk.green('anot.js 打包压缩完成!'))
})
/** /**
* -------------------------------------------------------- * --------------------------------------------------------
* 打包带触摸事件的未来版的 anot * 打包带触摸事件的未来版的 anot
* -------------------------------------------------------- * --------------------------------------------------------
*/ */
log('正在打包 anot-touch.js...') log('正在打包 anot.touch.js...')
let touchVerPack = Buffer.concat([PAD_START, touchVer, PAD_END]).toString() let touchVerPack = Buffer.concat([PAD_START, touchVer, PAD_END]).toString()
fs.echo( minify(touchVerPack, { sourceMap: false }).then(res => {
comment({ touch: true }) + uglify.minify(touchVerPack).code, fs.echo(comment({ touch: true }) + res.code, './dist/anot.touch.js')
'./dist/anot-touch.js' log(chalk.green('anot.touch.js 打包压缩完成!'))
) })
log(chalk.green('anot-touch.js 打包压缩完成!'))
} }
let args = process.argv.slice(2) let args = process.argv.slice(2)

View File

@ -1,6 +1,6 @@
{ {
"name": "anot", "name": "anot",
"version": "2.2.1", "version": "2.2.4",
"description": "Anot - 迷你mvvm框架", "description": "Anot - 迷你mvvm框架",
"main": "dist/anot.js", "main": "dist/anot.js",
"files": ["dist"], "files": ["dist"],
@ -14,9 +14,9 @@
"devDependencies": { "devDependencies": {
"chalk": "^2.4.1", "chalk": "^2.4.1",
"chokidar": "^2.0.4", "chokidar": "^2.0.4",
"es.shim": "^1.1.2", "es.shim": "^2.0.1",
"iofs": "^1.1.0", "iofs": "^1.5.2",
"uglify-es": "^3.3.9" "terser": "^5.0.0"
}, },
"repository": "https://github.com/yutent/anot.js.git", "repository": "https://github.com/yutent/anot.js.git",
"author": "yutent", "author": "yutent",

View File

@ -16,7 +16,7 @@ npm run prod
``` ```
执行完, 会打包为2个版本, 分别是 执行完, 会打包为2个版本, 分别是
- anot.js 普通版(需要支持es6 module的现代浏览器) - anot.js 普通版(需要支持es6 module的现代浏览器)
- anot-touch.js 带触摸的版本(需要支持es6 module的现代浏览器) - anot.touch.js 带触摸事件的版本(需要支持es6 module的现代浏览器)
### 文档: ### 文档:

View File

@ -4,14 +4,7 @@ let Anot = function(el) {
} }
/*视浏览器情况采用最快的异步回调*/ /*视浏览器情况采用最快的异步回调*/
Anot.nextTick = new (function() { Anot.nextTick = (function() {
// jshint ignore:line
let tickImmediate = window.setImmediate
let tickObserver = window.MutationObserver
if (tickImmediate) {
return tickImmediate.bind(window)
}
let queue = [] let queue = []
function callback() { function callback() {
let n = queue.length let n = queue.length
@ -21,21 +14,16 @@ Anot.nextTick = new (function() {
queue = queue.slice(n) queue = queue.slice(n)
} }
if (tickObserver) { let node = document.createTextNode('<!-- -->')
let node = document.createTextNode('anot') new MutationObserver(callback).observe(node, { characterData: true })
new tickObserver(callback).observe(node, { characterData: true }) // jshint ignore:line
let bool = false let bool = false
return function(fn) { return function(fn) {
queue.push(fn) queue.push(fn)
bool = !bool bool = !bool
node.data = bool node.data = bool
} }
} })()
return function(fn) {
setTimeout(fn, 4)
}
})() // jshint ignore:line
/********************************************************************* /*********************************************************************
* Anot的静态方法定义区 * * Anot的静态方法定义区 *
@ -97,10 +85,7 @@ Anot.PropsTypes.isBoolean = function() {
/*判定是否是一个朴素的javascript对象Object不是DOM对象不是BOM对象不是自定义类的实例*/ /*判定是否是一个朴素的javascript对象Object不是DOM对象不是BOM对象不是自定义类的实例*/
Anot.isPlainObject = function(obj) { Anot.isPlainObject = function(obj) {
// 简单的 typeof obj === "object"检测会致使用isPlainObject(window)在opera下通不过 // 简单的 typeof obj === "object"检测会致使用isPlainObject(window)在opera下通不过
return ( return serialize.call(obj) === '[object Object]' && Object.getPrototypeOf(obj) === oproto
serialize.call(obj) === '[object Object]' &&
Object.getPrototypeOf(obj) === oproto
)
} }
let VMODELS = (Anot.vmodels = {}) //所有vmodel都储存在这里 let VMODELS = (Anot.vmodels = {}) //所有vmodel都储存在这里
@ -180,11 +165,7 @@ Anot.mix = Anot.fn.mix = function() {
if (target === copy) { if (target === copy) {
continue continue
} }
if ( if (deep && copy && (Anot.isPlainObject(copy) || (copyIsArray = Array.isArray(copy)))) {
deep &&
copy &&
(Anot.isPlainObject(copy) || (copyIsArray = Array.isArray(copy)))
) {
if (copyIsArray) { if (copyIsArray) {
copyIsArray = false copyIsArray = false
clone = src && Array.isArray(src) ? src : [] clone = src && Array.isArray(src) ? src : []
@ -290,11 +271,11 @@ Anot.mix({
t = t.trim() t = t.trim()
let hook = hooks[t] let hook = hooks[t]
if (typeof hook === 'object') { if (typeof hook === 'object') {
t = hook.type || type t = hook.type || t
phase = hook.phase || !!phase phase = hook.phase || phase
fn = hook.fix ? hook.fix(el, fn) : fn fn = hook.fix ? hook.fix(el, fn) : fn
} }
el.addEventListener(t, fn, phase) el.addEventListener(t, fn, !!phase)
}) })
return fn return fn
}, },
@ -307,10 +288,10 @@ Anot.mix({
t = t.trim() t = t.trim()
let hook = hooks[t] let hook = hooks[t]
if (typeof hook === 'object') { if (typeof hook === 'object') {
t = hook.type || type t = hook.type || t
phase = hook.phase || !!phase phase = hook.phase || phase
} }
el.removeEventListener(t, fn, phase) el.removeEventListener(t, fn, !!phase)
}) })
}, },
/*读写删除元素节点的样式*/ /*读写删除元素节点的样式*/
@ -478,10 +459,9 @@ Anot.mix({
}, },
//获取url的参数 //获取url的参数
search: function(key) { search: function(key) {
key += ''
let uri = location.search let uri = location.search
if (!key || !uri) { if (!uri) {
return null return null
} }
uri = decode(uri) uri = decode(uri)
@ -505,7 +485,11 @@ Anot.mix({
obj[tmp[0]] = tmp[1] obj[tmp[0]] = tmp[1]
} }
} }
if (key) {
return obj.hasOwnProperty(key) ? obj[key] : null return obj.hasOwnProperty(key) ? obj[key] : null
} else {
return obj
}
}, },
//复制文本到粘贴板 //复制文本到粘贴板
copy: function(txt) { copy: function(txt) {

View File

@ -264,8 +264,8 @@ function observeObject(source, options) {
return (old = value.get.call(this)) return (old = value.get.call(this))
}, },
set: function(x) { set: function(x) {
var older = old, var older = old
newer var newer
value.set.call(this, x) value.set.call(this, x)
newer = this[key] newer = this[key]
if (this.$fire && newer !== older) { if (this.$fire && newer !== older) {

View File

@ -50,7 +50,7 @@ function executeBindings(bindings, vmodels) {
} }
var roneTime = /^\s*::/ var roneTime = /^\s*::/
var rmsAttr = /:(\w+)-?(.*)|@(.*)/ var rmsAttr = /^:(\w+)-?(.*)|@(.*)/
var events = oneObject( var events = oneObject(
'animationend,blur,change,input,click,dblclick,focus,keydown,keypress,keyup,mousedown,mouseenter,mouseleave,mousemove,mouseout,mouseover,mouseup,scan,scroll,submit' 'animationend,blur,change,input,click,dblclick,focus,keydown,keypress,keyup,mousedown,mouseenter,mouseleave,mousemove,mouseout,mouseover,mouseup,scan,scroll,submit'
@ -372,6 +372,8 @@ function scanText(textNode, vmodels, index) {
anotFragment.appendChild(node) anotFragment.appendChild(node)
} }
textNode.parentNode.replaceChild(anotFragment, textNode) textNode.parentNode.replaceChild(anotFragment, textNode)
if (bindings.length) executeBindings(bindings, vmodels) if (bindings.length) {
executeBindings(bindings, vmodels)
}
} }
} }

View File

@ -47,7 +47,8 @@ var attrDir = Anot.directive('attr', {
}, },
update: function(val) { update: function(val) {
var elem = this.element var elem = this.element
var obj = {} var obj = Object.create(null)
var isSVG = rsvg.test(elem)
val = toJson(val) val = toJson(val)
@ -83,9 +84,13 @@ var attrDir = Anot.directive('attr', {
elem.style.cssText = obj[i] elem.style.cssText = obj[i]
continue continue
} }
if (i === 'href' || i === 'src') {
elem[i] = obj[i] if (i.slice(0, 6) === 'xlink:') {
} else { var k = i
i = i.slice(6)
obj[i] = obj[k]
delete obj[k]
}
// 修正这些值的显示 // 修正这些值的显示
if (obj[i] === false || obj[i] === null || obj[i] === undefined) { if (obj[i] === false || obj[i] === null || obj[i] === undefined) {
obj[i] = '' obj[i] = ''
@ -110,7 +115,7 @@ var attrDir = Anot.directive('attr', {
} }
//SVG只能使用setAttribute(xxx, yyy), HTML的固有属性必须elem.xxx = yyy //SVG只能使用setAttribute(xxx, yyy), HTML的固有属性必须elem.xxx = yyy
var isInnate = rsvg.test(elem) ? false : i in elem.cloneNode(false) var isInnate = isSVG ? false : i in elem.cloneNode(false)
if (isInnate) { if (isInnate) {
elem[i] = obj[i] elem[i] = obj[i]
} else { } else {
@ -123,5 +128,4 @@ var attrDir = Anot.directive('attr', {
} }
} }
} }
}
}) })