Skip to content

Commit

Permalink
update flow
Browse files Browse the repository at this point in the history
  • Loading branch information
@RubyLouvre
RubyLouvre committed Mar 20, 2013
1 parent 56232f6 commit eed886d
Show file tree
Hide file tree
Showing 4 changed files with 275 additions and 328 deletions.
52 changes: 28 additions & 24 deletions flow.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -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)//没反应
Expand All @@ -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)//没反应
Expand All @@ -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) { //
Expand All @@ -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) {
Expand All @@ -213,6 +216,7 @@ define("flow", ["class"], function($) {
callback.apply(null, args);
}
},
//用于提供一个简单的错误回调
fail: function(callback) {
var that = this;
that.once('error', function(err) {
Expand Down Expand Up @@ -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) {
Expand Down
180 changes: 48 additions & 132 deletions index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -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>
35 changes: 35 additions & 0 deletions more/UI.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -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代码来
Loading

0 comments on commit eed886d

Please sign in to comment.