tabs, pages, controls

css/slides.css

@@ -5,11 +5,17 @@
 }
 
 body{
+
 	margin:0;
 	overflow: hidden;
 
 	background: #fff; /*url('[email protected]');
 	background-size: 100px 100px;*/
+
+	font-family: 'FuturaHandwritten';
+	color: #333;
+	font-size: 20px;
+
 }
 #main{
 	width: 100%;
@@ -30,7 +36,7 @@ body{
 #slideshow{
 
 	/*background: #bada55;*/
-	/*border: 1px solid rgba(0,0,0,0.2);*/
+	border: 1px solid rgba(0,0,0,0.2);
 	width:960px;
 	height:540px;
 
@@ -55,15 +61,15 @@ body{
 
 /******** Text Box ********/
 
-.textbox{
-	font-family: 'FuturaHandwritten';
-	color: #333;
-	font-size: 20px;
-}
+.textbox{}
 .textbox > div{
 	position: absolute;
 }
 
+.label{
+	position: absolute;
+}
+
 /********* Button ********/
 
 .button{
@@ -112,6 +118,33 @@ body{
 	display: none;
 }
 
+
+/*************************/
+/****** SANDBOX UI *******/
+/*************************/
+
+#sandbox_tabs{
+	position: absolute;
+	left: 460px; top:-10px;
+	background: url(../assets/sandbox_tabs.png);
+	width:500px; height:470px;
+	background-size: auto 100%;
+}
+#sandbox_tabs > div{
+	position: absolute;
+}
+#sandbox_tabs .hitbox{
+	cursor: pointer;
+	font-size: 25px;
+	top: 22px;
+}
+#sandbox_tabs .sandbox_page{
+	width: 433px;
+	height: 385px;
+	left: 33px;
+	top: 80px;
+}
+
 /*************************/
 /***** SLIDE SELECT ******/
 /*************************/

index.html

@@ -16,7 +16,7 @@
 
 <!-- Libraries -->
 <script src="js/lib/helpers.js"></script>
-<script src="js/lib/pegasus.min.js"></script>
+<script src="js/lib/pegasus.js"></script>
 <script src="js/lib/minpubsub.src.js"></script>
 <script src="js/lib/q.js"></script>
 <script src="js/lib/pixi.min.js"></script>
@@ -36,9 +36,10 @@
 <script src="js/sims/PD.js"></script>
 <script src="js/sims/SillyPixi.js"></script>
 <script src="js/sims/Tournament.js"></script>
+<script src="js/sims/SandboxUI.js"></script>
 
 <!-- Slides -->
-<script src="js/slides/Slides_Ecology.js"></script>
+<script src="js/slides/Slides_Sandbox.js"></script>
 
 <!-- Main Code -->
 <script>

js/core/Button.js

@@ -24,7 +24,10 @@ function Button(config){
 	// Customize DOM
 	button.style.left = config.x+"px";
 	button.style.top = config.y+"px";
-	text.innerHTML = Words.get(config.text_id);
+	config.upperCase = (config.upperCase===undefined) ? true : config.upperCase;
+	var words = Words.get(config.text_id);
+	if(config.upperCase) words=words.toUpperCase();
+	text.innerHTML = words;
 
 	// On hover...
 	hitbox.onmouseover = function(){

js/lib/helpers.js

@@ -46,6 +46,18 @@ var _removeFade = function(self, INSTANT){
 	}
 };
 
+// Make Label
+var _makeLabel = function(wordID, x, y, width, height){
+	var dom = document.createElement("div");
+	dom.className = "label";
+	if(x!==undefined) dom.style.left = x+"px";
+	if(y!==undefined) dom.style.top = y+"px";
+	if(width!==undefined) dom.style.width = width+"px";
+	if(height!==undefined) dom.style.height = height+"px";
+	dom.innerHTML = Words.get(wordID);
+	return dom;
+};
+
 /*******
 
 Make a Sprite. e.g:

js/lib/pegasus.js

@@ -0,0 +1,53 @@
+// a   url (naming it a, because it will be reused to store callbacks)
+// e   timeout error placeholder to avoid using var, not to be used
+// xhr placeholder to avoid using var, not to be used
+function pegasus(a, e, xhr) {
+  xhr = new XMLHttpRequest();
+
+  // Set URL
+  xhr.open('GET', a);
+
+  // Don't need a to store URL anymore
+  // Reuse it to store callbacks
+  a = [];
+
+  pegasus.timeout && (xhr.timeout = pegasus.timeout);
+
+  xhr.ontimeout = function (event) {
+    e = event
+  }
+
+  xhr.onreadystatechange = xhr.then = function(onSuccess, onError, cb, data) {
+    // Test if onSuccess is a function
+    // Means that the user called xhr.then
+    if (onSuccess && onSuccess.call) {
+      a = [,onSuccess, onError];
+    }
+
+    // Test if there's a timeout error
+    e && a[2] && a[2](e, xhr)
+
+    // Test if request is complete
+    if (xhr.readyState == 4) {
+      // index will be:
+      // 0 if undefined
+      // 1 if status is between 200 and 399
+      // 2 if status is over
+      cb = a[0|xhr.status / 200];
+      if (cb) {
+        /*try {
+          data = JSON.parse(xhr.responseText) // NICKY FIX -- don't be helpful
+        } catch (e) {*/
+          data = null;
+        //}
+        cb(data, xhr);
+      }
+    }
+  };
+
+  // Send the GET request
+  xhr.send();
+
+  // Return request
+  return xhr;
+}

js/lib/q.js

@@ -81,7 +81,7 @@
 
 var hasStacks = false;
 try {
-    throw new Error();
+    // throw new Error(); // NICKY FIX -- STOP TRYING TO BE HELPFUL
 } catch (e) {
     hasStacks = !!e.stack;
 }
@@ -461,7 +461,7 @@ function captureLine() {
     }
 
     try {
-        throw new Error();
+        // throw new Error(); // NICKY FIX -- STOP TRYING TO BE HELPFUL
     } catch (e) {
         var lines = e.stack.split("\n");
         var firstLine = lines[0].indexOf("@") > 0 ? lines[1] : lines[2];

js/sims/PD.js

@@ -11,7 +11,7 @@ PD.PAYOFFS_DEFAULT = {
 
 PD.PAYOFFS = PD.PAYOFFS_DEFAULT;
 
-PD.NOISE = 0.05;
+PD.NOISE = 0;
 
 PD.getPayoffs = function(move1, move2){
 	var payoffs = PD.PAYOFFS;