JSFiddle - React, Tailwind, and code Playground

by darcyclarke

JavaScript

// My Application
// http://www.darcyclarke.me/articles/development/javascript-applications-101/
var App = {};
App.prototype.init = function () {
  
  // Events object
  this.events = {};
    
  // Our application knows that the document is ready to start quering and manipulating
  this.on( 'ready', function () {
    console.log( 'dom is ready!' );
  });
  
  this.on( 'ready', function () {
    console.log( 'yoooo' );
  });

};

// Add a callback to an event
App.prototype.on = function ( event_name, callback ) {
  // if an event store hasn't been created yet, make it
  if ( !this.events[ event_name ] ) {
    this.events[ event_name ] = [];
  }
  // add a new callback to a specific event
  this.events[ event_name ].push( {
    callback: callback 
  });
};

// Trigger an event
App.prototype.trigger = function ( event_name, args ) {
  this.events[ event_name ].forEach( function ( obj ) {
    obj.callback( args );
  });
};

// Initialize application
var myApp = new App();
myApp.init();

// Event trigger from outside application
jQuery( 'ready', function($) {
  myApp.trigger( 'ready' );
});