diff --git a/scripts/core/init.js b/scripts/core/init.js
index b73a72d..fa54bcd 100644
--- a/scripts/core/init.js
+++ b/scripts/core/init.js
@@ -25,5 +25,6 @@ starting_canvas.height = window.innerHeight - 200;
commander.query("~ "+ronin.timestamp());
commander.query("# "+starting_canvas.render());
+commander.query("# layer=render");
commander.query("# layer=main");
commander.query("> 1 0,0 #000000");
\ No newline at end of file
diff --git a/scripts/modules/file.save.js b/scripts/modules/file.save.js
index 3877059..1530f48 100644
--- a/scripts/modules/file.save.js
+++ b/scripts/modules/file.save.js
@@ -8,7 +8,8 @@ function FileSave(rune)
{
var n = "Ronin Export";
var f = cmd.variable("format");
- var d = ronin.surface.merged();
+ var d = ronin.surface.merge();
+ d = ronin.surface.layers["render"].element.toDataURL('image/png');
var w = window.open('about:blank','image from canvas');
w.document.write("
"+(n ? n : "Untitled")+"
");
}
diff --git a/scripts/modules/overlay.js b/scripts/modules/overlay.js
index 710e450..d86634f 100644
--- a/scripts/modules/overlay.js
+++ b/scripts/modules/overlay.js
@@ -105,8 +105,6 @@ function Overlay(rune)
{
this.element.width = rect.width * 2;
this.element.height = rect.height * 2;
- this.element.style.left = (window.innerWidth/2)-(rect.width/2);
- this.element.style.top = (window.innerHeight/2)-(rect.height/2);
this.element.style.width = rect.width+"px";
this.element.style.height = rect.height+"px";
this.context().scale(2,2);
diff --git a/scripts/modules/surface.js b/scripts/modules/surface.js
index 691e570..9b3ee71 100644
--- a/scripts/modules/surface.js
+++ b/scripts/modules/surface.js
@@ -8,6 +8,7 @@ function Surface(rune)
this.layers = {};
this.active_layer = null;
+ this.render_layer = null;
this.size = null;
@@ -24,22 +25,30 @@ function Surface(rune)
this.context().fill();
}
- //
-
if(cmd.variable("layer")){
- var layer_name = cmd.variable("layer").value;
- if(this.layers[layer_name]){
- console.log("Selecting layer:"+layer_name);
- this.active_layer = this.layers[layer_name];
- }
- else{
- console.log("Creating layer:"+layer_name);
- this.layers[layer_name] = new Layer(layer_name,this.size);
- this.active_layer = this.layers[layer_name];
- this.element.appendChild(this.active_layer.element);
- this.active_layer.resize(this.size);
+ var name = cmd.variable("layer").value;
+ if(!this.layers[name]){
+ this.add_layer(new Layer(name,this.size));
}
+ this.select_layer(this.layers[name]);
}
+
+ }
+
+ this.select_layer = function(layer)
+ {
+ console.log("Selecting layer:"+layer.name);
+ this.active_layer = layer;
+ }
+
+ this.add_layer = function(layer)
+ {
+ console.log("Creating layer:"+layer.name);
+
+ this.layers[layer.name] = layer;
+ this.active_layer = layer;
+ this.element.appendChild(layer.element);
+ this.active_layer.resize(this.size);
}
this.passive = function(cmd)
@@ -94,24 +103,20 @@ function Surface(rune)
return this.active_layer.context();
}
- this.merged = function()
+ this.merge = function()
{
- var export_canvas = document.createElement("canvas");
- export_canvas.width = this.size.width;
- export_canvas.height = this.size.height;
-
+ this.render_layer = this.layers["render"];
+
+ var a = [];
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);
+ if(key != "render"){
+ a.push(ronin.surface.layers[key]);
+ }
});
-
- 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";
-
+ for (i = a.length; i > 0 ; i--) {
+ ronin.surface.render_layer.context().drawImage(a[i-1].context().canvas,10,10);
+ }
+ return this.render_layer;
}
// Cursor
diff --git a/scripts/modules/surface.layer.js b/scripts/modules/surface.layer.js
index 994ccf7..c527ada 100644
--- a/scripts/modules/surface.layer.js
+++ b/scripts/modules/surface.layer.js
@@ -29,6 +29,22 @@ function Layer(name)
return this.element.getContext('2d');
}
+ this.image = function()
+ {
+ return this.element.toDataURL('image/png');
+ }
+
+ this.merge = function()
+ {
+ console.log(ronin.surface.render_layer);
+ var ctx = ronin.surface.render_layer.context();
+ var img = new Image();
+ img.onload = function(){
+ ctx.drawImage(img,10,10);
+ };
+ img.src = this.element.toDataURL();
+ }
+
//
this.widget_cursor = function()