BigBirdify

initializer.js

"use strict";

var $ = require('jquery');
var BigBird = require('bigbird');

// BigBird Nodules
var Messenger   = require('./app/messenger');
var Welcome     = require('./app/welcome');

// BigBird Initializer
var initializer = new BigBird.Initializer({
  modules: {
    common: {
      initialize: function initializeAction() {
        var messenger = new Messenger();
      }
    },
    static: {
      welcome: function() {
        var welcome = new Welcome();
      }
    }
  }
});

messenger.js

"use strict";

var $ = require("jquery");
var BigBird = require("bigbird");

module.exports = BigBird.Module.extend({

  el: $('.message'),

  subscriptions: {
    "messenger:send": "updateMessage"
  },

  updateMessage: function(msg) {
    this.$el.html(msg);
  }

});

modernizr-scripts.json

"scripts": {
  "modernizr": "browserify app/assets/javascripts/browsernizr.js -o app/assets/javascripts/modernizr.js",
  "build": "browserify app/assets/javascripts/initializer.js -o app/assets/javascripts/application.js",
  "watch": "watchify app/assets/javascripts/initializer.js -o app/assets/javascripts/application.js",
  "start": "npm run watch & npm run modernizr & rails server"
}

npm-install-dev.sh

npm install browserify watchify  --save-dev

npm-install.sh

npm install browsernizr bigbird jquery --save

npm-scripts.json

"scripts": {
  "build": "browserify app/assets/javascripts/initializer.js -o app/assets/javascripts/application.js",
  "watch": "watchify app/assets/javascripts/initializer.js -o app/assets/javascripts/application.js",
  "start": "npm run watch & rails server"
}

package.json

{
  "name": "bigbirdify",
  "version": "0.0.1",
  "repository": {
    "type": "git",
    "url": "http://github.com/olvado/bigbirdify"
  },
  "devDependencies": {
    "watchify": "^2.4.0",
    "browserify": "^9.0.3"
  },
  "dependencies": {
    "bigbird": "^0.3.5",
    "jquery": "^2.1.3",
    "browsernizr": "^1.0.2"
  }
}

welcome.js

"use strict";

var $ = require("jquery");
var BigBird = require("bigbird");

module.exports = BigBird.Module.extend({

  el: 'body',

  events: {
    "click .js-button": "onButtonClick"
  },

  initialize: function initializeAction() {
    this.sendMessage("Welcome");
  },

  onButtonClick: function(e) {
    e.preventDefault();
    e.stopPropagation();
    $(e.currentTarget).remove();

    this.$els('bigbird-version').text( BigBird.VERSION );
    this.$els('jquery-version').text( $.fn.jquery );
    // this.$els('modernizr-version').text( Modernizr._version );

    this.sendMessage("Framework versions updated");
  },

  sendMessage: function(msg) {
    this.publish('messenger:send', msg);
  }

});