Permalink
Browse files

update flow

  • Loading branch information...
1 parent 56232f6 commit eed886d2e69665287d3a0df54ae13e8957a51e1d @RubyLouvre committed Mar 20, 2013
Showing with 275 additions and 328 deletions.
  1. +28 −24 flow.js
  2. +48 −132 index.html
  3. +35 −0 more/UI.js
  4. +164 −172 mvvm.js
View
@@ -96,10 +96,10 @@ define("flow", ["class"], function($) {
return this;
},
/**待所有子步骤都执行过一遍后,执行最后的回调,之后每次都执行最后的回调以局部刷新数据
- require("interact",function($){
+ require("flow",function($){
var flow = new $.Flow;
flow.refresh("aaa,bbb,ccc",function(){
- $.log(Array.call([],arguments))
+ $.log(Array.apply([],arguments))
});
flow.fire("aaa",1)//没反应
flow.fire("bbb",2)//没反应
@@ -115,10 +115,10 @@ define("flow", ["class"], function($) {
return this;
},
/**待所有子步骤都执行过一遍后,执行最后的回调,然后清后所有数据,重新开始这过程
- require("interact",function($){
+ require("flow",function($){
var flow = new $.Flow;
flow.reload("aaa,bbb,ccc",function(){
- $.log(Array.call([],arguments))
+ $.log(Array.apply([],arguments))
});
flow.fire("aaa",1)//没反应
flow.fire("bbb",2)//没反应
@@ -134,19 +134,19 @@ define("flow", ["class"], function($) {
return this;
},
/**配合refresh使用,相当于一种特殊的fire,要求用户在fire时,按refresh的第一个参数绑定的顺序依次执行
- require("interact",function($){
+ require("flow",function($){
var flow = new $.Flow;
flow.refresh("aaa,bbb,ccc", function(){
- $.log(Array.call([],arguments))
+ $.log(Array.apply([],arguments))
});
flow.order("aaa",1);//没有反应
flow.order("aaa",2);//出错,它本应该触发bbb,但没有警告,它只要求你重来
flow.order("aaa",3);//没有反应
flow.order("bbb",4);//没有反应
flow.order("ccc",5);//[4,5,6]
})
- //如果new $.Flow(4000)在构器器传入timeout,在第一个fire后,过了4秒时间限制还没有全部依次触发完aaa,bbb,ccc
- //也要求你重来
+ //此外我们也可以在构造器传入时间限制,如果new $.Flow(4000),从第一个fire这个时间点到4秒内,
+ //没有能依次触发完aaa,bbb,ccc,则清空已有数据,重新开始
// 可以应用于游戏中的QTE http://baike.baidu.com/view/1398321.htm,我们只需要绑定keydown事件,在回调中调用flow.order(e.which);
*/
order: function(type) { //
@@ -169,41 +169,44 @@ define("flow", ["class"], function($) {
}
},
/**一个子步骤在重复执行N遍后,执行最后的回调
- require("interact",function($){
+ require("flow", function($) {
var flow = new $.Flow;
- flow.repeat("aaa",4,function(){
- $.log(Array.call([],arguments))
+ flow.repeat("aaa", 4, function() {
+ $.log(Array.apply([], arguments))
});
- flow.fire("aaa",1)//没反应
- flow.fire("aaa",2)//没反应
- flow.fire("aaa",3)//没反应
- flow.fire("aaa",4)//[1,2,3,4]
- flow.fire("aaa",5)//没反应
- flow.fire("aaa",6)//没反应
+ flow.fire("aaa", 1) //没反应
+ flow.fire("aaa", 2) //没反应
+ flow.fire("aaa", 3) //没反应
+ flow.fire("aaa", 4) //[1,2,3,4]
+ flow.fire("aaa", 5) //没反应
+ flow.fire("aaa", 6) //没反应
+ flow.fire("aaa", 7) //没反应
+ flow.fire("aaa", 8) //[5,6,7,8]
})
*/
repeat: function(type, times, callback) {
- var target = this._target,
+ var old = times,
that = this,
ret = [];
-
function wrapper() {
ret.push.apply(ret, $.slice(arguments, 1));
- if(--times == 0) {
- that.unbind(last, wrapper);
- callback.apply(target, ret);
+ if(--times === 0) {
+ callback.apply(this._target, ret);
+ times = old;
+ ret = [];
}
}
that.bind(type, wrapper);
return this;
},
+ //用于提供一个简单的成功回调
done: function(callback) {
var that = this;
return function(err, data) {
if(err) {
return that.fire('error', err);
}
- if(typeof handler === 'string') {
+ if(typeof callback === 'string') {
return that.fire(callback, data);
}
if(arguments.length <= 2) {
@@ -213,6 +216,7 @@ define("flow", ["class"], function($) {
callback.apply(null, args);
}
},
+ //用于提供一个简单的错误回调
fail: function(callback) {
var that = this;
that.once('error', function(err) {
@@ -265,7 +269,7 @@ define("flow", ["class"], function($) {
return;
}
var result = [];
- for(index = 0; index < length; index++) {
+ for(var index = 0; index < length; index++) {
result.push.apply(result, flow._fired[events[index]]);
}
if(reload) {
View
@@ -3,154 +3,70 @@
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
- <script src="mass_merge.js"></script>
+ <script src="mass.js"></script>
+
<style>
#ccc {
border:1px solid red;
}
</style>
<script>
- require("messenger,event,ready", function(Messenger, $) {
- var iframe = $("#iframe");
- var messager = new Messenger({
- target: '#iframe',
- onmessage: function(data) {
- $.log(data, true)
- if (typeof data == "object") {
- $.log(data.aaa, true);
- $.log(data.fn, true);
- }
- }
+
+ require("flow", function($) {
+ var flow = new $.Flow;
+ flow.refresh("aaa,bbb,ccc", function() {
+ $.log(Array.apply([], arguments))
});
- iframe.on("load", function() {
- messager.send('发给子页面的消息');
+ flow.fire("aaa", 1)//没反应
+ flow.fire("bbb", 2)//没反应
+ flow.fire("ccc", 3)//[1,2,3]
+ flow.fire("aaa", 4)//[4,2,3],刷新第一个
+ flow.fire("bbb", 5)//[4,5,3],刷新第二个
+ flow.fire("ccc", 6)//[4,5,6],刷新第三个
+ })
+ require("flow", function($) {
+ var flow = new $.Flow;
+ flow.reload("aaa,bbb,ccc", function() {
+ $.log(Array.call([], arguments))
});
- var el = $("#aaa")[0]
- var div = document.createElement("div");
- div.id = "ccc"
- el.applyElement(div,"inside")
-
+ flow.fire("aaa", 1)//没反应
+ flow.fire("bbb", 2)//没反应
+ flow.fire("ccc", 3)//[1,2,3]
+ flow.fire("aaa", 4)//没反应
+ flow.fire("bbb", 5)//没反应
+ flow.fire("ccc", 6)//[4,5,6]
})
-(function (constructors, defineGetter, defineSetter) {
- constructors.forEach (defineGetter);
- constructors.forEach (defineSetter);
-})(
- [ Element, Attr, EntityReference, Entity, DocumentFragment ],
-
- (function (getInnerText) {
- return function (C) { C.prototype.__defineGetter__('innerText', getInnerText); };
- })(
- (function (getInnerText) {
- return function () { return Array.map (this.childNodes, getInnerText).join (''); };
- })(
- function (n) { return n.innerText; })),
-
- (function (setInnerText) {
- return function (C) { C.prototype.__defineSetter__('innerText', setInnerText); };
- })(
- function (s) {
- while (this.hasChildNodes ()) this.removeChild (this.firstChild);
- this.appendChild (this.ownerDocument.createTextNode (s));
- }));
-
-(function (constructors, defineGetter, defineSetter) {
- constructors.forEach (defineGetter);
- constructors.forEach (defineSetter);
-})(
- [ Text, CDATASection ],
-
- (function (getInnerText) {
- return function (C) { C.prototype.__defineGetter__('innerText', getInnerText); };
- })(
- function () { return this.data; }),
-
- (function (setInnerText) {
- return function (C) { C.prototype.__defineSetter__('innerText', setInnerText); };
- })(
- function (s) { this.data = s; }));
-
-(function (constructors, defineGetter, defineSetter) {
- constructors.forEach (defineGetter);
- constructors.forEach (defineSetter);
-})(
- [ ProcessingInstruction, Comment, Document, DocumentType, Notation ],
-
- (function (getInnerText) {
- return function (C) { C.prototype.__defineGetter__('innerText', getInnerText); };
- })(
- function () { return ''; }),
-
- (function (setInnerText) {
- return function (C) { C.prototype.__defineSetter__('innerText', setInnerText); };
- })(
- function (s) { throw new TypeError ('DOMException.NO_MODIFICATION_ALLOWED_ERR(7)'); }));
-HTMLElement.prototype.__defineGetter__('innerText', function () {
- var s = [ ];
- var d = this.ownerDocument || this;
- var t = NodeFilter.SHOW_TEXT | NodeFilter.SHOW_CDATA_SECTION;
- var w = d.createTreeWalker (this, t, null, true);
- var n;
- while (n = w.nextNode ()) s[s.length] = n.data;
- return s.join ('');
-});
-HTMLElement.prototype.__defineGetter__('innerText', function () {
- var d = this.ownerDocument || this;
- var r = d.createRange ();
- r.selectNodeContents (this);
- return r.toString ();
-});
-HTMLElement.prototype.__defineGetter__('innerText', function () {
- var d = this.ownerDocument || this;
- var x = 'string(self::node())';
- var r = d.createNSResolver (this);
- var t = XPathResult.STRING_TYPE;
- return d.evaluate (x, this, r, t, null).stringValue;
-});
-// <http://www.w3.org/TR/ElementTraversal/>
-
-(function (proto, getElement) {
- proto.__defineGetter__ ('firstElementChild', function () {
- return getElement.call (this, 'firstChild', 'nextSibling');
- });
-
- proto.__defineGetter__ ('lastElementChild', function () {
- return getElement.call (this, 'lastChild', 'previousSibling');
- });
-
- proto.__defineGetter__ ('previousElementSibling', function () {
- return getElement.call (this, 'previousSibling');
- });
-
- proto.__defineGetter__ ('nextElementSibling', function () {
- return getElement.call (this, 'nextSibling');
- });
-
- proto.__defineGetter__ ('childElementCount', function () {
- for (var count = 0, n = this.firstElementChild; n; n = n.nextElementSibling, count++);
- return count;
- });
-} )(
- Element.prototype,
-
- function (start, direction) {
- for (var node = this[start]; node; node = node[direction || start]) {
- if (node.nodeType == Node.ELEMENT_NODE) {
- break;
- }
- }
- return node;
- }
-);
-
</script>
</head>
<body>
<p id="aaa">mass messager 组件 by 司徒正美</p>
- <iframe id="iframe" width="800" height="200" src="iframe.html">
- </iframe>
+ <a href="#button" id="button">Button</a>
+ <script type="text/vbscript">
+
+
+ </script>
+ function onRead(obj, prop) {
+ return obj[prop] + "!!";
+ }
+ function onWrite(obj, prop, val) {
+ obj[prop] = val
+ }
+ var obj = {
+ aa: 1,
+ bb: 2,
+ cc: function() {
+ return 3
+ }
+ };
+ var a = fn(obj, onRead, onWrite);
+ console.log(a)
+ a.aa = 4
+ console.log(a.aa)// -> 1!!
+ console.log(a.bb)// -> 2!!
+ console.log(a.cc())// -> 3
</body>
</html>
View
@@ -2415,3 +2415,38 @@ var ifm = document.createElement('iframe');
ifm.src = 'about:blank';
document.body.insertBefore(ifm, document.body.lastChild);
ifm.contentWindow.location.replace('javascript:;');
+
+
+我测试下来, 可能 js replace 是最佳做法的样子
+额 说错. 把笔记贴来看看
+1. window.open
+被弹出页面,IE全系,不会带有refer.非ie 带有当前页面地址作为 refer .
+
+2.一个页面用 <meta http-equiv="refresh" content="0;url=redirect url">
+跳转. 则IE,FF 不会带有refer . chrome, opera, safari则会带有. 另外值得一提的是,ie6,7 使用meta 跳转.会留有历史记录, 这一点和其他浏览器有重要区别. IE8+改进了这个行为.
+
+
+3.swf 弹窗:
+ ie : refer 为swf的url
+ ff : 无refer .
+ webkit : refer 为 swf所在页面url.
+教主Franky(449666) 15:50:03
+不过 firefox 最近改变了 refer 的策略
+
+
+教主Franky(449666) 15:52:59
+
+另外要注意的几个问题是. appendChild这种动态加载的脚本引入的外部脚本中如果有document.write 操作 就会有很大兼容性差异
+两种场景
+A: 当外部脚本写入文档流时,当前页面文档流未关闭
+ 除了Opera,以及早期webkit浏览器比如Safari4-,Chrome8-,Firefox3.6- , 其他浏览器都不会有写入文档流操作
+
+
+B: 外部脚本写入文档流时,当前页面文档流已关闭
+ 除了webkit 早期版本如Safari4-, chrome8-,Firefox3.6-,Opera11-(11.6+已修正) 其他浏览器都不会写入或覆盖文档流… (这应该是浏览器做的防范措施)
+
+这是 最近我有动态加载 cnzz统计代码需求时遇到的. 因为cnzz 的统计代码里 要doc.write 他们的logo到文档流
+教主Franky(449666) 15:54:29
+又因为这个渠道 是ie only .所以确定可以动态加载cnzz . 不会有被覆盖文档流的风险. 从发展角度来看 ie系一直有这种保护.其他浏览器在后期才开始改进
+教主Franky(449666) 15:56:18
+跟各种渠道 和代理商 交流 是见很长见识的事情.. 你根本想不到,他们能写出什么样的 js代码来
Oops, something went wrong. Retry.

0 comments on commit eed886d

Please sign in to comment.