JS模块通信功能
默认分类 2011-05-25 07:17:39
- <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
- <html xmlns="http://www.w3.org/1999/xhtml">
-
- <head>
- <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
- <title>Untitled 1</title>
- <script type="text/javascript">
- <!--
- function isArray(a){ return Object.prototype.toString.apply(a) === '[object Array]';}
- if(typeof console == "undefined") window.console={log:function(str){var console=document.getElementById('console');if(!!console)consoleconsole.innerHTML=console.innerHTML+str+"<br/>";}}
-
-
-
- DOM = {getElementById:function(i){return document.getElementById(i);}}
-
- MM = ModuleManager = {
- id:Math.random(),
- Modules:{},
- Listners:{},//Listners["id"+id+evt]
- get:function(id){return Modules[id]},
- push:function(module){
- this.Modules[module.id] = module;
- },
- //监听事件
- //ModuleB.addEventListener('doit',ModuleA);
- //如果ModuleA发生了doit,请通知我[ModuleB]
- addEventListener:function(receiver,evt,sender){
- this.Listners[receiver.id+this.id.toString()+evt] ={"module":receiver,listenEvent:evt,sender:sender};
- },
- //触发事件
- //ModuleA.sendEvent('doit',ModuleB);
- //我[ModuleA]刚刚发生了doit,请告诉ModuleB
- receiveEvent:function(sender,evt,receiver){
- //sender发生了evt
- var i,j,k,sender,to,listenEvent,listner,meInFromList=false,toInMeList=false;
-
- for(i in this.Listners){
- listner = this.Listners[i];
-
- if(!listner.listenEvent||listner.listenEvent!=evt||
- (!!listner.module&&!(listner.module instanceof Module)))
- {console.log('Module ['+listner.module.id+'] is not listen "'+evt+'".');continue;}
- //检测sender是不是在listner的fromList中
- if(listner.sender!==undefined&&!listner.sender[sender.id]){console.log('Module ['+sender.id+'] is not in module ['+listner.module.id+'] listen list.');continue;}
- //listner.module不在receiver之列
- if(receiver!==undefined&&!receiver[listner.module.id]){console.log('Module ['+listner.module.id+'] is not in module ['+sender.id+'] receive list.');continue;}
-
- if(listner.module.needinit&&!listner.module.inited)
- console.log("Module [" + listner.module.id + "] is not inited.If it not need init please set it's property {needinit:flase}");
- else
- listner.module.fireEvent(evt);
- }
- }
-
- }
-
- Module=function(arg){
- /* arg:{id:string,element:HTMLElement,init:funtion}
- */
- var _this=this;
- if(this.needinit===undefined)
- this.needinit=true;
- if(this.inited===undefined)
- this.inited=false;
-
- //触发事件
- //ModuleA.sendEvent('doit',ModuleB);
- //ModuleA刚刚发生了doit,请告诉[ModuleB]
- arg.sendEvent=function(evt,target){
- var i,j,k,receivers;
- if(target!==undefined){
- if(Object.prototype.toString.apply(target)==='[object Array]'){
- for(i in target){
- if(target[i] instanceof Module){
- if(receivers==undefined) receivers={};
- receivers[target[i].id]=target[i];
- }
- }
- }
- else if(target instanceof Module){receivers={};receivers[target.id]=target;}
- else console.log("Sender is not module.");
- }
-
- MM.receiveEvent(_this,evt,receivers);
- }
- //监听事件
- //ModuleB.addEventListener('doit',ModuleA);
- //如果ModuleA发生了doit,请通知我[ModuleB]
- arg.addEventListener=function(evt,source){
- var i,j,k,senders;
- if(source!==undefined){
- if(Object.prototype.toString.apply(source)==='[object Array]'){
- for(i in source){
- if(source[i] instanceof Module){
- if(senders==undefined) senders={};
- senders[source[i].id]=source[i];
- }
- }
- }
- else if(source instanceof Module){senders={};senders[source.id]=source;}
- else console.log("Sender is not module.");
- }
-
- MM.addEventListener(_this,evt,senders);
- }
- if(!!arg.fireEvent)
- this.fireEvent=function(evt){arg.fireEvent(evt)}
- else this.fireEvent=function(evt){console.log('Module ['+this.id+'] not set fireEvent().');};
-
-
- for(var i in arg){this[i] = arg[i];}
-
- if(!!arg.init) {this.init=function(){this.inited=true;arg.init.call(this);};}
- else {this.init=function(){this.inited=true;};}
-
- this.initObj = arg;
- arg.module=this;
- ModuleManager.push(this);
- }
-
-
- //////////////////////////////////////////////////////////////////////////////////////////
-
- var ModuleA = new Module({
- id:"a",
- init:function(){
- this.element = DOM.getElementById(this.id);
- this.element.onclick=function(){
- ModuleC.addEventListener('Adoit');
-
- ModuleA.sendEvent('Adoit',[ModuleA,ModuleC]);
-
- };
- this.addEventListener('Adoit');
- }
- });
- var ModuleB = new Module({
- id:"b",
- init:function(){
- this.element = DOM.getElementById(this.id);
- this.addEventListener('Adoit');
- this.element.onclick=function(){
- ModuleB.sendEvent('Adoit');
- };
- },
- fireEvent:function(evt){
- this.element.innerHTML="fire";
- }
-
- });
- var ModuleC = new Module({
- id:"c",
- init:function(){
- this.element = DOM.getElementById(this.id);
- this.addEventListener('Adoit');
- this.element.onclick=function(){
- this.sendEvent('Bdoit');
- };
-
-
- },
- fireEvent:function(evt){
- this.element.innerHTML="fire";
- }
-
- });
-
-
- window.onload=function(){
- //MM.init([ModuleA,ModuleB,ModuleC]);
-
- ModuleA.init();
- ModuleB.init();
- //ModuleC.init();
-
- }
-
-
-
-
-
-
-
-
-
- //-->
- </script>
- </head>
-
- <body>
- <div id="a">aaaaa</div>
- <div id="b">bbbb</div>
- <div id="c">cccc</div>
-
- <div id="console" style="font-style:italic;">Console<br/></div>
- </body>
-
- </html>
>>
留言评论