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

Vector is working again

Browse Source
This commit is contained in:
Devine Lu Linvega 2017-03-27 14:04:47 -07:00
parent 40aae14931
commit a585d6ec63
10 changed files with 184 additions and 196 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
index.html
View File

@ -17,7 +17,7 @@
<script type="text/javascript" src="scripts/modules/cursor.js"></script> <script type="text/javascript" src="scripts/modules/cursor.js"></script>
<script type="text/javascript" src="scripts/modules/terminal.js"></script> <script type="text/javascript" src="scripts/modules/terminal.js"></script>
<script type="text/javascript" src="scripts/modules/module.js"></script> <script type="text/javascript" src="scripts/modules/module.js"></script>
<script type="text/javascript" src="scripts/modules/vector.js"></script> <script type="text/javascript" src="scripts/modules/path.js"></script>
<script type="text/javascript" src="scripts/modules/overlay.js"></script> <script type="text/javascript" src="scripts/modules/overlay.js"></script>
<script type="text/javascript" src="scripts/modules/brush.js"></script> <script type="text/javascript" src="scripts/modules/brush.js"></script>
<script type="text/javascript" src="scripts/modules/brush.pointer.js"></script> <script type="text/javascript" src="scripts/modules/brush.pointer.js"></script>

4
scripts/core/ronin.js
View File

@ -11,7 +11,7 @@ function Ronin()
this.brush = new Brush("-"); this.brush = new Brush("-");
this.eye = new Eye("*"); this.eye = new Eye("*");
this.render = new Render("%"); this.render = new Render("%");
this.vector = new Vector("+"); this.path = new Path("+");
this.typo = new Typographe("&"); this.typo = new Typographe("&");
this.cursor = new Cursor("."); this.cursor = new Cursor(".");
this.terminal = new Terminal(">"); this.terminal = new Terminal(">");
@ -24,7 +24,7 @@ function Ronin()
this.modules[this.brush.rune] = this.brush; this.modules[this.brush.rune] = this.brush;
this.modules[this.eye.rune] = this.eye; this.modules[this.eye.rune] = this.eye;
this.modules[this.typo.rune] = this.typo; this.modules[this.typo.rune] = this.typo;
this.modules[this.vector.rune] = this.vector; this.modules[this.path.rune] = this.path;
this.modules[this.terminal.rune] = this.terminal; this.modules[this.terminal.rune] = this.terminal;
this.modules[this.overlay.rune] = this.overlay; this.modules[this.overlay.rune] = this.overlay;
this.modules[this.magnet.rune] = this.magnet; this.modules[this.magnet.rune] = this.magnet;

30
scripts/modules/cursor.js
View File

@ -130,18 +130,18 @@ function Cursor(rune)
this.update = function(event) this.update = function(event)
{ {
if(ronin.module){ // if(ronin.terminal.module_name){
this.set_mode(ronin.module); // this.set_mode(ronin.module);
} // }
else if(event.altKey == true && event.shiftKey == true){ // else if(event.altKey == true && event.shiftKey == true){
this.set_mode(ronin.surface.active_layer); // this.set_mode(ronin.surface.active_layer);
} // }
else if(event.altKey == true){ // else if(event.altKey == true){
this.set_mode(ronin.default); // this.set_mode(ronin.default);
} // }
else{ // else{
this.set_mode(ronin.brush); // this.set_mode(ronin.brush);
} // }
} }
this.set_mode = function(mode) this.set_mode = function(mode)
@ -161,7 +161,10 @@ function Cursor(rune)
this.mode.mouse_from = this.position; this.mode.mouse_from = this.position;
this.mode.mouse_held = true; this.mode.mouse_held = true;
this.mode.mouse_down(this.position); this.mode.mouse_down(this.position);
console.log(this.mode)
} }
ronin.terminal.update_hint();
} }
this.mouse_move = function(position) this.mouse_move = function(position)
@ -185,6 +188,7 @@ function Cursor(rune)
this.mode.mouse_move(this.position,rect); this.mode.mouse_move(this.position,rect);
this.mode.mouse_prev = this.position; this.mode.mouse_prev = this.position;
} }
ronin.terminal.update_hint();
} }
this.mouse_up = function(position) this.mouse_up = function(position)
@ -200,7 +204,7 @@ function Cursor(rune)
this.mode.mouse_held = false; this.mode.mouse_held = false;
} }
ronin.terminal.input_element.focus(); ronin.terminal.input_element.focus();
ronin.terminal.update_hint();
this.mode.mouse_from = null; this.mode.mouse_from = null;
} }
} }

7
scripts/modules/default.js
View File

@ -4,7 +4,12 @@ function Default(rune)
this.hint = function() this.hint = function()
{ {
return "??"; var s = "";
for(module in ronin.modules){
s += ronin.modules[module].constructor.name+" ";
}
return s;
} }
// Cursor // Cursor

2
scripts/modules/file.save.js
View File

@ -16,7 +16,7 @@ function FileSave(rune)
var w = window.open('about:blank','image from canvas'); var w = window.open('about:blank','image from canvas');
if(cmd.setting("format") && cmd.setting("format").value == "svg"){ if(cmd.setting("format") && cmd.setting("format").value == "svg"){
w.document.write("<title>Untitled</title><body>"+ronin.vector.create_svg()+"</body>"); w.document.write("<title>Untitled</title><body>"+ronin.path.create_svg()+"</body>");
} }
else if(cmd.setting("format") && cmd.setting("format").value == "jpg"){ else if(cmd.setting("format") && cmd.setting("format").value == "jpg"){
w.document.write("<title>Untitled</title><body><img src='"+this.merge().element.toDataURL('image/jpeg')+"' width='"+ronin.surface.settings["size"].width+"px' height='"+ronin.surface.settings["size"].height+"px'/></body>"); w.document.write("<title>Untitled</title><body><img src='"+this.merge().element.toDataURL('image/jpeg')+"' width='"+ronin.surface.settings["size"].width+"px' height='"+ronin.surface.settings["size"].height+"px'/></body>");

7
scripts/modules/module.js
View File

@ -77,17 +77,20 @@ function Module(rune)
{ {
var s = ""; var s = "";
ronin.terminal.hint_element.innerHTML = "";
var method_name = content.split(" ")[0]; var method_name = content.split(" ")[0];
if(this.methods[method_name]){ if(this.methods[method_name]){
s = this.methods[method_name].params; s = this.methods[method_name].params;
s += this.methods[method_name].mouse_event ? "<i>["+this.methods[method_name].mouse_event+"]</i> " : "";
} }
else{ else{
for(method in this.methods){ for(method in this.methods){
s += "."+method+"("+method_name+") "; s += ".<b>"+method+"</b> ";
} }
for(setting in this.settings){ for(setting in this.settings){
s += setting+"="+this.settings[setting].render()+" "; s += setting+"="+this.settings[setting]+" ";
} }
} }
return s; return s;

130
scripts/modules/path.js Normal file
View File

@ -0,0 +1,130 @@
function Path(rune)
{
Module.call(this,rune);
this.parameters = [Any];
this.settings = {"fill_color" : "#ff0000","line_width" : 1,"line_color" : "#ffffff", "line_cap" : "square"};
this.add_method(new Method("stroke",["Positions"],"Add point"));
this.add_method(new Method("fill",["Positions"]),"Add point");
this.coordinates = [];
this.last_pos = null;
this.paths = [];
this.stroke = function(params,preview = false)
{
if(!ronin.path.layer){ ronin.path.create_layer(); ronin.path.layer.is_blinking = true; }
this.layer.clear();
this.layer.context().lineCap = this.settings["line_cap"];
this.layer.context().lineWidth = this.settings["line_width"];
this.layer.context().strokeStyle = this.settings["line_color"];
ronin.path.layer.context().stroke(new Path2D(params));
}
this.fill = function(params,preview = false)
{
if(!ronin.path.layer){ ronin.path.create_layer(); ronin.path.layer.is_blinking = true; }
this.layer.clear();
this.layer.context().fillStyle = this.settings["fill_color"];
ronin.path.layer.context().fill(new Path2D(params));
}
// Tools
this.create_path = function()
{
var command = "";
for (var i = 0; i < this.coordinates.length; i++) {
command += this.coordinates[i]+" ";
}
return command;
}
this.create_svg = function()
{
var s = "";
s += "<svg width='"+ronin.surface.settings["size"].width+"' height='"+ronin.surface.settings["size"].height+"' xmlns='http://www.w3.org/2000/svg' baseProfile='full' version='1.1' style='fill:none;stroke:red;stroke-width:2px;stroke-linecap:square;'>";
for (var i = 0; i < this.paths.length; i++) {
s += "<path d='"+this.paths[i]+"' />";
}
s += "</svg>";
console.log(s);
return s;
}
// Mouse
this.mouse_mode = function()
{
if(keyboard.shift_held == true && keyboard.alt_held == true){
return "Path(Origin)";
}
else if(keyboard.shift_held == true){
return "Path(Counterclock Arc)";
}
else if(keyboard.alt_held == true){
return "Path(Clockwise Arc)";
}
else{
return "Path(Line)";
}
}
this.mouse_down = function(position)
{
ronin.terminal.input_element.value = "path."+ronin.terminal.method_name+" "+this.create_path();
ronin.terminal.input_element.value += "M"+position.render();
ronin.terminal.passive();
}
this.mouse_move = function(position)
{
ronin.terminal.input_element.value = "path."+ronin.terminal.method_name+" "+this.create_path();
ronin.terminal.input_element.value += "L"+position.render();
ronin.terminal.passive();
}
this.mouse_up = function(position)
{
if(this.coordinates.length == 0){
this.coordinates.push("M"+position.render());
}
else{
var offset = this.last_pos ? position.offset(this.last_pos) : position;
if(keyboard.shift_held == true && keyboard.alt_held == true){
this.coordinates.push("M"+position.render());
}
else if(keyboard.shift_held == true){
this.coordinates.push("a"+offset.render()+" 0 0,1 "+offset.render());
}
else if(keyboard.alt_held == true){
this.coordinates.push("a"+offset.render()+" 0 0,0 "+offset.render());
}
else{
this.coordinates.push("l"+offset.render());
}
}
ronin.terminal.input_element.value = "path."+ronin.terminal.method_name+" "+this.create_path();
this.last_pos = position;
ronin.terminal.passive();
}
this.key_escape = function()
{
if(this.layer){ this.layer.remove(this); }
this.coordinates = [];
this.last_pos = null;
ronin.terminal.input_element.value = "";
ronin.terminal.passive();
}
}

32
scripts/modules/terminal.js
View File

@ -27,27 +27,31 @@ function Terminal(rune)
{ {
} }
this.passive = function(content) this.module_name = null;
this.method_name = null;
this.method_params = null;
this.passive = function()
{ {
this.hint(content); var content = this.input_element.value;
var parts = content.split(" ");
var key = parts.shift();
this.module_name = key.split(".")[0];
this.method_name = key.indexOf(".") > -1 ? key.split(".")[1] : null;
this.method_params = parts;
return; if(ronin[this.module_name]){
var key = content[0]; ronin.cursor.set_mode(ronin[this.module_name]);
var cmd = this.cmd(); if(ronin[this.module_name][this.method_name]){
ronin[this.module_name][this.method_name](this.method_params,true);
ronin.module = null; }
this.hint_element.innerHTML = "";
if(ronin.modules[key]){
ronin.modules[key].passive(cmd);
ronin.module = ronin.modules[key];
ronin.cursor.set_mode(ronin.module);
this.update_hint(content);
} }
else{ else{
ronin.cursor.set_mode(ronin.brush); ronin.cursor.set_mode(ronin.brush);
} }
this.hint(content);
} }
this.cmd = function() this.cmd = function()

159
scripts/modules/vector.js
View File

@ -1,159 +0,0 @@
function Vector(rune)
{
Module.call(this,rune);
this.parameters = [Any];
this.variables = {"fill_color" : null,"stroke_width" : 5,"stroke_color" : "#ffffff", "line_cap" : "square"};
this.add_method(new Method("stroke",["Positions"]));
this.add_method(new Method("fill",["Positions"]));
this.coordinates = [];
this.last_pos = null;
this.paths = [];
this.stroke = function()
{
// TODO
console.warn("!!!!!")
}
this.fill = function()
{
}
// Module
this.passive = function(cmd)
{
if(!ronin.vector.layer){ ronin.vector.create_layer(); ronin.vector.layer.is_blinking = true; }
this.layer.clear();
this.layer.context().lineCap = cmd.setting("line_cap") ? cmd.setting("line_cap").value : "square";
this.layer.context().lineWidth = cmd.setting("stroke_width") ? cmd.setting("stroke_width").value : 10;
this.layer.context().strokeStyle = cmd.setting("stroke_color") ? cmd.setting("stroke_color").value : "#ffffff";
this.layer.context().fillStyle = cmd.setting("fill_color") ? cmd.setting("fill_color").value : "#ffffff";
if(cmd.setting("fill_color")){ronin.vector.layer.context().fill(new Path2D(cmd.content.join(" ")));}
ronin.vector.layer.context().stroke(new Path2D(cmd.content.join(" ")));
}
this.active = function(cmd)
{
this.paths.push(this.create_path());
this.coordinates = [];
if(this.layer){ this.layer.remove(this); }
ronin.surface.active_layer.context().lineCap = cmd.setting("line_cap") ? cmd.setting("line_cap").value : "square";
ronin.surface.active_layer.context().lineWidth = cmd.setting("stroke_width") ? cmd.setting("stroke_width").value : 10;
ronin.surface.active_layer.context().strokeStyle = cmd.setting("stroke_color") ? cmd.setting("stroke_color").value : "#ffffff";
ronin.surface.active_layer.context().fillStyle = cmd.setting("fill_color") ? cmd.setting("fill_color").value : "#ffffff";
if(cmd.setting("fill_color")){ronin.surface.active_layer.context().fill(new Path2D(cmd.content.join(" ")));}
ronin.surface.active_layer.context().stroke(new Path2D(cmd.content.join(" ")));
}
// Tools
this.create_path = function()
{
var command = "";
for (var i = 0; i < this.coordinates.length; i++) {
command += this.coordinates[i]+" ";
}
return command;
}
this.create_svg = function()
{
var s = "";
s += "<svg width='"+ronin.surface.settings["size"].width+"' height='"+ronin.surface.settings["size"].height+"' xmlns='http://www.w3.org/2000/svg' baseProfile='full' version='1.1' style='fill:none;stroke:red;stroke-width:2px;stroke-linecap:square;'>";
for (var i = 0; i < this.paths.length; i++) {
s += "<path d='"+this.paths[i]+"' />";
}
s += "</svg>";
console.log(s);
return s;
}
// Mouse
this.click = null;
this.mouse_mode = function()
{
if(keyboard.shift_held == true && keyboard.alt_held == true){
return "Vector(Origin)";
}
else if(keyboard.shift_held == true){
return "Vector(Counterclock Arc)";
}
else if(keyboard.alt_held == true){
return "Vector(Clockwise Arc)";
}
else{
return "Vector(Line)";
}
}
this.mouse_down = function(position)
{
this.click = true;
ronin.terminal.input_element.value = "+ "+this.create_path();
this.passive(ronin.terminal.cmd());
ronin.terminal.update_hint();
}
this.mouse_move = function(position)
{
if(!this.click){ return; }
ronin.terminal.input_element.value = "+ "+this.create_path();
ronin.terminal.input_element.value += "L"+position.render();
this.passive(ronin.terminal.cmd());
ronin.terminal.update_hint();
}
this.mouse_up = function(position)
{
this.click = null;
if(this.coordinates.length == 0){
this.coordinates.push("M"+position.render());
}
else{
var offset = this.last_pos ? position.offset(this.last_pos) : position;
if(keyboard.shift_held == true && keyboard.alt_held == true){
this.coordinates.push("M"+position.render());
}
else if(keyboard.shift_held == true){
this.coordinates.push("a"+offset.render()+" 0 0,1 "+offset.render());
}
else if(keyboard.alt_held == true){
this.coordinates.push("a"+offset.render()+" 0 0,0 "+offset.render());
}
else{
this.coordinates.push("l"+offset.render());
}
}
ronin.terminal.input_element.value = "+ "+this.create_path();
this.passive(ronin.terminal.cmd());
this.last_pos = position;
ronin.terminal.update_hint();
}
this.key_escape = function()
{
if(this.layer){ this.layer.remove(this); }
this.coordinates = [];
this.last_pos = null;
}
}

3
scripts/units/method.js
View File

@ -1,9 +1,10 @@
function Method(name,params) function Method(name,params,mouse_event)
{ {
Unit.call(this); Unit.call(this);
this.name = name; this.name = name;
this.params = params; this.params = params;
this.mouse_event = mouse_event;
this.example = ""; this.example = "";
this.render = function() this.render = function()