@tldraw/editor
Version:
tldraw infinite canvas SDK (editor).
8 lines (7 loc) • 4.34 kB
Source Map (JSON)
{
"version": 3,
"sources": ["../../../src/lib/exports/embedMedia.ts"],
"sourcesContent": ["import { MediaHelpers } from '@tldraw/utils'\nimport { getRenderedChildren } from './domUtils'\nimport { resourceToDataUrl } from './fetchCache'\n\nfunction copyAttrs(source: Element, target: Element) {\n\tconst attrs = Array.from(source.attributes)\n\tattrs.forEach((attr) => {\n\t\ttarget.setAttribute(attr.name, attr.value)\n\t})\n}\n\nfunction replace(original: HTMLElement, replacement: HTMLElement) {\n\toriginal.replaceWith(replacement)\n\treturn replacement\n}\n\nasync function createImage(dataUrl: string | null, cloneAttributesFrom?: HTMLElement) {\n\tconst image = document.createElement('img')\n\n\tif (cloneAttributesFrom) {\n\t\tcopyAttrs(cloneAttributesFrom, image)\n\t}\n\n\timage.setAttribute('src', dataUrl ?? 'data:')\n\timage.setAttribute('decoding', 'sync')\n\timage.setAttribute('loading', 'eager')\n\n\ttry {\n\t\tawait image.decode()\n\t} catch {\n\t\t// this is fine\n\t}\n\treturn image\n}\n\nasync function getCanvasReplacement(canvas: HTMLCanvasElement) {\n\ttry {\n\t\tconst dataURL = canvas.toDataURL()\n\t\treturn await createImage(dataURL, canvas)\n\t} catch {\n\t\treturn await createImage(null, canvas)\n\t}\n}\n\nasync function getVideoReplacement(video: HTMLVideoElement) {\n\ttry {\n\t\tconst dataUrl = await MediaHelpers.getVideoFrameAsDataUrl(video)\n\t\treturn createImage(dataUrl, video)\n\t} catch (err) {\n\t\tconsole.error('Could not get video frame', err)\n\t}\n\n\tif (video.poster) {\n\t\tconst dataUrl = await resourceToDataUrl(video.poster)\n\t\treturn createImage(dataUrl, video)\n\t}\n\n\treturn createImage(null, video)\n}\n\nexport async function embedMedia(node: HTMLElement) {\n\tif (node instanceof HTMLCanvasElement) {\n\t\treturn replace(node, await getCanvasReplacement(node))\n\t} else if (node instanceof HTMLVideoElement) {\n\t\treturn replace(node, await getVideoReplacement(node))\n\t} else if (node instanceof HTMLImageElement) {\n\t\tconst src = node.currentSrc || node.src\n\t\tconst dataUrl = await resourceToDataUrl(src)\n\t\tnode.setAttribute('src', dataUrl ?? 'data:')\n\t\tnode.setAttribute('decoding', 'sync')\n\t\tnode.setAttribute('loading', 'eager')\n\t\ttry {\n\t\t\tawait node.decode()\n\t\t} catch {\n\t\t\t// this is fine\n\t\t}\n\t\treturn node\n\t} else if (node instanceof HTMLInputElement) {\n\t\t// if an input has a value, make sure it's serialized when we convert to svg\n\t\tnode.setAttribute('value', node.value)\n\t} else if (node instanceof HTMLTextAreaElement) {\n\t\tnode.textContent = node.value\n\t}\n\n\tawait Promise.all(\n\t\tArray.from(getRenderedChildren(node), (child) => embedMedia(child as HTMLElement))\n\t)\n}\n"],
"mappings": "AAAA,SAAS,oBAAoB;AAC7B,SAAS,2BAA2B;AACpC,SAAS,yBAAyB;AAElC,SAAS,UAAU,QAAiB,QAAiB;AACpD,QAAM,QAAQ,MAAM,KAAK,OAAO,UAAU;AAC1C,QAAM,QAAQ,CAAC,SAAS;AACvB,WAAO,aAAa,KAAK,MAAM,KAAK,KAAK;AAAA,EAC1C,CAAC;AACF;AAEA,SAAS,QAAQ,UAAuB,aAA0B;AACjE,WAAS,YAAY,WAAW;AAChC,SAAO;AACR;AAEA,eAAe,YAAY,SAAwB,qBAAmC;AACrF,QAAM,QAAQ,SAAS,cAAc,KAAK;AAE1C,MAAI,qBAAqB;AACxB,cAAU,qBAAqB,KAAK;AAAA,EACrC;AAEA,QAAM,aAAa,OAAO,WAAW,OAAO;AAC5C,QAAM,aAAa,YAAY,MAAM;AACrC,QAAM,aAAa,WAAW,OAAO;AAErC,MAAI;AACH,UAAM,MAAM,OAAO;AAAA,EACpB,QAAQ;AAAA,EAER;AACA,SAAO;AACR;AAEA,eAAe,qBAAqB,QAA2B;AAC9D,MAAI;AACH,UAAM,UAAU,OAAO,UAAU;AACjC,WAAO,MAAM,YAAY,SAAS,MAAM;AAAA,EACzC,QAAQ;AACP,WAAO,MAAM,YAAY,MAAM,MAAM;AAAA,EACtC;AACD;AAEA,eAAe,oBAAoB,OAAyB;AAC3D,MAAI;AACH,UAAM,UAAU,MAAM,aAAa,uBAAuB,KAAK;AAC/D,WAAO,YAAY,SAAS,KAAK;AAAA,EAClC,SAAS,KAAK;AACb,YAAQ,MAAM,6BAA6B,GAAG;AAAA,EAC/C;AAEA,MAAI,MAAM,QAAQ;AACjB,UAAM,UAAU,MAAM,kBAAkB,MAAM,MAAM;AACpD,WAAO,YAAY,SAAS,KAAK;AAAA,EAClC;AAEA,SAAO,YAAY,MAAM,KAAK;AAC/B;AAEA,eAAsB,WAAW,MAAmB;AACnD,MAAI,gBAAgB,mBAAmB;AACtC,WAAO,QAAQ,MAAM,MAAM,qBAAqB,IAAI,CAAC;AAAA,EACtD,WAAW,gBAAgB,kBAAkB;AAC5C,WAAO,QAAQ,MAAM,MAAM,oBAAoB,IAAI,CAAC;AAAA,EACrD,WAAW,gBAAgB,kBAAkB;AAC5C,UAAM,MAAM,KAAK,cAAc,KAAK;AACpC,UAAM,UAAU,MAAM,kBAAkB,GAAG;AAC3C,SAAK,aAAa,OAAO,WAAW,OAAO;AAC3C,SAAK,aAAa,YAAY,MAAM;AACpC,SAAK,aAAa,WAAW,OAAO;AACpC,QAAI;AACH,YAAM,KAAK,OAAO;AAAA,IACnB,QAAQ;AAAA,IAER;AACA,WAAO;AAAA,EACR,WAAW,gBAAgB,kBAAkB;AAE5C,SAAK,aAAa,SAAS,KAAK,KAAK;AAAA,EACtC,WAAW,gBAAgB,qBAAqB;AAC/C,SAAK,cAAc,KAAK;AAAA,EACzB;AAEA,QAAM,QAAQ;AAAA,IACb,MAAM,KAAK,oBAAoB,IAAI,GAAG,CAAC,UAAU,WAAW,KAAoB,CAAC;AAAA,EAClF;AACD;",
"names": []
}