dakedres/ronin
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Improved guides

Browse Source
This commit is contained in:
Devine Lu Linvega 2017-01-17 09:06:20 -07:00
parent a5a9fb3e6f
commit 348943c505
8 changed files with 34 additions and 36 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
sources/ronin.html
View File

@ -50,9 +50,7 @@
</head> </head>
<body> <body>
<div id='ronin'> <div id='ronin'>
<div id='surface'> <div id='surface'></div>
<canvas id='overlay' width="1480" height="800"></canvas>
</div>
<div id='widget'>Loading..</div> <div id='widget'>Loading..</div>
<div id ='commander'> <div id ='commander'>
<div id='commander_hint'></div> <div id='commander_hint'></div>

2
sources/scripts/core/commander.hint.js
View File

@ -30,7 +30,7 @@ function Hint(element)
var s = "<span class='module'>Modules</span>"; var s = "<span class='module'>Modules</span>";
for (var key in ronin.modules){ for (var key in ronin.modules){
s += "<span> <span class='value'>"+key+"</span> <span class='param'>"+ronin.modules[key].constructor.name.substr(0,2)+" "; s += "<span> <span class='value'>"+key+"</span> <span class='param'>"+ronin.modules[key].constructor.name+" ";
} }
return s; return s;

3
sources/scripts/core/init.js
View File

@ -1,6 +1,5 @@
var ronin = new Ronin(); var ronin = new Ronin();
ronin.element = document.getElementById('ronin'); ronin.element = document.getElementById('ronin');
ronin.overlay.element = document.getElementById('overlay');
ronin.surface.element = document.getElementById('surface'); ronin.surface.element = document.getElementById('surface');
ronin.widget.element = document.getElementById('widget'); ronin.widget.element = document.getElementById('widget');
ronin.cursor.mode = ronin.brush; ronin.cursor.mode = ronin.brush;
@ -22,6 +21,8 @@ var keyboard = new Keyboard();
document.onkeyup = function myFunction(){ keyboard.listen_onkeyup(event); }; document.onkeyup = function myFunction(){ keyboard.listen_onkeyup(event); };
document.onkeydown = function myFunction(){ keyboard.listen_onkeydown(event); }; document.onkeydown = function myFunction(){ keyboard.listen_onkeydown(event); };
ronin.install();
// Canvas // Canvas
var starting_canvas = new Rect(); var starting_canvas = new Rect();
starting_canvas.width = window.innerWidth - 200; starting_canvas.width = window.innerWidth - 200;

13
sources/scripts/core/ronin.js
View File

@ -34,14 +34,15 @@ function Ronin()
this.modules[this.vector.rune] = this.vector; this.modules[this.vector.rune] = this.vector;
this.modules[this.help.rune] = this.help; this.modules[this.help.rune] = this.help;
// Install
for(var key in this.modules){
this.modules[key].install();
}
// //
this.install = function()
{
for(var key in this.modules){
this.modules[key].install();
}
}
this.cursors = []; this.cursors = [];
this.position_in_canvas = function(e) this.position_in_canvas = function(e)

2
sources/scripts/modules/file.load.js
View File

@ -14,7 +14,7 @@ function FileLoad(rune)
base_image = new Image(); base_image = new Image();
base_image.src = cmd.filepath().path; base_image.src = cmd.filepath().path;
base_image.src += '?' + new Date().getTime(); base_image.src += '?'+new Date().getTime();
base_image.crossOrigin = "Anonymous"; base_image.crossOrigin = "Anonymous";
base_image.onload = function(){ base_image.onload = function(){

31
sources/scripts/modules/overlay.js
View File

@ -2,9 +2,16 @@ function Overlay(rune)
{ {
Module.call(this,rune); Module.call(this,rune);
this.parameters = [Position,Rect]; this.parameters = [Position,Rect,Color];
// Module this.color = new Color("#ff00ff");
this.layer = null;
this.install = function()
{
this.layer = new Layer("Test",this);
ronin.surface.add_layer(this.layer);
}
this.passive = function(cmd) this.passive = function(cmd)
{ {
@ -14,6 +21,7 @@ function Overlay(rune)
this.active = function(cmd) this.active = function(cmd)
{ {
if(cmd.bang()){ this.guides = []; } if(cmd.bang()){ this.guides = []; }
if(cmd.color()){ this.color = cmd.color(); }
} }
// draw // draw
@ -52,7 +60,7 @@ function Overlay(rune)
this.context().lineCap="round"; this.context().lineCap="round";
this.context().lineWidth = 1; this.context().lineWidth = 1;
this.context().strokeStyle = "#ff0000"; this.context().strokeStyle = this.color.hex;
this.context().stroke(); this.context().stroke();
this.context().closePath(); this.context().closePath();
} }
@ -68,7 +76,7 @@ function Overlay(rune)
this.context().lineCap="round"; this.context().lineCap="round";
this.context().lineWidth = 1; this.context().lineWidth = 1;
this.context().strokeStyle = "#ff0000"; this.context().strokeStyle = this.color.hex;
this.context().stroke(); this.context().stroke();
this.context().closePath(); this.context().closePath();
} }
@ -82,7 +90,7 @@ function Overlay(rune)
this.context().lineCap="round"; this.context().lineCap="round";
this.context().lineWidth = 1; this.context().lineWidth = 1;
this.context().strokeStyle = "#ff0000"; this.context().strokeStyle = this.color.hex;
this.context().stroke(); this.context().stroke();
this.context().closePath(); this.context().closePath();
} }
@ -96,23 +104,14 @@ function Overlay(rune)
this.context().lineCap="round"; this.context().lineCap="round";
this.context().lineWidth = 1; this.context().lineWidth = 1;
this.context().strokeStyle = "#ff0000"; this.context().strokeStyle = this.color.hex;
this.context().stroke(); this.context().stroke();
this.context().closePath(); this.context().closePath();
} }
this.resize = function(rect)
{
this.element.width = rect.width * 2;
this.element.height = rect.height * 2;
this.element.style.width = rect.width+"px";
this.element.style.height = rect.height+"px";
this.context().scale(2,2);
}
this.context = function() this.context = function()
{ {
return this.element.getContext('2d'); return this.layer.context();
} }
this.clear = function() this.clear = function()

7
sources/scripts/modules/surface.js
View File

@ -10,13 +10,12 @@ function Surface(rune)
this.active_layer = null; this.active_layer = null;
this.render_layer = null; this.render_layer = null;
this.size = null; this.size = new Rect("200x200");
this.active = function(cmd) this.active = function(cmd)
{ {
if(cmd.rect()){ if(cmd.rect()){
this.resize(cmd.rect(),cmd.position()); this.resize(cmd.rect(),cmd.position());
ronin.overlay.resize(cmd.rect());
} }
if(cmd.color()){ if(cmd.color()){
@ -27,7 +26,7 @@ function Surface(rune)
} }
if(cmd.bang() && Object.keys(ronin.surface.layers).length > 1){ if(cmd.bang() && Object.keys(ronin.surface.layers).length > 1){
// Remove element from DOM this.layers[this.active_layer.name].element.outerHTML = "";
delete this.layers[this.active_layer.name]; delete this.layers[this.active_layer.name];
this.select_any_layer(); this.select_any_layer();
ronin.widget.update(); ronin.widget.update();
@ -36,7 +35,7 @@ function Surface(rune)
if(cmd.variable("layer")){ if(cmd.variable("layer")){
var name = cmd.variable("layer").value; var name = cmd.variable("layer").value;
if(!this.layers[name]){ if(!this.layers[name]){
this.add_layer(new Layer(name,this.size)); this.add_layer(new Layer(name));
} }
this.select_layer(this.layers[name]); this.select_layer(this.layers[name]);
} }

6
sources/scripts/modules/surface.layer.js
View File

@ -1,7 +1,7 @@
function Layer(name,host = "user") function Layer(name,manager = null)
{ {
this.name = name; this.name = name;
this.host = host; this.manager = manager;
this.element = document.createElement("canvas"); this.element = document.createElement("canvas");
this.element.setAttribute("id","_"+name); this.element.setAttribute("id","_"+name);
this.element.setAttribute("class","layer"); this.element.setAttribute("class","layer");
@ -44,7 +44,7 @@ function Layer(name,host = "user")
this.widget = function() this.widget = function()
{ {
return (ronin.surface.active_layer.name == this.name) ? "<span class='highlight'>- "+this.name+"</span><br />" : "- "+this.name+"<br />"; 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 />";
} }
this.move_from = null; this.move_from = null;