From e7307f7bdd0c94ed6834ea1701113ad97415afad Mon Sep 17 00:00:00 2001 From: Devine Lu Linvega Date: Fri, 17 Mar 2017 15:29:47 -0700 Subject: [PATCH] Improved terminal feedback --- links/main.css | 1 + scripts/core/init.js | 3 ++- scripts/modules/brush.js | 17 ++++------------- scripts/modules/cursor.js | 14 +++++++++----- scripts/modules/module.js | 2 ++ scripts/modules/surface.js | 1 + scripts/modules/terminal.js | 18 +++++++++++++++--- scripts/modules/typographe.js | 19 +++++++++---------- scripts/units/color.js | 10 ++++++++++ 9 files changed, 53 insertions(+), 32 deletions(-) diff --git a/links/main.css b/links/main.css index facf3df..46d4f2f 100644 --- a/links/main.css +++ b/links/main.css @@ -7,6 +7,7 @@ body { margin:0px; padding:0px; overflow:hidden; font-family:"input_mono_medium" #surface widget { position: absolute; top:0px; left:0px; line-height: 20px; font-size:10px; z-index:9000; color:white; width:100%; height:100%; } #surface widget span { display:inline-block; padding:2px 10px; } #surface widget .cursor { position:absolute; bottom:0px; right:0px; } +#surface.bright widget { color:#000; } #overlay { position:absolute; z-index:1000;} #surface { cursor:none;} diff --git a/scripts/core/init.js b/scripts/core/init.js index 5c45028..e6f9cbc 100644 --- a/scripts/core/init.js +++ b/scripts/core/init.js @@ -34,10 +34,11 @@ starting_canvas.height = parseInt(starting_canvas.height/40) * 40; ronin.terminal.query("~ "+ronin.timestamp()); ronin.terminal.query("@ "+starting_canvas.render()); ronin.terminal.query("@ layer=Main"); +ronin.terminal.query("@ #ff0000"); ronin.terminal.query("- 0,0"); ronin.terminal.query("- 1,1"); ronin.terminal.query("- 2,2"); -ronin.terminal.query("- #ff0000"); +ronin.terminal.query("- #000000"); ronin.terminal.query("~ Ready."); ronin.terminal.input_element.focus(); diff --git a/scripts/modules/brush.js b/scripts/modules/brush.js index f1a9aa7..4621a0e 100644 --- a/scripts/modules/brush.js +++ b/scripts/modules/brush.js @@ -95,7 +95,7 @@ function Brush(rune) this.position_prev = position; } - // Cursor + // Mouse this.mouse_mode = function() { @@ -106,14 +106,9 @@ function Brush(rune) return "● Brush "+ronin.brush.pointers.length+"x "+this.size; } } - - this.is_drawing = false; this.mouse_down = function(position) - { - this.is_drawing = true; - this.position_prev = null; - + { if(keyboard.shift_held == true){ this.erase(); } @@ -122,12 +117,11 @@ function Brush(rune) ronin.brush.pointers[i].start(); } } - } this.mouse_move = function(position,rect) { - if(this.is_drawing === false){ return; } + if(!this.mouse_held){ return; } if(keyboard.shift_held == true){ this.erase(); @@ -140,10 +134,7 @@ function Brush(rune) } this.mouse_up = function(position,rect) - { - this.is_drawing = false; - this.position_prev = null; - + { for (i = 0; i < ronin.brush.pointers.length; i++) { ronin.brush.pointers[i].stop(); } diff --git a/scripts/modules/cursor.js b/scripts/modules/cursor.js index 7adebb2..ddc5970 100644 --- a/scripts/modules/cursor.js +++ b/scripts/modules/cursor.js @@ -38,7 +38,7 @@ function Cursor(rune) if(cmd.rect()){ this.magnetism = cmd.rect(); - this.draw(cmd.rect(),this.grid); + this.draw(this.magnetism,this.grid); } } @@ -74,8 +74,6 @@ function Cursor(rune) this.pointer_last = this.pointer_last ? this.pointer_last : position; - this.layer.clear(); - this.layer.context().beginPath(); this.layer.context().moveTo(this.pointer_last.x,this.pointer_last.y); this.layer.context().lineTo(position.x,position.y); @@ -148,7 +146,7 @@ function Cursor(rune) this.mouse_down = function(position) { - this.layer.clear(); + if(this.layer){ this.layer.clear(); } if(this.magnetism){ position = this.magnetic_position(position); @@ -158,13 +156,18 @@ function Cursor(rune) if(this.mode.constructor.name != Cursor.name){ this.mode.mouse_from = position; + this.mode.mouse_held = true; this.mode.mouse_down(position); } } this.mouse_move = function(position) { + if(!this.layer){ this.create_layer(); } + + this.layer.clear(); this.draw_pointer(position); + if(this.magnetism){ this.draw(this.magnetism,this.grid); } if(this.mode.mouse_from == null){ return; } @@ -180,8 +183,8 @@ function Cursor(rune) if(this.mode.constructor.name != Cursor.name){ this.mode.mouse_move(position,rect); + this.mode.mouse_prev = position; } - } this.mouse_up = function(position) @@ -198,6 +201,7 @@ function Cursor(rune) if(this.mode.constructor.name != Cursor.name){ this.mode.mouse_up(position,rect); + this.mode.mouse_held = false; } ronin.terminal.input_element.focus(); diff --git a/scripts/modules/module.js b/scripts/modules/module.js index d0cff0b..301b4fa 100644 --- a/scripts/modules/module.js +++ b/scripts/modules/module.js @@ -81,6 +81,8 @@ function Module(rune) } this.mouse_from = null; + this.mouse_held = null; + this.mouse_prev = null; this.mouse_down = function(position) { diff --git a/scripts/modules/surface.js b/scripts/modules/surface.js index 512ccdd..ba7a886 100644 --- a/scripts/modules/surface.js +++ b/scripts/modules/surface.js @@ -41,6 +41,7 @@ function Surface(rune) this.context().fill(); ronin.terminal.log(new Log(this,"Filled layer: "+cmd.color().hex)); this.element.style.border = "1px solid "+cmd.color().hex; + this.element.setAttribute("class",cmd.color().style()); } if(cmd.bang() && Object.keys(ronin.surface.layers).length > 1){ diff --git a/scripts/modules/terminal.js b/scripts/modules/terminal.js index 681ba3f..d07d4a0 100644 --- a/scripts/modules/terminal.js +++ b/scripts/modules/terminal.js @@ -122,20 +122,23 @@ function Terminal(rune) this.update_hint = function(content = this.input_element.value) { - ronin.terminal.input_element.setAttribute("style","color:"+ronin.brush.color.hex); + // ronin.terminal.input_element.setAttribute("style","color:"+ronin.brush.color.hex); if(content.indexOf(";") > -1){ - this.hint_element.innerHTML = " "+content.split(";").length+" commands"; + this.hint_element.innerHTML = this.pad(content)+" "+content.split(";").length+" commands"; } else if(ronin.module){ this.hint_element.innerHTML = ronin.module.hint(content); } - else{ + else if(content == ""){ this.hint_element.innerHTML = ""; for(module in ronin.modules){ this.hint_element.innerHTML += ""+module+" "+ronin.modules[module].constructor.name+" "; } } + else{ + this.hint_element.innerHTML = this.pad(content)+" Unknown Command." + } } this.update_menu = function() @@ -165,6 +168,15 @@ function Terminal(rune) ronin.terminal.input_element.value = "> "+ronin.terminal.history[this.history_index]; } + + this.pad = function(input) + { + var s = ""; + for (i = 0; i < input.length+1; i++){ + s += "_"; + } + return ""+s+""; + } } // Log diff --git a/scripts/modules/typographe.js b/scripts/modules/typographe.js index fd86948..008cfcf 100644 --- a/scripts/modules/typographe.js +++ b/scripts/modules/typographe.js @@ -41,8 +41,6 @@ function Typographe(rune) // Mouse - this.click = null; - this.mouse_mode = function() { return "Typographe"; @@ -50,24 +48,25 @@ function Typographe(rune) this.mouse_down = function(position) { - this.click = true; ronin.overlay.draw(position); - commander.element_input.value = "& "+position.render()+" "; - commander.hint.update(); + ronin.terminal.input_element.value = "& "+position.render()+" "; + ronin.terminal.update_hint(); } - this.mouse_move = function(position) + this.mouse_move = function(position,rect) { - if(!this.click){ return; } + if(!this.mouse_held){ return; } + ronin.overlay.draw(position); - commander.element_input.value = "& "+position.render(); + ronin.terminal.input_element.value = "& "+position.render()+" "; + ronin.terminal.update_hint(); } this.mouse_up = function(position) { - this.click = null; ronin.overlay.draw(position); - commander.element_input.value = "& "+position.render(); + ronin.terminal.input_element.value = "& "+position.render()+" "; + ronin.terminal.update_hint(); } this.key_escape = function() diff --git a/scripts/units/color.js b/scripts/units/color.js index 9cf1d67..848f693 100644 --- a/scripts/units/color.js +++ b/scripts/units/color.js @@ -29,4 +29,14 @@ function Color(hex = '#000000') { return "#"+("0" + parseInt(rgb[0],10).toString(16)).slice(-2)+("0" + parseInt(rgb[1],10).toString(16)).slice(-2)+("0" + parseInt(rgb[2],10).toString(16)).slice(-2); } + + this.brightness = function() + { + return this.rgb() ? (this.rgb().r + this.rgb().g + this.rgb().b)/3 : 0; + } + + this.style = function() + { + return this.brightness() > 150 ? "bright" : "dark"; + } } \ No newline at end of file