diff --git a/links/main.css b/links/main.css
index f303aad..d2bdb36 100644
--- a/links/main.css
+++ b/links/main.css
@@ -7,7 +7,9 @@ canvas:hover { cursor: crosshair;}
#surface { width:100vw; height:100vh; overflow:hidden; position:fixed; left:0px; top:0px; background:#efefef; border-radius:3px;}
#surface .layer { position:absolute; top:0px; left:0px; width:100%; height:100%;}
#overlay { position:absolute; z-index:1000;}
-#widget { color:#efefef; position:absolute; font-size:10px; line-height:30px;}
+#widget { color:#efefef; position:absolute; font-size:10px; padding-top:10px;}
+#widget .module { float:left; margin-right:10px; }
+#widget .module .highlight { color:#72dec2; }
#widget .cursor { float:right;}
#commander { display:none; z-index: 2000; position:fixed; }
diff --git a/scripts/core/widget.js b/scripts/core/widget.js
index 3749010..c4d0004 100644
--- a/scripts/core/widget.js
+++ b/scripts/core/widget.js
@@ -7,10 +7,10 @@ function Widget()
var s = "";
for (var key in ronin.modules){
- s += ronin.modules[key].widget();
+ s += ronin.modules[key].widget() ? "
"+ronin.modules[key].widget()+"
" : "";
}
- s += ""+ronin.cursor.mode.widget_cursor()+"";
+ s += ""+ronin.cursor.mode.widget_cursor()+"
";
this.element.innerHTML = s;
}
diff --git a/scripts/modules/file.save.js b/scripts/modules/file.save.js
index 2524c17..3877059 100644
--- a/scripts/modules/file.save.js
+++ b/scripts/modules/file.save.js
@@ -6,9 +6,9 @@ function FileSave(rune)
this.active = function(cmd)
{
- var n = cmd.any().string[1];
+ var n = "Ronin Export";
var f = cmd.variable("format");
- var d = ronin.canvas.element.toDataURL("image/png");
+ var d = ronin.surface.merged();
var w = window.open('about:blank','image from canvas');
w.document.write(""+(n ? n : "Untitled")+"
");
}
diff --git a/scripts/modules/surface.js b/scripts/modules/surface.js
index 9ad122c..691e570 100644
--- a/scripts/modules/surface.js
+++ b/scripts/modules/surface.js
@@ -73,7 +73,13 @@ function Surface(rune)
this.widget = function()
{
if(!this.active_layer){ return ""; }
- return "# "+this.active_layer.name;
+
+ var s = "";
+
+ Object.keys(ronin.surface.layers).forEach(function (key) {
+ s += "# "+key+"
";
+ });
+ return s; // "# "+this.active_layer.name;
}
this.widget_cursor = function()
@@ -87,6 +93,26 @@ function Surface(rune)
{
return this.active_layer.context();
}
+
+ this.merged = function()
+ {
+ var export_canvas = document.createElement("canvas");
+ export_canvas.width = this.size.width;
+ export_canvas.height = this.size.height;
+
+ Object.keys(ronin.surface.layers).forEach(function (key) {
+ var base_image = new Image();
+ base_image.src = ronin.surface.layers[key].element.toDataURL('image/png');
+ export_canvas.getContext('2d').drawImage(base_image,0,0);
+ });
+
+ return this.active_layer.element.toDataURL('image/png');
+
+ // this.context().globalCompositeOperation = "copy";
+ // this.context().drawImage(this.context().canvas, -offset_x, -offset_y);
+ // this.context().globalCompositeOperation = "source-over";
+
+ }
// Cursor
diff --git a/scripts/modules/surface.layer.js b/scripts/modules/surface.layer.js
index 1ff89e3..994ccf7 100644
--- a/scripts/modules/surface.layer.js
+++ b/scripts/modules/surface.layer.js
@@ -9,7 +9,6 @@ function Layer(name)
{
console.log("Resize "+this.name+" to "+rect.render());
- var canvas_pixels = this.element.toDataURL("image/png");
var pixels_rect = new Rect(this.element.width+"x"+this.element.height);
this.element.width = rect.width * 2;
@@ -18,12 +17,6 @@ function Layer(name)
this.element.style.height = rect.height+"px";
this.context().scale(2,2);
-
- // base_image = new Image();
- // base_image.src = canvas_pixels;
-
- // ronin.surface.context().drawImage(base_image, -position.x, -position.y, pixels_rect.width, pixels_rect.height);
- // ronin.surface.context().scale(2,2);
}
this.clear = function()
@@ -61,7 +54,7 @@ function Layer(name)
this.context().globalCompositeOperation = "copy";
this.context().drawImage(this.context().canvas, -offset_x, -offset_y);
- this.context().globalCompositeOperation = "source-over"
+ this.context().globalCompositeOperation = "source-over";
this.move_from = new Position(position.x,position.y);
}