// App Stuff
var gui = require('nw.gui');
var magicaVoxel = require('./scripts/voxel/magicaVoxel.js');
var stl = require('./scripts/stl.js');
var win = gui.Window.get();

// Page Stuffs
// ================================
var isDOMLoaded = false;
var renderer = undefined;
var worker = undefined;

window.onload = function(){
  new draggable(
    document.getElementById('controls'),
    true,
    document.getElementById('handle')
  );

  isDOMLoaded = true;
  Initialize();

  // Create the worker and process it's events
  worker = new Worker('scripts/geoGenerator.js');
  worker.addEventListener('message', function(e){
    var data = e.data;
    if (!data.hasOwnProperty('cmd'))
      return;

    switch(data.cmd){
      case 'geo':
        renderer.jobs.push({
          vertices: data.vertices,
          faces: data.faces,
          colors: data.colors
        });
        break;
      case 'status':
        break;
      default:
        console.log('default');
        console.log(data);
        break;
    }
  }, false);

  renderer.update();
};

function Initialize(){
  renderer = new voxRenderer({
    domElement: document.getElementById('canv')
  });
  renderer.init();

  document.getElementById('voxFile').addEventListener('change', handleFileOpen, false);
  document.getElementById('stlFile').addEventListener('change', handleFileSave, false);
}

function handleFileOpen(e){
  var filePath = this.value;
  var mdl = magicaVoxel.load(filePath);

  var buffer = mdl.getVoxelBuffer();

  // Clear the model
  renderer.clearModel();

  // Send the Job
  worker.postMessage({
    cmd: 'create',
    mdl: {
      width: mdl.width,
      height: mdl.zUp ? mdl.depth : mdl.height,
      depth: mdl.zUp ? mdl.height : mdl.depth,
    },
    buffer: buffer
  }, [buffer]);

  // Reset the camera and controls
  renderer.setCamera(
    mdl.width,
    mdl.zUp ? mdl.depth : mdl.height,
    mdl.zUp ? mdl.height : mdl.depth
  );
}

function handleFileSave(e){
  // TODO
}

// Create the Window Menu
// =============================================
var winMenu = new gui.Menu({type: 'menubar'});

// File Menu
var fileMenu = new gui.Menu();
fileMenu.append(new gui.MenuItem({
  label: 'Open',
  click: function(){
    if (!isDOMLoaded) return;

    var fin = document.getElementById('voxFile');
    fin.click();
  }
}));
fileMenu.append(new gui.MenuItem({
  label: 'Export STL',
  click: function(){
    if (!isDOMLoaded) return;

    var fout = document.getElementById('stlFile');
    fout.click();
  }
}));
fileMenu.append(new gui.MenuItem({
  type: 'separator'
}));
fileMenu.append(new gui.MenuItem({
  label: 'Exit',
  click: gui.App.quit
}));

winMenu.append(new gui.MenuItem({
  label: 'File',
  submenu: fileMenu
}));
win.menu = winMenu;

@@ -289,16 +289,44 @@
 defined;
+%0Avar voxelModel = undefined;
 %0A%0Awindow
@@ -1384,16 +1384,200 @@
 false);%0A
+  document.getElementById('voxelSize').addEventListener('change', updatePrintStats, false);%0A  document.getElementById('matSelect').addEventListener('change', updatePrintStats, false);%0A
 %7D%0A%0Afunct
@@ -1667,16 +1667,36 @@
 lePath);
+%0A  voxelModel = mdl;
 %0A%0A  var 
@@ -2163,48 +2163,1023 @@
  );%0A
-%7D%0A%0Afunction handleFileSave(e)%7B%0A  // TODO
+%0A  updateDimensions();%0A  updatePrintStats();%0A%7D%0A%0Afunction handleFileSave(e)%7B%0A  // TODO%0A%7D%0A%0Afunction updateDimensions()%7B%0A  if (voxelModel)%7B%0A    document.getElementById('dimW').dataset.value = voxelModel.width;%0A    document.getElementById('dimH').dataset.value = voxelModel.height;%0A    document.getElementById('dimD').dataset.value = voxelModel.depth;%0A  %7D%0A%7D%0A%0Afunction updatePrintStats()%7B%0A  if (voxelModel)%7B%0A    var volume = voxelModel.getVolume();%0A    var size = document.getElementById('voxelSize').value;%0A    if (size %3E 0)%7B%0A      size = size * size * size;%0A%0A      var material = document.getElementById('matSelect').value;%0A      var printVolume = volume * size;%0A      var mass = stl.calcSolidWeight(printVolume, material);%0A%0A      document.getElementById('volume').dataset.value = printVolume.toFixed(2);%0A      document.getElementById('mass').dataset.value = mass.toFixed(2);%0A    %7D%0A    else %7B%0A      document.getElementById('volume').dataset.value = 0;%0A      document.getElementById('mass').dataset.value = 0;%0A    %7D%0A  %7D
 %0A%7D%0A%0A

Update page.js