@umituz/web-canvas 1.0.5 → 1.0.6

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,11 +0,0 @@
1
- import {
2
- ReportService,
3
- ScreenshotStudioService
4
- } from "../chunk-DNKRSL6D.mjs";
5
- import "../chunk-UOGTEMIJ.mjs";
6
- import "../chunk-Z6IB4BQV.mjs";
7
- import "../chunk-MC6PNV2F.mjs";
8
- export {
9
- ReportService,
10
- ScreenshotStudioService
11
- };
@@ -1,358 +0,0 @@
1
- import {
2
- ScreenshotRenderer
3
- } from "./chunk-UOGTEMIJ.mjs";
4
- import {
5
- DEFAULT_SCREENSHOT_STUDIO_CONFIG
6
- } from "./chunk-Z6IB4BQV.mjs";
7
-
8
- // src/application/services/ScreenshotStudioService.ts
9
- var ScreenshotStudioService = class {
10
- constructor(config) {
11
- this.config = {
12
- ...DEFAULT_SCREENSHOT_STUDIO_CONFIG,
13
- ...config
14
- };
15
- this.renderer = new ScreenshotRenderer();
16
- }
17
- /**
18
- * Generate screenshot
19
- */
20
- async generateScreenshot(options) {
21
- const deviceConfig = this.config.device?.devices.find(
22
- (d) => d === options.deviceType
23
- );
24
- if (!deviceConfig) {
25
- throw new Error(`Device configuration not found for ${options.deviceType}`);
26
- }
27
- const canvas = this.renderer["canvasRenderer"].createCanvas(
28
- options.customDimensions || { width: 1290, height: 2796 }
29
- );
30
- const ctx = canvas.getContext("2d");
31
- if (!ctx) {
32
- throw new Error("Failed to get canvas context");
33
- }
34
- this.renderer["renderPlaceholderContent"](
35
- ctx,
36
- { width: canvas.width, height: canvas.height },
37
- options.deviceType
38
- );
39
- const blob = await this.renderer["canvasRenderer"].exportToBlob(canvas, {
40
- format: options.format || this.config.export?.defaultFormat || "png",
41
- quality: options.quality || this.config.canvas?.defaultQuality || 0.9
42
- });
43
- return {
44
- id: this.generateId(),
45
- deviceType: options.deviceType,
46
- dimensions: { width: canvas.width, height: canvas.height },
47
- format: options.format || this.config.export?.defaultFormat || "png",
48
- timestamp: /* @__PURE__ */ new Date(),
49
- fileSize: blob.blob.size,
50
- url: blob.url
51
- };
52
- }
53
- /**
54
- * Generate batch screenshots
55
- */
56
- async generateBatchScreenshots(deviceTypes) {
57
- const BATCH_SIZE = 3;
58
- const results = [];
59
- for (let i = 0; i < deviceTypes.length; i += BATCH_SIZE) {
60
- const batch = deviceTypes.slice(i, i + BATCH_SIZE);
61
- const batchPromises = batch.map(
62
- (deviceType) => this.generateScreenshot({ deviceType })
63
- );
64
- const batchResults = await Promise.all(batchPromises);
65
- results.push(...batchResults);
66
- }
67
- return results;
68
- }
69
- /**
70
- * Generate designed screenshot
71
- */
72
- async generateDesignedScreenshot(content, design) {
73
- const canvas = await this.renderer.renderDesignedScreenshot(content, design);
74
- const blob = await this.renderer["canvasRenderer"].exportToBlob(canvas, {
75
- format: "png"
76
- });
77
- return {
78
- id: this.generateId(),
79
- deviceType: design.deviceType,
80
- dimensions: { width: canvas.width, height: canvas.height },
81
- format: "png",
82
- timestamp: /* @__PURE__ */ new Date(),
83
- fileSize: blob.blob.size,
84
- url: blob.url
85
- };
86
- }
87
- /**
88
- * Export project as ZIP
89
- */
90
- async exportProjectAsZip(project) {
91
- const JSZip = (await import("jszip")).default;
92
- const zip = new JSZip();
93
- const folder = zip.folder(project.currentLanguage);
94
- if (!folder) {
95
- throw new Error("Failed to create folder in ZIP");
96
- }
97
- if (this.config.export?.includeMetadata) {
98
- const metadataText = `APP NAME: ${project.appMetadata.appName}
99
- SUBTITLE: ${project.appMetadata.subtitle}
100
- DESCRIPTION:
101
- ${project.appMetadata.description}
102
-
103
- KEYWORDS: ${project.appMetadata.keywords}
104
- WHATS NEW:
105
- ${project.appMetadata.whatsNew}`;
106
- folder.file("aso_metadata.txt", metadataText);
107
- }
108
- const screenshotPromises = project.screens.map(
109
- (screen, index) => this.generateDesignedScreenshot(screen, project.design).then((screenshot) => ({ screenshot, index }))
110
- );
111
- const screenshots = await Promise.all(screenshotPromises);
112
- screenshots.forEach(({ screenshot, index }) => {
113
- const base64Data = screenshot.url.split(",")[1];
114
- folder.file(
115
- `screen_${index + 1}_${project.design.deviceType}.png`,
116
- base64Data,
117
- { base64: true }
118
- );
119
- });
120
- return await zip.generateAsync({ type: "blob" });
121
- }
122
- /**
123
- * Create project
124
- */
125
- createProject(name) {
126
- return {
127
- id: this.generateId(),
128
- name,
129
- design: this.getDefaultDesign(),
130
- screens: [this.getDefaultScreen()],
131
- currentLanguage: this.config.defaultLanguage || "en-US",
132
- selectedScreenId: "1",
133
- appMetadata: {
134
- appName: "My App",
135
- subtitle: "App Description",
136
- promotionalText: "Promotional text",
137
- keywords: "keyword1, keyword2",
138
- description: "App description",
139
- whatsNew: "What is new in this version"
140
- },
141
- appIcon: null,
142
- createdAt: /* @__PURE__ */ new Date(),
143
- updatedAt: /* @__PURE__ */ new Date()
144
- };
145
- }
146
- /**
147
- * Get default design
148
- */
149
- getDefaultDesign() {
150
- return {
151
- backgroundColor: "#6366f1",
152
- backgroundGradientEnd: "#a855f7",
153
- backgroundImage: null,
154
- backgroundBlur: 0,
155
- backgroundOverlayOpacity: 0,
156
- backgroundPattern: "none",
157
- textColor: "#ffffff",
158
- highlightColor: "#fbbf24",
159
- textAlign: "center",
160
- deviceColor: "#1f2937",
161
- deviceType: this.config.device?.defaultDevice || "iphone-15-pro",
162
- frameStyle: "realistic",
163
- layout: "text-top",
164
- scale: 0.85,
165
- fontFamily: "Inter",
166
- titleFontSize: 60,
167
- subtitleFontSize: 24,
168
- titleFontWeight: "900",
169
- subtitleFontWeight: "500",
170
- textCase: "uppercase",
171
- lineHeight: 0.9,
172
- letterSpacing: -1,
173
- rotation: 0,
174
- rotationX: 0,
175
- rotationY: 0,
176
- rotationZ: 0,
177
- offsetY: 0,
178
- shadowIntensity: 0.5,
179
- padding: 40,
180
- gap: 20,
181
- isPanoramic: false
182
- };
183
- }
184
- /**
185
- * Get default screen
186
- */
187
- getDefaultScreen() {
188
- return {
189
- id: "1",
190
- title: "MY *APP*",
191
- subtitle: "Your app description here",
192
- screenshot: null,
193
- translations: {
194
- "en-US": { title: "MY *APP*", subtitle: "Your app description here" }
195
- },
196
- imageFit: "cover",
197
- imageZoom: 1,
198
- imageAnchorX: 50,
199
- imageAnchorY: 50
200
- };
201
- }
202
- /**
203
- * Generate unique ID - optimized version
204
- */
205
- generateId() {
206
- if (typeof crypto !== "undefined" && crypto.randomUUID) {
207
- return crypto.randomUUID();
208
- }
209
- return `${Date.now().toString(36)}-${Math.random().toString(36).substring(2, 9)}`;
210
- }
211
- };
212
-
213
- // src/application/services/ReportService.ts
214
- var ReportService = class _ReportService {
215
- static getInstance() {
216
- if (!_ReportService.instance) {
217
- _ReportService.instance = new _ReportService();
218
- }
219
- return _ReportService.instance;
220
- }
221
- /**
222
- * Export DOM element to PDF
223
- */
224
- async exportToPDF(elementId, options = {}) {
225
- const html2canvas = (await import("html2canvas")).default;
226
- const jsPDF = (await import("jspdf")).default;
227
- const element = document.getElementById(elementId);
228
- if (!element) {
229
- throw new Error("Report element not found");
230
- }
231
- const canvas = await html2canvas(element, {
232
- scale: options.scale || 2,
233
- useCORS: options.useCORS !== false,
234
- backgroundColor: options.backgroundColor || "#ffffff"
235
- });
236
- const imgData = canvas.toDataURL("image/png");
237
- const pdf = new jsPDF("p", "mm", "a4");
238
- const imgWidth = 210;
239
- const imgHeight = canvas.height * imgWidth / canvas.width;
240
- pdf.addImage(imgData, "PNG", 0, 0, imgWidth, imgHeight);
241
- pdf.save(options.filename || "report.pdf");
242
- }
243
- /**
244
- * Export canvas to PDF
245
- */
246
- async exportCanvasToPDF(canvas, options = {}) {
247
- const jsPDF = (await import("jspdf")).default;
248
- const imgData = canvas.toDataURL("image/png");
249
- const pdf = new jsPDF("p", "mm", "a4");
250
- const imgWidth = 210;
251
- const imgHeight = canvas.height * imgWidth / canvas.width;
252
- pdf.addImage(imgData, "PNG", 0, 0, imgWidth, imgHeight);
253
- pdf.save(options.filename || "canvas-export.pdf");
254
- }
255
- /**
256
- * Export data to Excel
257
- */
258
- async exportToExcel(data, options = {}) {
259
- const XLSX = await import("xlsx");
260
- const wb = XLSX.utils.book_new();
261
- const apps = data.items.filter((i) => i.type === "app").map((i) => ({ Name: i.name, ...i.metrics, ...i.details }));
262
- const campaigns = data.items.filter((i) => i.type === "campaign").map((i) => ({ Name: i.name, ...i.metrics, ...i.details }));
263
- const posts = data.items.filter((i) => i.type === "post").map((i) => ({ Name: i.name, ...i.metrics, ...i.details }));
264
- if (apps.length > 0) {
265
- XLSX.utils.book_append_sheet(
266
- wb,
267
- XLSX.utils.json_to_sheet(apps),
268
- options.sheetName || "Apps"
269
- );
270
- }
271
- if (campaigns.length > 0) {
272
- XLSX.utils.book_append_sheet(
273
- wb,
274
- XLSX.utils.json_to_sheet(campaigns),
275
- "Campaigns"
276
- );
277
- }
278
- if (posts.length > 0) {
279
- XLSX.utils.book_append_sheet(
280
- wb,
281
- XLSX.utils.json_to_sheet(posts),
282
- "Posts"
283
- );
284
- }
285
- if (options.includeSummary !== false) {
286
- const summary = [
287
- { Metric: "Total Reach", Value: data.summary.totalReach },
288
- {
289
- Metric: "Total Engagement",
290
- Value: data.summary.totalEngagement
291
- },
292
- {
293
- Metric: "Average Score",
294
- Value: data.summary.averageScore
295
- },
296
- {
297
- Metric: "Export Date",
298
- Value: (/* @__PURE__ */ new Date()).toLocaleDateString()
299
- }
300
- ];
301
- XLSX.utils.book_append_sheet(
302
- wb,
303
- XLSX.utils.json_to_sheet(summary),
304
- "Summary"
305
- );
306
- }
307
- XLSX.writeFile(wb, options.filename || "report.xlsx");
308
- }
309
- /**
310
- * Export data to CSV
311
- */
312
- exportToCSV(data, filename = "report.csv", delimiter = ",") {
313
- const headers = ["Type", "Name", "Metrics"];
314
- const rows = data.items.map((item) => [
315
- item.type,
316
- item.name,
317
- JSON.stringify(item.metrics)
318
- ]);
319
- const csvContent = [headers, ...rows].map((row) => row.map((cell) => `"${cell}"`).join(delimiter)).join("\n");
320
- const blob = new Blob([csvContent], { type: "text/csv;charset=utf-8;" });
321
- const url = URL.createObjectURL(blob);
322
- const link = document.createElement("a");
323
- link.href = url;
324
- link.download = filename;
325
- link.click();
326
- URL.revokeObjectURL(url);
327
- }
328
- /**
329
- * Export multiple elements to PDF
330
- */
331
- async exportMultipleToPDF(elementIds, options = {}) {
332
- const html2canvas = (await import("html2canvas")).default;
333
- const jsPDF = (await import("jspdf")).default;
334
- const pdf = new jsPDF("p", "mm", "a4");
335
- for (let i = 0; i < elementIds.length; i++) {
336
- const element = document.getElementById(elementIds[i]);
337
- if (!element) continue;
338
- const canvas = await html2canvas(element, {
339
- scale: options.scale || 2,
340
- useCORS: options.useCORS !== false,
341
- backgroundColor: options.backgroundColor || "#ffffff"
342
- });
343
- const imgData = canvas.toDataURL("image/png");
344
- const imgWidth = 210;
345
- const imgHeight = canvas.height * imgWidth / canvas.width;
346
- if (i > 0) {
347
- pdf.addPage();
348
- }
349
- pdf.addImage(imgData, "PNG", 0, 0, imgWidth, imgHeight);
350
- }
351
- pdf.save(options.filename || "multi-page-report.pdf");
352
- }
353
- };
354
-
355
- export {
356
- ScreenshotStudioService,
357
- ReportService
358
- };