| import { ProjectTemplate } from '../project-templates'; |
| import { saveManager } from '../save-manager'; |
|
|
| const CANVAS_SVG = `url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='360' height='360' viewBox='0 0 300 300'%3E%3Crect x='52' y='52' width='256' height='256' rx='10' ry='9' fill='%23ffffff'/%3E%3Cg transform='translate(52,308) scale(0.0476,-0.0476)' fill='%23121214' stroke='none'%3E%3Cpath d='M725 4825 c-50 -18 -100 -71 -114 -122 -22 -54 -15 -1573 0 -1628 16 -55 44 -92 89 -115 38 -19 62 -20 855 -20 781 0 817 1 853 19 46 23 67 46 87 94 13 32 15 138 15 830 0 566 -3 804 -11 828 -16 45 -55 87 -104 110 -38 18 -82 19 -835 18 -659 0 -802 -2 -835 -14z m1351 -371 c15 -11 37 -33 48 -48 21 -27 21 -38 21 -520 0 -547 3 -523 -68 -566 -31 -19 -54 -20 -521 -20 -483 0 -489 0 -524 22 -20 12 -42 38 -53 62 -17 38 -19 74 -19 504 0 496 1 503 51 548 46 41 66 43 561 41 464 -2 477 -3 504 -23z'/%3E%3Cpath d='M3058 4830 c-44 -13 -87 -49 -108 -90 -19 -37 -20 -61 -20 -471 0 -428 0 -432 22 -471 13 -22 41 -51 64 -64 41 -24 41 -24 685 -24 645 0 645 0 689 -22 63 -33 80 -71 80 -183 0 -101 -15 -144 -63 -179 -28 -21 -41 -21 -695 -26 -666 -5 -667 -5 -702 -27 -109 -68 -106 -247 5 -310 40 -23 40 -23 858 -23 664 0 824 3 850 14 43 17 95 78 102 118 3 18 5 225 3 459 -3 426 -3 426 -31 462 -58 76 -15 71 -757 77 -620 5 -667 6 -692 23 -44 30 -58 74 -58 179 0 116 16 153 80 186 44 22 44 22 693 22 710 0 678 -3 731 60 80 96 41 240 -79 287 -35 14 -1612 17 -1657 3z'/%3E%3Cpath d='M702 2509 c-48 -24 -75 -57 -91 -114 -9 -29 -11 -253 -9 -840 3 -779 4 -801 23 -834 11 -19 37 -48 58 -65 39 -31 39 -31 380 -31 342 0 342 0 399 28 31 15 63 39 73 53 16 25 16 25 62 -16 77 -67 104 -71 470 -68 320 3 320 3 360 30 24 16 49 44 62 70 21 44 21 49 21 854 0 773 -1 811 -19 851 -35 76 -135 120 -215 93 -41 -13 -90 -51 -109 -84 -9 -16 -13 -187 -17 -688 -5 -654 -5 -667 -26 -694 -43 -58 -68 -69 -169 -72 -82 -3 -99 -1 -133 18 -22 12 -49 39 -61 60 -21 37 -21 45 -21 664 0 439 -3 641 -11 673 -32 123 -190 174 -285 91 -73 -64 -69 -20 -70 -743 0 -721 3 -687 -66 -737 -28 -20 -47 -23 -133 -26 -91 -3 -103 -2 -134 20 -19 13 -44 36 -55 51 -21 28 -21 38 -26 695 -4 481 -8 673 -17 687 -50 87 -152 118 -241 74z'/%3E%3Cpath d='M3047 2515 c-47 -16 -81 -46 -101 -90 -14 -28 -16 -95 -16 -463 0 -281 4 -440 11 -459 15 -40 48 -73 94 -94 38 -17 79 -19 685 -19 626 0 646 -1 678 -20 58 -35 72 -72 72 -185 0 -110 -14 -147 -67 -182 -25 -17 -73 -18 -698 -23 -672 -5 -672 -5 -708 -33 -20 -15 -44 -42 -53 -60 -21 -39 -21 -125 -1 -163 20 -38 65 -80 100 -93 19 -8 289 -11 833 -11 701 0 809 2 841 15 48 20 71 41 94 88 19 35 19 60 17 480 -3 444 -3 444 -30 479 -54 71 -23 68 -740 68 -612 0 -645 1 -685 20 -67 30 -83 66 -83 183 0 116 14 156 68 189 35 21 35 21 691 22 606 1 658 2 688 19 137 74 130 264 -12 328 -38 18 -85 19 -840 18 -652 0 -807 -2 -838 -14z'/%3E%3C/g%3E%3C/svg%3E")`; |
|
|
| export const CANVAS_CSS = `.canvas { position: fixed; inset: 0; z-index: 0; background-image: ${CANVAS_SVG}; background-size: 36px 36px; opacity: 0.04; transform: rotate(-10deg) scale(1.5); transform-origin: center center; pointer-events: none; }`; |
|
|
| export const CANVAS_HTML = '<div class="canvas"></div>'; |
|
|
| export interface AssetConfig { |
| |
| filename: string; |
| |
| path: string; |
| } |
|
|
| export async function createProjectFromTemplate( |
| vfs: any, |
| projectId: string, |
| template: ProjectTemplate, |
| assets?: AssetConfig[] |
| ): Promise<void> { |
| await saveManager.runWithSuppressedDirty(projectId, async () => { |
| |
| for (const dir of template.directories) { |
| await vfs.createDirectory(projectId, dir); |
| } |
|
|
| |
| for (const file of template.files) { |
| let content: string | ArrayBuffer = file.content; |
|
|
| if (file.isBase64) { |
| const binaryString = atob(file.content); |
| const bytes = new Uint8Array(binaryString.length); |
| for (let i = 0; i < binaryString.length; i++) { |
| bytes[i] = binaryString.charCodeAt(i); |
| } |
| content = bytes.buffer; |
| } |
|
|
| await vfs.createFile(projectId, file.path, content); |
| } |
|
|
| |
| if (assets && assets.length > 0) { |
| for (const asset of assets) { |
| try { |
| const response = await fetch(`${window.location.origin}/${asset.filename}`); |
| if (response.ok) { |
| const arrayBuffer = await response.arrayBuffer(); |
| await vfs.createFile(projectId, asset.path, arrayBuffer); |
| } else { |
| console.warn(`Asset fetch failed (${response.status}): ${asset.filename}`); |
| } |
| } catch (error) { |
| console.warn(`Asset fetch error: ${asset.filename}`, error); |
| } |
| } |
| } |
| }); |
| } |
