Merge pull request #151 from collective/mle-make-minimal-size-work-again

Adapt limit_minimum_cropping_size to work with current cropperjs version

MANIFEST.in

@@ -12,3 +12,4 @@ include *.js
 include *.json
 include *.lock
 include *.txt
+include *.yaml

instance.yaml

@@ -0,0 +1,15 @@
+---
+# This is a cookiecutter configuration context file for
+#
+#   cookiecutter-zope-instance
+#
+# available options are documented at
+# https://github.com/bluedynamics/cookiecutter-zope-instance/
+#
+# read also README_MAKE.md in this folder
+#
+default_context:
+    wsgi_http_listen: localhost:8080
+    initial_user_name: admin
+    initial_user_password: admin
+    db_storage: direct

news/150.bugfix

@@ -0,0 +1,2 @@
+Fix minimal crop size implementation, to support current cropperjs version.
+[maethu]

resources/js/cropperpattern.js

@@ -181,25 +181,35 @@ export default Base.extend({
     limit_minimum_cropping_size: function () {
         var current = this.cropper,
             newbox = {};
+        const relativeWidth =
+          (current.canvasData.width /
+            current.canvasData.naturalWidth) *
+          this.options.target_width;
+        const relativeHeight =
+          (current.canvasData.height /
+            current.canvasData.naturalHeight) *
+          this.options.target_height;
+
         if (
-            current.width < this.options.target_width ||
-            current.height < this.options.target_height
+            current.cropBoxData.width <= Math.round(relativeWidth) ||
+            current.cropBoxData.height <= Math.round(relativeHeight)
         ) {
             newbox.width = this.options.target_width;
             newbox.height = this.options.target_height;
-            if (current.x + this.options.target_width > this.options.true_width) {
+            const data = current.getData()
+            if (data.x + this.options.target_width > this.options.true_width) {
                 newbox.x = this.options.true_width - this.options.target_width;
             } else {
-                newbox.x = current.x;
+                newbox.x = data.x;
             }
-            if (current.y + this.options.target_height > this.options.true_height) {
+            if (data.y + this.options.target_height > this.options.true_height) {
                 newbox.y = this.options.true_height - this.options.target_height;
             } else {
-                newbox.y = current.y;
+                newbox.y = data.y;
             }
-            newbox.rotate = current.rotate;
-            newbox.scaleX = current.scaleX;
-            newbox.scaleY = current.scaleY;
+            newbox.rotate = data.rotate;
+            newbox.scaleX = data.scaleX;
+            newbox.scaleY = data.scaleY;
             this.while_reset = true;
             this.cropper.setData(newbox);
             this.while_reset = false;