(destDir: string, resolution: CanvasResolution)
| 456 | * by hand or move the dimensions inline. |
| 457 | */ |
| 458 | export function applyResolutionPreset(destDir: string, resolution: CanvasResolution): void { |
| 459 | const { width, height } = CANVAS_DIMENSIONS[resolution]; |
| 460 | for (const file of listHtmlFiles(destDir)) { |
| 461 | let html = readFileSync(file, "utf-8"); |
| 462 | let changed = false; |
| 463 | |
| 464 | const dataWidthRe = /(data-width=)["'](\d+)["']/g; |
| 465 | if (dataWidthRe.test(html)) { |
| 466 | html = html.replace(dataWidthRe, `$1"${width}"`); |
| 467 | changed = true; |
| 468 | } |
| 469 | const dataHeightRe = /(data-height=)["'](\d+)["']/g; |
| 470 | if (dataHeightRe.test(html)) { |
| 471 | html = html.replace(dataHeightRe, `$1"${height}"`); |
| 472 | changed = true; |
| 473 | } |
| 474 | |
| 475 | const htmlOpenRe = /<html\b([^>]*)>/i; |
| 476 | const htmlOpen = html.match(htmlOpenRe); |
| 477 | if (htmlOpen) { |
| 478 | const attrs = htmlOpen[1] ?? ""; |
| 479 | let next: string; |
| 480 | if (/data-resolution=/.test(attrs)) { |
| 481 | next = attrs.replace(/data-resolution=["'][^"']*["']/, `data-resolution="${resolution}"`); |
| 482 | } else { |
| 483 | next = `${attrs.replace(/\s+$/, "")} data-resolution="${resolution}"`; |
| 484 | } |
| 485 | if (next !== attrs) { |
| 486 | html = html.replace(htmlOpenRe, `<html${next}>`); |
| 487 | changed = true; |
| 488 | } |
| 489 | } |
| 490 | |
| 491 | // Inline `html, body { ... }` CSS: handle width-before-height and |
| 492 | // height-before-width orderings. Hand-authored templates can use either. |
| 493 | const bodyCssRe = /(html\s*,\s*body\s*\{[^}]*?width:\s*)\d+px([^}]*?height:\s*)\d+px/i; |
| 494 | if (bodyCssRe.test(html)) { |
| 495 | html = html.replace(bodyCssRe, `$1${width}px$2${height}px`); |
| 496 | changed = true; |
| 497 | } |
| 498 | const bodyCssReverseRe = /(html\s*,\s*body\s*\{[^}]*?height:\s*)\d+px([^}]*?width:\s*)\d+px/i; |
| 499 | if (bodyCssReverseRe.test(html)) { |
| 500 | html = html.replace(bodyCssReverseRe, `$1${height}px$2${width}px`); |
| 501 | changed = true; |
| 502 | } |
| 503 | |
| 504 | const viewportRe = /(<meta[^>]*name=["']viewport["'][^>]*content=["'])width=\d+,\s*height=\d+/i; |
| 505 | if (viewportRe.test(html)) { |
| 506 | html = html.replace(viewportRe, `$1width=${width}, height=${height}`); |
| 507 | changed = true; |
| 508 | } |
| 509 | |
| 510 | if (changed) writeFileSync(file, html, "utf-8"); |
| 511 | } |
| 512 | } |
| 513 | |
| 514 | // --------------------------------------------------------------------------- |
| 515 | // scaffoldProject — copy template, patch video refs, write meta.json |
no test coverage detected