@expofp/floorplan
Version:
Interactive floor plan library for expos and events
2 lines (1 loc) • 6.11 kB
JavaScript
import{FONT_FACE as z,FONT_WEIGHT_PRIMARY_BOOTH as f}from"../../../../constants";export function createImageCanvas(n,l,r,i,c=1,o){const e=n?n.width/n.height:1;let a=l*i*c,t=r*i*c;l/r>e?a=t*e:t=a/e;const v=document.createElement("canvas"),u=v.getContext("2d");return v.width=a,v.height=t,v.id=n.id,o==="horizontal"?(u.scale(-1,1),u.translate(-a,0)):o==="vertical"&&(u.scale(1,-1),u.translate(0,-t)),u.drawImage(n,0,0,a,t),v}export function createCurrentCanvas(n,l="#c8248b",r=n*.4,i,c,o,e="#000"){i=i||95,c=c||95;const a=document.createElement("canvas"),t=a.getContext("2d");a.width=i*r,a.height=c*r,t.scale(r,r);const v=i/2,u=c/2;if(t.translate(v-35,o?0:u-35),t.beginPath(),t.fillStyle="#FFFFFF",t.moveTo(0,35),t.bezierCurveTo(0,54.329966,15.670034,70,35,70),t.bezierCurveTo(54.329966,70,70,54.329966,70,35),t.bezierCurveTo(70,15.670034,54.329966,0,35,0),t.bezierCurveTo(15.670034,0,0,15.670034,0,35),t.fill(),t.beginPath(),t.fillStyle=l,t.moveTo(10,35),t.bezierCurveTo(10,48.807119,21.192881,60,35,60),t.bezierCurveTo(48.807119,60,60,48.807119,60,35),t.bezierCurveTo(60,21.192881,48.807119,10,35,10),t.bezierCurveTo(21.192881,10,10,21.192881,10,35),t.fill(),o){t.textAlign="center",t.textBaseline="alphabetic",t.lineJoin="round",t.strokeStyle="#fff",t.fillStyle=e;const T=38;t.font=getFont(T),t.lineWidth=6;const b=70+T;t.strokeText(o,35,b,i),t.fillText(o,35,b,i)}return a}export function createTargetCanvas(n,l="#c8248b",r=n*.5){const i=70*r,c=100*r,o=document.createElement("canvas"),e=o.getContext("2d");return o.width=i,o.height=c,e.scale(r,r),e.beginPath(),e.fillStyle="rgb(255, 255, 255)",e.moveTo(32.6,97.8),e.bezierCurveTo(24.4,81.5,0,57,0,32.6),e.bezierCurveTo(0,14.6,14.6,0,32.6,0),e.bezierCurveTo(50.5,0,65.2,14.6,65.2,32.6),e.bezierCurveTo(65.2,57,40.7,81.5,32.6,97.8),e.fill(),e.beginPath(),e.fillStyle=l,e.moveTo(32.6,91.1),e.bezierCurveTo(25.2,76.3,3.1,54.2,3.1,32.1),e.bezierCurveTo(3.1,15.9,16.3,2.6,32.6,2.6),e.bezierCurveTo(48.8,2.6,62,15.9,62,32.1),e.bezierCurveTo(62,54.2,39.9,76.3,32.6,91.1),e.fill(),e.beginPath(),e.fillStyle="rgb(255, 255, 255)",e.moveTo(16.2,32.6),e.bezierCurveTo(16.2,41.6,23.5,48.9,32.5,48.9),e.bezierCurveTo(41.5,48.9,48.8,41.6,48.8,32.6),e.bezierCurveTo(48.8,23.6,41.5,16.3,32.5,16.3),e.bezierCurveTo(23.5,16.3,16.2,23.6,16.2,32.6),e.fill(),o}export function createArrowCurrentCanvas(n,l="#c8248b",r=n*.4){const i=95*r,c=95*r,o=document.createElement("canvas"),e=o.getContext("2d");return o.width=i,o.height=c,e.scale(r,r),e.beginPath(),e.arc(47,47,25,0,2*Math.PI),e.fillStyle=l,e.fill(),e.beginPath(),e.fillStyle=l,e.moveTo(75,27),e.lineTo(95,47),e.lineTo(75,67),e.lineTo(80,47),e.closePath(),e.fill(),o}export function createYahCanvas(n,l="#ff4343",r=n*.5){const i=77*r,c=116*r,o=document.createElement("canvas"),e=o.getContext("2d");return o.width=i,o.height=c,e.scale(r,r),e.scale(r,r),e.beginPath(),e.fillStyle="#FFFFFF",e.moveTo(68.303,57.335),e.bezierCurveTo(77.894,39.304,70.649,15.785,50.95,8.04),e.bezierCurveTo(30.727,0,8.375,11.837,3.207,32.831),e.bezierCurveTo(0,46.185,6.644,57.323,13.131,68.211),e.fill(),e.beginPath(),e.fillStyle=l,e.moveTo(51.565,35.459),e.bezierCurveTo(51.565,43.256,45.201,49.575,37.354,49.575),e.bezierCurveTo(29.516,49.575,23.159,43.256,23.159,35.459),e.bezierCurveTo(23.159,27.668,29.516,21.345,37.354,21.345),e.bezierCurveTo(45.201,21.345,51.565,27.668,51.565,35.459),e.closePath(),e.fill(),e.beginPath(),e.moveTo(68.303,57.335),e.bezierCurveTo(77.894,39.304,70.649,15.785,50.95,8.04),e.bezierCurveTo(30.727,0,8.375,11.837,3.207,32.831),e.bezierCurveTo(0,46.185,6.644,57.323,13.131,68.211),e.lineTo(13.131,68.211),e.lineTo(13.131,68.211),e.bezierCurveTo(13.921,69.533,14.698,70.829,15.454,72.137),e.bezierCurveTo(19.465,79.158,23.533,86.12,27.571,93.086),e.lineTo(27.571,93.086),e.bezierCurveTo(30.098,97.421,32.611,101.756,35.116,106.077),e.bezierCurveTo(36.128,107.868,38.934,107.868,39.945,106.077),e.bezierCurveTo(49.387,90.003,58.708,74.029,68.031,57.951),e.bezierCurveTo(68.15,57.743,68.24,57.543,68.303,57.335),e.closePath(),e.moveTo(60.103,60.395),e.lineTo(63.201,55.041),e.lineTo(63.201,55.041),e.bezierCurveTo(73.31,36.735,61.285,11.614,39.04,11.17),e.bezierCurveTo(19.388,10.714,2.759,29.479,9.386,49.013),e.bezierCurveTo(10.726,52.998,12.657,56.9,14.84,60.721),e.bezierCurveTo(15.041,58.454,15.938,56.258,17.589,54.586),e.bezierCurveTo(19.708,52.425,22.216,50.638,24.996,49.283),e.bezierCurveTo(28.252,52.249,32.595,54.051,37.354,54.051),e.bezierCurveTo(42.123,54.051,46.47,52.249,49.73,49.283),e.bezierCurveTo(52.505,50.638,55.017,52.425,57.135,54.586),e.bezierCurveTo(58.701,56.188,59.701,58.245,60.103,60.395),e.closePath(),e.fill("evenodd"),e.beginPath(),e.moveTo(29.024,104.982),e.bezierCurveTo(29.024,103.626,27.923,102.527,26.57,102.527),e.bezierCurveTo(25.214,102.527,24.114,103.626,24.114,104.982),e.bezierCurveTo(24.114,111.395,30.347,116.838,37.444,116.838),e.bezierCurveTo(44.54,116.838,50.771,111.395,50.771,104.982),e.bezierCurveTo(50.771,103.626,49.666,102.527,48.317,102.527),e.bezierCurveTo(46.961,102.527,45.855,103.626,45.855,104.982),e.bezierCurveTo(45.855,108.193,42.352,111.956,37.444,111.956),e.bezierCurveTo(32.528,111.956,29.024,108.193,29.024,104.982),e.closePath(),e.fill(),o}const h=document.createElement("canvas"),C=h.getContext("2d");let d;function g(n,l){return d!==n&&(C.font=n),C.measureText(l).width}export function createLabelCanvas(n,l,r,i="#fff",c,o,e){n=n.replace(/^_/,""),l*=r;const a=document.createElement("canvas"),t=a.getContext("2d"),v=Number(getComputedStyle(document.body).getPropertyValue(f)),u=getFont(l,v||c),T=g(u,n.replace(/[0-9]/g,"3").replace(/[A-Z]/g,"A"))+3+3,b=4,s=l+b;return a.width=T*r,a.height=s*r,t.font=u,t.textAlign="center",t.textBaseline="alphabetic",t.fillStyle=i,e&&o&&(t.lineWidth=e,t.strokeStyle=o,t.strokeText(n,T/2,s-b/2*r),t.lineJoin="round"),t.fillText(n,T/2,s-b/2*r),a}export function getFont(n,l=500,r="normal"){const i=getComputedStyle(document.body).getPropertyValue(z),c='Oswald, -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif',o=i?`${i}, ${c}`:c;return`${r} ${l} ${n}px ${o}`}