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

Improved commander hints.

Browse Source
This commit is contained in:
Devine Lu Linvega 2016-11-16 15:51:30 -08:00
parent e85193041d
commit 0cf12bc718
24 changed files with 184 additions and 110 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
README.md
View File

@ -83,6 +83,8 @@ $ ! ; Clear temporary storage
0..5 ; random: 0.0-5.0
45' ; degree: 45/365
rate:10 ; variable: rate = 10
"foo" ; string: foo
{40w} ; dynamic: 120px, 40% canvas width
```
#Presets

38
index.html
View File

@ -1,26 +1,32 @@
<html>
<head>
<link rel="stylesheet" type="text/css" href="links/main.css"/>
<script type="text/javascript" src="scripts/unit.js"></script>
<script type="text/javascript" src="scripts/units/rect.js"></script>
<script type="text/javascript" src="scripts/units/color.js"></script>
<script type="text/javascript" src="scripts/units/position.js"></script>
<script type="text/javascript" src="scripts/units/bang.js"></script>
<script type="text/javascript" src="scripts/units/angle.js"></script>
<script type="text/javascript" src="scripts/units/value.js"></script>
<script type="text/javascript" src="scripts/units/filepath.js"></script>
<script type="text/javascript" src="scripts/units/any.js"></script>
<script type="text/javascript" src="scripts/unit.rect.js"></script>
<script type="text/javascript" src="scripts/unit.color.js"></script>
<script type="text/javascript" src="scripts/unit.position.js"></script>
<script type="text/javascript" src="scripts/unit.command.js"></script>
<script type="text/javascript" src="scripts/ronin.module.js"></script>
<script type="text/javascript" src="scripts/ronin.canvas.js"></script>
<script type="text/javascript" src="scripts/ronin.filter.js"></script>
<script type="text/javascript" src="scripts/ronin.stroke.js"></script>
<script type="text/javascript" src="scripts/ronin.vector.js"></script>
<script type="text/javascript" src="scripts/ronin.overlay.js"></script>
<script type="text/javascript" src="scripts/ronin.brush.js"></script>
<script type="text/javascript" src="scripts/ronin.brush.pointer.js"></script>
<script type="text/javascript" src="scripts/ronin.file.js"></script>
<script type="text/javascript" src="scripts/ronin.hint.js"></script>
<script type="text/javascript" src="scripts/module.js"></script>
<script type="text/javascript" src="scripts/modules/canvas.js"></script>
<script type="text/javascript" src="scripts/modules/filter.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>
<script type="text/javascript" src="scripts/modules/brush.pointer.js"></script>
<script type="text/javascript" src="scripts/modules/file.js"></script>
<script type="text/javascript" src="scripts/modules/hint.js"></script>
<script type="text/javascript" src="scripts/keyboard.js"></script>
<script type="text/javascript" src="scripts/command.js"></script>
<script type="text/javascript" src="scripts/commander.js"></script>
<script type="text/javascript" src="scripts/ronin.js"></script>
<link rel="stylesheet" type="text/css" href="links/main.css"/>
</head>
<body>
<div id='ronin'>

13
links/main.css
View File

@ -5,9 +5,16 @@ canvas:hover { cursor: crosshair;}
#overlay { position:fixed; z-index:1000;}
#commander { display:none; z-index: 2000; }
#commander { display:none; z-index: 2000; position:fixed; }
#commander.visible { display:block; }
#commander.hidden { display:none; }
#commander input { background:black; padding:15px; position:fixed; bottom:0; color:white; font-size:14px; left:0; border:0; width:calc(100vw); font-family:courier; cursor:pointer; display:block;}
#commander input { background:black; padding:5px 15px; position:fixed; bottom:0; color:white; font-size:14px; left:0; border:0; width:calc(100vw); font-family:courier; cursor:pointer; display:block;}
#commander_hint { background: black;position: absolute;bottom: 47px;padding: 15px 15px 0 15px;line-height: 17px;font-family: courier;font-size: 14px;width: 100vw;color: #999;}
#commander_hint { background: black;position: fixed;bottom: 27px;padding: 5px 15px 0 15px;line-height: 17px;font-family: courier;font-size: 14px;width: 100vw;color: #999;}
#commander_hint .module { color:#ffffff; display:inline-block; margin-right:10px;}
#commander_hint .param { font-style: italic;}
#commander_hint .param:after { content:", "; }
#commander_hint .param:last-child:after { content:"";}
#commander_hint .value { color:#ff0000;}
#commander_hint .value:after { content:", "; color:#999; }
#commander_hint .value:last-child:after { content:"";}

22
scripts/unit.command.js → scripts/command.js
View File

@ -2,6 +2,12 @@ function Command(content)
{
this.content = content;
this.any = function()
{
if(this.content.join() === ""){ return null; }
return new Any(this.content);
}
this.rect = function()
{
for (i = 0; i < this.content.length; i++) {
@ -26,10 +32,10 @@ function Command(content)
return null;
}
this.path = function()
this.filepath = function()
{
for (i = 0; i < this.content.length; i++) {
if(this.content[i].indexOf("/") >= 0){ return this.content[i]; }
if(this.content[i].indexOf("/") >= 0){ return new Filepath(this.content[i]); }
}
return null;
}
@ -38,15 +44,15 @@ function Command(content)
{
for (i = 0; i < this.content.length; i++) {
var test = /[^$\-\d]/.test(this.content[i]);
if(!test){ return parseFloat(this.content[i]); }
if(!test && this.content[i] !== ""){ return new Value(this.content[i]); }
}
return null;
}
this.random = function()
this.range = function()
{
for (i = 0; i < this.content.length; i++) {
if(this.content[i].indexOf("..") >= 0){ (Math.random() * this.content[i].split("..")[1]) + this.content[i].split("..")[0]; }
if(this.content[i].indexOf("..") >= 0){ return new Range(this.content[i]); }
}
return null;
}
@ -54,7 +60,7 @@ function Command(content)
this.bang = function()
{
for (i = 0; i < this.content.length; i++) {
if(this.content[i].indexOf("!") >= 0){ return true; }
if(this.content[i].indexOf("!") >= 0){ return new Bang(); }
}
return null;
}
@ -62,7 +68,7 @@ function Command(content)
this.angle = function()
{
for (i = 0; i < this.content.length; i++) {
if(this.content[i].indexOf("'") >= 0){ return parseFloat(this.content[i].replace('\'','')); }
if(this.content[i].indexOf("'") >= 0){ return new Angle(this.content[i]); }
}
return null;
}
@ -70,7 +76,7 @@ function Command(content)
this.variable = function(name)
{
for (i = 0; i < this.content.length; i++) {
if(this.content[i].indexOf(name+":") >= 0){ return this.content[i].split(":")[1]; }
if(this.content[i].indexOf(name+":") >= 0){ return Variable(this.content[i]); }
}
return null;
}

2
scripts/ronin.module.js → scripts/module.js
View File

@ -1,5 +1,7 @@
function Module()
{
this.parameters = [];
this.active = function(cmd)
{
console.log("Nothing to do.");

16
scripts/ronin.brush.js → scripts/modules/brush.js
View File

@ -2,6 +2,7 @@ function Brush()
{
Module.call(this);
this.parameters = [Position,Rect,Angle,Color,Value,Bang];
this.pointers = [new Pointer(new Position())];
this.position = new Position();
@ -38,7 +39,7 @@ function Brush()
this.color = cmd.color();
}
if(cmd.value()){
this.size = cmd.value();
this.size = cmd.value().float;
}
}
@ -55,19 +56,6 @@ function Brush()
}
}
this.hint = function(cmd)
{
if(cmd.bang()){ return "Brush: Erase all pointers"; }
var hint_value = (cmd.value() ? "Size "+cmd.value()+" " : "");
var hint_position = (cmd.position() ? "Position "+cmd.position().x+","+cmd.position().y+" " : "");
var hint_color = (cmd.color() ? "Color "+cmd.color().hex+" " : "");
var hint_rect = (cmd.rect() ? "Mirror "+cmd.rect().width+"/"+cmd.rect().height+" " : "");
var hint_random = (cmd.random() ? "Random 0.."+cmd.random()+" " : "");
return "Brush: "+hint_value+hint_position+hint_color+hint_rect+hint_random;
}
this.add_pointer = function(pointer)
{
this.pointers.push(pointer);

2
scripts/ronin.brush.pointer.js → scripts/modules/brush.pointer.js
View File

@ -51,7 +51,7 @@ function Pointer(offset = new Position(), color = new Color('000000'))
this.position = function()
{
if(this.angle){
var angle_radian = this.angle * Math.PI / 180;
var angle_radian = this.angle.degrees * Math.PI / 180;
var deltaX = ronin.brush.position.x - this.offset.x;
var deltaY = ronin.brush.position.y - this.offset.y;
var t = Math.atan2(deltaY, deltaX) + angle_radian;

11
scripts/ronin.canvas.js → scripts/modules/canvas.js
View File

@ -2,6 +2,7 @@ function Canvas(element)
{
Module.call(this);
this.parameters = [Rect,Color,Bang];
this.element = element;
this.active = function(cmd)
@ -28,16 +29,6 @@ function Canvas(element)
}
}
this.hint = function(cmd)
{
if(cmd.bang()){ return "Canvas: Clear"; }
var hint_rect = (cmd.rect() ? "Resize to "+cmd.rect().width+"px by "+cmd.rect().height+"px " : "");
var hint_color = (cmd.color() ? "Fill with color "+cmd.color().hex+" " : "");
return "Canvas: "+hint_rect+hint_color;
}
//
this.resize = function(rect)

20
scripts/ronin.file.js → scripts/modules/file.js
View File

@ -2,6 +2,7 @@ function File()
{
Module.call(this);
this.parameters = [Filepath,Position,Rect,Bang];
this.storage = [];
this.active = function(cmd)
@ -10,12 +11,12 @@ function File()
ronin.overlay.clear();
if(!cmd.path() && !cmd.value()){ return; }
if(!cmd.filepath() && !cmd.value()){ return; }
var position = cmd.position() ? cmd.position() : new Position();
base_image = new Image();
base_image.src = cmd.value() && this.storage[cmd.value()] ? this.storage[cmd.value()] : cmd.path();
base_image.src = cmd.value() && this.storage[cmd.value().int] ? this.storage[cmd.value().int] : cmd.filepath().path;
base_image.src += '?' + new Date().getTime();
base_image.crossOrigin = "Anonymous";
@ -37,7 +38,7 @@ function File()
this.passive = function(cmd)
{
if(!cmd.path() && !cmd.value()){ return; }
if(!cmd.filepath() && !cmd.value()){ return; }
var position = cmd.position() ? cmd.position() : new Position();
@ -49,19 +50,10 @@ function File()
}
}
this.hint = function(cmd)
{
var hint_path = (cmd.path() ? "Path "+cmd.path()+" " : "");
var hint_position = (cmd.position() ? "Position "+cmd.position().x+","+cmd.position().y+" " : "");
var hint_rect = (cmd.rect() ? "Size "+cmd.rect().width+" by "+cmd.rect().height+" " : "");
return "File: "+hint_path+hint_position+hint_rect;
}
this.save = function(cmd)
{
if(cmd.value() > 0){
this.storage[cmd.value()] = ronin.canvas.element.toDataURL("image/png");
if(cmd.value() && cmd.value().int > 0){
this.storage[cmd.value().int] = ronin.canvas.element.toDataURL("image/png");
}
else{
var d = ronin.canvas.element.toDataURL("image/png");

7
scripts/ronin.filter.js → scripts/modules/filter.js
View File

@ -2,6 +2,8 @@ function Filter(element)
{
Module.call(this);
this.parameters = [Text,Value];
this.active = function(cmd)
{
if(cmd.content.length < 1){ return; }
@ -21,11 +23,6 @@ function Filter(element)
{
}
this.hint = function(cmd)
{
return "Filter: ";
}
// Filters
this.filter_saturation = function(pixels = this.pixels(),p = null)

32
scripts/modules/hint.js Normal file
View File

@ -0,0 +1,32 @@
function Hint(element)
{
Module.call(this);
this.element = element;
this.update = function()
{
if(ronin.module){
this.element.innerHTML = this.message(ronin.module,commander.cmd);
this.element.style.display = "block";
}
else{
this.element.style.display = "none";
}
}
this.message = function(module,cmd)
{
var s = "<span class='module'>"+module.constructor.name+"</span>";
var e = 0;
while(e < 10){
if(!module.parameters[e]){ break; }
var param_name = module.parameters[e].name;
s += cmd[param_name.toLowerCase()]() ? "<span class='value'>"+cmd[param_name.toLowerCase()]().render()+"</span>" : "<span class='param'>"+param_name+"</span>";
e += 1;
}
return s;
}
}

10
scripts/ronin.overlay.js → scripts/modules/overlay.js
View File

@ -16,16 +16,6 @@ function Overlay(element)
if(cmd.bang()){ this.guides = []; }
}
this.hint = function(cmd)
{
if(cmd.bang()){ return "Overlay: Erase all guides"; }
var hint_position = (cmd.position() ? "Position "+cmd.position().x+","+cmd.position().y+" " : "");
var hint_rect = (cmd.rect() ? "Size "+cmd.rect().width+"px by "+cmd.rect().height+"px " : "");
return "Overlay: "+hint_position+hint_rect;
}
// draw
this.draw = function(position,rect)

6
scripts/ronin.stroke.js → scripts/modules/stroke.js
View File

@ -2,6 +2,8 @@ function Stroke(element)
{
Module.call(this);
this.parameters = [Any];
// Module
this.passive = function(cmd)
@ -29,8 +31,4 @@ function Stroke(element)
ronin.brush.is_drawing = false;
}
this.hint = function(cmd)
{
}
}

11
scripts/ronin.vector.js → scripts/modules/vector.js
View File

@ -2,6 +2,8 @@ function Vector()
{
Module.call(this);
this.parameters = [Any,Position];
// Module
this.passive = function(cmd)
@ -22,16 +24,11 @@ function Vector()
ronin.canvas.context().stroke(new Path2D(cmd.content.join(" ")));
}
this.hint = function(cmd)
{
return "Vector: ";
}
// + M 100, 100 m -75, 0 a 75,75 0 1,0 150,0 a 75,75 0 1,0 -150,0 ; Draw a circle
// M100,100 h200 a20,20 0 0 1 20,20 v200 a20,20 0 0 1 -20,20 h-200 a20,20 0 0 1 -20,-20 v-200 a20,20 0 0 1 20,-20 z
// Large
// Large 128
// @ 128x128;> 2 #ffffff;+ M 64, 64 m -50, 0 a 50,50 0 1,0 100,0 a 50,50 0 1,0 -100,0;+ M 64, 64 m -45, 0 a 45,45 0 1,0 90,0 a 45,45 0 1,0 -90,0;+ M 64, 64 m -40, 0 a 40,40 0 1,0 80,0 a 40,40 0 1,0 -80,0;+ M 64, 64 m -35, 0 a 35,35 0 1,0 70,0 a 35,35 0 1,0 -70,0;+ M 64, 64 m -30, 0 a 30,30 0 1,0 60,0 a 30,30 0 1,0 -60,0;+ M 64, 64 m -25, 0 a 25,25 0 1,0 50,0 a 25,25 0 1,0 -50,0;+ M 64, 64 m -20, 0 a 20,20 0 1,0 40,0 a 20,20 0 1,0 -40,0;+ M 64, 64 m -15, 0 a 15,15 0 1,0 30,0 a 15,15 0 1,0 -30,0;+ M 64, 64 m -10, 0 a 10,10 0 1,0 20,0 a 10,10 0 1,0 -20,0;+ M 64, 64 m -5, 0 a 5,5 0 1,0 10,0 a 5,5 0 1,0 -10,0;$ logo
// Icon
// Icon 128
// @ 128x128;> 4 #ffffff;+ M 64, 64 m -50, 0 a 50,50 0 1,0 100,0 a 50,50 0 1,0 -100,0;+ M 64, 64 m -40, 0 a 40,40 0 1,0 80,0 a 40,40 0 1,0 -80,0;+ M 64, 64 m -30, 0 a 30,30 0 1,0 60,0 a 30,30 0 1,0 -60,0;+ M 64, 64 m -20, 0 a 20,20 0 1,0 40,0 a 20,20 0 1,0 -40,0;+ M 64, 64 m -10, 0 a 10,10 0 1,0 20,0 a 10,10 0 1,0 -20,0;$ logo
}

17
scripts/ronin.hint.js
View File

@ -1,17 +0,0 @@
function Hint(element)
{
Module.call(this);
this.element = element;
this.update = function()
{
if(ronin.module){
this.element.innerHTML = ronin.module.hint(commander.cmd);
this.element.style.display = "block";
}
else{
this.element.style.display = "none";
}
}
}

7
scripts/unit.js Normal file
View File

@ -0,0 +1,7 @@
function Unit()
{
this.render = function()
{
return "HEY!";
}
}

11
scripts/units/angle.js Normal file
View File

@ -0,0 +1,11 @@
function Angle(angle_str)
{
Unit.call(this);
this.degrees = parseFloat(angle_str.replace('\'',''));
this.render = function()
{
return this.degrees+"'";
}
}

11
scripts/units/any.js Normal file
View File

@ -0,0 +1,11 @@
function Any(str)
{
Unit.call(this);
this.string = str;
this.render = function()
{
return this.string;
}
}

9
scripts/units/bang.js Normal file
View File

@ -0,0 +1,9 @@
function Bang()
{
Unit.call(this);
this.render = function()
{
return "BANG";
}
}

7
scripts/unit.color.js → scripts/units/color.js
View File

@ -1,5 +1,7 @@
function Color(hex = '#000000')
{
Unit.call(this);
this.hex = hex;
this.rgb = function()
@ -16,4 +18,9 @@ function Color(hex = '#000000')
{
return "rgba("+this.rgb().r+","+this.rgb().g+","+this.rgb().b+",1)";
}
this.render = function()
{
return this.hex;
}
}

11
scripts/units/filepath.js Normal file
View File

@ -0,0 +1,11 @@
function Filepath(path_str)
{
Unit.call(this);
this.path = path_str;
this.render = function()
{
return this.path;
}
}

7
scripts/unit.position.js → scripts/units/position.js
View File

@ -1,5 +1,7 @@
function Position(position_str = "0,0",y = null)
{
Unit.call(this);
this.position_str = position_str;
this.x = y ? position_str : parseFloat(this.position_str.split(",")[0]);
@ -26,4 +28,9 @@ function Position(position_str = "0,0",y = null)
this.y = ronin.canvas.element.height - rect.height - Math.abs(this.y);
}
}
this.render = function()
{
return (isNaN(this.x) ? 0 : this.x)+","+(isNaN(this.y) ? 0 : this.y);
}
}

7
scripts/unit.rect.js → scripts/units/rect.js
View File

@ -1,7 +1,14 @@
function Rect(rect_str)
{
Unit.call(this);
this.rect_str = rect_str;
this.width = parseFloat(this.rect_str.split("x")[0]);
this.height = parseFloat(this.rect_str.split("x")[1]);
this.render = function()
{
return (isNaN(this.width) ? 0 : this.width)+"x"+(isNaN(this.height) ? 0 : this.height);
}
}

13
scripts/units/value.js Normal file
View File

@ -0,0 +1,13 @@
function Value(value_str)
{
Unit.call(this);
this.value = value_str;
this.float = parseFloat(this.value);
this.int = parseInt(this.value);
this.render = function()
{
return this.value;
}
}