Working on new SpaceGame example

NewSpaceGame/Resources/Components/SpaceGame.js

@@ -1,4 +1,5 @@
 var UI = require("UI/ui");
+var options = require("UI/options")
 
 var game = Atomic.game;
 
@@ -164,7 +165,11 @@ function createScene() {
   viewport.renderPath = renderPathXML;
 
   // Example of appending a post process filter
-  //viewport.renderPath.append(game.cache.getResource("XMLFile", "PostProcess/GreyScale.xml"));
+  if (options.getOptions().blackAndWhite)
+    viewport.renderPath.append(game.cache.getResource("XMLFile", "PostProcess/GreyScale.xml"));
+  if (options.getOptions().blur)
+    viewport.renderPath.append(game.cache.getResource("XMLFile", "PostProcess/Blur.xml"));
+
 
   game.renderer.setViewport(1, viewport);
 

NewSpaceGame/Resources/UI/about.js

@@ -27,6 +27,15 @@ exports.init = function(onClose) {
   view.addChild(window);
   window.center();
 
+  var file = game.cache.getFile("UI/about.txt");
+  var text = file.readText();
+
+  text = text.replace("$Platform", Atomic.platform);
+
+
+  window.getWidget("about_text").text = text ;
+
+
   window.getWidget("ok").onClick = function () {
 
     closeWindow();

NewSpaceGame/Resources/UI/about.txt

@@ -0,0 +1,9 @@
+<color #00FF00><u>Atomic Space Game</u></color>
+
+A simple example of:
+
+• Javascript Components
+• UI Widgets
+• Game Loop
+
+Running on: $Platform

NewSpaceGame/Resources/UI/about.ui.txt

@@ -1,6 +1,6 @@
 TBLayout: axis: y
 	TBEditField: multiline: 1, styling: 1, gravity: all, id: about_text, readonly: 1, adapt-to-content: 0
-		font: size: 12
+		font: size: 18
 		lp: max-width: 800, min-width: 800, min-height: 512, max-height: 512
 		text: "..."
 	TBButton: text: OK, id: ok

NewSpaceGame/Resources/UI/mainMenu.js

@@ -46,6 +46,17 @@ exports.init = function() {
 
   }
 
+  window.getWidget("options").onClick = function () {
+
+    // disable ourselves until ok is clicked on about
+    window.setState(UI.WIDGET_STATE_DISABLED, true);
+
+    var ui = require("./ui");
+    ui.showOptions(function() {window.setState(UI.WIDGET_STATE_DISABLED, false);});
+
+  }
+
+
   window.getWidget("quit").onClick = function () {
 
     game.engine.exit();

NewSpaceGame/Resources/UI/mainMenu.ui.txt

@@ -6,7 +6,7 @@ TBLayout: axis: y, size: available
 
 	TBButton: text: "New Game", id: "new_game"
 		@include definitions>menubutton
-	TBButton: text: "High Scores"
+	TBButton: text: "Options", id: "options"
 		@include definitions>menubutton
 	TBButton: text: "About", id: "about"
 		@include definitions>menubutton

NewSpaceGame/Resources/UI/options.js

@@ -0,0 +1,73 @@
+'use strict';
+
+var game = Atomic.game;
+var view = game.uiView;
+var UI = Atomic.UI;
+var UIWindow = Atomic.UIWindow;
+
+var window;
+
+function closeWindow() {
+
+  if (window)
+    window.die();
+  window = null;
+
+}
+
+var blackAndWhiteSetting = false;
+var blurSetting = false;
+
+exports.getOptions = function() {
+  return {
+    "blackAndWhite": blackAndWhiteSetting,
+    "blur": blurSetting,
+  }
+}
+
+exports.init = function(onClose) {
+
+  window = new UIWindow();
+
+  window.settings = Atomic.UI.WINDOW_SETTINGS_TITLEBAR;
+  window.text = "Options";
+
+  window.load("UI/options.ui.txt");
+  window.resizeToFitContent();
+  view.addChild(window);
+  window.center();
+
+  var blackAndWhite = window.getWidget("ppbw");
+  var blur = window.getWidget("ppblur");
+
+  blackAndWhite.value = blackAndWhiteSetting;
+  blur.value = blurSetting;
+
+  blackAndWhite.onChanged = function() {
+
+    blackAndWhiteSetting = blackAndWhite.value;
+
+  }
+
+  blur.onChanged = function() {
+
+    blurSetting = blur.value;
+
+  }
+
+  window.getWidget("ok").onClick = function () {
+
+    closeWindow();
+    onClose();
+
+  }
+
+
+
+}
+
+exports.shutdown = function() {
+
+  closeWindow();
+
+}

NewSpaceGame/Resources/UI/options.ui.txt

@@ -0,0 +1,11 @@
+TBLayout: axis: y, size: available
+	TBClickLabel: text: "Post Process: Black & White"
+		font: size: 24
+		TBCheckBox: id: "ppbw"
+	TBClickLabel: text: "Post Process: Blur"
+		font: size: 24
+		TBCheckBox: id: "ppblur"
+	TBButton: text: OK, id: ok
+		font: size: 24
+		lp: min-width: 128, min-height: 48
+	

NewSpaceGame/Resources/UI/ui.js

@@ -3,6 +3,7 @@
 var mainMenu = require("./mainMenu");
 var gameOver = require("./gameOver");
 var about = require("./about");
+var options = require("./options");
 
 exports.showMainMenu = function() {
 
@@ -19,6 +20,11 @@ exports.showAbout = function(onClose) {
     about.init(onClose);
 }
 
+exports.showOptions = function(onClose) {
+
+    options.init(onClose);
+}
+
 
 exports.update = function(timeStep) {