From 744e660c98bfd5af6750c4059e4d9e1bc58941de Mon Sep 17 00:00:00 2001 From: Devine Lu Linvega Date: Sat, 12 Nov 2016 12:33:22 -0800 Subject: [PATCH] Starting to build save/load and guides. --- _notes.txt | 23 +++++++++++++++++------ index.html | 1 + scripts/commander.js | 39 +++++++++++++++++++++++++++++++++++++-- scripts/main.js | 7 ++++--- scripts/pointer.js | 2 +- scripts/ronin.js | 3 +++ 6 files changed, 63 insertions(+), 12 deletions(-) create mode 100644 scripts/ronin.js diff --git a/_notes.txt b/_notes.txt index 983ebe5..b29d138 100644 --- a/_notes.txt +++ b/_notes.txt @@ -12,7 +12,7 @@ Layers # 1 -> Next Layer +> < Prev Laye Files @@ -20,13 +20,24 @@ $ new_name.jpg / file_name.jpg Brushes -+ 10 0 ++ 10 0 ff00000 s10 - 10 0 Cursors -= 10 -] += 1 -[ -= 1 += 10 ; Set cursors to 10 +] += 1 ; Increase cursors by 1 +[ -= 1 ; Decrease cursors by 1 Formatting -; Split into multiple commands \ No newline at end of file +; ; Split into multiple commands + + Guides +| 10 10 100 100 ; Draw a guide + + + + Zoom + + Eraser + + Right click should not draw diff --git a/index.html b/index.html index 519aefb..06bfd09 100644 --- a/index.html +++ b/index.html @@ -7,6 +7,7 @@ + diff --git a/scripts/commander.js b/scripts/commander.js index d8de071..10b99c6 100644 --- a/scripts/commander.js +++ b/scripts/commander.js @@ -21,8 +21,8 @@ function Commander(element,element_input) // Canvas if(parts[0] == ":@"){ - canvas.style.width = parts[1]+"px"; - canvas.style.height = parts[2]+"px"; + canvas.setAttribute('width',parts[1]+"px"); + canvas.setAttribute('height',parts[2]+"px"); } // Brush @@ -35,10 +35,45 @@ function Commander(element,element_input) brush.remove(parts); } + // Save + if(parts[0] == ":$"){ + var d=canvas.toDataURL("image/png"); + var w=window.open('about:blank','image from canvas'); + w.document.write(""+parts[1]+"from canvas"); + } + + // Load + if(parts[0] == ":/"){ + base_image = new Image(); + base_image.src = 'img/base.png'; + base_image.onload = function(){ + context.drawImage(base_image, 100, 100); + } + } + + // Guides + if(parts[0] == ":|"){ + console.log("!!"); + } this.hide(); } this.passive = function() { + var parts = this.element_input.value.split(" "); + + // Guides + if(parts[0] == ":|"){ + console.log("!!"); + } + + // Draw + if(parts[0] == ":/"){ + base_image = new Image(); + base_image.src = 'img/base.png'; + base_image.onload = function(){ + context.drawImage(base_image, 100, 100); + } + } } } \ No newline at end of file diff --git a/scripts/main.js b/scripts/main.js index 87a918a..65c400a 100644 --- a/scripts/main.js +++ b/scripts/main.js @@ -1,3 +1,4 @@ +var ronin = new Ronin(); var canvas = document.getElementById('myCanvas'); var context = canvas.getContext('2d'); @@ -10,6 +11,7 @@ canvas.addEventListener('mousemove', function(e) { }, false); canvas.addEventListener('mousedown', function(e) { + if(e.which != 1){ return; } brush.draw_start(e); }, false); @@ -20,13 +22,12 @@ canvas.addEventListener('mouseup', function(e) { var keyboard = new Keyboard(); document.onkeydown = function myFunction(){ keyboard.listen(event); }; +/* brush experiments + var mirror_test = new Pointer(); mirror_test.mirror = new Position(200,10); brush.add_pointer(mirror_test); -/* brush experiments - - var mirror_test2 = new Pointer(new Position(0,10)); mirror_test2.mirror = new Position(200,0); brush.add_pointer(mirror_test2); diff --git a/scripts/pointer.js b/scripts/pointer.js index 08afc7d..2523c8d 100644 --- a/scripts/pointer.js +++ b/scripts/pointer.js @@ -23,7 +23,7 @@ function Pointer(offset = new Position(), color = new Color('000000')) this.thickness = function() { var v = 100 - ((this.position().distance_to(this.position_prev))); - var t = v/20; + var t = v/40; return t < 1 ? 1 : t; } diff --git a/scripts/ronin.js b/scripts/ronin.js new file mode 100644 index 0000000..8d88769 --- /dev/null +++ b/scripts/ronin.js @@ -0,0 +1,3 @@ +function Ronin() +{ +} \ No newline at end of file