diff --git a/desktop/sources/links/main.css b/desktop/sources/links/main.css index 47787f0..1257ec8 100644 --- a/desktop/sources/links/main.css +++ b/desktop/sources/links/main.css @@ -9,5 +9,5 @@ body { margin:0px; padding:0px; overflow:hidden; font-family:"input_mono_regular #ronin #wrapper #commander div#status { position: absolute; bottom: 0px; } #ronin #wrapper #commander.hidden { margin-left:-331px; } -#ronin canvas#surface,#ronin canvas#guide { position: absolute; right:0px; top:0px; -webkit-user-select: none;-webkit-app-region: no-drag; background-image: url("data:image/svg+xml;utf8,"); background-size: 10px 10px; background-position: -4px -4px; } +#ronin canvas#surface,#ronin canvas#guide { position: absolute; right:0px; top:0px; -webkit-user-select: none;-webkit-app-region: no-drag; background-image: url("data:image/svg+xml;utf8,"); background-size: 10px 10px; background-position: -4px -4px; width:100%; height:100%;} #ronin canvas#guide { background:none; } \ No newline at end of file diff --git a/desktop/sources/scripts/lib/controller.js b/desktop/sources/scripts/lib/controller.js index 6094222..52a3ee3 100644 --- a/desktop/sources/scripts/lib/controller.js +++ b/desktop/sources/scripts/lib/controller.js @@ -16,7 +16,9 @@ function Controller () { if (!this.menu[mode]) { this.menu[mode] = {} } if (!this.menu[mode][cat]) { this.menu[mode][cat] = {} } this.menu[mode][cat][label] = { fn: function (_menuItem, browserWindow) { - browserWindow.webContents.focus() + if (browserWindow) { + browserWindow.webContents.focus() + } fn.apply(this, arguments) }, accelerator: accelerator } diff --git a/desktop/sources/scripts/library.js b/desktop/sources/scripts/library.js index fc82f7f..9cce785 100644 --- a/desktop/sources/scripts/library.js +++ b/desktop/sources/scripts/library.js @@ -31,10 +31,6 @@ function Library (ronin) { return rect } - this.select = (rect = this.frame()) => { - return ronin.surface.select(rect) - } - this.exit = () => { // TODO: Closes Ronin } @@ -193,8 +189,28 @@ function Library (ronin) { } this.theme = (variable, el = document.documentElement) => { - // ex. styleprop('--f_high') to get css variable value - return getComputedStyle(el).getPropertyValue(variable) + return getComputedStyle(el).getPropertyValue(variable) // ex. styleprop('--f_high') to get css variable value + } + + // Pixels + + this.pixels = (rect, fn, q) => { + const img = ronin.surface.context.getImageData(0, 0, rect.w, rect.h) + for (let i = 0, loop = img.data.length; i < loop; i += 4) { + const pixel = { r: img.data[i], g: img.data[i + 1], b: img.data[i + 2], a: img.data[i + 3] } + const processed = fn(pixel, q) + img.data[i] = processed[0] + img.data[i + 1] = processed[1] + img.data[i + 2] = processed[2] + img.data[i + 3] = processed[3] + } + ronin.surface.context.putImageData(img, 0, 0) + return rect + } + + this.saturation = (pixel, q = 1) => { + var color = 0.2126 * pixel.r + 0.7152 * pixel.g + 0.0722 * pixel.b + return [color, color, color, pixel.a] } // Math diff --git a/desktop/sources/scripts/surface.js b/desktop/sources/scripts/surface.js index d214b8a..dc9b72a 100644 --- a/desktop/sources/scripts/surface.js +++ b/desktop/sources/scripts/surface.js @@ -4,6 +4,8 @@ function Surface (ronin) { this._guide = document.createElement('canvas') this._guide.id = 'guide' this.ratio = window.devicePixelRatio + + // Contexts this.context = this.el.getContext('2d') this.guide = this.el.getContext('2d') @@ -14,6 +16,8 @@ function Surface (ronin) { this._guide.addEventListener('mousedown', ronin.commander.onMouseDown, false) this._guide.addEventListener('mousemove', ronin.commander.onMouseMove, false) this._guide.addEventListener('mouseup', ronin.commander.onMouseUp, false) + this.context.scale(this.ratio, this.ratio) + this.guide.scale(this.ratio, this.ratio) } this.start = function () { @@ -25,15 +29,6 @@ function Surface (ronin) { } - this.select = function (rect) { - const img = this.context.getImageData(rect.x, rect.y, rect.w, rect.h) - const pixels = [] - for (let i = 0, loop = img.data.length; i < loop; i += 4) { - pixels.push({ r: img.data[i], g: img.data[i + 1], b: img.data[i + 2], a: img.data[i + 3] }) - } - return pixels - } - // Shape this.stroke = (shape, width, color, context = this.context) => { diff --git a/examples/pixels.lisp b/examples/pixels.lisp index f599c38..e58fb38 100644 --- a/examples/pixels.lisp +++ b/examples/pixels.lisp @@ -1,10 +1,21 @@ ; pixels -((clear) +( + (clear) + + ; Filter + + (def filter-action + (lambda () (pixels + (rect 0 0 500 500) + saturation + 0.5) + )) ; Draw photo - (draw "../../PREVIEW.jpg" - (frame) - (lambda () (echo (select (rect 660 344 10 10)))) -)) \ No newline at end of file + (draw + "../../PREVIEW.jpg" + (frame) + filter-action) +) \ No newline at end of file