From 35edb435032646aba0e2f352567a8091743e9334 Mon Sep 17 00:00:00 2001
From: Devine Lu Linvega <aliceffekt@gmail.com>
Date: Tue, 17 Jan 2017 09:22:35 -0700
Subject: [PATCH] Improved layer display

---
 sources/links/main.css                   |  4 +++-
 sources/scripts/core/init.js             |  5 ++---
 sources/scripts/modules/file.save.js     |  8 ++++++++
 sources/scripts/modules/overlay.js       |  3 ++-
 sources/scripts/modules/surface.layer.js | 11 ++++++++++-
 5 files changed, 25 insertions(+), 6 deletions(-)

diff --git a/sources/links/main.css b/sources/links/main.css
index 11ade73..b77e5ce 100644
--- a/sources/links/main.css
+++ b/sources/links/main.css
@@ -10,7 +10,9 @@ canvas:hover { cursor: crosshair;}
 #widget { color:#fff; position:absolute; font-size:10px; padding-top:10px; border-top:1px solid #333; background-image:url(../media/graphics/logo.svg); background-repeat:no-repeat; background-size:80px 80px; height:100px; background-position: -10px 10px; line-height:20px;}
 #widget .module:first-child { margin-left:80px; }
 #widget .module { float:left; margin-right:10px; margin-top:5px; width: 20% }
-#widget .module .highlight:after { content:"_"; color:red;}
+#widget .module .layer { color:#999; padding:2px 5px;}
+#widget .module .highlight { background:#fff; color:black;}
+#widget .module .highlight.managed { background:red; color:black; }
 #widget .cursor { float:right; text-align: right; margin-top:5px}
 #widget .layer:hover { cursor:pointer;}
 
diff --git a/sources/scripts/core/init.js b/sources/scripts/core/init.js
index aad7075..a664d1f 100644
--- a/sources/scripts/core/init.js
+++ b/sources/scripts/core/init.js
@@ -36,7 +36,6 @@ starting_canvas.height = parseInt(starting_canvas.height/40) * 40;
 commander.query("~ "+ronin.timestamp());
 commander.query("# "+starting_canvas.render());
 commander.query("# layer=background");
-// commander.query("# #efefef");
+commander.query("# #ff0000");
 commander.query("# layer=main");
-commander.query("> 1 0,0 #ff0000");
-commander.query("> 1 1,1 #ff0000");
\ No newline at end of file
+commander.query("> 1 ; > 0,0 ; > 1,1 ; > #ffffff");
\ No newline at end of file
diff --git a/sources/scripts/modules/file.save.js b/sources/scripts/modules/file.save.js
index cd7db04..3f112f5 100644
--- a/sources/scripts/modules/file.save.js
+++ b/sources/scripts/modules/file.save.js
@@ -7,6 +7,14 @@ function FileSave(rune)
 
   this.docs = "Creates a new window with a image of the resulting canvas in the specified format.";
   
+  this.layer = null;
+
+  this.install = function()
+  {
+    this.layer = new Layer("Export",this);
+    ronin.surface.add_layer(this.layer);
+  }
+
   this.active = function(cmd)
   {
     var d = null;
diff --git a/sources/scripts/modules/overlay.js b/sources/scripts/modules/overlay.js
index 426f644..086ef7e 100644
--- a/sources/scripts/modules/overlay.js
+++ b/sources/scripts/modules/overlay.js
@@ -9,7 +9,8 @@ function Overlay(rune)
 
   this.install = function()
   {
-    this.layer = new Layer("Test",this);
+    this.layer = new Layer("Guide",this);
+    this.layer.element.setAttribute("style","z-index:9000");
     ronin.surface.add_layer(this.layer);
   }
 
diff --git a/sources/scripts/modules/surface.layer.js b/sources/scripts/modules/surface.layer.js
index ac74433..904040a 100644
--- a/sources/scripts/modules/surface.layer.js
+++ b/sources/scripts/modules/surface.layer.js
@@ -44,7 +44,16 @@ function Layer(name,manager = null)
 
   this.widget = function()
   {
-    return (ronin.surface.active_layer.name == this.name) ? "<span class='highlight'>- "+(this.manager != null ? this.manager.constructor.name+"." : '')+this.name+"</span><br />" : "- "+(this.manager != null ? this.manager.constructor.name+"." : '')+this.name+"<br />";
+    var e_name = "";
+    if(this.manager != null){ e_name += this.manager.constructor.name+"."; }
+    e_name += this.name;
+
+    var e_class = "";
+    e_class += "layer ";
+    if(ronin.surface.active_layer.name == this.name){ e_class += "highlight "; }
+    if(this.manager != null){ e_class += "managed "; }
+
+    return "<span class='"+e_class+"'>- "+e_name+"</span><br />";
   }
 
   this.move_from = null;