Saving RIN file
This commit is contained in:
parent
52a044b78e
commit
4040964505
@ -15,7 +15,6 @@
|
||||
<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/module.js"></script>
|
||||
<script type="text/javascript" src="scripts/modules/stroke.js"></script>
|
||||
<script type="text/javascript" src="scripts/modules/vector.js"></script>
|
||||
<script type="text/javascript" src="scripts/modules/overlay.js"></script>
|
||||
<script type="text/javascript" src="scripts/modules/brush.js"></script>
|
||||
@ -23,7 +22,6 @@
|
||||
<script type="text/javascript" src="scripts/modules/file.load.js"></script>
|
||||
<script type="text/javascript" src="scripts/modules/file.save.js"></script>
|
||||
<script type="text/javascript" src="scripts/modules/help.js"></script>
|
||||
<script type="text/javascript" src="scripts/modules/history.js"></script>
|
||||
<script type="text/javascript" src="scripts/modules/eraser.js"></script>
|
||||
<script type="text/javascript" src="scripts/modules/surface.js"></script>
|
||||
<script type="text/javascript" src="scripts/modules/surface.layer.js"></script>
|
||||
|
@ -19,3 +19,4 @@ canvas:hover { cursor: none;}
|
||||
#terminal logs { display: block;position: absolute;bottom:20px;width:100vw;color:white}
|
||||
#terminal logs log { display: block; font-size:10px; line-height:25px; padding:0px 5px; color:#666;}
|
||||
#terminal logs log .rune { color:white; }
|
||||
#terminal menu { display: inline-block;position: absolute;bottom: 0px;right: 0px;padding: 0px 5px;font-size: 10px;line-height: 20px;color:white }
|
@ -1,41 +0,0 @@
|
||||
function Hint(element)
|
||||
{
|
||||
Module.call(this);
|
||||
|
||||
this.element = element;
|
||||
|
||||
this.update = function()
|
||||
{
|
||||
var module = ronin.module;
|
||||
var cmd = commander.cmd();
|
||||
|
||||
if(module){
|
||||
this.element.innerHTML = this.message(module,cmd);
|
||||
this.element.style.display = "block";
|
||||
}
|
||||
else if(commander && commander.element_input.value != ""){
|
||||
this.element.innerHTML = commander.element_input.value;
|
||||
this.element.style.display = "block";
|
||||
}
|
||||
else{
|
||||
this.element.innerHTML = this.default();
|
||||
this.element.style.display = "block";
|
||||
}
|
||||
}
|
||||
|
||||
this.message = function(module,cmd)
|
||||
{
|
||||
return module.hint(cmd);
|
||||
}
|
||||
|
||||
this.default = function()
|
||||
{
|
||||
var s = "<span class='module'>Modules</span>";
|
||||
|
||||
for (var key in ronin.modules){
|
||||
s += "<span> <span class='value'>"+key+"</span> <span class='param'>"+ronin.modules[key].constructor.name+" ";
|
||||
}
|
||||
|
||||
return s;
|
||||
}
|
||||
}
|
@ -1,111 +0,0 @@
|
||||
function Commander(element,element_input)
|
||||
{
|
||||
this.element = element;
|
||||
this.element_input = element_input;
|
||||
this.hint = new Hint();
|
||||
this.storage = [];
|
||||
this.storage_index = 0;
|
||||
this.always_show = false;
|
||||
|
||||
this.queue = [];
|
||||
|
||||
this.query = function(input_str)
|
||||
{
|
||||
if(input_str.indexOf(";") > 0){
|
||||
this.queue = input_str.split(";");
|
||||
}
|
||||
else{
|
||||
this.queue = [];
|
||||
this.queue.push(input_str)
|
||||
}
|
||||
this.run();
|
||||
this.hide();
|
||||
}
|
||||
|
||||
this.run = function()
|
||||
{
|
||||
if(!commander.queue[0]){ console.log("Finished queue"); return; }
|
||||
|
||||
active(commander.queue[0].trim());
|
||||
commander.queue.shift();
|
||||
|
||||
setTimeout(function(){ commander.run(); }, 100);
|
||||
}
|
||||
|
||||
function active(content)
|
||||
{
|
||||
console.info(content);
|
||||
var key = content[0];
|
||||
var cmd = new Command(content.substring(1).trim().split(" "));
|
||||
|
||||
if(ronin.modules[key]){
|
||||
ronin.modules[key].active(cmd);
|
||||
}
|
||||
|
||||
ronin.history.add(content);
|
||||
}
|
||||
|
||||
this.passive = function(content)
|
||||
{
|
||||
var key = content[0];
|
||||
var cmd = new Command(content.substring(1).trim().split(" "));
|
||||
|
||||
ronin.module = null;
|
||||
|
||||
if(ronin.modules[key]){
|
||||
ronin.modules[key].passive(cmd);
|
||||
ronin.module = ronin.modules[key];
|
||||
ronin.cursor.set_mode(ronin.module);
|
||||
}
|
||||
else{
|
||||
ronin.cursor.set_mode(ronin.brush);
|
||||
}
|
||||
this.hint.update();
|
||||
}
|
||||
|
||||
this.cmd = function()
|
||||
{
|
||||
var content = this.element_input.value.trim();
|
||||
var key = content[0];
|
||||
var cmd = new Command(content.substring(1).trim().split(" "));
|
||||
return cmd;
|
||||
}
|
||||
|
||||
//
|
||||
|
||||
this.show = function()
|
||||
{
|
||||
this.element.setAttribute('class','visible');
|
||||
this.element_input.focus();
|
||||
this.element_input.value = "";
|
||||
}
|
||||
|
||||
this.always = function() {
|
||||
this.always_show = !this.always_show;
|
||||
}
|
||||
|
||||
this.hide = function()
|
||||
{
|
||||
if (!this.always_show) {
|
||||
this.element.setAttribute('class','hidden');
|
||||
}
|
||||
this.element_input.value = "";
|
||||
}
|
||||
|
||||
this.clear = function()
|
||||
{
|
||||
this.element_input.value = "";
|
||||
}
|
||||
|
||||
this.next_cmd = function()
|
||||
{
|
||||
this.storage_index += this.storage_index < this.storage.length ? 1 : 0;
|
||||
this.element_input.value = this.storage[this.storage_index] ? this.storage[this.storage_index] : "";
|
||||
}
|
||||
|
||||
this.prev_cmd = function()
|
||||
{
|
||||
this.storage_index -= this.storage_index < 1 ? 0 : 1;
|
||||
this.element_input.value = this.storage[this.storage_index];
|
||||
}
|
||||
}
|
@ -37,8 +37,9 @@ ronin.terminal.query("@ layer=Main");
|
||||
ronin.terminal.query("- 0,0");
|
||||
ronin.terminal.query("- 1,1");
|
||||
ronin.terminal.query("- 2,2");
|
||||
ronin.terminal.query("- #ff00ff");
|
||||
ronin.terminal.query("- #ff0000");
|
||||
ronin.terminal.query("~ Ready.");
|
||||
|
||||
ronin.terminal.input_element.focus();
|
||||
ronin.terminal.update_hint();
|
||||
ronin.surface.update_widget();
|
@ -38,8 +38,8 @@ function Keyboard()
|
||||
case 27: this.key_escape(); break;
|
||||
case 219: ronin.brush.size_up(); break;
|
||||
case 221: ronin.brush.size_down(); break;
|
||||
case 38: ronin.surface.layer_up(); break;
|
||||
case 40: ronin.surface.layer_down(); break;
|
||||
case 38: this.key_arrow_up(); break;
|
||||
case 40: this.key_arrow_down(); break;
|
||||
case 8: this.key_delete(); break;
|
||||
}
|
||||
|
||||
@ -64,18 +64,22 @@ function Keyboard()
|
||||
|
||||
this.key_arrow_up = function()
|
||||
{
|
||||
if(ronin.module){ ronin.module.key_arrow_up(); }
|
||||
}
|
||||
|
||||
this.key_arrow_down = function()
|
||||
{
|
||||
if(ronin.module){ ronin.module.key_arrow_down(); }
|
||||
}
|
||||
|
||||
this.key_arrow_left = function()
|
||||
{
|
||||
if(ronin.module){ ronin.module.key_arrow_left(); }
|
||||
}
|
||||
|
||||
this.key_arrow_right = function()
|
||||
{
|
||||
if(ronin.module){ ronin.module.key_arrow_right(); }
|
||||
}
|
||||
|
||||
this.key_colon = function()
|
||||
|
@ -6,12 +6,10 @@ function Ronin()
|
||||
this.surface = new Surface("@");
|
||||
this.fileload = new FileLoad("/");
|
||||
this.filesave = new FileSave("$");
|
||||
this.history = new History("^");
|
||||
this.overlay = new Overlay("|");
|
||||
this.brush = new Brush("-");
|
||||
this.eye = new Eye("*");
|
||||
this.render = new Render("%");
|
||||
this.stroke = new Stroke("_");
|
||||
this.vector = new Vector("+");
|
||||
this.help = new Help("?");
|
||||
this.typo = new Typographe("&");
|
||||
@ -21,13 +19,11 @@ function Ronin()
|
||||
this.modules[this.surface.rune] = this.surface;
|
||||
this.modules[this.fileload.rune] = this.fileload;
|
||||
this.modules[this.filesave.rune] = this.filesave;
|
||||
this.modules[this.history.rune] = this.history;
|
||||
this.modules[this.overlay.rune] = this.overlay;
|
||||
this.modules[this.render.rune] = this.render;
|
||||
this.modules[this.brush.rune] = this.brush;
|
||||
this.modules[this.eye.rune] = this.eye;
|
||||
this.modules[this.typo.rune] = this.typo;
|
||||
this.modules[this.stroke.rune] = this.stroke;
|
||||
this.modules[this.vector.rune] = this.vector;
|
||||
this.modules[this.help.rune] = this.help;
|
||||
this.modules[this.terminal.rune] = this.terminal;
|
||||
|
@ -17,29 +17,48 @@ function Eye(rune)
|
||||
return "Eye";
|
||||
}
|
||||
|
||||
this.color_picker = function(position)
|
||||
// TODO: If a rect is given, return the average color
|
||||
this.color_picker = function(position,rect = null)
|
||||
{
|
||||
var imgData = ronin.surface.context().getImageData(position.x, position.y, 1, 1).data;
|
||||
var imgData = ronin.surface.context().getImageData(position.x*2, position.y*2, 1, 1).data;
|
||||
var c = new Color();
|
||||
commander.show();
|
||||
commander.element_input.focus();
|
||||
commander.element_input.value = "> "+(c.rgb_to_hex(imgData));
|
||||
ronin.terminal.input_element.value = "* "+(c.rgb_to_hex(imgData));
|
||||
ronin.terminal.update_hint();
|
||||
}
|
||||
|
||||
// Cursor
|
||||
|
||||
this.live_draw_from = null;
|
||||
|
||||
this.mouse_down = function(position)
|
||||
{
|
||||
this.click = true;
|
||||
this.live_draw_from = position;
|
||||
ronin.overlay.draw(position);
|
||||
this.color_picker(position);
|
||||
}
|
||||
|
||||
this.mouse_move = function(position)
|
||||
{
|
||||
this.color_picker(position);
|
||||
if(!this.click){ return; }
|
||||
|
||||
var rect = new Rect();
|
||||
rect.width = position.x - this.live_draw_from.x;
|
||||
rect.height = position.y - this.live_draw_from.y;
|
||||
|
||||
ronin.overlay.draw(this.live_draw_from,rect);
|
||||
|
||||
this.color_picker(position,rect);
|
||||
}
|
||||
|
||||
this.mouse_up = function(position)
|
||||
{
|
||||
this.color_picker(position);
|
||||
this.click = null;
|
||||
|
||||
var rect = new Rect();
|
||||
rect.width = position.x - this.live_draw_from.x;
|
||||
rect.height = position.y - this.live_draw_from.y;
|
||||
|
||||
this.color_picker(position,rect);
|
||||
}
|
||||
}
|
@ -3,7 +3,7 @@ function FileSave(rune)
|
||||
Module.call(this,rune);
|
||||
|
||||
this.parameters = [];
|
||||
this.variables = {"format" : "[png/jpg/svg]"};
|
||||
this.variables = {"format" : "[png/jpg/svg/rin]"};
|
||||
|
||||
this.docs = "Creates a new window with a image of the resulting canvas in the specified format.";
|
||||
|
||||
@ -21,6 +21,12 @@ function FileSave(rune)
|
||||
else if(cmd.variable("format") && cmd.variable("format").value == "jpg"){
|
||||
w.document.write("<title>Untitled</title><body><img src='"+this.merge().element.toDataURL('image/jpeg')+"' width='"+ronin.surface.size.width+"px' height='"+ronin.surface.size.height+"px'/></body>");
|
||||
}
|
||||
else if(cmd.variable("format") && cmd.variable("format").value == "rin"){
|
||||
var w = window.open('about:blank','source');
|
||||
var html = "";
|
||||
for (i = 0; i < ronin.terminal.history.length; i++) { html += ronin.terminal.history[i]+";<br />"; }
|
||||
w.document.write("<title>Source</title><pre>"+html+"</pre>");
|
||||
}
|
||||
else{
|
||||
w.document.write("<title>Untitled</title><body><img src='"+this.merge().element.toDataURL('image/png')+"' width='"+ronin.surface.size.width+"px' height='"+ronin.surface.size.height+"px'/></body>");
|
||||
}
|
||||
|
@ -1,30 +0,0 @@
|
||||
function History(rune)
|
||||
{
|
||||
Module.call(this,rune);
|
||||
|
||||
this.cmds = [];
|
||||
|
||||
this.active = function(cmd)
|
||||
{
|
||||
var w = window.open('about:blank','source');
|
||||
var html = "";
|
||||
|
||||
for (i = 0; i < this.cmds.length; i++) {
|
||||
if(this.cmds[i][0] == this.rune){ continue; }
|
||||
html += this.cmds[i]+";<br />";
|
||||
}
|
||||
w.document.write("<title>Source</title><style>body { font-family:courier}</style>"+html+"");
|
||||
}
|
||||
|
||||
this.add = function(content)
|
||||
{
|
||||
this.cmds.push(content);
|
||||
}
|
||||
|
||||
this.widget = function()
|
||||
{
|
||||
if(this.cmds.length === 0){ return "";}
|
||||
|
||||
return "^ "+this.cmds.length+" ";
|
||||
}
|
||||
}
|
@ -102,4 +102,22 @@ function Module(rune)
|
||||
this.key_delete = function()
|
||||
{
|
||||
}
|
||||
|
||||
this.key_arrow_up = function()
|
||||
{
|
||||
ronin.surface.layer_up();
|
||||
}
|
||||
|
||||
this.key_arrow_down = function()
|
||||
{
|
||||
ronin.surface.layer_down();
|
||||
}
|
||||
|
||||
this.key_arrow_left = function()
|
||||
{
|
||||
}
|
||||
|
||||
this.key_arrow_right = function()
|
||||
{
|
||||
}
|
||||
}
|
@ -62,10 +62,14 @@ function Overlay(rune)
|
||||
{
|
||||
this.context().beginPath();
|
||||
|
||||
this.context().moveTo(position.x,position.y);
|
||||
this.context().lineTo(position.x + 10,position.y);
|
||||
this.context().lineTo(position.x,position.y + 10);
|
||||
this.context().lineTo(position.x,position.y);
|
||||
this.context().moveTo(position.x + 2,position.y);
|
||||
this.context().lineTo(position.x + 5,position.y);
|
||||
this.context().moveTo(position.x,position.y + 2);
|
||||
this.context().lineTo(position.x,position.y + 5);
|
||||
this.context().moveTo(position.x - 2,position.y);
|
||||
this.context().lineTo(position.x - 5,position.y);
|
||||
this.context().moveTo(position.x,position.y - 2);
|
||||
this.context().lineTo(position.x,position.y - 5);
|
||||
|
||||
this.context().lineCap="round";
|
||||
this.context().lineWidth = 1;
|
||||
|
@ -1,62 +0,0 @@
|
||||
function Stroke(rune)
|
||||
{
|
||||
Module.call(this,rune);
|
||||
|
||||
this.parameters = [Any];
|
||||
|
||||
// Create a stroke
|
||||
|
||||
this.positions = null;
|
||||
|
||||
this.new_stroke = function()
|
||||
{
|
||||
this.positions = [];
|
||||
}
|
||||
|
||||
this.append_stroke = function(p)
|
||||
{
|
||||
this.positions.push(p);
|
||||
}
|
||||
|
||||
this.save_stroke = function(mode)
|
||||
{
|
||||
// TODO
|
||||
// s = "_ module="+mode+" ";
|
||||
// for (i = 0; i < this.positions.length; i++) {
|
||||
// s += this.positions[i].render()+" ";
|
||||
// }
|
||||
// if(this.positions.length > 0){ ronin.history.add(s); }
|
||||
// this.positions = null;
|
||||
}
|
||||
|
||||
// Module
|
||||
|
||||
this.passive = function(cmd)
|
||||
{
|
||||
}
|
||||
|
||||
this.active = function(cmd)
|
||||
{
|
||||
var prev = null
|
||||
for (i = 1; i < cmd.content.length; i++) {
|
||||
var p = new Position(cmd.content[i]);
|
||||
if(prev){
|
||||
this.draw(prev,p);
|
||||
}
|
||||
prev = p;
|
||||
}
|
||||
}
|
||||
|
||||
this.draw = function(pos1,pos2)
|
||||
{
|
||||
ronin.surface.context().beginPath();
|
||||
ronin.surface.context().moveTo(pos1.x,pos1.y);
|
||||
ronin.surface.context().lineTo(pos2.x,pos2.y);
|
||||
ronin.surface.context().lineCap="round";
|
||||
ronin.surface.context().lineWidth = 10;
|
||||
ronin.surface.context().strokeStyle = ronin.brush.color.rgba();
|
||||
ronin.surface.context().stroke();
|
||||
ronin.surface.context().closePath();
|
||||
}
|
||||
|
||||
}
|
@ -6,6 +6,9 @@ function Terminal(rune)
|
||||
this.input_element = document.createElement("input");
|
||||
this.hint_element = document.createElement("hint");
|
||||
this.logs_element = document.createElement("logs");
|
||||
this.menu_element = document.createElement("menu");
|
||||
|
||||
this.history = [];
|
||||
|
||||
// Module
|
||||
this.install = function(cmd)
|
||||
@ -13,6 +16,7 @@ function Terminal(rune)
|
||||
this.element.appendChild(this.input_element);
|
||||
this.element.appendChild(this.hint_element);
|
||||
this.element.appendChild(this.logs_element);
|
||||
this.element.appendChild(this.menu_element);
|
||||
|
||||
this.hint_element.innerHTML = "_";
|
||||
|
||||
@ -26,7 +30,7 @@ function Terminal(rune)
|
||||
this.passive = function(content)
|
||||
{
|
||||
var key = content[0];
|
||||
var cmd = new Command(content.substring(1).trim().split(" "));
|
||||
var cmd = this.cmd();
|
||||
|
||||
ronin.module = null;
|
||||
this.hint_element.innerHTML = "";
|
||||
@ -85,7 +89,9 @@ function Terminal(rune)
|
||||
|
||||
if(ronin.modules[key]){
|
||||
ronin.modules[key].active(cmd);
|
||||
ronin.history.add(content);
|
||||
ronin.terminal.history.push(content);
|
||||
ronin.terminal.history_index = ronin.terminal.history.length-1;
|
||||
ronin.terminal.update_menu();
|
||||
}
|
||||
else{
|
||||
ronin.terminal.log(new Log(ronin.terminal,"Unknown module: "+key));
|
||||
@ -134,7 +140,10 @@ function Terminal(rune)
|
||||
}
|
||||
}
|
||||
else{
|
||||
var h = padding+" ";
|
||||
var h = "";
|
||||
for(module in ronin.modules){
|
||||
h += module+" ";
|
||||
}
|
||||
}
|
||||
|
||||
this.hint_element.innerHTML = h;
|
||||
@ -142,11 +151,33 @@ function Terminal(rune)
|
||||
ronin.terminal.input_element.setAttribute("style","color:"+ronin.brush.color.hex);
|
||||
}
|
||||
|
||||
this.update_menu = function()
|
||||
{
|
||||
this.menu_element.innerHTML = ronin.terminal.history.length;
|
||||
}
|
||||
|
||||
this.key_escape = function()
|
||||
{
|
||||
this.input_element.value = "";
|
||||
}
|
||||
|
||||
this.key_arrow_up = function()
|
||||
{
|
||||
this.history_index -= 1;
|
||||
|
||||
if(this.history_index < 0){ this.history_index = 0; }
|
||||
|
||||
ronin.terminal.input_element.value = "> "+ronin.terminal.history[this.history_index];
|
||||
}
|
||||
|
||||
this.key_arrow_down = function()
|
||||
{
|
||||
this.history_index += 1;
|
||||
|
||||
if(this.history_index >= this.history.length){ this.history_index = this.history.length-1; }
|
||||
|
||||
ronin.terminal.input_element.value = "> "+ronin.terminal.history[this.history_index];
|
||||
}
|
||||
}
|
||||
|
||||
// Log
|
||||
|
Loading…
x
Reference in New Issue
Block a user