P5-6722 - Set frame objects as dirty each render (#6)

.nvmrc

@@ -0,0 +1 @@
+v12.13.0

README.md

@@ -2,6 +2,14 @@ Photowall Image Editor
 ======================
 Image editor for the Photowall web project
 
+# Working with image-editor integrated in photowall site
+A suggested workflow is replacing `src/js/legacy/legacyVendor/image-editor.js` in photowall project with a symlink to
+`dist/image-editor.js` in this project. That way you can have `gulp watch` running to build on change in this project
+which will trigger `npm run watch` (webpack) in photowall project.
+
+Symlink should be removed and new copy of `dist/image-editor.js` copied to photowall project when work
+is done however to not force all team members to have same file structure for projects.
+
 # Linting
 Linting can be run manually with
 `npm run lint`

dist/image-editor.js

@@ -1042,6 +1042,7 @@ function FrameHandler(viewport) {
     this.setVisible(true);
 
     getFramesAsArray().forEach(function (o) {
+      o.dirty = true; // force objects cache to be rendered on next render http://fabricjs.com/docs/fabric.Object.html#dirty
       o.set(config.frames[frameType]);
     });
 

package-lock.json

@@ -4460,6 +4460,11 @@
         }
       }
     },
+    "jquery": {
+      "version": "2.2.4",
+      "resolved": "https://registry.npmjs.org/jquery/-/jquery-2.2.4.tgz",
+      "integrity": "sha1-LInWiJterFIqfuoywUUhVZxsvwI="
+    },
     "js-tokens": {
       "version": "4.0.0",
       "resolved": "https://registry.npmjs.org/js-tokens/-/js-tokens-4.0.0.tgz",

package.json

@@ -26,5 +26,7 @@
     "lint": "eslint gulpfile.js 'examples/**/*.js' 'test/unit/**/*.js' 'src/**/*.js'",
     "serve": "live-server --ignore=node_modules --port=50994 ./"
   },
-  "dependencies": {}
+  "dependencies": {
+    "jquery": "^2.2.4"
+  }
 }

src/FrameHandler.js

@@ -84,6 +84,7 @@ function FrameHandler(viewport) {
     this.setVisible(true);
 
     getFramesAsArray().forEach(function (o) {
+      o.dirty = true; // force objects cache to be rendered on next render http://fabricjs.com/docs/fabric.Object.html#dirty
       o.set(config.frames[frameType]);
     });