customized-fabric 1.5.5 → 1.5.7

Sign up to get free protection for your applications and to get access to all the features.
@@ -1,7 +1,7 @@
1
1
  import { fabric } from "fabric";
2
2
  import { IClipartOptions } from "./interfaces";
3
3
  import { ObjectId } from "../utils/objectId";
4
- export declare const toClipartObject: (clipartObject: Clipart) => {
4
+ export declare const toClipartObject: (object: Clipart) => {
5
5
  _id: ObjectId | undefined;
6
6
  id: ObjectId | undefined;
7
7
  personalizeId: number | undefined;
@@ -14,6 +14,8 @@ export declare const toClipartObject: (clipartObject: Clipart) => {
14
14
  clipartRootCategoryId: string | undefined;
15
15
  clipartCategoryId: string | undefined;
16
16
  clipartOptionId: number | undefined;
17
+ layoutGroupId: string | undefined;
18
+ layoutGroupName: string | undefined;
17
19
  };
18
20
  export default class Clipart extends fabric.Group {
19
21
  _id?: ObjectId;
@@ -28,6 +30,8 @@ export default class Clipart extends fabric.Group {
28
30
  clipartOptionId?: number;
29
31
  clipartUrl?: string;
30
32
  imageObject?: fabric.Image;
33
+ layoutGroupId?: string;
34
+ layoutGroupName?: string;
31
35
  loadImage?: (imageFile: File | string) => Promise<void>;
32
36
  getSettings?: (attribute: string) => any;
33
37
  setSizes?: (options: {
@@ -126,20 +126,22 @@ const ClipartClass = fabric_1.fabric.util.createClass(fabric_1.fabric.Group, {
126
126
  }
127
127
  },
128
128
  });
129
- const toClipartObject = (clipartObject) => {
129
+ const toClipartObject = (object) => {
130
130
  return {
131
- _id: clipartObject?._id,
132
- id: clipartObject?._id,
133
- personalizeId: clipartObject?.layerId,
134
- layerId: clipartObject?.layerId,
135
- name: clipartObject?.name,
136
- locked: clipartObject?.locked,
137
- isAdditional: clipartObject?.isAdditional,
138
- clipartUrl: clipartObject?.clipartUrl,
139
- clipartFile: clipartObject?.clipartFile,
140
- clipartRootCategoryId: clipartObject?.clipartRootCategoryId,
141
- clipartCategoryId: clipartObject?.clipartCategoryId,
142
- clipartOptionId: clipartObject?.clipartOptionId,
131
+ _id: object?._id,
132
+ id: object?._id,
133
+ personalizeId: object?.layerId,
134
+ layerId: object?.layerId,
135
+ name: object?.name,
136
+ locked: object?.locked,
137
+ isAdditional: object?.isAdditional,
138
+ clipartUrl: object?.clipartUrl,
139
+ clipartFile: object?.clipartFile,
140
+ clipartRootCategoryId: object?.clipartRootCategoryId,
141
+ clipartCategoryId: object?.clipartCategoryId,
142
+ clipartOptionId: object?.clipartOptionId,
143
+ layoutGroupId: object?.layoutGroupId,
144
+ layoutGroupName: object?.layoutGroupName,
143
145
  };
144
146
  };
145
147
  exports.toClipartObject = toClipartObject;
@@ -12,6 +12,8 @@ export declare const toCurvedTextObject: (object: CurvedText) => {
12
12
  fontCategoryId: string | undefined;
13
13
  fontUrl: string | undefined;
14
14
  isAdditional: boolean | undefined;
15
+ layoutGroupId: string | undefined;
16
+ layoutGroupName: string | undefined;
15
17
  text: {
16
18
  fontWeight: string | number | undefined;
17
19
  fontSize: number | undefined;
@@ -41,6 +43,8 @@ export default class CurvedText extends fabric.Group {
41
43
  fontCategoryId?: string;
42
44
  fontUrl?: string;
43
45
  isAdditional?: boolean;
46
+ layoutGroupId?: string;
47
+ layoutGroupName?: string;
44
48
  setText?: (text: string) => void;
45
49
  setPrefix?: (text: string) => void;
46
50
  setInfix?: (text: string) => void;
@@ -180,12 +180,16 @@ const CurvedTextClass = fabric_1.fabric.util.createClass(fabric_1.fabric.Group,
180
180
  this.pathObject = path;
181
181
  const pathInfo = fabric_1.fabric.util?.getPathSegmentsInfo?.(path.path);
182
182
  const pathLength = pathInfo?.[(pathInfo?.length ?? 0) - 1]?.length;
183
- const position = this.textObject.position ?? 0;
184
183
  this.textObject.set({
185
184
  path,
186
185
  pathLength,
187
- pathStartOffset: (position * pathLength) / 360,
188
186
  });
187
+ const position = this.textObject.position;
188
+ if (position) {
189
+ this.textObject.set({
190
+ pathStartOffset: (position * pathLength) / 360,
191
+ });
192
+ }
189
193
  },
190
194
  });
191
195
  const toCurvedTextObject = (object) => {
@@ -201,6 +205,8 @@ const toCurvedTextObject = (object) => {
201
205
  fontCategoryId: object?.fontCategoryId,
202
206
  fontUrl: object?.fontUrl,
203
207
  isAdditional: object?.isAdditional,
208
+ layoutGroupId: object?.layoutGroupId,
209
+ layoutGroupName: object?.layoutGroupName,
204
210
  text: {
205
211
  fontWeight: textObject?.fontWeight,
206
212
  fontSize: textObject?.fontSize,
@@ -10,6 +10,8 @@ export declare const toImagePlaceholderObject: (object: ImagePlaceholder) => {
10
10
  locked: boolean | undefined;
11
11
  isAdditional: boolean | undefined;
12
12
  maskUrl: string | undefined;
13
+ layoutGroupId: string | undefined;
14
+ layoutGroupName: string | undefined;
13
15
  imageSettings: {
14
16
  type: string | undefined;
15
17
  color: string | undefined;
@@ -31,6 +33,8 @@ export default class ImagePlaceholder extends fabric.Group {
31
33
  faceCutout?: boolean;
32
34
  imageObject?: fabric.Image;
33
35
  uploadedImage?: fabric.Image;
36
+ layoutGroupId?: string;
37
+ layoutGroupName?: string;
34
38
  getSettings?: (attribute: string) => any;
35
39
  setSizes?: (options: {
36
40
  width?: number;
@@ -286,6 +286,8 @@ const toImagePlaceholderObject = (object) => {
286
286
  locked: object?.locked,
287
287
  isAdditional: object?.isAdditional,
288
288
  maskUrl: object?.maskUrl,
289
+ layoutGroupId: object?.layoutGroupId,
290
+ layoutGroupName: object?.layoutGroupName,
289
291
  imageSettings: {
290
292
  type: object?.imageType,
291
293
  color: object?.imageColor,
@@ -12,5 +12,6 @@ export default class LayoutGroup {
12
12
  constructor(options?: ILayoutGroupOptions);
13
13
  select(): void;
14
14
  delete(): void;
15
+ rename(name: string): void;
15
16
  getObjects(): fabric.Object[] | undefined;
16
17
  }
@@ -5,14 +5,14 @@ const objectId_1 = require("../utils/objectId");
5
5
  const constants_1 = require("./constants");
6
6
  class LayoutGroup {
7
7
  constructor(options) {
8
- const { objects = [], canvas, _id } = options ?? {};
9
- const objectId = _id ?? new objectId_1.ObjectId().toString();
8
+ const { objects = [], canvas, _id, name = constants_1.LAYOUT_GROUP_OBJECT_ATTRIBUTES.name, } = options ?? {};
9
+ const groupId = _id ?? new objectId_1.ObjectId().toString();
10
10
  objects?.map((obj) => {
11
- obj.set({ layoutGroupId: objectId });
11
+ obj.set({ layoutGroupId: groupId, layoutGroupName: name });
12
12
  });
13
- this._id = objectId;
13
+ this._id = groupId;
14
+ this.name = name;
14
15
  this.type = constants_1.LAYOUT_GROUP_OBJECT_ATTRIBUTES.type;
15
- this.name = constants_1.LAYOUT_GROUP_OBJECT_ATTRIBUTES.name;
16
16
  this.objects = objects;
17
17
  this.canvas = canvas;
18
18
  return this;
@@ -44,6 +44,12 @@ class LayoutGroup {
44
44
  });
45
45
  }
46
46
  }
47
+ rename(name) {
48
+ this.name = name;
49
+ this.objects?.map((obj) => {
50
+ obj.set({ layoutGroupName: name });
51
+ });
52
+ }
47
53
  getObjects() {
48
54
  return this.objects;
49
55
  }
@@ -2,4 +2,5 @@ export interface ILayoutGroupOptions extends fabric.IObjectOptions {
2
2
  _id?: string;
3
3
  canvas?: fabric.Canvas;
4
4
  objects?: fabric.Object[];
5
+ name?: string;
5
6
  }
@@ -1,7 +1,7 @@
1
1
  import { fabric } from "fabric";
2
2
  import { ITextInputOptions } from "./interfaces";
3
3
  import { ObjectId } from "../utils/objectId";
4
- export declare const toTextInputObject: (textInputObject: TextInput) => {
4
+ export declare const toTextInputObject: (object: TextInput) => {
5
5
  _id: ObjectId | undefined;
6
6
  id: ObjectId | undefined;
7
7
  personalizeId: number | undefined;
@@ -12,6 +12,8 @@ export declare const toTextInputObject: (textInputObject: TextInput) => {
12
12
  fontCategoryId: string | undefined;
13
13
  fontUrl: string | undefined;
14
14
  isAdditional: boolean | undefined;
15
+ layoutGroupId: string | undefined;
16
+ layoutGroupName: string | undefined;
15
17
  text: {
16
18
  fontWeight: string | number | undefined;
17
19
  fontSize: number | undefined;
@@ -38,6 +40,8 @@ export default class TextInput extends fabric.Group {
38
40
  fontCategoryId?: string;
39
41
  fontUrl?: string;
40
42
  isAdditional?: boolean;
43
+ layoutGroupId?: string;
44
+ layoutGroupName?: string;
41
45
  setText?: (text: string) => void;
42
46
  setPrefix?: (text: string) => void;
43
47
  setInfix?: (text: string) => void;
@@ -178,19 +178,21 @@ const TextInputClass = fabric_1.fabric.util.createClass(fabric_1.fabric.Group, {
178
178
  return this.textObject.get(attribute);
179
179
  },
180
180
  });
181
- const toTextInputObject = (textInputObject) => {
182
- const textObject = textInputObject.textObject;
181
+ const toTextInputObject = (object) => {
182
+ const textObject = object.textObject;
183
183
  return {
184
- _id: textInputObject?._id,
185
- id: textInputObject?._id,
186
- personalizeId: textInputObject?.layerId,
187
- layerId: textInputObject?.layerId,
188
- name: textInputObject?.name,
189
- locked: textInputObject?.locked,
190
- fontId: textInputObject?.fontId,
191
- fontCategoryId: textInputObject?.fontCategoryId,
192
- fontUrl: textInputObject?.fontUrl,
193
- isAdditional: textInputObject?.isAdditional,
184
+ _id: object?._id,
185
+ id: object?._id,
186
+ personalizeId: object?.layerId,
187
+ layerId: object?.layerId,
188
+ name: object?.name,
189
+ locked: object?.locked,
190
+ fontId: object?.fontId,
191
+ fontCategoryId: object?.fontCategoryId,
192
+ fontUrl: object?.fontUrl,
193
+ isAdditional: object?.isAdditional,
194
+ layoutGroupId: object?.layoutGroupId,
195
+ layoutGroupName: object?.layoutGroupName,
194
196
  text: {
195
197
  fontWeight: textObject?.fontWeight,
196
198
  fontSize: textObject?.fontSize,
@@ -1 +1,3 @@
1
+ import { fabric } from "fabric";
1
2
  export declare const getEllipsePath: (rx: number, ry: number) => string;
3
+ export declare const getPathLenght: (path: fabric.Path) => any;
@@ -1,6 +1,7 @@
1
1
  "use strict";
2
2
  Object.defineProperty(exports, "__esModule", { value: true });
3
- exports.getEllipsePath = void 0;
3
+ exports.getPathLenght = exports.getEllipsePath = void 0;
4
+ const fabric_1 = require("fabric");
4
5
  const getEllipsePath = (rx, ry) => {
5
6
  let output = `M 0,0`;
6
7
  output += `a ${rx},${ry} 0 0,1 0,${ry * -2}`;
@@ -9,3 +10,9 @@ const getEllipsePath = (rx, ry) => {
9
10
  return output;
10
11
  };
11
12
  exports.getEllipsePath = getEllipsePath;
13
+ const getPathLenght = (path) => {
14
+ const pathInfo = fabric_1.fabric.util?.getPathSegmentsInfo?.(path.path);
15
+ const pathLength = pathInfo?.[(pathInfo?.length ?? 0) - 1]?.length;
16
+ return pathLength;
17
+ };
18
+ exports.getPathLenght = getPathLenght;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "customized-fabric",
3
- "version": "1.5.5",
3
+ "version": "1.5.7",
4
4
  "description": "Customized fabric",
5
5
  "main": "lib/index.js",
6
6
  "types": "lib/index.d.ts",