our hangout bootstrap.js

gistfile1.js

/**
  * app.js -- bootstrap so we can test different things ourselves
  */

var PRODUCTION_HOST = '//your-production-host.appspot.com',
    DEVELOPMENT_HOST = 'localhost',
    DEVELOPMENT_PORT = '8001';

var views = [
  "test",
  "canvas",
  "onboard"
];

window.hangoutMockLogger = console;

var Bootstrap = {
  'serverPath': "",
  
  // Wait for the Hangouts API to load
  'init': function () {
    console.log("init");
    var apiReady = function(e){
      if (e.isApiReady) {
        gapi.hangout.onApiReady.remove(apiReady);
        Bootstrap.ready();
      }
    };
    gapi.hangout.onApiReady.add(apiReady);
  },

  // Retrieve state from localStorage and load the view
  'ready': function(){
    var hostname = DEVELOPMENT_HOST;
    for (var i in views) {
      Bootstrap.button(views[i]);
    }
    if (localStorage) {
      if (localStorage['hostname']) {
        hostname = localStorage['hostname'];
      }
      if (hostname === "production") {
        Bootstrap.serverPath = PRODUCTION_PATH;
      } else {
        Bootstrap.serverPath = '//' + hostname + ':' + DEVELOPMENT_PORT;
      }
      console.log("serverPath: " + Bootstrap.serverPath);      
      if (localStorage['currentView']) {
        Bootstrap.load(localStorage['currentView']);
      }
    }

    $("#hostname").val(hostname);
    $("#hostname").keydown(Bootstrap.setHostname);
  },
  
  // Make a button
  'button': function(view){
    var button = document.createElement("button");
    button.onclick = function(){ Bootstrap.load(view) };
    button.innerHTML = view.toUpperCase();
    $("#buttons").append(button);
  },

  // Hitting enter on the hostname field to load assets from a different host
  'setHostname': function(e){
    if (e.keyCode == 13) {
      var hostname = $("#hostname").val();
      if (localStorage) {
        localStorage['hostname'] = hostname;
        $("#bootstrap").html("Please reload the app");
      } else {
        $("#bootstrap").html("You don't have localStorage.");
      }
    }
  },

  // Load a view into the DOM
  'load': function(view){
    if (localStorage) {
        localStorage['currentView'] = view;
    } else {
        $(window).data('currentView') = view;
    }
    $("#bootstrap").load(Bootstrap.serverPath + "/?path=" + view + ".html&ts=" + (+new Date ()));
  },
  
  // Load a javascript file once
  'javascripts': {},
  'javascript': function(filename) {
    if (filename in Bootstrap.javascripts) return;
    var script = document.createElement('script');
    script.type = 'text/javascript';
    script.src = Bootstrap.serverPath + filename;
    document.body.appendChild(script);
    Bootstrap.javascripts[filename] = true;
  },
  
  // Load a CSS file once
  'stylesheets': {},
  'stylesheet': function(filename) {    
    if (filename in Bootstrap.stylesheets) return;
    var css = document.createElement('link');
    css.rel = 'stylesheet';
    css.type = 'text/css';
    css.href = Bootstrap.serverPath + filename;
    document.body.appendChild(css);
    Bootstrap.stylesheets[filename] = true;
  }
};

$(Bootstrap.init);