<html>
<head>
</head>
<body>
<p id="p" name="Paragraph">foo</p>
<script>
SubObject={
clone: function(){
var o=Object.create(this)
if(this.init) this.init.call(o)
return o
},
extend: function(o){
for(var i in o) {if(!o.hasOwnProperty(i)) return this; this[i]=o[i]}
return this
}
}
DOMEvent=SubObject.clone()
.extend({
addTo: function(HTMLObject){
HTMLObject.addEventListener(this.actionName, this.self)
HTMLObject.addEventListener(this.actionName, this.emit)
},
init: function(){
this.listeners=[]
this.emit=function(){this.listeners.forEach(function(listener){listener.notify()})}.bind(this)
},
addListener: function(listener){this.listeners.push(listener)},
})
Notifier=SubObject.clone()
.extend({
init: function(){this.listeners=[]},
add: function(obj){this.listeners.push(obj); obj[this.action.name]=this.action},
notify: function(){var name=this.action.name; this.listeners.forEach(function(listener){listener[name]()})}
})
Person=function(name, job){this.name=name; this.job=job}
person1=new Person("Jack", "doctor")
person2=new Person("John", "police officer")
with(notifier=Notifier.clone()){
extend({action: function hello(){alert("Hello, my name is "+this.name+" and I am "+this.job)}})
add(person1)
add(person2)
}
with(DOMEvent.clone()){
extend({
actionName: "click",
self: function(){alert("Hi, friends! I am HTML"+this.getAttribute("name")+". And who are you?")},
})
addTo(p)
addListener(notifier)
}
</script>
</body>
</html>