fabric
Version:
Object model for HTML5 canvas, and SVG-to-canvas parser. Backed by jsdom and node-canvas.
1 lines • 3.28 kB
Source Map (JSON)
{"version":3,"file":"dom.min.mjs","names":[],"sources":["../../../../src/util/misc/dom.ts"],"sourcesContent":["import { getFabricDocument } from '../../env';\nimport type { ImageFormat, TSize } from '../../typedefs';\nimport { FabricError } from '../internals/console';\n/**\n * Creates canvas element\n * @return {CanvasElement} initialized canvas element\n */\nexport const createCanvasElement = (): HTMLCanvasElement => {\n const element = getFabricDocument().createElement('canvas');\n if (!element || typeof element.getContext === 'undefined') {\n throw new FabricError('Failed to create `canvas` element');\n }\n return element;\n};\n\n/**\n * Creates image element (works on client and node)\n * @return {HTMLImageElement} HTML image element\n */\nexport const createImage = (): HTMLImageElement =>\n getFabricDocument().createElement('img');\n\n/**\n * Creates a canvas element that is a copy of another and is also painted\n * @param {CanvasElement} canvas to copy size and content of\n * @return {CanvasElement} initialized canvas element\n */\nexport const copyCanvasElement = (\n canvas: HTMLCanvasElement,\n): HTMLCanvasElement => {\n const newCanvas = createCanvasElementFor(canvas);\n newCanvas.getContext('2d')?.drawImage(canvas, 0, 0);\n return newCanvas;\n};\n\n/**\n * Creates a canvas element as big as another\n * @param {CanvasElement} canvas to copy size and content of\n * @return {CanvasElement} initialized canvas element\n */\nexport const createCanvasElementFor = (\n canvas: HTMLCanvasElement | ImageData | HTMLImageElement | TSize,\n): HTMLCanvasElement => {\n const newCanvas = createCanvasElement();\n newCanvas.width = canvas.width;\n newCanvas.height = canvas.height;\n return newCanvas;\n};\n\n/**\n * since 2.6.0 moved from canvas instance to utility.\n * possibly useless\n * @param {CanvasElement} canvasEl to copy size and content of\n * @param {String} format 'jpeg' or 'png', in some browsers 'webp' is ok too\n * @param {number} quality <= 1 and > 0\n * @return {String} data url\n */\nexport const toDataURL = (\n canvasEl: HTMLCanvasElement,\n format: ImageFormat,\n quality: number,\n) => canvasEl.toDataURL(`image/${format}`, quality);\n\nexport const isHTMLCanvas = (\n canvas?: HTMLCanvasElement | string,\n): canvas is HTMLCanvasElement => {\n return !!canvas && (canvas as HTMLCanvasElement).getContext !== undefined;\n};\n\nexport const toBlob = (\n canvasEl: HTMLCanvasElement,\n format?: ImageFormat,\n quality?: number,\n): Promise<Blob | null> =>\n new Promise((resolve, _) => {\n canvasEl.toBlob(resolve, `image/${format}`, quality);\n });\n"],"mappings":"uHAOA,MAAa,MAAA,CACX,IAAM,EAAU,GAAA,CAAoB,cAAc,SAAA,CAClD,GAAA,CAAK,GAAkB,EAAQ,aAA1B,IAAyC,GAC5C,MAAM,IAAI,EAAY,oCAAA,CAExB,OAAO,GAOI,MACX,GAAA,CAAoB,cAAc,MAAA,CAOvB,EACX,GAAA,CAAA,IAAA,EAEA,IAAM,EAAY,EAAuB,EAAA,CAEzC,OADA,EAAA,EAAU,WAAW,KAAA,GAAK,MAAA,EAAE,UAAU,EAAQ,EAAG,EAAA,CAC1C,GAQI,EACX,GAAA,CAEA,IAAM,EAAY,GAAA,CAGlB,MAFA,GAAU,MAAQ,EAAO,MACzB,EAAU,OAAS,EAAO,OACnB,GAWI,GACX,EACA,EACA,IACG,EAAS,UAAU,SAAS,IAAU,EAAA,CAE9B,EACX,GAAA,CAAA,CAES,GAAW,EAA6B,aAAxC,IAAuD,GAGrD,GACX,EACA,EACA,IAEA,IAAI,SAAS,EAAS,IAAA,CACpB,EAAS,OAAO,EAAS,SAAS,IAAU,EAAA,EAAA,CAAA,OAAA,KAAA,kBAAA,KAAA,oBAAA,KAAA,uBAAA,KAAA,YAAA,KAAA,aAAA,KAAA,OAAA,KAAA"}