diff --git a/desktop/sources/scripts/commander.js b/desktop/sources/scripts/commander.js index 4ad021f..f6e966f 100644 --- a/desktop/sources/scripts/commander.js +++ b/desktop/sources/scripts/commander.js @@ -25,7 +25,6 @@ function Commander (ronin) { this.run = function (txt = this._input.value) { console.log('========') const inter = new Lisp(txt, ronin.library) - console.log(inter) inter.toPixels() } diff --git a/desktop/sources/scripts/library.js b/desktop/sources/scripts/library.js index 9096e74..c4a5342 100644 --- a/desktop/sources/scripts/library.js +++ b/desktop/sources/scripts/library.js @@ -12,8 +12,12 @@ function Library (ronin) { return { w, h } } - this.rect = (x, y, w, h) => { - return { x, y, w, h } + this.rect = (x, y, w, h, t = 'rect') => { + return { x, y, w, h, t } + } + + this.line = (a, b, t = 'line') => { + return { a, b, t } } this.frame = () => { @@ -24,11 +28,12 @@ function Library (ronin) { this.clone = (a, b) => { ronin.surface.clone(a, b) + return [a, b] } - this.stroke = (rect = this.frame(), thickness, color) => { - ronin.surface.stroke(rect, thickness, color) - return rect + this.stroke = (shape = this.frame(), thickness, color) => { + ronin.surface.stroke(shape, thickness, color) + return shape } this.fill = (rect = this.frame(), color) => { diff --git a/desktop/sources/scripts/surface.js b/desktop/sources/scripts/surface.js index c776fbd..a96c9bc 100644 --- a/desktop/sources/scripts/surface.js +++ b/desktop/sources/scripts/surface.js @@ -22,7 +22,17 @@ function Surface (ronin) { } } - this.stroke = (rect, width, color) => { + // Shape + + this.stroke = (shape, width, color) => { + if (shape.t === 'rect') { + this.strokeRect(shape, width, color) + } else if (shape.t === 'line') { + this.strokeLine(shape, width, color) + } + } + + this.strokeRect = (rect, width, color) => { this.context.beginPath() this.context.moveTo(rect.x, rect.y) this.context.lineTo(rect.x + rect.w, rect.y) @@ -35,7 +45,25 @@ function Surface (ronin) { this.context.closePath() } - this.fill = (rect, color) => { + this.strokeLine = function (line, width, color) { + this.context.beginPath() + this.context.moveTo(line.a.x, line.a.y) + this.context.lineTo(line.b.x, line.b.y) + this.context.lineWidth = width + this.context.strokeStyle = color + this.context.stroke() + this.context.closePath() + } + + // Fill + + this.fill = (shape, color) => { + if (shape.t === 'rect') { + this.fillRect(shape, color) + } + } + + this.fillRect = (rect, color) => { this.context.beginPath() this.context.moveTo(rect.x, rect.y) this.context.lineTo(rect.x + rect.w, rect.y) diff --git a/examples/test1.lisp b/examples/test1.lisp index c9689ee..abb7834 100644 --- a/examples/test1.lisp +++ b/examples/test1.lisp @@ -4,4 +4,6 @@ (stroke (rect 15 15 120 80) 2 "red") (fill (rect 30 30 120 80) "#72dec2") (clear (rect 45 45 45 45)) - (clone (rect 0 0 200 200) (rect 100 100 200 200))) \ No newline at end of file + (clone (rect 0 0 200 200) (rect 100 100 200 200)) + (stroke (line (pos 15 15) (pos 200 200)) 10 "red") +) \ No newline at end of file