Added notes and examples.
This commit is contained in:
parent
970676a3ff
commit
8a99bc5bb7
29
_notes.txt
Normal file
29
_notes.txt
Normal file
@ -0,0 +1,29 @@
|
|||||||
|
|
||||||
|
Rhonin
|
||||||
|
|
||||||
|
Graphics
|
||||||
|
% image.png 15 -15 100 100
|
||||||
|
|
||||||
|
Canvas
|
||||||
|
@ 100 100
|
||||||
|
|
||||||
|
Scale
|
||||||
|
~ 100 100
|
||||||
|
|
||||||
|
Layers
|
||||||
|
# 1
|
||||||
|
> Next Layer
|
||||||
|
< Prev Laye
|
||||||
|
|
||||||
|
Files
|
||||||
|
$ new_name.jpg
|
||||||
|
/ file_name.jpg
|
||||||
|
|
||||||
|
Brushes
|
||||||
|
+ 10 0
|
||||||
|
- 10 0
|
||||||
|
|
||||||
|
Cursors
|
||||||
|
= 10
|
||||||
|
] += 1
|
||||||
|
[ -= 1
|
@ -1,5 +1,7 @@
|
|||||||
body { margin:0px; padding:0px; overflow:hidden;}
|
body { margin:0px; padding:0px; overflow:hidden;}
|
||||||
|
|
||||||
canvas:hover { cursor: crosshair;}
|
canvas:hover { cursor: crosshair;}
|
||||||
|
|
||||||
#commander { display:none; }
|
#commander { display:none; }
|
||||||
#commander.visible { display:block; }
|
#commander.visible { display:block; }
|
||||||
#commander.hidden { display:none; }
|
#commander.hidden { display:none; }
|
||||||
|
@ -12,10 +12,22 @@ function Commander(element,element_input)
|
|||||||
this.hide = function()
|
this.hide = function()
|
||||||
{
|
{
|
||||||
this.element.setAttribute('class','hidden');
|
this.element.setAttribute('class','hidden');
|
||||||
|
this.element_input.value = "";
|
||||||
}
|
}
|
||||||
|
|
||||||
this.validate = function()
|
this.validate = function()
|
||||||
{
|
{
|
||||||
console.log(this.element_input.value);
|
var parts = this.element_input.value.split(" ");
|
||||||
|
|
||||||
|
if(parts[0] == ":@"){
|
||||||
|
canvas.style.width = parts[1]+"px";
|
||||||
|
canvas.style.height = parts[2]+"px";
|
||||||
|
}
|
||||||
|
|
||||||
|
this.hide();
|
||||||
|
}
|
||||||
|
|
||||||
|
this.passive = function()
|
||||||
|
{
|
||||||
}
|
}
|
||||||
}
|
}
|
@ -18,7 +18,8 @@ function Keyboard()
|
|||||||
{
|
{
|
||||||
if(this.is_locked === true){ return; }
|
if(this.is_locked === true){ return; }
|
||||||
|
|
||||||
console.log(event.keyCode);
|
commander.passive();
|
||||||
|
|
||||||
switch (event.keyCode)
|
switch (event.keyCode)
|
||||||
{
|
{
|
||||||
case 9: this.key_tab(); break;
|
case 9: this.key_tab(); break;
|
||||||
@ -66,6 +67,7 @@ function Keyboard()
|
|||||||
this.key_colon = function()
|
this.key_colon = function()
|
||||||
{
|
{
|
||||||
commander.show();
|
commander.show();
|
||||||
|
return false;
|
||||||
}
|
}
|
||||||
|
|
||||||
this.key_escape = function()
|
this.key_escape = function()
|
||||||
|
@ -2,6 +2,7 @@
|
|||||||
var canvas = document.getElementById('myCanvas');
|
var canvas = document.getElementById('myCanvas');
|
||||||
var context = canvas.getContext('2d');
|
var context = canvas.getContext('2d');
|
||||||
var brush = new Brush();
|
var brush = new Brush();
|
||||||
|
|
||||||
var commander = new Commander(document.getElementById("commander"),document.getElementById("commander_input"));
|
var commander = new Commander(document.getElementById("commander"),document.getElementById("commander_input"));
|
||||||
|
|
||||||
canvas.addEventListener('mousemove', function(e) {
|
canvas.addEventListener('mousemove', function(e) {
|
||||||
@ -16,6 +17,10 @@ canvas.addEventListener('mouseup', function(e) {
|
|||||||
brush.draw_stop(e);
|
brush.draw_stop(e);
|
||||||
}, false);
|
}, false);
|
||||||
|
|
||||||
|
var keyboard = new Keyboard();
|
||||||
|
document.onkeydown = function myFunction(){ keyboard.listen(event); };
|
||||||
|
|
||||||
|
/* brush experiments
|
||||||
var mirror_test = new Pointer();
|
var mirror_test = new Pointer();
|
||||||
mirror_test.mirror = new Position(200,0);
|
mirror_test.mirror = new Position(200,0);
|
||||||
brush.add_pointer(mirror_test);
|
brush.add_pointer(mirror_test);
|
||||||
@ -26,5 +31,4 @@ brush.add_pointer(mirror_test2);
|
|||||||
|
|
||||||
brush.add_pointer(new Pointer(new Position(0,10)));
|
brush.add_pointer(new Pointer(new Position(0,10)));
|
||||||
|
|
||||||
var keyboard = new Keyboard();
|
*/
|
||||||
document.onkeydown = function myFunction(){ keyboard.listen(event); };
|
|
@ -8,6 +8,7 @@ function Pointer(offset = new Position())
|
|||||||
{
|
{
|
||||||
if(!this.position_prev){this.position_prev = this.position(); }
|
if(!this.position_prev){this.position_prev = this.position(); }
|
||||||
|
|
||||||
|
/* Verteces
|
||||||
var id = context.createImageData(1,1);
|
var id = context.createImageData(1,1);
|
||||||
var d = id.data;
|
var d = id.data;
|
||||||
d[0] = 0;
|
d[0] = 0;
|
||||||
@ -15,6 +16,7 @@ function Pointer(offset = new Position())
|
|||||||
d[2] = 0;
|
d[2] = 0;
|
||||||
d[3] = 255;
|
d[3] = 255;
|
||||||
context.putImageData(id,this.position().x,this.position().y);
|
context.putImageData(id,this.position().x,this.position().y);
|
||||||
|
*/
|
||||||
|
|
||||||
context.beginPath();
|
context.beginPath();
|
||||||
context.moveTo(this.position_prev.x,this.position_prev.y);
|
context.moveTo(this.position_prev.x,this.position_prev.y);
|
||||||
|
Loading…
x
Reference in New Issue
Block a user