From bf2cc0cda356ab7eb5f7585fe3f27c3ba50b4648 Mon Sep 17 00:00:00 2001
From: Devine Lu Linvega <aliceffekt@gmail.com>
Date: Mon, 2 Jan 2017 17:07:06 -0700
Subject: [PATCH] Added layer select with arrows

---
 links/main.css             |  1 +
 scripts/core/init.js       |  5 +++--
 scripts/core/keyboard.js   |  6 ++++--
 scripts/modules/brush.js   | 16 ++++++++++++----
 scripts/modules/surface.js | 26 +++++++++++++++++++++++---
 5 files changed, 43 insertions(+), 11 deletions(-)

diff --git a/links/main.css b/links/main.css
index abfe3f3..cb22a84 100644
--- a/links/main.css
+++ b/links/main.css
@@ -11,6 +11,7 @@ canvas:hover { cursor: crosshair;}
 #widget .module { float:left; margin-right:10px; }
 #widget .module .highlight { color:#e7fff8; }
 #widget .cursor { float:right; text-align: right}
+#widget .layer:hover { cursor:pointer;}
 
 #commander { display:none; z-index: 2000; position:fixed; }
 #commander.visible { display:block; }
diff --git a/scripts/core/init.js b/scripts/core/init.js
index c6c67bf..b2ba85d 100644
--- a/scripts/core/init.js
+++ b/scripts/core/init.js
@@ -12,7 +12,7 @@ commander.hint.element = document.getElementById('commander_hint');
 document.addEventListener('mousedown', function(e){ ronin.cursor.mouse_down(ronin.position_in_canvas(e));}, false);
 document.addEventListener('mousemove', function(e){ ronin.cursor.mouse_move(ronin.position_in_canvas(e));}, false);
 document.addEventListener('mouseup', function(e){ ronin.cursor.mouse_up(ronin.position_in_canvas(e));}, false);
-// document.addEventListener('contextmenu', function(ev){ ev.preventDefault(); return false;}, false);
+document.addEventListener('contextmenu', function(ev){ ev.preventDefault(); return false;}, false);
 window.addEventListener('resize', function(){ ronin.on_resize(); }, true);
 
 // Keyboard
@@ -33,6 +33,7 @@ starting_canvas.height = parseInt(starting_canvas.height/40) * 40;
 
 commander.query("~ "+ronin.timestamp());
 commander.query("# "+starting_canvas.render());
-commander.query("# layer=render");
+commander.query("# layer=background");
+commander.query("# #efefef");
 commander.query("# layer=main");
 commander.query("> 1 0,0 #000000");
\ No newline at end of file
diff --git a/scripts/core/keyboard.js b/scripts/core/keyboard.js
index a5992bf..52a6dc8 100644
--- a/scripts/core/keyboard.js
+++ b/scripts/core/keyboard.js
@@ -18,8 +18,10 @@ function Keyboard()
       case 13:  this.key_enter();  break;
       case 186: this.key_colon();  break;
       case 27:  this.key_escape(); break;
-      case 219:  ronin.brush.size -= ronin.brush.size > 1 ? 1 : 0;ronin.widget.update(); break;
-      case 221:  ronin.brush.size += 1;ronin.widget.update(); break;
+      case 219:  ronin.brush.size_up(); break;
+      case 221:  ronin.brush.size_down(); break;
+      case 38:  ronin.surface.layer_up(); break;
+      case 40:  ronin.surface.layer_down(); break;
     }
 
     // Passive
diff --git a/scripts/modules/brush.js b/scripts/modules/brush.js
index b66e44c..d0c3de1 100644
--- a/scripts/modules/brush.js
+++ b/scripts/modules/brush.js
@@ -44,6 +44,18 @@ function Brush(rune)
       ronin.overlay.draw(cmd.position());
     }
   }
+
+  this.size_up = function()
+  {
+    this.size -= this.size > 1 ? 1 : 0;
+    ronin.widget.update();
+  }
+
+  this.size_down = function()
+  {
+     this.size += 1;
+     ronin.widget.update();
+  }
   
   this.add_pointer = function(cmd)
   {
@@ -74,10 +86,6 @@ function Brush(rune)
 
     return this.pointers.length > 0 ? "Brush "+this.size+", "+this.pointers.length+" pointers" : "No Pointers";
   }
-
-  // Commands
-
-  // this.
   
   // Cursor
 
diff --git a/scripts/modules/surface.js b/scripts/modules/surface.js
index 8ef2661..439f923 100644
--- a/scripts/modules/surface.js
+++ b/scripts/modules/surface.js
@@ -80,12 +80,12 @@ function Surface(rune)
   {
     if(!this.active_layer){ return ""; }
 
-    var s = "# "+this.size.render()+"<br />";
+    var s = "";
 
     Object.keys(ronin.surface.layers).forEach(function (key) {
-      s += ronin.surface.layers[key].widget();
+      s = ronin.surface.layers[key].widget()+s;
     });
-    return s;
+    return "# "+this.size.render()+"<br />"+s;
   }
   
   this.widget_cursor = function()
@@ -93,6 +93,26 @@ function Surface(rune)
     return "Drag";
   }
 
+  // Commands
+
+  this.layer_up = function()
+  {
+    var keys = Object.keys(ronin.surface.layers);
+    var loc = keys.indexOf(this.active_layer.name);
+
+    if(loc >= keys.length-1){ console.log("Reached end"); return false; }
+
+    if(keys[loc+1] != null){this.select_layer(ronin.surface.layers[keys[loc+1]]);}
+  }
+
+  this.layer_down = function()
+  {
+    var keys = Object.keys(ronin.surface.layers);
+    var loc = keys.indexOf(this.active_layer.name);
+
+    if(keys[loc-1] != null){this.select_layer(ronin.surface.layers[keys[loc-1]]);}
+  }
+
   // Layers
 
   this.context = function()