axure-to-mermaid-injected.min.js

javascript:(()=>{var g={all:{text:"Full",type:"generate"},startHere:{text:"Current",type:"generate"},copy:{text:"Copy",type:"copy"},txtDownload:{text:"TXT",type:"download"},svgUrl:{text:"SVG",type:"url"},svgDownload:{text:"SVG",type:"download"},pngUrl:{text:"PNG",type:"url"},pngDownload:{text:"PNG",type:"download"}},y=[["Sitemap",["all","startHere"]],["Code",["copy"]],["Download",["txtDownload","svgDownload","pngDownload"]],["URL",["svgUrl","pngUrl"]]],b=["https://cdn.jsdelivr.net/npm/pako@2.1.0/dist/pako.min.js","https://cdn.jsdelivr.net/npm/js-base64@3.7.5/base64.min.js"];async function w(){for(let a of b)await v(a)}function v(a){return new Promise((e,o)=>{let t=document.createElement("script");t.type="text/javascript",t.src=a,t.onload=e,t.onerror=o,document.head.appendChild(t)})}function s(a,e="",o={}){let t=document.createElement(a);t.textContent=e;for(let[n,r]of Object.entries(o))n==="style"&&typeof r=="object"?Object.entries(r).forEach(([i,m])=>{t.style[i]=m}):t[n]=r;return t}function c(a){let e=document.createElement("textarea");e.value=a,document.body.appendChild(e),e.select(),document.execCommand("copy"),document.body.removeChild(e)}function u(a){let e={code:a,mermaid:JSON.stringify({theme:"default"},null,2),updateEditor:!0,autoSync:!0,updateDiagram:!0},o=JSON.stringify(e),t=new TextEncoder().encode(o),n=pako.deflate(t,{level:9});return Base64.fromUint8Array(n,!0)}async function h(a,e=!1){let t=`https://mermaid.ink/svg/pako:${u(a)}`;if(e){let r=await(await fetch(t)).text();f(r,"sitemap.svg","image/svg+xml")}else window.open(t,"_blank")}async function x(a,e=!1){let t=`https://mermaid.ink/img/pako:${u(a)}?type=png`;if(e){let r=await(await fetch(t)).blob();f(r,"sitemap.png","image/png")}else window.open(t,"_blank")}function f(a,e,o){let t=new Blob([a],{type:o}),n=URL.createObjectURL(t),r=document.createElement("a");r.href=n,r.download=e,document.body.appendChild(r),r.click(),document.body.removeChild(r),URL.revokeObjectURL(n)}function C(a){f(a,"sitemap.txt","text/plain")}var d=class{constructor(e,o){this.processor=e,this.sitemapArray=o,this.currentMermaidText="",this.toolbar=s("div","",{style:{position:"fixed",display:"flex",flexDirection:"row",bottom:"2vh",right:"2vw",backgroundColor:"white",padding:"10px",border:"1px solid #ccc",zIndex:"1000",gap:"3ch"}}),this.buttons=this.createButtons(),this.attachButtons(),document.body.appendChild(this.toolbar)}createButtons(){return Object.entries(g).reduce((e,[o,t])=>(e[o]=s("button",`${t.text}`,{disabled:t.type!=="generate",dataset:{buttonType:t.type},onclick:()=>this.handleButtonClick(o,t.type)}),e),{})}handleButtonClick(e,o){({generate:{all:()=>this.handleAllClick(),startHere:()=>this.handleStartHereClick()},copy:{copy:()=>c(this.currentMermaidText)},download:{txtDownload:()=>C(this.currentMermaidText),svgDownload:()=>h(this.currentMermaidText,!0),pngDownload:()=>x(this.currentMermaidText,!0)},url:{svgUrl:()=>h(this.currentMermaidText),pngUrl:()=>x(this.currentMermaidText)}})[o]?.[e]?.()}handleAllClick(){let e=this.processor.processSitemap(this.sitemapArray);this.currentMermaidText=this.processor.generateMermaidMarkup(e),c(this.currentMermaidText),this.enableExportButtons()}handleStartHereClick(){let e=$axure.page.shortId,o=this.processor.findCurrentNode(this.sitemapArray,e);if(o){let t=this.processor.processSitemap([o]);this.currentMermaidText=this.processor.generateMermaidMarkup(t),c(this.currentMermaidText),this.enableExportButtons()}}enableExportButtons(){Object.values(this.buttons).forEach(e=>{e.dataset.buttonType!=="generate"&&(e.disabled=!1)})}unload(){this.toolbar?.parentNode?.removeChild(this.toolbar)}attachButtons(){y.forEach(([o,t])=>{let n=s("div","",{style:{display:"flex",flexDirection:"column",alignItems:"center",fontSize:".875rem",gap:".25rem"}}),r=s("span",o);n.appendChild(r);let i=s("div","",{style:{display:"flex",gap:".125rem"}});t.forEach(m=>{i.appendChild(this.buttons[m])}),n.appendChild(i),this.toolbar.appendChild(n)});let e=s("button","X",{style:{height:"2rem",width:"2rem",margin:"auto 0"},onclick:()=>this.unload()});this.toolbar.appendChild(e)}};var l=class{constructor(){}processSitemap(e,o=1,t=null,n=[]){return e.forEach(r=>{let i=r.id||`folder_${Math.random().toString(36).substr(2,7)}`;n.push({id:i,name:r.pageName,level:o,parentId:t,type:r.type}),r.children&&this.processSitemap(r.children,o+1,i,n)}),n}generateMermaidMarkup(e){let o=`---
config:
  title: ${$axure.document.configuration.projectName} Sitemap
  theme: default
---

graph TD
  classDef containers fill:transparent,stroke-width:0

`,t=Math.max(...e.map(n=>n.level));for(let n=1;n<=t;n++){let r=e.filter(i=>i.level===n);o+=`  subgraph tier${n}[" "]
`,r.forEach(i=>{n===1?o+=`    ${i.id}["${i.name}"]
`:o+=`    ${i.parentId} --- ${i.id}["${i.name}"]
`}),o+=`  end

`}return o+=`  class ${Array.from({length:t},(n,r)=>`tier${r+1}`).join(",")} containers`,o}findCurrentNode(e,o){for(let t of e){if(t.id===o)return t;if(t.children){let n=this.findCurrentNode(t.children,o);if(n)return n}}return null}};var p=class{constructor(){this.init()}async init(){let e={name:$axure.document.configuration.projectName,id:$axure.document.configuration.projectId};this.toolbar=new d(new l,$axure.document.sitemap.rootNodes)}};async function E(){await w(),window.AxureToMermaid=new p}E().catch(console.error);})();