JSFiddle - React, Tailwind, and code Playground

by rur_d

HTML

<script src="http://code.angularjs.org/angular-0.9.19.min.js" ng:autobind></script>

<div ng:controller="TestCtrl">
    <button ng:click="events.emitEvent('testEvent', 1,2,3)">Up It</button>
    <p>{{updates}}</p>
    <p>{{payload}}</p>
    <p>{{events}}</p>
    <button ng:click="events.clearEvent('testEvent')">Clear It</button>
    <div ng:controller="ChildCtrl">
        <p>>> {{childUpdate}}</p>
    </div>        
<div>

JavaScript

function TestCtrl(){
    var self = this;
    this.updates = 0;
    this.payload = "sdf";

    this.events = new BoundEventBus();
    this.events.addEvent("testEvent");

    this.$watch("events.testEvent",function(){
        self.payload = self.$get("events.$testEvent");
        self.updates++;
    },false);  
}

function ChildCtrl(){
    var self = this;
    this.childUpdate = 0;
    this.$watch("events.testEvent", function(){ self.childUpdate++; }, false);
}
 
    
        
function BoundEventBus(){
}   

BoundEventBus.prototype = {
    addEvent:function(type){
        this[type] = 1;
    },
    emitEvent:function( type ){
        if( this.hasOwnProperty(type) ){
            if( arguments.length > 1 ){
                this["$"+type] = Array.prototype.slice.call(arguments, 1);
            }
            this[type]++;
        }
    }
}