npm - @fmsim/board - Versions diffs - 0.0.96 → 0.0.98 - Mend

@fmsim/board 0.0.96 → 0.0.98

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (84) hide show

package/demo/index-modeller.html CHANGED Viewed

@@ -2,7 +2,7 @@
 <html lang="en-GB">
   <head>
     <meta charset="utf-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1" />
+    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" />
     <style>
       body {
         margin: 0;

package/demo/index-player.html CHANGED Viewed

@@ -2,7 +2,7 @@
 <html lang="en-GB">
   <head>
     <meta charset="utf-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1" />
+    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" />
     <style>
       body {
         margin: 0;

package/demo/index-viewer.html CHANGED Viewed

@@ -2,7 +2,7 @@
 <html lang="en-GB">
   <head>
     <meta charset="utf-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1" />
+    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" />
     <style>
       body {
         margin: 0;

package/demo/index.html CHANGED Viewed

@@ -2,7 +2,7 @@
 <html lang="en-GB">
   <head>
     <meta charset="utf-8" />
-    <meta name="viewport" content="width=device-width, initial-scale=1" />
+    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" />
     <style>
       body {
         margin: 0;

package/dist/src/layers/mcs-mouse-event-handler.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"mcs-mouse-event-handler.js","sourceRoot":"","sources":["../../../src/layers/mcs-mouse-event-handler.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,wBAAwB,CAAA;AAEjD,SAAS,YAAY,CAAC,KAAiB,EAAE,IAAS;;IAChD,MAAM,MAAM,GAAG,IAAI,CAAC,MAAM,CAAA;IAE1B,IAAI,CAAC,CAAA,MAAA,MAAM,CAAC,KAAK,0CAAE,EAAE,CAAA,EAAE;~~QACrB~~,OAAM;~~KACP~~;IAED,KAAK,CAAC,eAAe,EAAE,CAAA;IAEvB,MAAM,CAAC,aAAa,CAClB,IAAI,WAAW,CAAC,8BAA8B,EAAE;QAC9C,MAAM,EAAE;YACN,KAAK,EAAE;gBACL,IAAI,EAAE,OAAO;gBACb,KAAK;gBACL,KAAK,EAAE,MAAM,CAAC,KAAK;gBACnB,IAAI,EAAE,MAAM,CAAC,IAAI;aAClB;SACF;KACF,CAAC,CACH,CAAA;AACH,CAAC;AAED,SAAS,OAAO,CAAC,KAAiB,EAAE,IAAS;IAC3C,MAAM,MAAM,GAAG,IAAI,CAAC,MAAM,CAAA;IAE1B,2BAA2B;IAC3B,WAAW;IACX,IAAI;IAEJ,KAAK,CAAC,eAAe,EAAE,CAAA;IAEvB,UAAU,CAAC,GAAG,EAAE;;QACd,IAAI,MAAM,CAAC,YAAY,KAAK,UAAU,EAAE;~~YACtC~~,CAAA,MAAA,MAAM,CAAC,KAAK,0CAAE,EAAE;gBACd,MAAM,CAAC,aAAa,CAClB,IAAI,WAAW,CAAC,8BAA8B,EAAE;oBAC9C,MAAM,EAAE;wBACN,KAAK,EAAE;4BACL,IAAI,EAAE,OAAO;4BACb,KAAK;4BACL,KAAK,EAAE,MAAM,CAAC,KAAK;4BACnB,IAAI,EAAE,MAAM,CAAC,IAAI;yBAClB;qBACF;iBACF,CAAC,CACH,CAAA;YAEH,MAAM,CAAC,aAAa,CAClB,IAAI,WAAW,CAAC,gBAAgB,EAAE;gBAChC,MAAM,EAAE,MAAM;aACf,CAAC,CACH,CAAA;~~SACF~~;IACH,CAAC,EAAE,GAAG,CAAC,CAAA;AACT,CAAC;AAED,SAAS,UAAU,CAAC,KAAiB,EAAE,IAAS;;IAC9C,MAAM,MAAM,GAAG,IAAI,CAAC,MAAM,CAAA;IAE1B,UAAU,CAAC,GAAG,EAAE;QACd,MAAM,CAAC,YAAY,GAAG,EAAE,CAAA;IAC1B,CAAC,EAAE,GAAG,CAAC,CAAA;IAEP,2BAA2B;IAC3B,WAAW;IACX,IAAI;IAEJ,KAAK,CAAC,eAAe,EAAE,CAAA;IAEvB,MAAM,CAAC,YAAY,GAAG,UAAU,CAAA;IAChC,CAAA,MAAA,MAAM,CAAC,KAAK,0CAAE,EAAE;QACd,MAAM,CAAC,aAAa,CAClB,IAAI,WAAW,CAAC,8BAA8B,EAAE;YAC9C,MAAM,EAAE;gBACN,KAAK,EAAE;oBACL,IAAI,EAAE,UAAU;oBAChB,KAAK;oBACL,KAAK,EAAE,MAAM,CAAC,KAAK;oBACnB,IAAI,EAAE,MAAM,CAAC,IAAI;iBAClB;aACF;SACF,CAAC,CACH,CAAA;AACL,CAAC;AAED,QAAQ,CAAC,QAAQ,CAAC,mBAAmB,EAAE;IACrC,aAAa,EAAE;QACb,OAAO,EAAE;YACP,6CAA6C;YAC7C,KAAK,EAAE,OAAO;YACd,QAAQ,EAAE,UAAU;SACrB;KACF;CACF,CAAC,CAAA","sourcesContent":["import { EventMap } from '@hatiolab/things-scene'\n\nfunction onmouseenter(event: MouseEvent, hint: any) {\n const target = hint.origin\n\n if (!target.model?.id) {\n return\n }\n\n event.stopPropagation()\n\n window.dispatchEvent(\n new CustomEvent('fetchLvModelDataByMouseEvent', {\n detail: {\n value: {\n type: 'hover',\n event,\n model: target.state,\n data: target.data\n }\n }\n })\n )\n}\n\nfunction onclick(event: MouseEvent, hint: any) {\n const target = hint.origin\n\n // if (!target.model?.id) {\n // return\n // }\n\n event.stopPropagation()\n\n setTimeout(() => {\n if (target.currentEvent !== 'dblclick') {\n target.model?.id &&\n window.dispatchEvent(\n new CustomEvent('fetchLvModelDataByMouseEvent', {\n detail: {\n value: {\n type: 'click',\n event,\n model: target.state,\n data: target.data\n }\n }\n })\n )\n\n window.dispatchEvent(\n new CustomEvent('clickComponent', {\n detail: target\n })\n )\n }\n }, 300)\n}\n\nfunction ondblclick(event: MouseEvent, hint: any) {\n const target = hint.origin\n\n setTimeout(() => {\n target.currentEvent = ''\n }, 500)\n\n // if (!target.model?.id) {\n // return\n // }\n\n event.stopPropagation()\n\n target.currentEvent = 'dblclick'\n target.model?.id &&\n window.dispatchEvent(\n new CustomEvent('fetchLvModelDataByMouseEvent', {\n detail: {\n value: {\n type: 'dblclick',\n event,\n model: target.state,\n data: target.data\n }\n }\n })\n )\n}\n\nEventMap.register('mcs-event-handler', {\n 'model-layer': {\n '(all)': {\n // mouseenter: onmouseenter, /* 사용되지 않고 있음 */\n click: onclick,\n dblclick: ondblclick\n }\n }\n})\n"]}
1	+ {"version":3,"file":"mcs-mouse-event-handler.js","sourceRoot":"","sources":["../../../src/layers/mcs-mouse-event-handler.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAE,MAAM,wBAAwB,CAAA;AAEjD,SAAS,YAAY,CAAC,KAAiB,EAAE,IAAS;;IAChD,MAAM,MAAM,GAAG,IAAI,CAAC,MAAM,CAAA;IAE1B,IAAI,CAAC,CAAA,MAAA,MAAM,CAAC,KAAK,0CAAE,EAAE,CAAA,EAAE,CAAC;QACtB,OAAM;IACR,CAAC;IAED,KAAK,CAAC,eAAe,EAAE,CAAA;IAEvB,MAAM,CAAC,aAAa,CAClB,IAAI,WAAW,CAAC,8BAA8B,EAAE;QAC9C,MAAM,EAAE;YACN,KAAK,EAAE;gBACL,IAAI,EAAE,OAAO;gBACb,KAAK;gBACL,KAAK,EAAE,MAAM,CAAC,KAAK;gBACnB,IAAI,EAAE,MAAM,CAAC,IAAI;aAClB;SACF;KACF,CAAC,CACH,CAAA;AACH,CAAC;AAED,SAAS,OAAO,CAAC,KAAiB,EAAE,IAAS;IAC3C,MAAM,MAAM,GAAG,IAAI,CAAC,MAAM,CAAA;IAE1B,2BAA2B;IAC3B,WAAW;IACX,IAAI;IAEJ,KAAK,CAAC,eAAe,EAAE,CAAA;IAEvB,UAAU,CAAC,GAAG,EAAE;;QACd,IAAI,MAAM,CAAC,YAAY,KAAK,UAAU,EAAE,CAAC;YACvC,CAAA,MAAA,MAAM,CAAC,KAAK,0CAAE,EAAE;gBACd,MAAM,CAAC,aAAa,CAClB,IAAI,WAAW,CAAC,8BAA8B,EAAE;oBAC9C,MAAM,EAAE;wBACN,KAAK,EAAE;4BACL,IAAI,EAAE,OAAO;4BACb,KAAK;4BACL,KAAK,EAAE,MAAM,CAAC,KAAK;4BACnB,IAAI,EAAE,MAAM,CAAC,IAAI;yBAClB;qBACF;iBACF,CAAC,CACH,CAAA;YAEH,MAAM,CAAC,aAAa,CAClB,IAAI,WAAW,CAAC,gBAAgB,EAAE;gBAChC,MAAM,EAAE,MAAM;aACf,CAAC,CACH,CAAA;QACH,CAAC;IACH,CAAC,EAAE,GAAG,CAAC,CAAA;AACT,CAAC;AAED,SAAS,UAAU,CAAC,KAAiB,EAAE,IAAS;;IAC9C,MAAM,MAAM,GAAG,IAAI,CAAC,MAAM,CAAA;IAE1B,UAAU,CAAC,GAAG,EAAE;QACd,MAAM,CAAC,YAAY,GAAG,EAAE,CAAA;IAC1B,CAAC,EAAE,GAAG,CAAC,CAAA;IAEP,2BAA2B;IAC3B,WAAW;IACX,IAAI;IAEJ,KAAK,CAAC,eAAe,EAAE,CAAA;IAEvB,MAAM,CAAC,YAAY,GAAG,UAAU,CAAA;IAChC,CAAA,MAAA,MAAM,CAAC,KAAK,0CAAE,EAAE;QACd,MAAM,CAAC,aAAa,CAClB,IAAI,WAAW,CAAC,8BAA8B,EAAE;YAC9C,MAAM,EAAE;gBACN,KAAK,EAAE;oBACL,IAAI,EAAE,UAAU;oBAChB,KAAK;oBACL,KAAK,EAAE,MAAM,CAAC,KAAK;oBACnB,IAAI,EAAE,MAAM,CAAC,IAAI;iBAClB;aACF;SACF,CAAC,CACH,CAAA;AACL,CAAC;AAED,QAAQ,CAAC,QAAQ,CAAC,mBAAmB,EAAE;IACrC,aAAa,EAAE;QACb,OAAO,EAAE;YACP,6CAA6C;YAC7C,KAAK,EAAE,OAAO;YACd,QAAQ,EAAE,UAAU;SACrB;KACF;CACF,CAAC,CAAA","sourcesContent":["import { EventMap } from '@hatiolab/things-scene'\n\nfunction onmouseenter(event: MouseEvent, hint: any) {\n const target = hint.origin\n\n if (!target.model?.id) {\n return\n }\n\n event.stopPropagation()\n\n window.dispatchEvent(\n new CustomEvent('fetchLvModelDataByMouseEvent', {\n detail: {\n value: {\n type: 'hover',\n event,\n model: target.state,\n data: target.data\n }\n }\n })\n )\n}\n\nfunction onclick(event: MouseEvent, hint: any) {\n const target = hint.origin\n\n // if (!target.model?.id) {\n // return\n // }\n\n event.stopPropagation()\n\n setTimeout(() => {\n if (target.currentEvent !== 'dblclick') {\n target.model?.id &&\n window.dispatchEvent(\n new CustomEvent('fetchLvModelDataByMouseEvent', {\n detail: {\n value: {\n type: 'click',\n event,\n model: target.state,\n data: target.data\n }\n }\n })\n )\n\n window.dispatchEvent(\n new CustomEvent('clickComponent', {\n detail: target\n })\n )\n }\n }, 300)\n}\n\nfunction ondblclick(event: MouseEvent, hint: any) {\n const target = hint.origin\n\n setTimeout(() => {\n target.currentEvent = ''\n }, 500)\n\n // if (!target.model?.id) {\n // return\n // }\n\n event.stopPropagation()\n\n target.currentEvent = 'dblclick'\n target.model?.id &&\n window.dispatchEvent(\n new CustomEvent('fetchLvModelDataByMouseEvent', {\n detail: {\n value: {\n type: 'dblclick',\n event,\n model: target.state,\n data: target.data\n }\n }\n })\n )\n}\n\nEventMap.register('mcs-event-handler', {\n 'model-layer': {\n '(all)': {\n // mouseenter: onmouseenter, /* 사용되지 않고 있음 */\n click: onclick,\n dblclick: ondblclick\n }\n }\n})\n"]}

package/dist/src/layers/movement-layer.d.ts CHANGED Viewed

@@ -7,7 +7,7 @@ export type PATH = {
     dstZone: string;
     dstUnit: string;
     pathType: 'COMMAND' | 'JOB';
-    status: 'NORMAL' | 'DELAY' | 'ALTER';
+    status: 'NORMAL' | 'DELAY' | 'ALTER' | 'WARN';
     transportCnt: number;
 };
 export type MOVEMENT = PATH[];

package/dist/src/layers/movement-layer.js CHANGED Viewed

@@ -2,7 +2,8 @@ import { Component, Layer } from '@hatiolab/things-scene';
 const MOVEMENT_STYLES = {
     NORMAL /* NORMAL_TRANSPORT*/: ['#00B05033', '#00B050'],
     DELAY /* DELAYED_TRANSPORT*/: ['#FF000033', '#FF0000'],
-    ALTER /* ALTER_TRANSPORT*/: ['#76717133', '#767171']
+    ALTER /* ALTER_TRANSPORT*/: ['#76717133', '#767171'],
+    WARN /* WARN_TRANSPORT*/: ['#AAAA0033', '#AAAA00']
 };
 const degreesInRadians225 = (195 * Math.PI) / 180;
 const degreesInRadians135 = (165 * Math.PI) / 180;

package/dist/src/layers/movement-layer.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"movement-layer.js","sourceRoot":"","sources":["../../../src/layers/movement-layer.ts"],"names":[],"mappings":"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","sourcesContent":["import { Component, Layer, POINT, Properties } from '@hatiolab/things-scene'\n\nconst MOVEMENT_STYLES: { [key: string]: string[] } = {\n NORMAL /* NORMAL_TRANSPORT/: ['#00B05033', '#00B050'],\n DELAY / DELAYED_TRANSPORT/: ['#FF000033', '#FF0000'],\n ALTER / ALTER_TRANSPORT/: ['#76717133', '#767171']\n}\n\nexport type PATH = {\n srcMachine: string\n srcZone: string\n srcUnit: string\n dstMachine: string\n dstZone: string\n dstUnit: string\n pathType: 'COMMAND' \| 'JOB'\n status: 'NORMAL' \| 'DELAY' \| 'ALTER'\n transportCnt: number\n}\n\nexport type MOVEMENT = PATH[]\n\nconst degreesInRadians225 = (195 Math.PI) / 180\nconst degreesInRadians135 = (165 * Math.PI) / 180\n\nexport default class MovementLayer extends Layer {\n drawInstructionHandler = (e: Event) => {\n this.data = (e as CustomEvent).detail\n }\n clickComponentHandler = (e: Event) => {\n const component = (e as CustomEvent).detail\n const { type } = component.state\n\n if (type == 'model-layer') {\n this.data = [] /* clear /\n return\n }\n }\n\n ready() {\n const handler = (e: Event) => {\n this.data = (e as CustomEvent).detail\n }\n\n this.drawInstructionHandler = handler.bind(this)\n window.addEventListener('drawInstruction', this.drawInstructionHandler)\n window.addEventListener('clickComponent', this.clickComponentHandler)\n }\n\n dispose() {\n window.removeEventListener('drawInstruction', this.drawInstructionHandler)\n window.removeEventListener('clickComponent', this.clickComponentHandler)\n\n super.dispose && super.dispose()\n }\n\n get capturable() {\n return false\n }\n\n drawArrow(ctx: CanvasRenderingContext2D, p0: POINT, p1: POINT, headLength: number = 10, label: string) {\n // constants (could be declared as globals outside this function)\n // calc the angle of the line\n var dx = p1.x - p0.x\n var dy = p1.y - p0.y\n var angle = Math.atan2(dy, dx)\n\n // calc arrowhead points\n var x225 = p1.x + headLength Math.cos(angle + degreesInRadians225)\n var y225 = p1.y + headLength * Math.sin(angle + degreesInRadians225)\n var x135 = p1.x + headLength * Math.cos(angle + degreesInRadians135)\n var y135 = p1.y + headLength * Math.sin(angle + degreesInRadians135)\n\n // draw line plus arrowhead\n ctx.beginPath()\n\n // draw the line from p0 to p1\n ctx.moveTo(p0.x, p0.y)\n ctx.lineTo(p1.x, p1.y)\n\n ctx.stroke()\n\n ctx.beginPath()\n\n // draw partial arrowhead at 225 degrees\n ctx.moveTo(p1.x, p1.y)\n ctx.lineTo(x225, y225)\n // draw partial arrowhead at 135 degrees\n ctx.lineTo(x135, y135)\n ctx.lineTo(p1.x, p1.y)\n // stroke the line and arrowhead\n\n ctx.setLineDash([])\n\n ctx.stroke()\n ctx.fill()\n\n if (label) {\n const fontSize = 14\n const fontFamily = 'Arial'\n\n ctx.font = `bold ${fontSize}px ${fontFamily}`\n\n const textWidth = ctx.measureText(label).width\n\n const [x, y] = [(p0.x + p1.x) / 2 - textWidth / 2, (p0.y + p1.y) / 2]\n ctx.fillRect(x - 3, y - fontSize / 2 - 2, textWidth + 6, fontSize + 4)\n\n ctx.fillStyle = 'white'\n ctx.fillText(label, x, y + fontSize / 2 - 1)\n }\n }\n\n findSourceAndTarget(path: PATH): [Component?, Component?] {\n const root = this.root\n var src, dest\n\n for (const name of [path.srcUnit, path.srcZone, path.srcMachine].filter(Boolean)) {\n src = root.findById(name)\n if (src) {\n break\n }\n }\n\n for (const name of [path.dstUnit, path.dstZone, path.dstMachine].filter(Boolean)) {\n dest = root.findById(name)\n if (dest) {\n break\n }\n }\n\n return [src, dest]\n }\n\n render(ctx: CanvasRenderingContext2D) {\n const root = this.root\n const movement = (this.data instanceof Array && (this.data as MOVEMENT)) \|\| []\n\n ctx.save()\n\n movement.forEach(path => {\n const [src, dest] = this.findSourceAndTarget(path)\n if (!src \|\| !dest) {\n return\n }\n\n const [srcCenter, destCenter] = [src.center, dest.center]\n const [srcPos, destPos] = [\n src.transcoordS2C(srcCenter.x, srcCenter.y, root),\n dest.transcoordS2C(destCenter.x, destCenter.y, root)\n ]\n\n ctx.beginPath()\n\n ctx.setLineDash(path.pathType == 'COMMAND' ? [5, 5] : [])\n\n const gradient = ctx.createLinearGradient(srcPos.x, srcPos.y, destPos.x, destPos.y)\n ;(MOVEMENT_STYLES[path.status] \|\| []).forEach((color, idx) => gradient.addColorStop(idx, color))\n\n ctx.strokeStyle = gradient\n ctx.fillStyle = gradient\n ctx.lineWidth = 2\n\n this.drawArrow(ctx, srcPos, destPos, 10, Number(path.transportCnt \|\| 0) > 1 ? String(path.transportCnt) : '')\n\n ctx.stroke()\n })\n\n ctx.restore()\n }\n\n get eventMap() {\n return {\n 'model-layer': {\n '(self)': {\n change: this.onchangeModelLayer\n }\n }\n }\n }\n\n onchangeModelLayer(after: any, before: any, hint: any) {\n if (after.scale \|\| after.translate) {\n this.invalidate()\n }\n }\n\n onchangeData(after: Properties, before: Properties): void {\n this.invalidate()\n }\n}\n\nComponent.register('movement-layer', MovementLayer)\n"]}
1	+ {"version":3,"file":"movement-layer.js","sourceRoot":"","sources":["../../../src/layers/movement-layer.ts"],"names":[],"mappings":"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","sourcesContent":["import { Component, Layer, POINT, Properties } from '@hatiolab/things-scene'\n\nconst MOVEMENT_STYLES: { [key: string]: string[] } = {\n NORMAL /* NORMAL_TRANSPORT/: ['#00B05033', '#00B050'],\n DELAY / DELAYED_TRANSPORT/: ['#FF000033', '#FF0000'],\n ALTER / ALTER_TRANSPORT/: ['#76717133', '#767171'],\n WARN / WARN_TRANSPORT/: ['#AAAA0033', '#AAAA00']\n}\n\nexport type PATH = {\n srcMachine: string\n srcZone: string\n srcUnit: string\n dstMachine: string\n dstZone: string\n dstUnit: string\n pathType: 'COMMAND' \| 'JOB'\n status: 'NORMAL' \| 'DELAY' \| 'ALTER' \| 'WARN'\n transportCnt: number\n}\n\nexport type MOVEMENT = PATH[]\n\nconst degreesInRadians225 = (195 Math.PI) / 180\nconst degreesInRadians135 = (165 * Math.PI) / 180\n\nexport default class MovementLayer extends Layer {\n drawInstructionHandler = (e: Event) => {\n this.data = (e as CustomEvent).detail\n }\n clickComponentHandler = (e: Event) => {\n const component = (e as CustomEvent).detail\n const { type } = component.state\n\n if (type == 'model-layer') {\n this.data = [] /* clear /\n return\n }\n }\n\n ready() {\n const handler = (e: Event) => {\n this.data = (e as CustomEvent).detail\n }\n\n this.drawInstructionHandler = handler.bind(this)\n window.addEventListener('drawInstruction', this.drawInstructionHandler)\n window.addEventListener('clickComponent', this.clickComponentHandler)\n }\n\n dispose() {\n window.removeEventListener('drawInstruction', this.drawInstructionHandler)\n window.removeEventListener('clickComponent', this.clickComponentHandler)\n\n super.dispose && super.dispose()\n }\n\n get capturable() {\n return false\n }\n\n drawArrow(ctx: CanvasRenderingContext2D, p0: POINT, p1: POINT, headLength: number = 10, label: string) {\n // constants (could be declared as globals outside this function)\n // calc the angle of the line\n var dx = p1.x - p0.x\n var dy = p1.y - p0.y\n var angle = Math.atan2(dy, dx)\n\n // calc arrowhead points\n var x225 = p1.x + headLength Math.cos(angle + degreesInRadians225)\n var y225 = p1.y + headLength * Math.sin(angle + degreesInRadians225)\n var x135 = p1.x + headLength * Math.cos(angle + degreesInRadians135)\n var y135 = p1.y + headLength * Math.sin(angle + degreesInRadians135)\n\n // draw line plus arrowhead\n ctx.beginPath()\n\n // draw the line from p0 to p1\n ctx.moveTo(p0.x, p0.y)\n ctx.lineTo(p1.x, p1.y)\n\n ctx.stroke()\n\n ctx.beginPath()\n\n // draw partial arrowhead at 225 degrees\n ctx.moveTo(p1.x, p1.y)\n ctx.lineTo(x225, y225)\n // draw partial arrowhead at 135 degrees\n ctx.lineTo(x135, y135)\n ctx.lineTo(p1.x, p1.y)\n // stroke the line and arrowhead\n\n ctx.setLineDash([])\n\n ctx.stroke()\n ctx.fill()\n\n if (label) {\n const fontSize = 14\n const fontFamily = 'Arial'\n\n ctx.font = `bold ${fontSize}px ${fontFamily}`\n\n const textWidth = ctx.measureText(label).width\n\n const [x, y] = [(p0.x + p1.x) / 2 - textWidth / 2, (p0.y + p1.y) / 2]\n ctx.fillRect(x - 3, y - fontSize / 2 - 2, textWidth + 6, fontSize + 4)\n\n ctx.fillStyle = 'white'\n ctx.fillText(label, x, y + fontSize / 2 - 1)\n }\n }\n\n findSourceAndTarget(path: PATH): [Component?, Component?] {\n const root = this.root\n var src, dest\n\n for (const name of [path.srcUnit, path.srcZone, path.srcMachine].filter(Boolean)) {\n src = root.findById(name)\n if (src) {\n break\n }\n }\n\n for (const name of [path.dstUnit, path.dstZone, path.dstMachine].filter(Boolean)) {\n dest = root.findById(name)\n if (dest) {\n break\n }\n }\n\n return [src, dest]\n }\n\n render(ctx: CanvasRenderingContext2D) {\n const root = this.root\n const movement = (this.data instanceof Array && (this.data as MOVEMENT)) \|\| []\n\n ctx.save()\n\n movement.forEach(path => {\n const [src, dest] = this.findSourceAndTarget(path)\n if (!src \|\| !dest) {\n return\n }\n\n const [srcCenter, destCenter] = [src.center, dest.center]\n const [srcPos, destPos] = [\n src.transcoordS2C(srcCenter.x, srcCenter.y, root),\n dest.transcoordS2C(destCenter.x, destCenter.y, root)\n ]\n\n ctx.beginPath()\n\n ctx.setLineDash(path.pathType == 'COMMAND' ? [5, 5] : [])\n\n const gradient = ctx.createLinearGradient(srcPos.x, srcPos.y, destPos.x, destPos.y)\n ;(MOVEMENT_STYLES[path.status] \|\| []).forEach((color, idx) => gradient.addColorStop(idx, color))\n\n ctx.strokeStyle = gradient\n ctx.fillStyle = gradient\n ctx.lineWidth = 2\n\n this.drawArrow(ctx, srcPos, destPos, 10, Number(path.transportCnt \|\| 0) > 1 ? String(path.transportCnt) : '')\n\n ctx.stroke()\n })\n\n ctx.restore()\n }\n\n get eventMap() {\n return {\n 'model-layer': {\n '(self)': {\n change: this.onchangeModelLayer\n }\n }\n }\n }\n\n onchangeModelLayer(after: any, before: any, hint: any) {\n if (after.scale \|\| after.translate) {\n this.invalidate()\n }\n }\n\n onchangeData(after: Properties, before: Properties): void {\n this.invalidate()\n }\n}\n\nComponent.register('movement-layer', MovementLayer)\n"]}

package/dist/src/layers/tooltip-decorator.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"tooltip-decorator.js","sourceRoot":"","sources":["../../../src/layers/tooltip-decorator.ts"],"names":[],"mappings":"AAEA,MAAM,WAAW,GAAG,EAAE,CAAA;AAEtB,SAAS,wBAAwB,CAAC,OAAiC,EAAE,KAAe,EAAE,QAAiB;IACrG,MAAM,UAAU,GAAG,WAAW,CAAA;IAC9B,IAAI,UAAU,GAAG,CAAC,CAAA;IAClB,IAAI,WAAW,GAAG,KAAK,CAAC,MAAM,GAAG,UAAU,CAAA;IAE3C,KAAK,MAAM,IAAI,IAAI,KAAK,EAAE;~~QACxB~~,MAAM,WAAW,GAAG,OAAO,CAAC,WAAW,CAAC,IAAI,CAAC,CAAA;QAC7C,IAAI,WAAW,CAAC,KAAK,GAAG,UAAU,EAAE;~~YAClC~~,UAAU,GAAG,WAAW,CAAC,KAAK,CAAA;~~SAC/B~~;~~KACF~~;IAED,OAAO,EAAE,KAAK,EAAE,UAAU,EAAE,MAAM,EAAE,WAAW,EAAE,CAAA;AACnD,CAAC;AAED,SAAS,iBAAiB,CACxB,OAAiC,EACjC,KAAe,EACf,CAAS,EACT,CAAS,EACT,QAAiB;IAEjB,MAAM,UAAU,GAAG,WAAW,CAAA;IAE9B,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,KAAK,CAAC,MAAM,EAAE,CAAC,EAAE,EAAE;~~QACrC~~,OAAO,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,GAAG,CAAC,CAAC,GAAG,CAAC,CAAC,GAAG,UAAU,EAAE,QAAQ,CAAC,CAAA;~~KAClE~~;AACH,CAAC;AAED,MAAM,CAAC,OAAO,UAAU,gBAAgB,CACtC,SAAoB,EACpB,OAAiC,EACjC,KAAa,CAAC,YAAY;IAE1B,MAAM,EAAE,EAAE,EAAE,WAAW,EAAE,SAAS,EAAE,KAAK,EAAE,SAAS,EAAE,GAAG,SAAS,CAAC,IAAI,IAAI,EAAE,CAAA;IAC7E,MAAM,KAAK,GAAG,CAAC,EAAE,EAAE,WAAW,EAAE,SAAS,EAAE,KAAK,EAAE,SAAS,CAAC,CAAC,MAAM,CAAC,OAAO,CAAC,CAAA;IAE5E,IAAI,KAAK,CAAC,MAAM,GAAG,CAAC,EAAE;~~QACpB~~,IAAI,EAAE,IAAI,EAAE,GAAG,EAAE,GAAG,SAAS,CAAC,MAAM,CAAA;QACpC,IAAI,EAAE,CAAC,EAAE,CAAC,EAAE,GAAG,SAAS,CAAC,aAAa,CAAC,IAAI,EAAE,GAAG,EAAE,SAAS,CAAC,SAAgB,CAAC,CAAA;QAE7E,OAAO,CAAC,IAAI,GAAG,YAAY,CAAA;QAC3B,IAAI,OAAO,GAAG,wBAAwB,CAAC,OAAO,EAAE,KAAK,CAAC,CAAA;QAEtD,CAAC,GAAG,IAAI,CAAC,GAAG,CAAC,CAAC,GAAG,CAAC,EAAE,CAAC,CAAC,CAAA;QACtB,CAAC,GAAG,IAAI,CAAC,GAAG,CAAC,CAAC,GAAG,KAAK,CAAC,MAAM,GAAG,WAAW,GAAG,CAAC,EAAE,EAAE,CAAC,CAAA;QAEpD,OAAO,CAAC,SAAS,EAAE,CAAA;QAEnB,OAAO,CAAC,SAAS,GAAG,KAAK,CAAA;QAEzB,OAAO,CAAC,SAAS,CAAC,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,CAAC,EAAE,OAAO,CAAC,KAAK,GAAG,CAAC,GAAG,CAAC,EAAE,OAAO,CAAC,MAAM,GAAG,CAAC,GAAG,CAAC,EAAE,CAAC,CAAC,WAAW,CAAC,CAAA;QAE7F,OAAO,CAAC,IAAI,EAAE,CAAA;QAEd,OAAO,CAAC,SAAS,EAAE,CAAA;QAEnB,OAAO,CAAC,SAAS,GAAG,OAAO,CAAA;QAC3B,iBAAiB,CAAC,OAAO,EAAE,KAAK,EAAE,CAAC,EAAE,CAAC,CAAC,CAAA;QAEvC,OAAO,IAAI,CAAA;~~KACZ~~;IAED,OAAO,KAAK,CAAA;AACd,CAAC","sourcesContent":["import { Component } from '@hatiolab/things-scene'\n\nconst LINE_HEIGHT = 14\n\nfunction measureMultiLineTextSize(context: CanvasRenderingContext2D, lines: string[], maxWidth?: number) {\n const lineHeight = LINE_HEIGHT\n let totalWidth = 0\n let totalHeight = lines.length * lineHeight\n\n for (const line of lines) {\n const lineMetrics = context.measureText(line)\n if (lineMetrics.width > totalWidth) {\n totalWidth = lineMetrics.width\n }\n }\n\n return { width: totalWidth, height: totalHeight }\n}\n\nfunction drawMultiLineText(\n context: CanvasRenderingContext2D,\n lines: string[],\n x: number,\n y: number,\n maxWidth?: number\n) {\n const lineHeight = LINE_HEIGHT\n\n for (let i = 0; i < lines.length; i++) {\n context.fillText(lines[i], x, y + (i + 1) * lineHeight, maxWidth)\n }\n}\n\nexport default function tooltipDecorator(\n component: Component,\n context: CanvasRenderingContext2D,\n delta: number /* 1 to 0 /\n) {\n const { ID, DESCRIPTION, CARRIERID, LOTID, VEHICLEID } = component.data \|\| {}\n const lines = [ID, DESCRIPTION, CARRIERID, LOTID, VEHICLEID].filter(Boolean)\n\n if (lines.length > 0) {\n let { left, top } = component.bounds\n let { x, y } = component.transcoordS2C(left, top, component.rootModel as any)\n\n context.font = '12px Arial'\n let metrics = measureMultiLineTextSize(context, lines)\n\n x = Math.max(x + 3, 5)\n y = Math.max(y - lines.length LINE_HEIGHT - 7, 15)\n\n context.beginPath()\n\n context.fillStyle = 'red'\n\n context.roundRect(x - 3, y - 3, metrics.width + 3 * 2, metrics.height + 3 * 2, 3 /* round */)\n\n context.fill()\n\n context.beginPath()\n\n context.fillStyle = 'white'\n drawMultiLineText(context, lines, x, y)\n\n return true\n }\n\n return false\n}\n"]}
1	+ {"version":3,"file":"tooltip-decorator.js","sourceRoot":"","sources":["../../../src/layers/tooltip-decorator.ts"],"names":[],"mappings":"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","sourcesContent":["import { Component } from '@hatiolab/things-scene'\n\nconst LINE_HEIGHT = 14\n\nfunction measureMultiLineTextSize(context: CanvasRenderingContext2D, lines: string[], maxWidth?: number) {\n const lineHeight = LINE_HEIGHT\n let totalWidth = 0\n let totalHeight = lines.length * lineHeight\n\n for (const line of lines) {\n const lineMetrics = context.measureText(line)\n if (lineMetrics.width > totalWidth) {\n totalWidth = lineMetrics.width\n }\n }\n\n return { width: totalWidth, height: totalHeight }\n}\n\nfunction drawMultiLineText(\n context: CanvasRenderingContext2D,\n lines: string[],\n x: number,\n y: number,\n maxWidth?: number\n) {\n const lineHeight = LINE_HEIGHT\n\n for (let i = 0; i < lines.length; i++) {\n context.fillText(lines[i], x, y + (i + 1) * lineHeight, maxWidth)\n }\n}\n\nexport default function tooltipDecorator(\n component: Component,\n context: CanvasRenderingContext2D,\n delta: number /* 1 to 0 /\n) {\n const { ID, DESCRIPTION, CARRIERID, LOTID, VEHICLEID } = component.data \|\| {}\n const lines = [ID, DESCRIPTION, CARRIERID, LOTID, VEHICLEID].filter(Boolean)\n\n if (lines.length > 0) {\n let { left, top } = component.bounds\n let { x, y } = component.transcoordS2C(left, top, component.rootModel as any)\n\n context.font = '12px Arial'\n let metrics = measureMultiLineTextSize(context, lines)\n\n x = Math.max(x + 3, 5)\n y = Math.max(y - lines.length LINE_HEIGHT - 7, 15)\n\n context.beginPath()\n\n context.fillStyle = 'red'\n\n context.roundRect(x - 3, y - 3, metrics.width + 3 * 2, metrics.height + 3 * 2, 3 /* round */)\n\n context.fill()\n\n context.beginPath()\n\n context.fillStyle = 'white'\n drawMultiLineText(context, lines, x, y)\n\n return true\n }\n\n return false\n}\n"]}

package/dist/src/modeller/component-toolbar/component-detail.d.ts CHANGED Viewed

@@ -8,5 +8,5 @@ export declare class ComponentDetail extends LitElement {
     template: {
         about: string;
     } | null;
-    render(): import("lit-html").TemplateResult<1>;
+    render(): import("lit").TemplateResult<1>;
 }

package/dist/src/modeller/component-toolbar/component-menu.d.ts CHANGED Viewed

@@ -17,7 +17,7 @@ export declare class ComponentMenu extends ComponentMenu_base {
     static get scopedElements(): {
         'component-detail': typeof ComponentDetail;
     };
-    render(): import("lit-html").TemplateResult<1>;
+    render(): import("lit").TemplateResult<1>;
     updated(changes: PropertyValues<this>): void;
     findTemplate(type: string | null | undefined): void;
     onHoverComponent(e: MouseEvent): void;

package/dist/src/modeller/component-toolbar/component-menu.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"component-menu.js","sourceRoot":"","sources":["../../../../src/modeller/component-toolbar/component-menu.ts"],"names":[],"mappings":"AAAA;;GAEG;;AAEH,OAAO,EAAE,GAAG,EAAE,IAAI,EAAE,UAAU,EAAkB,MAAM,KAAK,CAAA;AAC3D,OAAO,EAAE,QAAQ,EAAE,KAAK,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAA;AAG1D,OAAO,EAAE,mBAAmB,EAAE,MAAM,0BAA0B,CAAA;AAC9D,OAAO,EAAE,eAAe,EAAE,MAAM,iBAAiB,CAAA;AAGjD,OAAO,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAA;AAEpD,MAAM,OAAO,GAAG,IAAI,GAAG,CAAC,2CAA2C,EAAE,MAAM,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,IAAI,CAAA;AAE1F,MAAM,OAAO,aAAc,SAAQ,mBAAmB,CAAC,UAAU,CAAC;IAAlE;;QAoF8B,WAAM,GAAa,EAAE,CAAA;QACrB,UAAK,GAAiB,IAAI,CAAA;QAC1B,UAAK,GAAkB,EAAE,CAAA;QAE5C,cAAS,GAAiB,EAAE,CAAA;IAqFvC,CAAC;IAhFC,MAAM,KAAK,cAAc;QACvB,OAAO;YACL,kBAAkB,EAAE,eAAe;SACpC,CAAA;IACH,CAAC;IAED,MAAM;QACJ,OAAO,IAAI,CAAC,KAAK;YACf,CAAC,CAAC,IAAI,CAAA;wBACY,CAAC,CAAa,EAAE,EAAE,CAAC,CAAC,CAAC,eAAe,EAAE,IAAI,IAAI,CAAC,KAAK;;sCAEtC,CAAC,CAAa,EAAE,EAAE,CAAC,IAAI,CAAC,gBAAgB,CAAC,CAAC,CAAC;cACnE,CAAC,IAAI,CAAC,SAAS,IAAI,EAAE,CAAC,CAAC,GAAG,CAC1B,QAAQ,CAAC,EAAE,CAAC,IAAI,CAAA;8BACA,IAAI,CAAC,eAAe,cAAc,QAAQ,CAAC,IAAI;6BAChD,IAAI,CAAC,YAAY,CAAC,QAAQ,CAAC,MAAM,QAAQ,CAAC,IAAI;;eAE5D,CACF;;;;;wBAKW,GAAG,EAAE;gBACf,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAA;YACtB,CAAC;wBACW,IAAI,CAAC,QAAQ;;;;SAI5B;YACH,CAAC,CAAC,IAAI,CAAA,EAAE,CAAA;IACZ,CAAC;IAED,OAAO,CAAC,OAA6B;;QACnC,IAAI,OAAO,CAAC,GAAG,CAAC,OAAO,CAAC,EAAE;~~YACxB~~,IAAI,CAAC,IAAI,CAAC,KAAK,EAAE;~~gBACf~~,IAAI,CAAC,SAAS,GAAG,EAAE,CAAA;gBACnB,IAAI,CAAC,YAAY,CAAC,QAAQ,EAAE,EAAE,CAAC,CAAA;~~aAChC~~;iBAAM;~~gBACL~~,IAAI,CAAC,SAAS,GAAG,CAAA,MAAA,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC,CAAS,EAAE,EAAE,CAAC,CAAC,CAAC,IAAI,KAAK,IAAI,CAAC,KAAK,CAAC,0CAAE,SAAS,KAAI,EAAE,CAAA;gBACxF,IAAI,CAAC,eAAe,CAAC,QAAQ,CAAC,CAAA;~~aAC/B~~;~~SACF~~;QAED,IAAI,OAAO,CAAC,GAAG,CAAC,UAAU,CAAC,EAAE;~~YAC3B~~,IAAI,CAAC,QAAQ,IAAI,IAAI,CAAC,QAAQ,CAAC,KAAK;gBAClC,CAAC,CAAC,IAAI,CAAC,MAAM,CAAC,eAAe,CAAC,QAAQ,CAAC;gBACvC,CAAC,CAAC,IAAI,CAAC,MAAM,CAAC,YAAY,CAAC,QAAQ,EAAE,EAAE,CAAC,CAAA;~~SAC3C~~;IACH,CAAC;IAED,YAAY,CAAC,IAA+B;QAC1C,IAAI,CAAC,QAAQ,GAAG,IAAI,IAAI,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,QAAQ,CAAC,EAAE,CAAC,QAAQ,CAAC,IAAI,IAAI,IAAI,CAAC,CAAA;IAChF,CAAC;IAED,gBAAgB,CAAC,CAAa;;QAC5B,MAAM,MAAM,GAAG,CAAC,CAAC,MAAqB,CAAA;QACtC,IAAI,CAAC,YAAY,CAAC,MAAA,MAAO,CAAC,OAAO,CAAC,aAAa,CAAC,0CAAE,YAAY,CAAC,WAAW,CAAC,CAAC,CAAA;IAC9E,CAAC;IAED,eAAe,CAAC,CAAa;;QAC3B,IAAI,IAAI,GAAG,CAAC,CAAC,MAAqB,CAAA;QAClC,IAAI,IAAI,GAAG,MAAA,IAAI,CAAC,OAAO,CAAC,aAAa,CAAC,0CAAE,YAAY,CAAC,WAAW,CAAC,CAAA;QAEjE,IAAI,CAAC,IAAI,EAAE;~~YACT~~,OAAM;~~SACP~~;QAED,IAAI,IAAI,CAAC,KAAK,EAAE;~~YACd~~,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,QAAQ,CAAC,EAAE,CAAC,QAAQ,CAAC,IAAI,IAAI,IAAI,CAAC,CAAA;YACtE,IAAI,CAAC,QAAQ,IAAI,IAAI,CAAC,KAAK,CAAC,YAAY,CAAC,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC,CAAC,CAAA;~~SAC1F~~;QAED,IAAI,CAAC,KAAK,GAAG,IAAI,CAAA;IACnB,CAAC;IAED,YAAY,CAAC,QAAoB;QAC/B,OAAO,QAAQ,CAAC,IAAI,IAAI,OAAO,CAAA;IACjC,CAAC;;AA3KM,oBAAM,GAAG;IACd,eAAe;IACf,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;KA8EF;CACF,AAjFY,CAiFZ;AAE2B;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;6CAAsB;AACrB;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;4CAA2B;AAC1B;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;4CAA0B;AAE5C;IAAR,KAAK,EAAE;gDAA6B;AAC5B;IAAR,KAAK,EAAE;+CAA2B;AAER;IAA1B,KAAK,CAAC,kBAAkB,CAAC;6CAAqB","sourcesContent":["/*\n @license Copyright © HatioLab Inc. All rights reserved.\n */\n\nimport { css, html, LitElement, PropertyValues } from 'lit'\nimport { property, query, state } from 'lit/decorators.js'\n\nimport { Scene } from '@hatiolab/things-scene'\nimport { ScopedElementsMixin } from '@open-wc/scoped-elements'\nimport { ScrollbarStyles } from '@operato/styles'\n\nimport { Pallet, PalletItem } from '../../types'\nimport { ComponentDetail } from './component-detail'\n\nconst noImage = new URL('../../../../icons/components/no-image.png', import.meta.url).href\n\nexport class ComponentMenu extends ScopedElementsMixin(LitElement) {\n static styles = [\n ScrollbarStyles,\n css`\n :host {\n display: flex;\n flex-direction: column;\n align-content: stretch;\n\n background-color: var(--component-menu-background-color);\n margin: 0px;\n padding: 0px;\n\n width: 180px;\n height: 100%;\n\n overflow: visible;\n\n border: 2px solid var(--component-menu-border-color);\n box-sizing: border-box;\n\n position: absolute;\n top: 0px;\n\n z-index: 1;\n }\n\n h2 {\n background-color: var(--component-menu-border-color);\n padding: 1px 5px;\n margin: 0;\n font: var(--component-menu-title);\n color: #fff;\n text-transform: capitalize;\n }\n\n [templates] {\n flex: 1;\n\n display: block;\n margin: 0;\n padding: 0;\n overflow-y: auto;\n\n background-color: var(--component-menu-background-color);\n }\n\n [template] {\n display: flex;\n align-items: center;\n min-height: var(--component-menu-item-icon-size);\n padding: 0 5px 0 0;\n border-bottom: 1px solid rgba(0, 0, 0, 0.1);\n font-size: 11px;\n color: var(--component-menu-item-color);\n }\n\n [template]:hover,\n [template]:focus {\n color: var(--component-menu-item-hover-color);\n font-weight: bold;\n cursor: pointer;\n }\n\n [template] img {\n margin: 5px;\n width: var(--component-menu-item-icon-size);\n height: var(--component-menu-item-icon-size);\n }\n\n component-detail {\n position: absolute;\n top: 0;\n left: 180px;\n height: 100%;\n outline: none;\n }\n\n component-detail[hidden] {\n display: none;\n }\n `\n ]\n\n @property({ type: Object }) groups: Pallet[] = []\n @property({ type: Object }) scene: Scene \| null = null\n @property({ type: String }) group: string \| null = ''\n\n @state() templates: PalletItem[] = []\n @state() template: PalletItem \| any\n\n @query('component-detail') detail!: HTMLElement\n\n static get scopedElements() {\n return {\n 'component-detail': ComponentDetail\n }\n }\n\n render() {\n return this.group\n ? html`\n <h2 onclick=${(e: MouseEvent) => e.stopPropagation()}>${this.group} list</h2>\n\n <div templates @mouseover=${(e: MouseEvent) => this.onHoverComponent(e)}>\n ${(this.templates \|\| []).map(\n template => html`\n <div @click=${this.onClickTemplate} data-type=${template.type} template>\n <img src=${this.templateIcon(template)} />${template.type}\n </div>\n `\n )}\n </div>\n\n <component-detail\n tabindex=\"-1\"\n @focusout=${() => {\n this.template = null\n }}\n .template=${this.template}\n hidden\n >\n </component-detail>\n `\n : html``\n }\n\n updated(changes: PropertyValues<this>) {\n if (changes.has('group')) {\n if (!this.group) {\n this.templates = []\n this.setAttribute('hidden', '')\n } else {\n this.templates = this.groups.find((g: Pallet) => g.name === this.group)?.templates \|\| []\n this.removeAttribute('active')\n }\n }\n\n if (changes.has('template')) {\n this.template && this.template.about\n ? this.detail.removeAttribute('hidden')\n : this.detail.setAttribute('hidden', '')\n }\n }\n\n findTemplate(type: string \| null \| undefined) {\n this.template = type && this.templates.find(template => template.type == type)\n }\n\n onHoverComponent(e: MouseEvent) {\n const button = e.target as HTMLElement\n this.findTemplate(button!.closest('[data-type]')?.getAttribute('data-type'))\n }\n\n onClickTemplate(e: MouseEvent) {\n var item = e.target as HTMLElement\n var type = item.closest('[data-type]')?.getAttribute('data-type')\n\n if (!type) {\n return\n }\n\n if (this.scene) {\n this.template = this.templates.find(template => template.type == type)\n this.template && this.scene.startAddMode(JSON.parse(JSON.stringify(this.template.model)))\n }\n\n this.group = null\n }\n\n templateIcon(template: PalletItem) {\n return template.icon \|\| noImage\n }\n}\n"]}
1	+ {"version":3,"file":"component-menu.js","sourceRoot":"","sources":["../../../../src/modeller/component-toolbar/component-menu.ts"],"names":[],"mappings":"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","sourcesContent":["/*\n @license Copyright © HatioLab Inc. All rights reserved.\n */\n\nimport { css, html, LitElement, PropertyValues } from 'lit'\nimport { property, query, state } from 'lit/decorators.js'\n\nimport { Scene } from '@hatiolab/things-scene'\nimport { ScopedElementsMixin } from '@open-wc/scoped-elements'\nimport { ScrollbarStyles } from '@operato/styles'\n\nimport { Pallet, PalletItem } from '../../types'\nimport { ComponentDetail } from './component-detail'\n\nconst noImage = new URL('../../../../icons/components/no-image.png', import.meta.url).href\n\nexport class ComponentMenu extends ScopedElementsMixin(LitElement) {\n static styles = [\n ScrollbarStyles,\n css`\n :host {\n display: flex;\n flex-direction: column;\n align-content: stretch;\n\n background-color: var(--component-menu-background-color);\n margin: 0px;\n padding: 0px;\n\n width: 180px;\n height: 100%;\n\n overflow: visible;\n\n border: 2px solid var(--component-menu-border-color);\n box-sizing: border-box;\n\n position: absolute;\n top: 0px;\n\n z-index: 1;\n }\n\n h2 {\n background-color: var(--component-menu-border-color);\n padding: 1px 5px;\n margin: 0;\n font: var(--component-menu-title);\n color: #fff;\n text-transform: capitalize;\n }\n\n [templates] {\n flex: 1;\n\n display: block;\n margin: 0;\n padding: 0;\n overflow-y: auto;\n\n background-color: var(--component-menu-background-color);\n }\n\n [template] {\n display: flex;\n align-items: center;\n min-height: var(--component-menu-item-icon-size);\n padding: 0 5px 0 0;\n border-bottom: 1px solid rgba(0, 0, 0, 0.1);\n font-size: 11px;\n color: var(--component-menu-item-color);\n }\n\n [template]:hover,\n [template]:focus {\n color: var(--component-menu-item-hover-color);\n font-weight: bold;\n cursor: pointer;\n }\n\n [template] img {\n margin: 5px;\n width: var(--component-menu-item-icon-size);\n height: var(--component-menu-item-icon-size);\n }\n\n component-detail {\n position: absolute;\n top: 0;\n left: 180px;\n height: 100%;\n outline: none;\n }\n\n component-detail[hidden] {\n display: none;\n }\n `\n ]\n\n @property({ type: Object }) groups: Pallet[] = []\n @property({ type: Object }) scene: Scene \| null = null\n @property({ type: String }) group: string \| null = ''\n\n @state() templates: PalletItem[] = []\n @state() template: PalletItem \| any\n\n @query('component-detail') detail!: HTMLElement\n\n static get scopedElements() {\n return {\n 'component-detail': ComponentDetail\n }\n }\n\n render() {\n return this.group\n ? html`\n <h2 onclick=${(e: MouseEvent) => e.stopPropagation()}>${this.group} list</h2>\n\n <div templates @mouseover=${(e: MouseEvent) => this.onHoverComponent(e)}>\n ${(this.templates \|\| []).map(\n template => html`\n <div @click=${this.onClickTemplate} data-type=${template.type} template>\n <img src=${this.templateIcon(template)} />${template.type}\n </div>\n `\n )}\n </div>\n\n <component-detail\n tabindex=\"-1\"\n @focusout=${() => {\n this.template = null\n }}\n .template=${this.template}\n hidden\n >\n </component-detail>\n `\n : html``\n }\n\n updated(changes: PropertyValues<this>) {\n if (changes.has('group')) {\n if (!this.group) {\n this.templates = []\n this.setAttribute('hidden', '')\n } else {\n this.templates = this.groups.find((g: Pallet) => g.name === this.group)?.templates \|\| []\n this.removeAttribute('active')\n }\n }\n\n if (changes.has('template')) {\n this.template && this.template.about\n ? this.detail.removeAttribute('hidden')\n : this.detail.setAttribute('hidden', '')\n }\n }\n\n findTemplate(type: string \| null \| undefined) {\n this.template = type && this.templates.find(template => template.type == type)\n }\n\n onHoverComponent(e: MouseEvent) {\n const button = e.target as HTMLElement\n this.findTemplate(button!.closest('[data-type]')?.getAttribute('data-type'))\n }\n\n onClickTemplate(e: MouseEvent) {\n var item = e.target as HTMLElement\n var type = item.closest('[data-type]')?.getAttribute('data-type')\n\n if (!type) {\n return\n }\n\n if (this.scene) {\n this.template = this.templates.find(template => template.type == type)\n this.template && this.scene.startAddMode(JSON.parse(JSON.stringify(this.template.model)))\n }\n\n this.group = null\n }\n\n templateIcon(template: PalletItem) {\n return template.icon \|\| noImage\n }\n}\n"]}

package/dist/src/modeller/component-toolbar/component-toolbar.d.ts CHANGED Viewed

@@ -21,7 +21,7 @@ export declare class ComponentToolbar extends ComponentToolbar_base {
     static get scopedElements(): {
         'component-menu': typeof ComponentMenu;
     };
-    render(): import("lit-html").TemplateResult<1>;
+    render(): import("lit").TemplateResult<1>;
     onWheelEvent(e: Event): void;
     _setMode(mode: SCENE_MODE): void;
     _onClickShift(e: MouseEvent): void;

package/dist/src/modeller/component-toolbar/component-toolbar.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"component-toolbar.js","sourceRoot":"","sources":["../../../../src/modeller/component-toolbar/component-toolbar.ts"],"names":[],"mappings":"AAAA;;GAEG;;AAEH,OAAO,EAAE,GAAG,EAAE,IAAI,EAAE,UAAU,EAAkB,MAAM,KAAK,CAAA;AAC3D,OAAO,EAAE,QAAQ,EAAE,KAAK,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAA;AAE7D,OAAO,EAAS,UAAU,EAAE,MAAM,wBAAwB,CAAA;AAC1D,OAAO,EAAE,mBAAmB,EAAE,MAAM,0BAA0B,CAAA;AAG9D,OAAO,EAAE,aAAa,EAAE,MAAM,qBAAqB,CAAA;AACnD,OAAO,EAAE,cAAc,EAAE,eAAe,EAAE,MAAM,cAAc,CAAA;AAE9D,MAAM,OAAO,gBAAiB,SAAQ,mBAAmB,CAAC,UAAU,CAAC;IAArE;;QAsD6B,uBAAkB,GAAqB,EAAE,CAAA;QAGxC,SAAI,GAAe,UAAU,CAAC,IAAI,CAAA;QAOtD,UAAK,GAA+B,EAAE,CAAA;IAkHhD,CAAC;IAhHC,OAAO,CAAC,OAA6B;QACnC,IAAI,OAAO,CAAC,GAAG,CAAC,oBAAoB,CAAC,EAAE;~~YACrC~~,MAAM,KAAK,GAAG,gBAAgB,CAAC,IAAI,EAAE,IAAI,CAAC,CAAC,gBAAgB,CAAC,iBAAiB,CAAC,CAAA;YAE9E,IAAI,CAAC,KAAK,GAAG,CAAC,IAAI,CAAC,kBAAkB,IAAI,EAAE,CAAC;iBACzC,MAAM,CAAC,KAAK,CAAC,EAAE,WAAC,OAAA,CAAA,MAAA,KAAK,CAAC,SAAS,0CAAE,MAAM,IAAG,CAAC,CAAA,EAAA,CAAC;iBAC5C,MAAM,CAAC,CAAC,GAAG,EAAE,KAAqB,EAAE,EAAE;gBACrC,GAAG,CAAC,KAAK,CAAC,IAAI,CAAC;oBACb,0CAA0C,GAAG,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,OAAO,CAAC,kBAAkB,EAAE,KAAK,CAAC,CAAC,CAAA;gBAClG,OAAO,GAAG,CAAA;YACZ,CAAC,EAAE,EAAgC,CAAC,CAAA;YAEtC,IAAI,CAAC,KAAK,CAAC,WAAW,CAAC;gBACrB,0CAA0C,GAAG,IAAI,CAAC,cAAc,CAAC,OAAO,CAAC,kBAAkB,EAAE,KAAK,CAAC,CAAC,CAAA;YACtG,IAAI,CAAC,KAAK,CAAC,YAAY,CAAC;gBACtB,0CAA0C,GAAG,IAAI,CAAC,eAAe,CAAC,OAAO,CAAC,kBAAkB,EAAE,KAAK,CAAC,CAAC,CAAA;~~SACxG~~;QAED,IAAI,OAAO,CAAC,GAAG,CAAC,OAAO,CAAC,EAAE;~~YACxB~~,IAAI,CAAC,MAAM,CAAC,OAAO,CAAC,KAAK,CAAC,EAAE;gBAC1B,KAAK,CAAC,YAAY,CAAC,YAAY,CAAC,KAAK,IAAI,CAAC,KAAK;oBAC7C,CAAC,CAAC,KAAK,CAAC,YAAY,CAAC,QAAQ,EAAE,EAAE,CAAC;oBAClC,CAAC,CAAC,KAAK,CAAC,eAAe,CAAC,QAAQ,CAAC,CAAA;YACrC,CAAC,CAAC,CAAA;YAEF,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC,eAAe,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC,YAAY,CAAC,QAAQ,EAAE,EAAE,CAAC,CAAA;~~SACxF~~;IACH,CAAC;IAED,MAAM,KAAK,cAAc;QACvB,OAAO;YACL,gBAAgB,EAAE,aAAa;SAChC,CAAA;IACH,CAAC;IAED,MAAM;QACJ,MAAM,aAAa,GAAG,IAAI,CAAC,kBAAkB,IAAI,EAAE,CAAA;QACnD,MAAM,QAAQ,GAAG,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,IAAI,KAAK,UAAU,CAAC,KAAK,CAAC,CAAC,CAAC,YAAY,CAAC,CAAC,CAAC,WAAW,CAAC,CAAA;QAExF,OAAO,IAAI,CAAA;oCACqB,CAAC,CAAa,EAAE,EAAE,CAAC,IAAI,CAAC,YAAY,CAAC,CAAC,CAAC;+BAC5C,QAAQ,WAAW,CAAC,CAAa,EAAE,EAAE,CAAC,IAAI,CAAC,aAAa,CAAC,CAAC,CAAC;;UAEhF,aAAa;aACZ,MAAM,CAAC,KAAK,CAAC,EAAE,WAAC,OAAA,CAAA,MAAA,KAAK,CAAC,SAAS,0CAAE,MAAM,IAAG,CAAC,CAAA,EAAA,CAAC;aAC5C,GAAG,CACF,KAAK,CAAC,EAAE,CAAC,IAAI,CAAA;;6BAEI,KAAK,CAAC,IAAI;yBACd,CAAC,CAAa,EAAE,EAAE,CAAC,IAAI,CAAC,aAAa,CAAC,CAAC,CAAC;uBAC1C,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,IAAI,CAAC;;aAEhC,CACF;;;;;oBAKS,GAAG,EAAE;YACf,IAAI,CAAC,KAAK,GAAG,IAAI,CAAA;QACnB,CAAC;iBACQ,IAAI,CAAC,KAAK;iBACV,IAAI,CAAC,KAAK;kBACT,aAAa;;;;KAI1B,CAAA;IACH,CAAC;IAED,YAAY,CAAC,CAAQ;QACnB,IAAI,KAAK,GAAG,IAAI,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,IAAI,CAAC,GAAG,CAAC,CAAC,EAAG,CAAgB,CAAC,MAAM,IAAI,CAAE,CAAgB,CAAC,MAAM,CAAC,CAAC,CAAA;QAC5F,IAAI,CAAC,mBAAmB,CAAC,SAAS,IAAI,KAAK,GAAG,EAAE,CAAA;QAEhD,CAAC,CAAC,cAAc,EAAE,CAAA;IACpB,CAAC;IAED,QAAQ,CAAC,IAAgB;QACvB,IAAI,CAAC,IAAI,GAAG,IAAI,CAAA;QAEhB,IAAI,CAAC,aAAa,CAChB,IAAI,WAAW,CAAC,cAAc,EAAE;YAC9B,OAAO,EAAE,IAAI;YACb,QAAQ,EAAE,IAAI;YACd,MAAM,EAAE,EAAE,KAAK,EAAE,IAAI,EAAE;SACxB,CAAC,CACH,CAAA;IACH,CAAC;IAED,aAAa,CAAC,CAAa;QACzB,MAAM,KAAK,GAAG,IAAI,CAAC,KAAK,CAAA;QAExB,IAAI,KAAK,CAAC,YAAY,CAAC,QAAQ,CAAC,EAAE;~~YAChC~~,KAAK,CAAC,eAAe,CAAC,QAAQ,CAAC,CAAA;YAC/B,IAAI,CAAC,QAAQ,CAAC,UAAU,CAAC,IAAI,CAAC,CAAA;~~SAC/B~~;aAAM;~~YACL~~,KAAK,CAAC,YAAY,CAAC,QAAQ,EAAE,EAAE,CAAC,CAAA;YAChC,IAAI,CAAC,QAAQ,CAAC,UAAU,CAAC,KAAK,CAAC,CAAA;~~SAChC~~;IACH,CAAC;IAED,KAAK,CAAC,aAAa,CAAC,CAAa;;QAC/B,IAAI,MAAM,GAAG,CAAC,CAAC,MAAqB,CAAA;QAEpC,IAAI,CAAC,KAAK,GAAG,MAAA,MAAO,CAAC,OAAO,CAAC,cAAc,CAAC,0CAAE,YAAY,CAAC,YAAY,CAAC,CAAA;QAExE,IAAI,CAAC,IAAI,CAAC,KAAK;YAAE,OAAM;QAEvB,MAAM,IAAI,CAAC,cAAc,CAAA;QAEzB,MAAA,IAAI,CAAC,IAAI,0CAAE,KAAK,EAAE,CAAA;IACpB,CAAC;;AAhLM,uBAAM,GAAG;IACd,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;KAiDF;CACF,AAnDY,CAmDZ;AAE0B;IAA1B,QAAQ,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,CAAC;4DAA0C;AACxC;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;+CAAsB;AACrB;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;+CAAc;AACb;IAA3B,QAAQ,CAAC,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC;8CAAmC;AAE7C;IAAhB,KAAK,CAAC,QAAQ,CAAC;+CAAyB;AACR;IAAhC,KAAK,CAAC,gBAAgB,CAAC;8CAA2B;AACjB;IAAjC,KAAK,CAAC,iBAAiB,CAAC;6DAA0C;AACjC;IAAjC,QAAQ,CAAC,cAAc,CAAC;gDAAyC","sourcesContent":["/*\n @license Copyright © HatioLab Inc. All rights reserved.\n /\n\nimport { css, html, LitElement, PropertyValues } from 'lit'\nimport { property, query, queryAll } from 'lit/decorators.js'\n\nimport { Scene, SCENE_MODE } from '@hatiolab/things-scene'\nimport { ScopedElementsMixin } from '@open-wc/scoped-elements'\n\nimport { ComponentGroup } from '../../types'\nimport { ComponentMenu } from './component-menu.js'\nimport { ICON_EDIT_MODE, ICON_SHIFT_MODE } from './mode-icons'\n\nexport class ComponentToolbar extends ScopedElementsMixin(LitElement) {\n static styles = [\n css`\n :host {\n left: 0;\n display: block;\n position: relative;\n\n width: var(--component-toolbar-icon-size);\n background-color: var(--component-toolbar-background-color);\n }\n\n [components] {\n display: block;\n padding: 0;\n margin: 0;\n\n width: 100%;\n height: 100%;\n overflow: hidden;\n }\n\n [components] > img {\n display: flex;\n flex-direction: row;\n\n width: var(--component-toolbar-icon-size);\n height: var(--component-toolbar-icon-size);\n min-width: 50%;\n\n border-bottom: var(--component-toolbar-border);\n margin: 0;\n padding: 6px;\n box-sizing: border-box;\n }\n\n #shift[active] {\n background-color: #beb9b3;\n }\n\n component-menu {\n position: absolute;\n top: 0;\n left: var(--component-toolbar-icon-size);\n height: 100%;\n outline: none;\n }\n\n component-menu[hidden] {\n display: none;\n }\n `\n ]\n\n @property({ type: Array }) componentGroupList: ComponentGroup[] = []\n @property({ type: String }) group?: string \| null\n @property({ type: Object }) scene!: Scene\n @property({ type: Number }) mode: SCENE_MODE = SCENE_MODE.EDIT\n\n @query('#shift') shift!: HTMLImageElement\n @query('component-menu') private menu!: HTMLElement\n @query('div[components]') private componentsContainer!: HTMLElement\n @queryAll('[data-group]') private groups!: NodeListOf<HTMLElement>\n\n private icons: { [name: string]: string } = {}\n\n updated(changes: PropertyValues<this>) {\n if (changes.has('componentGroupList')) {\n const color = getComputedStyle(this, null).getPropertyValue('--primary-color')\n\n this.icons = (this.componentGroupList \|\| [])\n .filter(group => group.templates?.length > 0)\n .reduce((sum, group: ComponentGroup) => {\n sum[group.name] =\n 'data:image/svg+xml;charset=UTF-8;base64,' + btoa(group.icon.replace(/{{strokeColor}}/g, color))\n return sum\n }, {} as { [name: string]: string })\n\n this.icons['mode-edit'] =\n 'data:image/svg+xml;charset=UTF-8;base64,' + btoa(ICON_EDIT_MODE.replace(/{{strokeColor}}/g, color))\n this.icons['mode-shift'] =\n 'data:image/svg+xml;charset=UTF-8;base64,' + btoa(ICON_SHIFT_MODE.replace(/{{strokeColor}}/g, color))\n }\n\n if (changes.has('group')) {\n this.groups.forEach(group => {\n group.getAttribute('data-group') === this.group\n ? group.setAttribute('active', '')\n : group.removeAttribute('active')\n })\n\n this.group ? this.menu.removeAttribute('hidden') : this.menu.setAttribute('hidden', '')\n }\n }\n\n static get scopedElements() {\n return {\n 'component-menu': ComponentMenu\n }\n }\n\n render() {\n const componentList = this.componentGroupList \|\| []\n const modeIcon = this.icons[this.mode === SCENE_MODE.SHIFT ? 'mode-shift' : 'mode-edit']\n\n return html`\n <div components @mousewheel=${(e: MouseEvent) => this.onWheelEvent(e)}>\n <img id=\"shift\" .src=${modeIcon} @click=${(e: MouseEvent) => this._onClickShift(e)} />\n\n ${componentList\n .filter(group => group.templates?.length > 0)\n .map(\n group => html`\n <img\n data-group=${group.name}\n @click=${(e: MouseEvent) => this._onClickGroup(e)}\n .src=${this.icons[group.name]}\n />\n `\n )}\n </div>\n\n <component-menu\n tabindex=\"-1\"\n @focusout=${() => {\n this.group = null\n }}\n .scene=${this.scene}\n .group=${this.group}\n .groups=${componentList}\n hidden\n >\n </component-menu>\n `\n }\n\n onWheelEvent(e: Event) {\n var delta = Math.max(-1, Math.min(1, (e as WheelEvent).deltaY \|\| -(e as WheelEvent).detail))\n this.componentsContainer.scrollTop += delta 10\n\n e.preventDefault()\n }\n\n _setMode(mode: SCENE_MODE) {\n this.mode = mode\n\n this.dispatchEvent(\n new CustomEvent('mode-changed', {\n bubbles: true,\n composed: true,\n detail: { value: mode }\n })\n )\n }\n\n _onClickShift(e: MouseEvent) {\n const shift = this.shift\n\n if (shift.hasAttribute('active')) {\n shift.removeAttribute('active')\n this._setMode(SCENE_MODE.EDIT)\n } else {\n shift.setAttribute('active', '')\n this._setMode(SCENE_MODE.SHIFT)\n }\n }\n\n async _onClickGroup(e: MouseEvent) {\n var button = e.target as HTMLElement\n\n this.group = button!.closest('[data-group]')?.getAttribute('data-group')\n\n if (!this.group) return\n\n await this.updateComplete\n\n this.menu?.focus()\n }\n}\n"]}
1	+ {"version":3,"file":"component-toolbar.js","sourceRoot":"","sources":["../../../../src/modeller/component-toolbar/component-toolbar.ts"],"names":[],"mappings":"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","sourcesContent":["/*\n @license Copyright © HatioLab Inc. All rights reserved.\n /\n\nimport { css, html, LitElement, PropertyValues } from 'lit'\nimport { property, query, queryAll } from 'lit/decorators.js'\n\nimport { Scene, SCENE_MODE } from '@hatiolab/things-scene'\nimport { ScopedElementsMixin } from '@open-wc/scoped-elements'\n\nimport { ComponentGroup } from '../../types'\nimport { ComponentMenu } from './component-menu.js'\nimport { ICON_EDIT_MODE, ICON_SHIFT_MODE } from './mode-icons'\n\nexport class ComponentToolbar extends ScopedElementsMixin(LitElement) {\n static styles = [\n css`\n :host {\n left: 0;\n display: block;\n position: relative;\n\n width: var(--component-toolbar-icon-size);\n background-color: var(--component-toolbar-background-color);\n }\n\n [components] {\n display: block;\n padding: 0;\n margin: 0;\n\n width: 100%;\n height: 100%;\n overflow: hidden;\n }\n\n [components] > img {\n display: flex;\n flex-direction: row;\n\n width: var(--component-toolbar-icon-size);\n height: var(--component-toolbar-icon-size);\n min-width: 50%;\n\n border-bottom: var(--component-toolbar-border);\n margin: 0;\n padding: 6px;\n box-sizing: border-box;\n }\n\n #shift[active] {\n background-color: #beb9b3;\n }\n\n component-menu {\n position: absolute;\n top: 0;\n left: var(--component-toolbar-icon-size);\n height: 100%;\n outline: none;\n }\n\n component-menu[hidden] {\n display: none;\n }\n `\n ]\n\n @property({ type: Array }) componentGroupList: ComponentGroup[] = []\n @property({ type: String }) group?: string \| null\n @property({ type: Object }) scene!: Scene\n @property({ type: Number }) mode: SCENE_MODE = SCENE_MODE.EDIT\n\n @query('#shift') shift!: HTMLImageElement\n @query('component-menu') private menu!: HTMLElement\n @query('div[components]') private componentsContainer!: HTMLElement\n @queryAll('[data-group]') private groups!: NodeListOf<HTMLElement>\n\n private icons: { [name: string]: string } = {}\n\n updated(changes: PropertyValues<this>) {\n if (changes.has('componentGroupList')) {\n const color = getComputedStyle(this, null).getPropertyValue('--primary-color')\n\n this.icons = (this.componentGroupList \|\| [])\n .filter(group => group.templates?.length > 0)\n .reduce((sum, group: ComponentGroup) => {\n sum[group.name] =\n 'data:image/svg+xml;charset=UTF-8;base64,' + btoa(group.icon.replace(/{{strokeColor}}/g, color))\n return sum\n }, {} as { [name: string]: string })\n\n this.icons['mode-edit'] =\n 'data:image/svg+xml;charset=UTF-8;base64,' + btoa(ICON_EDIT_MODE.replace(/{{strokeColor}}/g, color))\n this.icons['mode-shift'] =\n 'data:image/svg+xml;charset=UTF-8;base64,' + btoa(ICON_SHIFT_MODE.replace(/{{strokeColor}}/g, color))\n }\n\n if (changes.has('group')) {\n this.groups.forEach(group => {\n group.getAttribute('data-group') === this.group\n ? group.setAttribute('active', '')\n : group.removeAttribute('active')\n })\n\n this.group ? this.menu.removeAttribute('hidden') : this.menu.setAttribute('hidden', '')\n }\n }\n\n static get scopedElements() {\n return {\n 'component-menu': ComponentMenu\n }\n }\n\n render() {\n const componentList = this.componentGroupList \|\| []\n const modeIcon = this.icons[this.mode === SCENE_MODE.SHIFT ? 'mode-shift' : 'mode-edit']\n\n return html`\n <div components @mousewheel=${(e: MouseEvent) => this.onWheelEvent(e)}>\n <img id=\"shift\" .src=${modeIcon} @click=${(e: MouseEvent) => this._onClickShift(e)} />\n\n ${componentList\n .filter(group => group.templates?.length > 0)\n .map(\n group => html`\n <img\n data-group=${group.name}\n @click=${(e: MouseEvent) => this._onClickGroup(e)}\n .src=${this.icons[group.name]}\n />\n `\n )}\n </div>\n\n <component-menu\n tabindex=\"-1\"\n @focusout=${() => {\n this.group = null\n }}\n .scene=${this.scene}\n .group=${this.group}\n .groups=${componentList}\n hidden\n >\n </component-menu>\n `\n }\n\n onWheelEvent(e: Event) {\n var delta = Math.max(-1, Math.min(1, (e as WheelEvent).deltaY \|\| -(e as WheelEvent).detail))\n this.componentsContainer.scrollTop += delta 10\n\n e.preventDefault()\n }\n\n _setMode(mode: SCENE_MODE) {\n this.mode = mode\n\n this.dispatchEvent(\n new CustomEvent('mode-changed', {\n bubbles: true,\n composed: true,\n detail: { value: mode }\n })\n )\n }\n\n _onClickShift(e: MouseEvent) {\n const shift = this.shift\n\n if (shift.hasAttribute('active')) {\n shift.removeAttribute('active')\n this._setMode(SCENE_MODE.EDIT)\n } else {\n shift.setAttribute('active', '')\n this._setMode(SCENE_MODE.SHIFT)\n }\n }\n\n async _onClickGroup(e: MouseEvent) {\n var button = e.target as HTMLElement\n\n this.group = button!.closest('[data-group]')?.getAttribute('data-group')\n\n if (!this.group) return\n\n await this.updateComplete\n\n this.menu?.focus()\n }\n}\n"]}

package/dist/src/modeller/edit-toolbar.d.ts CHANGED Viewed

@@ -25,7 +25,7 @@ export declare class EditToolbar extends LitElement {
     private distributes;
     firstUpdated(): void;
     updated(changes: PropertyValues<this>): void;
-    render(): import("lit-html").TemplateResult<1>;
+    render(): import("lit").TemplateResult<1>;
     hasEmptySlot(): boolean;
     onWheelEvent(e: Event): void;
     getSymbol(key: string): string;