diff --git a/desktop/sources/scripts/library.js b/desktop/sources/scripts/library.js index a86298c..22a3272 100644 --- a/desktop/sources/scripts/library.js +++ b/desktop/sources/scripts/library.js @@ -43,6 +43,11 @@ function Library (ronin) { return rect } + this.crop = (rect, callback) => { + ronin.surface.crop(rect, callback) + return rect + } + this.exit = () => { // TODO: Closes Ronin } diff --git a/desktop/sources/scripts/surface.js b/desktop/sources/scripts/surface.js index aa92e1c..a80bfee 100644 --- a/desktop/sources/scripts/surface.js +++ b/desktop/sources/scripts/surface.js @@ -136,6 +136,13 @@ function Surface (ronin) { } } + this.crop = function (rect) { + console.log(`Crop ${rect.w}x${rect.h} from ${rect.x}x${rect.y}`) + const crop = this.getCrop(rect) + this.resize(rect, true) + this.context.drawImage(crop, 0, 0) + } + this.clear = function (rect = this.getFrame(), context = this.context) { context.clearRect(rect.x, rect.y, rect.w, rect.h) } @@ -184,6 +191,14 @@ function Surface (ronin) { return { x: 0, y: 0, w: this.el.width, h: this.el.height, t: 'rect' } } + this.getCrop = function (rect) { + const newCanvas = document.createElement('canvas') + newCanvas.width = rect.w + newCanvas.height = rect.h + newCanvas.getContext('2d').drawImage(this.el, rect.x, rect.y, rect.w, rect.h, 0, 0, rect.w, rect.h) + return newCanvas + } + this.resizeImage = function (src, dst, type = 'image/jpeg', quality = 0.92) { var tmp = new Image() var canvas diff --git a/examples/crop.lisp b/examples/crop.lisp new file mode 100644 index 0000000..d0e57de --- /dev/null +++ b/examples/crop.lisp @@ -0,0 +1,16 @@ +; crop + +( + (clear) + + ; Filter + + (def filter-action + (lambda () (crop (rect 100 100 400 400)))) + + ; Draw photo + + (open + "../../PREVIEW.jpg" + filter-action) +) \ No newline at end of file diff --git a/examples/resize.lisp b/examples/resize.lisp index edf6174..9cac33a 100644 --- a/examples/resize.lisp +++ b/examples/resize.lisp @@ -1,4 +1,4 @@ -; pixels +; resize ( (clear)