fabric
Version:
Object model for HTML5 canvas, and SVG-to-canvas parser. Backed by jsdom and node-canvas.
5 lines • 3.81 kB
JavaScript
import{_defineProperty as e}from"../../_virtual/_@oxc-project_runtime@0.122.0/helpers/defineProperty.min.mjs";import{iMatrix as t}from"../constants.min.mjs";import{classRegistry as n}from"../ClassRegistry.min.mjs";import{uid as r}from"../util/internals/uid.min.mjs";import{pick as i}from"../util/misc/pick.min.mjs";import{matrixToSVG as a}from"../util/misc/svgExport.min.mjs";import{isPath as o}from"../util/typeAssertions.min.mjs";import{escapeXml as s}from"../util/lang_string.min.mjs";import{parseTransformAttribute as c}from"../parser/parseTransformAttribute.min.mjs";import{linearDefaultCoords as l,radialDefaultCoords as u}from"./constants.min.mjs";import{parseColorStops as d}from"./parser/parseColorStops.min.mjs";import{parseGradientUnits as f,parseType as p}from"./parser/misc.min.mjs";import{parseCoords as m}from"./parser/parseCoords.min.mjs";var h=class{constructor(e){let{type:t=`linear`,gradientUnits:n=`pixels`,coords:i={},colorStops:a=[],offsetX:o=0,offsetY:s=0,gradientTransform:c,id:d}=e||{};Object.assign(this,{type:t,gradientUnits:n,coords:{...t===`radial`?u:l,...i},colorStops:a,offsetX:o,offsetY:s,gradientTransform:c,id:d?`${d}_${r()}`:r()})}addColorStop(e){for(let t in e)this.colorStops.push({offset:parseFloat(t),color:e[t]});return this}toObject(e){return{...i(this,e),type:this.type,coords:{...this.coords},colorStops:this.colorStops.map(e=>({...e})),offsetX:this.offsetX,offsetY:this.offsetY,gradientUnits:this.gradientUnits,gradientTransform:this.gradientTransform?[...this.gradientTransform]:void 0}}toSVG(e,{additionalTransform:n}={}){let r=[],i=this.gradientTransform?this.gradientTransform.concat():t.concat(),c=this.gradientUnits===`pixels`?`userSpaceOnUse`:`objectBoundingBox`,l=this.colorStops.map(e=>({...e})).sort((e,t)=>e.offset-t.offset),u=-this.offsetX,d=-this.offsetY;c===`objectBoundingBox`?(u/=e.width,d/=e.height):(u+=e.width/2,d+=e.height/2),o(e)&&this.gradientUnits!==`percentage`&&(u-=e.pathOffset.x,d-=e.pathOffset.y),i[4]-=u,i[5]-=d;let f=[`id="SVGID_${s(String(this.id))}"`,`gradientUnits="${c}"`,`gradientTransform="${n?n+` `:``}${a(i)}"`,``].join(` `),p=e=>parseFloat(String(e));if(this.type===`linear`){let{x1:e,y1:t,x2:n,y2:i}=this.coords,a=p(e),o=p(t),s=p(n),c=p(i);r.push(`<linearGradient `,f,` x1="`,a,`" y1="`,o,`" x2="`,s,`" y2="`,c,`">
`)}else if(this.type===`radial`){let{x1:e,y1:t,x2:n,y2:i,r1:a,r2:o}=this.coords,s=p(e),c=p(t),u=p(n),d=p(i),m=p(a),h=p(o),g=m>h;r.push(`<radialGradient `,f,` cx="`,g?s:u,`" cy="`,g?c:d,`" r="`,g?m:h,`" fx="`,g?u:s,`" fy="`,g?d:c,`">
`),g&&(l.reverse(),l.forEach(e=>{e.offset=1-e.offset}));let _=Math.min(m,h);if(_>0){let e=_/Math.max(m,h);l.forEach(t=>{t.offset+=e*(1-t.offset)})}}return l.forEach(({color:e,offset:t})=>{r.push(`<stop offset="${100*t}%" style="stop-color:${e};"/>\n`)}),r.push(this.type===`linear`?`</linearGradient>`:`</radialGradient>`,`
`),r.join(``)}toLive(e){let{x1:t,y1:n,x2:r,y2:i,r1:a,r2:o}=this.coords,s=this.type===`linear`?e.createLinearGradient(t,n,r,i):e.createRadialGradient(t,n,a,r,i,o);return this.colorStops.forEach(({color:e,offset:t})=>{s.addColorStop(t,e)}),s}static async fromObject(e){let{colorStops:t,gradientTransform:n}=e;return new this({...e,colorStops:t?t.map(e=>({...e})):void 0,gradientTransform:n?[...n]:void 0})}static fromElement(e,t,n){let r=f(e),i=t._findCenterFromElement();return new this({id:e.getAttribute(`id`)||void 0,type:p(e),coords:m(e,{width:n.viewBoxWidth||n.width,height:n.viewBoxHeight||n.height}),colorStops:d(e,n.opacity),gradientUnits:r,gradientTransform:c(e.getAttribute(`gradientTransform`)||``),...r===`pixels`?{offsetX:t.width/2-i.x,offsetY:t.height/2-i.y}:{offsetX:0,offsetY:0}})}};e(h,`type`,`Gradient`),n.setClass(h,`gradient`),n.setClass(h,`linear`),n.setClass(h,`radial`);export{h as Gradient};
//# sourceMappingURL=Gradient.min.mjs.map