@leapfrog/interactive-canvas 2.0.23-beta-3 → 2.0.23-beta-5

package/dist/interactive-canvas.es.js

@@ -1,7 +1,8 @@
 import _, { round, each, values, reduce, clone, max, isEqual } from 'lodash';
 import { BehaviorSubject, Subject } from 'rxjs';
-import { createCanvas, loadImage } from 'canvas';
 import * as fabric from 'fabric';
+import { FabricImage } from 'fabric';
+import { loadImage } from 'canvas';
 
 const PIXELS_PER_MM$2 = 3.937;
 class MillimeterDimensions {
@@ -3042,7 +3043,7 @@ class AbstractInteractiveCanvas {
             const options = { crossOrigin: "anonymous" };
             if (this.headless) {
                 // Server-side logic without mock DOM
-                createCanvas(1, 1);
+                //const canvas = createCanvas(1, 1);
                 //const ctx = canvas.getContext("2d");
                 const image = yield loadImage(imageUrl);
                 const id = this.randomId();
@@ -3052,12 +3053,14 @@ class AbstractInteractiveCanvas {
                     newScale = maxWidth / curWidth;
                 }
                 // Set image properties and add to the canvas
-                const fabricImage = new this.fabric.Image(image, {
+                const fabricImage = new FabricImage(imageUrl, {
                     id: id,
                     scaleX: newScale,
                     scaleY: newScale,
                     originX: "left",
                     originY: "top",
+                    crossOrigin: options.crossOrigin,
+                    src: imageUrl
                 });
                 this.fabricCanvas.add(fabricImage);
                 const object = new Image(this, fabricImage);

package/dist/interactive-canvas.js

@@ -2,8 +2,8 @@
 
 var _ = require('lodash');
 var rxjs = require('rxjs');
-var canvas = require('canvas');
 var fabric = require('fabric');
+var canvas = require('canvas');
 
 function _interopNamespaceDefault(e) {
     var n = Object.create(null);
@@ -3063,7 +3063,7 @@ class AbstractInteractiveCanvas {
             const options = { crossOrigin: "anonymous" };
             if (this.headless) {
                 // Server-side logic without mock DOM
-                canvas.createCanvas(1, 1);
+                //const canvas = createCanvas(1, 1);
                 //const ctx = canvas.getContext("2d");
                 const image = yield canvas.loadImage(imageUrl);
                 const id = this.randomId();
@@ -3073,12 +3073,14 @@ class AbstractInteractiveCanvas {
                     newScale = maxWidth / curWidth;
                 }
                 // Set image properties and add to the canvas
-                const fabricImage = new this.fabric.Image(image, {
+                const fabricImage = new fabric.FabricImage(imageUrl, {
                     id: id,
                     scaleX: newScale,
                     scaleY: newScale,
                     originX: "left",
                     originY: "top",
+                    crossOrigin: options.crossOrigin,
+                    src: imageUrl
                 });
                 this.fabricCanvas.add(fabricImage);
                 const object = new Image(this, fabricImage);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@leapfrog/interactive-canvas",
-  "version": "2.0.23-beta-3",
+  "version": "2.0.23-beta-5",
   "description": "Leapfrog interactive canvas",
   "files": [
     "dist"