@leapfrog/interactive-canvas 2.0.25-beta-1 → 2.0.25-beta-3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -1449,14 +1449,19 @@ class HorizontalRule extends AbstractCanvasObject {
|
|
|
1449
1449
|
|
|
1450
1450
|
class Image extends AbstractCanvasObject {
|
|
1451
1451
|
constructor(canvas, fabricObject, persistedField) {
|
|
1452
|
+
var _a;
|
|
1452
1453
|
super(ObjectType.IMAGE, canvas, fabricObject, persistedField);
|
|
1453
1454
|
this.DEFAULT_RESTRICTIONS = {
|
|
1454
1455
|
minWidth: 1,
|
|
1455
1456
|
minHeight: 1
|
|
1456
1457
|
};
|
|
1457
1458
|
this.canvas = canvas;
|
|
1459
|
+
console.log("fabric object", this.fabricObject);
|
|
1460
|
+
console.log("fabric src", (_a = this.fabricObject) === null || _a === void 0 ? void 0 : _a.getSrc());
|
|
1458
1461
|
this.imageUrl$ = new BehaviorSubject(this.fabricObject.getSrc());
|
|
1462
|
+
console.log("imageUrl$", this.imageUrl$);
|
|
1459
1463
|
this.data.imagePath = this.imageUrl$.value;
|
|
1464
|
+
console.log("this.data.imagePath", this.data.imagePath);
|
|
1460
1465
|
this.layoutWidth = this.getBoundingBox().width;
|
|
1461
1466
|
}
|
|
1462
1467
|
/**
|
|
@@ -3065,12 +3070,15 @@ class AbstractInteractiveCanvas {
|
|
|
3065
3070
|
return Object.assign(Object.assign({}, fabric.Object.prototype.toObject.call(this)), { src: this.src, crossOrigin: this.crossOrigin, id: id });
|
|
3066
3071
|
},
|
|
3067
3072
|
});
|
|
3073
|
+
fabricImage.toDataURL({ format: 'png' });
|
|
3068
3074
|
this.fabricCanvas.add(fabricImage);
|
|
3069
3075
|
const canvasObjectData = new CanvasObjectData(ObjectType.IMAGE, id);
|
|
3070
3076
|
canvasObjectData.imagePath = imageUrl;
|
|
3071
3077
|
console.log("Assigned imagePath:", canvasObjectData.imagePath);
|
|
3072
|
-
const object = new Image(this, fabricImage);
|
|
3073
|
-
object
|
|
3078
|
+
const object = new Image(this, fabricImage, canvasObjectData);
|
|
3079
|
+
console.log("Created Image object with imagePath:", object);
|
|
3080
|
+
//object.data.imagePath = imageUrl;
|
|
3081
|
+
// object.imageUrl$.next(imageUrl);
|
|
3074
3082
|
this.trackNewObject(object);
|
|
3075
3083
|
this.syncObjectList();
|
|
3076
3084
|
return object;
|
|
@@ -1470,14 +1470,19 @@ class HorizontalRule extends AbstractCanvasObject {
|
|
|
1470
1470
|
|
|
1471
1471
|
class Image extends AbstractCanvasObject {
|
|
1472
1472
|
constructor(canvas, fabricObject, persistedField) {
|
|
1473
|
+
var _a;
|
|
1473
1474
|
super(exports.ObjectType.IMAGE, canvas, fabricObject, persistedField);
|
|
1474
1475
|
this.DEFAULT_RESTRICTIONS = {
|
|
1475
1476
|
minWidth: 1,
|
|
1476
1477
|
minHeight: 1
|
|
1477
1478
|
};
|
|
1478
1479
|
this.canvas = canvas;
|
|
1480
|
+
console.log("fabric object", this.fabricObject);
|
|
1481
|
+
console.log("fabric src", (_a = this.fabricObject) === null || _a === void 0 ? void 0 : _a.getSrc());
|
|
1479
1482
|
this.imageUrl$ = new rxjs.BehaviorSubject(this.fabricObject.getSrc());
|
|
1483
|
+
console.log("imageUrl$", this.imageUrl$);
|
|
1480
1484
|
this.data.imagePath = this.imageUrl$.value;
|
|
1485
|
+
console.log("this.data.imagePath", this.data.imagePath);
|
|
1481
1486
|
this.layoutWidth = this.getBoundingBox().width;
|
|
1482
1487
|
}
|
|
1483
1488
|
/**
|
|
@@ -3086,12 +3091,15 @@ class AbstractInteractiveCanvas {
|
|
|
3086
3091
|
return Object.assign(Object.assign({}, fabric__namespace.Object.prototype.toObject.call(this)), { src: this.src, crossOrigin: this.crossOrigin, id: id });
|
|
3087
3092
|
},
|
|
3088
3093
|
});
|
|
3094
|
+
fabricImage.toDataURL({ format: 'png' });
|
|
3089
3095
|
this.fabricCanvas.add(fabricImage);
|
|
3090
3096
|
const canvasObjectData = new CanvasObjectData(exports.ObjectType.IMAGE, id);
|
|
3091
3097
|
canvasObjectData.imagePath = imageUrl;
|
|
3092
3098
|
console.log("Assigned imagePath:", canvasObjectData.imagePath);
|
|
3093
|
-
const object = new Image(this, fabricImage);
|
|
3094
|
-
object
|
|
3099
|
+
const object = new Image(this, fabricImage, canvasObjectData);
|
|
3100
|
+
console.log("Created Image object with imagePath:", object);
|
|
3101
|
+
//object.data.imagePath = imageUrl;
|
|
3102
|
+
// object.imageUrl$.next(imageUrl);
|
|
3095
3103
|
this.trackNewObject(object);
|
|
3096
3104
|
this.syncObjectList();
|
|
3097
3105
|
return object;
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { IDimensionRestrictions, IInteractiveCanvas, IMutableImage, IMutablePosition, IPosition } from "../..";
|
|
2
2
|
import { ICanvasObject } from "../canvas-object.interface";
|
|
3
3
|
import { AbstractCanvasObject } from "../abstract-canvas-object";
|
|
4
|
-
import { Observable } from "rxjs";
|
|
4
|
+
import { BehaviorSubject, Observable } from "rxjs";
|
|
5
5
|
import { CanvasObjectData } from "../canvas-object-data";
|
|
6
6
|
import { FabricImage } from "fabric";
|
|
7
7
|
/**
|
|
@@ -12,7 +12,7 @@ export interface IImage extends ICanvasObject, IMutableImage, IMutablePosition {
|
|
|
12
12
|
export declare class Image extends AbstractCanvasObject<FabricImage> implements IImage {
|
|
13
13
|
private readonly DEFAULT_RESTRICTIONS;
|
|
14
14
|
private layoutWidth;
|
|
15
|
-
|
|
15
|
+
imageUrl$: BehaviorSubject<string>;
|
|
16
16
|
constructor(canvas: IInteractiveCanvas, fabricObject: FabricImage, persistedField?: CanvasObjectData);
|
|
17
17
|
/**
|
|
18
18
|
* @override
|