svgedit/dist/editor/extensions/ext-polystar/ext-polystar.js

Powerful SVG-Editor for your browser

/**
 * @file ext-polystar.js
 *
 *
 * @copyright 2010 CloudCanvas, Inc. All rights reserved
 * @copyright 2021 Optimistik SAS, Inc. All rights reserved
 * @license MIT
 *
 */
const t="polystar",loadExtensionTranslation=async function(e){let a;const u=e.configObj.pref("lang");try{a=await function __variableDynamicImportRuntime0__(t){switch(t){case"./locale/en.js":return Promise.resolve().then((function(){return l}));case"./locale/fr.js":return Promise.resolve().then((function(){return o}));case"./locale/sv.js":return Promise.resolve().then((function(){return i}));case"./locale/tr.js":return Promise.resolve().then((function(){return n}));case"./locale/uk.js":return Promise.resolve().then((function(){return s}));case"./locale/zh-CN.js":return Promise.resolve().then((function(){return r}));default:return new Promise((function(e,l){("function"==typeof queueMicrotask?queueMicrotask:setTimeout)(l.bind(null,new Error("Unknown variable dynamic import: "+t)))}))}}(`./locale/${u}.js`)}catch(e){console.warn(`Missing translation (${u}) for ${t} - using 'en'`),a=await Promise.resolve().then((function(){return l}))}e.i18next.addResourceBundle(u,t,a.default)};var e={name:t,async init(){const e=this,{svgCanvas:l}=e,{ChangeElementCommand:o}=l.history,addToHistory=t=>{l.undoMgr.addCommandToHistory(t)},{$id:i,$click:n}=l;let s,r,a;await loadExtensionTranslation(e);const showPanel=(t,e)=>{t?i(`${e}_panel`).style.removeProperty("display"):i(`${e}_panel`).style.display="none"},setAttr=(t,e)=>{l.changeSelectedAttribute(t,e),l.call("changed",s)},cot=t=>1/Math.tan(t),sec=t=>1/Math.cos(t);return{name:e.i18next.t(`${t}:name`),callback(){const e=`\n            <se-flyingbutton id="tools_polygon" title="${`${t}:title`}">\n              <se-button id="tool_star" title="${`${t}:buttons.0.title`}" src="star.svg">\n              </se-button>\n              <se-button id="tool_polygon" title="${`${t}:buttons.1.title`}" src="polygon.svg">\n              </se-button>\n            </se-flyingbutton>\n          `;l.insertChildAtIndex(i("tools_left"),e,10),n(i("tool_star"),(()=>{this.leftPanel.updateLeftPanel("tool_star")&&(l.setMode("star"),showPanel(!0,"star"),showPanel(!1,"polygon"))})),n(i("tool_polygon"),(()=>{this.leftPanel.updateLeftPanel("tool_polygon")&&(l.setMode("polygon"),showPanel(!0,"polygon"),showPanel(!1,"star"))}));const r=`${t}:contextTools.0.label`,a=`${t}:contextTools.0.title`,u=`${t}:contextTools.1.label`,d=`${t}:contextTools.1.title`,c=`${t}:contextTools.2.label`,b=`${t}:contextTools.2.title`,g=`${t}:contextTools.3.label`,p=`${t}:contextTools.3.title`,h=document.createElement("template");h.innerHTML=`\n          <div id="star_panel">\n            <se-spin-input id="starNumPoints" label="${r}" min=1 step=1 value=5 title="${a}">\n            </se-spin-input>\n            <se-spin-input id="RadiusMultiplier" label="${u}" min=1 step=2.5 value=3 title="${d}">\n            </se-spin-input>\n            <se-spin-input id="radialShift" min=0 step=1 value=0 label="${c}" title="${b}">\n            </se-spin-input>\n          </div>\n          <div id="polygon_panel">\n            <se-spin-input size="3" id="polySides" min=1 step=1 value=5 label="${g}" title="${p}">\n            </se-spin-input>\n          </div>\n        `,i("tools_top").appendChild(h.content.cloneNode(!0)),showPanel(!1,"star"),showPanel(!1,"polygon"),i("starNumPoints").addEventListener("change",(t=>{setAttr("point",t.target.value);const e=t.target.value;let l=s.length;for(;l--;){const t=s[l];if(t.hasAttribute("r")){const l=t.getAttribute("point"),i=t.getAttribute("points"),n=t.getAttribute("radialshift");let s=0,r=0;if(t.points){const a=t.points,u=a.numberOfItems;for(let t=0;t<u;++t){const e=a.getItem(t);s+=parseFloat(e.x),r+=parseFloat(e.y)}const d=s/u,c=r/u,b=Number(t.getAttribute("r")),g=b/t.getAttribute("starRadiusMultiplier");let p="";for(let t=0;e>=t;t++){let l=2*Math.PI*(t/e);l-=Math.PI/2;let o=b*Math.cos(l)+d,i=b*Math.sin(l)+c;p+=o+","+i+" ",isNaN(g)||(l=2*Math.PI*(t/e)+Math.PI/e,l-=Math.PI/2,l+=n,o=g*Math.cos(l)+d,i=g*Math.sin(l)+c,p+=o+","+i+" ")}t.setAttribute("points",p),addToHistory(new o(t,{point:l,points:i}))}}}})),i("RadiusMultiplier").addEventListener("change",(t=>{setAttr("starRadiusMultiplier",t.target.value)})),i("radialShift").addEventListener("change",(t=>{setAttr("radialshift",t.target.value)})),i("polySides").addEventListener("change",(t=>{setAttr("sides",t.target.value);const e=t.target.value;let l=s.length;for(;l--;){const t=s[l];if(t.hasAttribute("edge")){const l=t.getAttribute("sides"),i=t.getAttribute("points");let n=0,s=0;if(t.points){const r=t.points,a=r.numberOfItems;for(let t=0;t<a;++t){const e=r.getItem(t);n+=parseFloat(e.x),s+=parseFloat(e.y)}const u=n/a,d=s/a,c=t.getAttribute("edge")/2*cot(Math.PI/e)*sec(Math.PI/e);let b="";for(let t=0;e>=t;t++){const l=2*Math.PI*t/e;b+=c*Math.cos(l)+u+","+(c*Math.sin(l)+d)+" "}t.setAttribute("points",b),addToHistory(new o(t,{sides:l,points:i}))}}}}))},mouseDown(t){if("star"===l.getMode()){const e=l.getColor("fill"),o=l.getColor("stroke"),n=l.getStrokeWidth();return r=!0,a=l.addSVGElementsFromJson({element:"polygon",attr:{cx:t.start_x,cy:t.start_y,id:l.getNextId(),shape:"star",point:i("starNumPoints").value,r:0,radialshift:i("radialShift").value,r2:0,orient:"point",fill:e,stroke:o,"stroke-width":n}}),{started:!0}}if("polygon"===l.getMode()){const e=l.getColor("fill"),o=l.getColor("stroke"),n=l.getStrokeWidth();return r=!0,a=l.addSVGElementsFromJson({element:"polygon",attr:{cx:t.start_x,cy:t.start_y,id:l.getNextId(),shape:"regularPoly",sides:i("polySides").value,orient:"x",edge:0,fill:e,stroke:o,"stroke-width":n}}),{started:!0}}},mouseMove(t){if(r){if("star"===l.getMode()){const e=Number(a.getAttribute("cx")),l=Number(a.getAttribute("cy")),o=Number(a.getAttribute("point")),i=a.getAttribute("orient"),n=a.getAttribute("fill"),s=a.getAttribute("stroke"),r=Number(a.getAttribute("stroke-width")),u=Number(a.getAttribute("radialshift"));let d=t.mouse_x,c=t.mouse_y;const b=Math.sqrt((d-e)*(d-e)+(c-l)*(c-l))/1.5,g=document.getElementById("RadiusMultiplier").value,p=b/g;a.setAttribute("r",b),a.setAttribute("r2",p),a.setAttribute("starRadiusMultiplier",g);let h="";for(let t=0;o>=t;t++){let n=2*Math.PI*(t/o);"point"===i?n-=Math.PI/2:"edge"===i&&(n=n+Math.PI/o-Math.PI/2),d=b*Math.cos(n)+e,c=b*Math.sin(n)+l,h+=d+","+c+" ",isNaN(p)||(n=2*Math.PI*(t/o)+Math.PI/o,"point"===i?n-=Math.PI/2:"edge"===i&&(n=n+Math.PI/o-Math.PI/2),n+=u,d=p*Math.cos(n)+e,c=p*Math.sin(n)+l,h+=d+","+c+" ")}return a.setAttribute("points",h),a.setAttribute("fill",n),a.setAttribute("stroke",s),a.setAttribute("stroke-width",r),a.getAttribute("shape"),{started:!0}}if("polygon"===l.getMode()){const e=Number(a.getAttribute("cx")),l=Number(a.getAttribute("cy")),o=Number(a.getAttribute("sides")),i=a.getAttribute("fill"),n=a.getAttribute("stroke"),s=Number(a.getAttribute("stroke-width"));let r=t.mouse_x,u=t.mouse_y;const d=Math.sqrt((r-e)*(r-e)+(u-l)*(u-l))/1.5;a.setAttribute("edge",d);const c=d/2*cot(Math.PI/o)*sec(Math.PI/o);let b="";for(let t=0;o>=t;t++){const i=2*Math.PI*t/o;r=c*Math.cos(i)+e,u=c*Math.sin(i)+l,b+=r+","+u+" "}return a.setAttribute("points",b),a.setAttribute("fill",i),a.setAttribute("stroke",n),a.setAttribute("stroke-width",s),{started:!0}}}},mouseUp(){if("star"===l.getMode()){return{keep:"0"!==a.getAttribute("r"),element:a}}if("polygon"===l.getMode()){return{keep:"0"!==a.getAttribute("edge"),element:a}}},selectedChanged(t){s=t.elems;let e=s.length;if(!e)return showPanel(!1,"star"),void showPanel(!1,"polygon");for(;e--;){const l=s[e];"star"===l?.getAttribute("shape")?t.selectedElement&&!t.multiselected?(i("starNumPoints").value=l.getAttribute("point"),i("radialShift").value=l.getAttribute("radialshift"),showPanel(!0,"star")):showPanel(!1,"star"):"regularPoly"===l?.getAttribute("shape")?t.selectedElement&&!t.multiselected?(i("polySides").value=l.getAttribute("sides"),showPanel(!0,"polygon")):showPanel(!1,"polygon"):(showPanel(!1,"star"),showPanel(!1,"polygon"))}}}}},l=Object.freeze({__proto__:null,default:{name:"star",title:"Polygone/Star Tool",buttons:[{title:"Star Tool"},{title:"Polygon Tool"}],contextTools:[{title:"Number of Sides",label:"points"},{title:"Pointiness",label:"Pointiness"},{title:"Twists the star",label:"Radial Shift"},{title:"Number of Sides",label:"sides"}]}}),o=Object.freeze({__proto__:null,default:{name:"etoile",title:"Outil Polygone/Etoile",buttons:[{title:"Outil Etoile"},{title:"Outil Polygone"}],contextTools:[{title:"Nombre de côtés",label:"points"},{title:"Précision",label:"Précision"},{title:"Torsion Etoile",label:"Décalage Radial"},{title:"Nombre de côtés",label:"côtés"}]}}),i=Object.freeze({__proto__:null,default:{name:"stjärna",title:"Polygon/stjärnverktyg",buttons:[{title:"Stjärnverktyg"},{title:"Polygonverktyg"}],contextTools:[{title:"Antal sidor",label:"poäng"},{title:"Pointiness",label:"Pointiness"},{title:"Vrider stjärnan",label:"Radiell förskjutning"},{title:"Antal sidor",label:"sidor"}]}}),n=Object.freeze({__proto__:null,default:{name:"yıldız",title:"Çokgen/Yıldız Aracı",buttons:[{title:"Yıldız Aracı"},{title:"Çokgen Aracı"}],contextTools:[{title:"Kenar Sayısı",label:"noktalar"},{title:"Sivrilik",label:"Sivrilik"},{title:"Yıldızı Kıvır",label:"Döngüsel Kaydırma"},{title:"Kenar Sayısı",label:"kenarlar"}]}}),s=Object.freeze({__proto__:null,default:{name:"зірка",title:"Полігон/Зірка",buttons:[{title:"Зірка"},{title:"Полігон"}],contextTools:[{title:"Кількість Сторін",label:"точки"},{title:"Без точок",label:"Без точок"},{title:"Закручення зірки",label:"Радіальне Зміщення"},{title:"Кількість Сторін",label:"сторони"}]}}),r=Object.freeze({__proto__:null,default:{name:"星形",title:"Polygone/Star Tool",buttons:[{title:"星形工具"},{title:"多边形工具"}],contextTools:[{title:"顶点",label:"顶点"},{title:"钝度",label:"钝度"},{title:"径向",label:"径向"},{title:"边数",label:"边数"}]}});export{e as default};
//# sourceMappingURL=ext-polystar.js.map