Improved design

This commit is contained in:
Devine Lu Linvega
2016-12-25 16:07:47 -07:00
parent 42b47e817d
commit 0f2a6cdcd9
8 changed files with 50 additions and 23 deletions

View File

@@ -10,6 +10,7 @@ function FileSave(rune)
var f = cmd.variable("format");
var d = ronin.surface.merge();
d = ronin.surface.layers["render"].element.toDataURL('image/png');
ronin.surface.layers["render"].clear();
var w = window.open('about:blank','image from canvas');
w.document.write("<title>"+(n ? n : "Untitled")+"</title><img src='"+d+"'/>");
}

View File

@@ -68,8 +68,8 @@ function Surface(rune)
ronin.surface.element.width = rect.width * 2;
ronin.surface.element.height = rect.height * 2;
ronin.surface.element.style.left = (window.innerWidth/2)-(rect.width/2);
ronin.surface.element.style.top = (window.innerHeight/2)-(rect.height/2);
ronin.surface.element.style.marginLeft = -(rect.width/2);
ronin.surface.element.style.marginTop = -(rect.height/2);
ronin.surface.element.style.width = rect.width+"px";
ronin.surface.element.style.height = rect.height+"px";
ronin.widget.element.style.left = (window.innerWidth/2)-(rect.width/2);
@@ -86,7 +86,7 @@ function Surface(rune)
var s = "";
Object.keys(ronin.surface.layers).forEach(function (key) {
s += "# "+key+"<br />";
s += ronin.surface.layers[key].widget();
});
return s; // "# "+this.active_layer.name;
}
@@ -114,7 +114,7 @@ function Surface(rune)
}
});
for (i = a.length; i > 0 ; i--) {
ronin.surface.render_layer.context().drawImage(a[i-1].context().canvas,10,10);
ronin.surface.render_layer.context().drawImage(a[i-1].context().canvas,0,0,this.size.width/2,this.size.height/2);
}
return this.render_layer;
}
@@ -122,6 +122,8 @@ function Surface(rune)
// Cursor
this.drag_from = null;
this.drag_offset_x = 0;
this.drag_offset_y = 0;
this.mouse_down = function(position)
{
@@ -136,10 +138,16 @@ function Surface(rune)
var offset_x = this.drag_from.x - position.x;
var offset_y = this.drag_from.y - position.y;
this.drag_offset_x -= offset_x;
this.drag_offset_y -= offset_y;
ronin.surface.element.style.left = ronin.surface.element.style.left ? parseInt(ronin.surface.element.style.left) - offset_x : offset_x;
ronin.surface.element.style.top = ronin.surface.element.style.top ? parseInt(ronin.surface.element.style.top) - offset_y : offset_y;
ronin.surface.element.style.marginLeft = -(this.size.width/2) + this.drag_offset_x;
ronin.surface.element.style.marginTop = -(this.size.height/2) + this.drag_offset_y;
ronin.element.style.backgroundPosition = ((this.drag_offset_x/8))-(window.innerWidth % 20)+"px "+((this.drag_offset_y/8)-(window.innerWidth % 20))+"px";
ronin.widget.element.style.marginLeft = this.drag_offset_x;
ronin.widget.element.style.marginTop = this.drag_offset_y;
this.drag_from = new Position(position.x,position.y);
}

View File

@@ -1,6 +1,7 @@
function Layer(name)
function Layer(name,host = "user")
{
this.name = name;
this.host = host;
this.element = document.createElement("canvas");
this.element.setAttribute("id","_"+name);
this.element.setAttribute("class","layer");
@@ -52,6 +53,11 @@ function Layer(name)
return "Move";
}
this.widget = function()
{
return "# "+this.name+"<br />";
}
this.move_from = null;
this.mouse_down = function(position)