rezoner

/* 
  
  I've decided there will be two levels of integration

  1) You get loaders only. You have to create renderers and scenes manually.
  2) You get loaders and magically bootstrapped Three.js
    
  Below is level 2 integration example which renders a textured cube:

*/

rezoner

PLAYGROUND.Layer = {

  plugin: true,

  app: {

    create: function(app, data) {

      app.layer = cq().appendTo(app.container);

rezoner

/* 
  
  Here is a simple plugin that creates scanlines image
  and draws it after everything has been rendered

  I am still not sure what will be the standard for configuration.

*/

PLAYGROUND.Scanlines = function(app) {

rezoner

/* This will make you a screenshot for later usage whenever you want */

ENGINE.Game = {

  showOptionsScreen: function() {
    
    app.screenshot = this.app.layer.cache();
    app.setState(ENGINE.Options);

  }

rezoner

var app = new PLAYGROUND.Application({

  preload: function() {

    /* this is called before create and lets you silently load some assets */

    this.loadData("objects/buildings", "objects/subObjects", "objects/townBuildingList");

  },

rezoner

playground({

  create: function() {

    app.loadData(...);

  },

  ready: function() {

rezoner

var app = playground({

  create: function() {

    app.loadData(...);

  },

  ready: function() {

rezoner

Namespacing concept for javascript

keyword namespace would replace window as a default global with another object until namespace is escaped.

namespace ENGINE;

Physics = {

 applyForce: function(x, y) { ... },

rezoner

var offsets = [
  [0.0, 1.0],
  [0.0, 0.5],
  [0.0, 0.0],
  [0.5, 0.0],
  [0.5, 0.5],
  [0.5, 1.0]
  [1.0, 0.0],
  [1.0, 0.5],
  [1.0, 1.0]

rezoner

class GUIList extends GUIWidget {

  constructor(args) {

    super(args);

    this.scrollable = true;

    this.layout = {