customized-fabric 1.9.0 → 1.9.2

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.
@@ -1,4 +1,4 @@
1
- export declare const GROUP_LAYOUT_OBJECT_ATTRIBUTES: {
2
- name: string;
3
- type: string;
4
- };
1
+ export declare const GROUP_LAYOUT_OBJECT_ATTRIBUTES: {
2
+ name: string;
3
+ type: string;
4
+ };
@@ -1,7 +1,7 @@
1
- "use strict";
2
- Object.defineProperty(exports, "__esModule", { value: true });
3
- exports.GROUP_LAYOUT_OBJECT_ATTRIBUTES = void 0;
4
- exports.GROUP_LAYOUT_OBJECT_ATTRIBUTES = {
5
- name: "Group layout",
6
- type: "GROUP_LAYOUT",
7
- };
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
3
+ exports.GROUP_LAYOUT_OBJECT_ATTRIBUTES = void 0;
4
+ exports.GROUP_LAYOUT_OBJECT_ATTRIBUTES = {
5
+ name: "Group layout",
6
+ type: "GROUP_LAYOUT",
7
+ };
@@ -1,19 +1,19 @@
1
- import { fabric } from "fabric";
2
- import { ObjectId } from "../utils/objectId";
3
- import { IGroupLayoutOptions } from "./interfaces";
4
- export declare const toGroupLayoutObject: (groupLayoutObject: GroupLayout) => {
5
- _id: ObjectId | undefined;
6
- id: ObjectId | undefined;
7
- personalizeId: number | undefined;
8
- layerId: number | undefined;
9
- name: string | undefined;
10
- locked: boolean | undefined;
11
- isAdditional: boolean | undefined;
12
- };
13
- export default class GroupLayout extends fabric.ActiveSelection {
14
- _id?: ObjectId;
15
- layerId?: number;
16
- locked?: boolean;
17
- isAdditional?: boolean;
18
- constructor(options?: IGroupLayoutOptions);
19
- }
1
+ import { fabric } from "fabric";
2
+ import { ObjectId } from "../utils/objectId";
3
+ import { IGroupLayoutOptions } from "./interfaces";
4
+ export declare const toGroupLayoutObject: (groupLayoutObject: GroupLayout) => {
5
+ _id: ObjectId | undefined;
6
+ id: ObjectId | undefined;
7
+ personalizeId: number | undefined;
8
+ layerId: number | undefined;
9
+ name: string | undefined;
10
+ locked: boolean | undefined;
11
+ isAdditional: boolean | undefined;
12
+ };
13
+ export default class GroupLayout extends fabric.ActiveSelection {
14
+ _id?: ObjectId;
15
+ layerId?: number;
16
+ locked?: boolean;
17
+ isAdditional?: boolean;
18
+ constructor(options?: IGroupLayoutOptions);
19
+ }
@@ -1,26 +1,26 @@
1
- "use strict";
2
- Object.defineProperty(exports, "__esModule", { value: true });
3
- exports.toGroupLayoutObject = void 0;
4
- const fabric_1 = require("fabric");
5
- const GroupLayoutClass = fabric_1.fabric.util.createClass(fabric_1.fabric.ActiveSelection, {
6
- initialize: async function (options) { },
7
- });
8
- const toGroupLayoutObject = (groupLayoutObject) => {
9
- return {
10
- _id: groupLayoutObject._id,
11
- id: groupLayoutObject._id,
12
- personalizeId: groupLayoutObject.layerId,
13
- layerId: groupLayoutObject.layerId,
14
- name: groupLayoutObject.name,
15
- locked: groupLayoutObject.locked,
16
- isAdditional: groupLayoutObject?.isAdditional,
17
- };
18
- };
19
- exports.toGroupLayoutObject = toGroupLayoutObject;
20
- class GroupLayout extends fabric_1.fabric.ActiveSelection {
21
- constructor(options) {
22
- super();
23
- return new GroupLayoutClass(options);
24
- }
25
- }
26
- exports.default = GroupLayout;
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
3
+ exports.toGroupLayoutObject = void 0;
4
+ const fabric_1 = require("fabric");
5
+ const GroupLayoutClass = fabric_1.fabric.util.createClass(fabric_1.fabric.ActiveSelection, {
6
+ initialize: async function (options) { },
7
+ });
8
+ const toGroupLayoutObject = (groupLayoutObject) => {
9
+ return {
10
+ _id: groupLayoutObject._id,
11
+ id: groupLayoutObject._id,
12
+ personalizeId: groupLayoutObject.layerId,
13
+ layerId: groupLayoutObject.layerId,
14
+ name: groupLayoutObject.name,
15
+ locked: groupLayoutObject.locked,
16
+ isAdditional: groupLayoutObject?.isAdditional,
17
+ };
18
+ };
19
+ exports.toGroupLayoutObject = toGroupLayoutObject;
20
+ class GroupLayout extends fabric_1.fabric.ActiveSelection {
21
+ constructor(options) {
22
+ super();
23
+ return new GroupLayoutClass(options);
24
+ }
25
+ }
26
+ exports.default = GroupLayout;
@@ -1,3 +1,3 @@
1
- export interface IGroupLayoutOptions extends fabric.IObjectOptions {
2
- objects?: fabric.Object[];
3
- }
1
+ export interface IGroupLayoutOptions extends fabric.IObjectOptions {
2
+ objects?: fabric.Object[];
3
+ }
@@ -1,2 +1,2 @@
1
- "use strict";
2
- Object.defineProperty(exports, "__esModule", { value: true });
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
@@ -245,8 +245,9 @@ const ImagePlaceholderClass = fabric_1.fabric.util.createClass(fabric_1.fabric.G
245
245
  loadCustomizedImage: async function (image) {
246
246
  if (image) {
247
247
  const { url, filteredUrl, data, clipPath } = image;
248
- if (url && data && clipPath) {
249
- const loadedImage = await (0, utils_1.loadImageFromUrl)(filteredUrl ?? url);
248
+ const imageUrl = filteredUrl ?? url;
249
+ if (imageUrl && data && clipPath) {
250
+ const loadedImage = await (0, utils_1.loadImageFromUrl)(imageUrl);
250
251
  if (loadedImage) {
251
252
  const mask = await this.getMask();
252
253
  const { top, left, scaleX, width, angle, flipX, flipY, settings = {}, } = data;
@@ -45,9 +45,6 @@ const TextInputClass = fabric_1.fabric.util.createClass(fabric_1.fabric.Group, {
45
45
  this.set(attributes);
46
46
  this.rectObject.set(attributes);
47
47
  this.autoChangeFontSize(0.1);
48
- this.textObject.set({
49
- width: width,
50
- });
51
48
  this.canvas?.renderAll?.();
52
49
  });
53
50
  this.set({
@@ -72,35 +69,30 @@ const TextInputClass = fabric_1.fabric.util.createClass(fabric_1.fabric.Group, {
72
69
  },
73
70
  autoChangeFontSize: function (changeSpeed) {
74
71
  let maxLineWidth = Math.max(...this.textObject.__lineWidths);
75
- if (this.width <= maxLineWidth || this.height <= this.textObject.height) {
76
- while (this.width <= maxLineWidth ||
77
- this.height <= this.textObject.height) {
78
- this.textObject.set({
79
- fontSize: this.textObject.fontSize - changeSpeed,
80
- });
81
- maxLineWidth = Math.max(...this.textObject.__lineWidths);
82
- }
72
+ let fontSize = this.textObject.fontSize;
73
+ while (this.width - fontSize / 4 < maxLineWidth ||
74
+ this.height < this.textObject.height) {
75
+ fontSize -= changeSpeed;
76
+ this.textObject.set({
77
+ fontSize,
78
+ });
79
+ maxLineWidth = Math.max(...this.textObject.__lineWidths);
83
80
  }
84
- else {
85
- while (this.textObject.maxFontSize > this.textObject.fontSize &&
86
- this.width > maxLineWidth &&
87
- this.height > this.textObject.height) {
88
- this.textObject.set({
89
- fontSize: this.textObject.fontSize + changeSpeed,
90
- });
91
- maxLineWidth = Math.max(...this.textObject.__lineWidths);
92
- }
81
+ while (this.textObject.maxFontSize > fontSize.toFixed(1) &&
82
+ this.width - fontSize / 4 > maxLineWidth &&
83
+ this.height > this.textObject.height) {
84
+ fontSize += changeSpeed;
85
+ this.textObject.set({
86
+ fontSize,
87
+ });
88
+ maxLineWidth = Math.max(...this.textObject.__lineWidths);
93
89
  }
94
90
  },
95
91
  setText: function (text) {
96
92
  this.textObject.set({
97
93
  text,
98
94
  });
99
- this.autoChangeFontSize(0.1);
100
- this.textObject.set({
101
- width: this.width,
102
- });
103
- this.canvas?.renderAll?.();
95
+ this.fire("scaling");
104
96
  },
105
97
  setPrefix: function (text) {
106
98
  this.textObject.set({
@@ -126,34 +118,17 @@ const TextInputClass = fabric_1.fabric.util.createClass(fabric_1.fabric.Group, {
126
118
  const text = prefix + infix + suffix;
127
119
  this.setText(infix?.length > 0 ? (isAllCapital ? text.toUpperCase() : text) : "");
128
120
  },
129
- setMaxFontSize: function (fontSize) {
130
- this.textObject.set({
131
- fontSize,
132
- });
133
- const maxLineWidth = Math.max(...this.textObject.__lineWidths);
134
- if (maxLineWidth < this.width && this.textObject.height < this.height) {
135
- }
136
- else {
137
- this.autoChangeFontSize(1);
138
- }
139
- this.textObject.set({
140
- width: this.width,
141
- });
142
- this.textObject.set({
143
- maxFontSize: fontSize,
144
- });
145
- this.canvas?.renderAll?.();
121
+ setMaxFontSize: function (size) {
122
+ const fontSize = Number(size);
123
+ this.textObject.set({ fontSize, maxFontSize: fontSize });
124
+ this.fire("scaling");
146
125
  },
147
126
  setFontFamily: async function (fontName, fontUrl) {
148
127
  if (!(0, utils_1.isFontLoaded)(fontName)) {
149
128
  await (0, utils_1.loadFontFromUrl)(fontUrl ?? "", fontName);
150
129
  }
151
130
  this.textObject.set({ fontFamily: fontName });
152
- this.autoChangeFontSize(0.1);
153
- this.textObject.set({
154
- width: this.width,
155
- });
156
- this.canvas?.renderAll?.();
131
+ this.fire("scaling");
157
132
  },
158
133
  setSizes: function (options) {
159
134
  const { width, height } = options;
@@ -167,9 +142,6 @@ const TextInputClass = fabric_1.fabric.util.createClass(fabric_1.fabric.Group, {
167
142
  },
168
143
  setTextAttributes: function (options) {
169
144
  this.textObject.set(options);
170
- this.textObject.set({
171
- width: this.width,
172
- });
173
145
  this.canvas?.renderAll?.();
174
146
  },
175
147
  getTextAttribute: function (attribute) {
@@ -1,6 +1,6 @@
1
- export declare const OBJECT_TYPES: {
2
- textInput: string;
3
- clipart: string;
4
- imagePlaceHolder: string;
5
- activeSelection: string;
6
- };
1
+ export declare const OBJECT_TYPES: {
2
+ textInput: string;
3
+ clipart: string;
4
+ imagePlaceHolder: string;
5
+ activeSelection: string;
6
+ };
@@ -1,12 +1,12 @@
1
- "use strict";
2
- Object.defineProperty(exports, "__esModule", { value: true });
3
- exports.OBJECT_TYPES = void 0;
4
- const constants_1 = require("../ClipartObject/constants");
5
- const constants_2 = require("../ImagePlaceholderObject/constants");
6
- const constants_3 = require("../TextInputObject/constants");
7
- exports.OBJECT_TYPES = {
8
- textInput: constants_3.TEXT_INPUT_OBJECT_ATTRIBUTES.type,
9
- clipart: constants_1.CLIPART_OBJECT_ATTRIBUTES.type,
10
- imagePlaceHolder: constants_2.IMAGE_PLACEHOLDER_OBJECT_ATTRIBUTES.type,
11
- activeSelection: "activeSelection",
12
- };
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", { value: true });
3
+ exports.OBJECT_TYPES = void 0;
4
+ const constants_1 = require("../ClipartObject/constants");
5
+ const constants_2 = require("../ImagePlaceholderObject/constants");
6
+ const constants_3 = require("../TextInputObject/constants");
7
+ exports.OBJECT_TYPES = {
8
+ textInput: constants_3.TEXT_INPUT_OBJECT_ATTRIBUTES.type,
9
+ clipart: constants_1.CLIPART_OBJECT_ATTRIBUTES.type,
10
+ imagePlaceHolder: constants_2.IMAGE_PLACEHOLDER_OBJECT_ATTRIBUTES.type,
11
+ activeSelection: "activeSelection",
12
+ };
package/package.json CHANGED
@@ -1,25 +1,25 @@
1
- {
2
- "name": "customized-fabric",
3
- "version": "1.9.0",
4
- "description": "Customized fabric",
5
- "main": "lib/index.js",
6
- "types": "lib/index.d.ts",
7
- "files": [
8
- "lib"
9
- ],
10
- "scripts": {
11
- "test": "echo \"Error: no test specified\" && exit 1",
12
- "build": "tsc",
13
- "prepare": "npm run build"
14
- },
15
- "author": "",
16
- "license": "ISC",
17
- "dependencies": {
18
- "@types/node": "^20.6.0",
19
- "fabric": "^5.3.0"
20
- },
21
- "devDependencies": {
22
- "@types/fabric": "^5.3.3",
23
- "typescript": "^5.2.2"
24
- }
25
- }
1
+ {
2
+ "name": "customized-fabric",
3
+ "version": "1.9.2",
4
+ "description": "Customized fabric",
5
+ "main": "lib/index.js",
6
+ "types": "lib/index.d.ts",
7
+ "files": [
8
+ "lib"
9
+ ],
10
+ "scripts": {
11
+ "test": "echo \"Error: no test specified\" && exit 1",
12
+ "build": "tsc",
13
+ "prepare": "npm run build"
14
+ },
15
+ "author": "",
16
+ "license": "ISC",
17
+ "dependencies": {
18
+ "@types/node": "^20.6.0",
19
+ "fabric": "^5.3.0"
20
+ },
21
+ "devDependencies": {
22
+ "@types/fabric": "^5.3.3",
23
+ "typescript": "^5.2.2"
24
+ }
25
+ }