@operato/scene-manufacturing 1.3.19 → 1.3.20

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.
@@ -1 +1 @@
1
- {"version":3,"file":"tact-timer.js","sourceRoot":"","sources":["../src/tact-timer.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAA+B,QAAQ,EAAE,KAAK,EAAE,MAAM,wBAAwB,CAAA;AAChG,OAAO,MAAM,MAAM,eAAe,CAAA;AAElC,MAAM,IAAI,GAAG,IAAI,GAAG,CAAC,8BAA8B,EAAE,MAAM,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,IAAI,CAAA;AAE1E,MAAM,MAAM,GAAoB;IAC9B,OAAO,EAAE,KAAK;IACd,SAAS,EAAE,IAAI;IACf,SAAS,EAAE,IAAI;IACf,UAAU,EAAE;QACV;YACE,IAAI,EAAE,QAAQ;YACd,KAAK,EAAE,YAAY;YACnB,IAAI,EAAE,WAAW;YACjB,WAAW,EAAE,gBAAgB;SAC9B;QACD;YACE,IAAI,EAAE,QAAQ;YACd,KAAK,EAAE,UAAU;YACjB,IAAI,EAAE,SAAS;YACf,WAAW,EAAE,gBAAgB;SAC9B;QACD;YACE,IAAI,EAAE,QAAQ;YACd,KAAK,EAAE,QAAQ;YACf,IAAI,EAAE,QAAQ;YACd,WAAW,EAAE,UAAU;SACxB;QACD;YACE,IAAI,EAAE,QAAQ;YACd,KAAK,EAAE,oBAAoB;YAC3B,IAAI,EAAE,mBAAmB;YACzB,QAAQ,EAAE;gBACR,OAAO,EAAE,CAAC,EAAE,EAAE,UAAU,EAAE,UAAU,CAAC;aACtC;SACF;QACD;YACE,IAAI,EAAE,OAAO;YACb,KAAK,EAAE,yBAAyB;YAChC,IAAI,EAAE,uBAAuB;SAC9B;QACD;YACE,IAAI,EAAE,OAAO;YACb,KAAK,EAAE,yBAAyB;YAChC,IAAI,EAAE,uBAAuB;SAC9B;QACD;YACE,IAAI,EAAE,OAAO;YACb,KAAK,EAAE,qBAAqB;YAC5B,IAAI,EAAE,mBAAmB;SAC1B;QACD;YACE,IAAI,EAAE,OAAO;YACb,KAAK,EAAE,oBAAoB;YAC3B,IAAI,EAAE,mBAAmB;SAC1B;QACD;YACE,IAAI,EAAE,OAAO;YACb,KAAK,EAAE,uBAAuB;YAC9B,IAAI,EAAE,qBAAqB;SAC5B;QACD;YACE,IAAI,EAAE,QAAQ;YACd,KAAK,EAAE,oBAAoB;YAC3B,IAAI,EAAE,mBAAmB;YACzB,WAAW,EAAE,GAAG;SACjB;QACD;YACE,IAAI,EAAE,QAAQ;YACd,KAAK,EAAE,OAAO;YACd,IAAI,EAAE,OAAO;SACd;QACD;YACE,IAAI,EAAE,SAAS;YACf,KAAK,EAAE,YAAY;YACnB,IAAI,EAAE,WAAW;SAClB;QACD;YACE,IAAI,EAAE,SAAS;YACf,KAAK,EAAE,eAAe;YACtB,IAAI,EAAE,cAAc;SACrB;QACD;YACE,IAAI,EAAE,SAAS;YACf,KAAK,EAAE,YAAY;YACnB,IAAI,EAAE,WAAW;SAClB;KACF;IACD,IAAI,EAAE,0CAA0C;CACjD,CAAA;AAED,MAAM,CAAC,OAAO,OAAO,SAAU,SAAQ,QAAQ,CAAC,KAAK,CAAC;IAAtD;;QAYU,WAAM,GAAW,CAAC,CAAA;QAClB,SAAI,GAAW,CAAC,CAAA;IAqL1B,CAAC;IA/LC,MAAM,KAAK,IAAI;QACb,IAAI,CAAC,SAAS,CAAC,IAAI,EAAE,CAAC;YACpB,SAAS,CAAC,IAAI,GAAG,IAAI,KAAK,EAAE,CAAA;YAC5B,SAAS,CAAC,IAAI,CAAC,GAAG,GAAG,IAAI,CAAA;QAC3B,CAAC;QAED,OAAO,SAAS,CAAC,IAAI,CAAA;IACvB,CAAC;IAKD,IAAI,MAAM;QACR,OAAO,MAAM,CAAA;IACf,CAAC;IAED,KAAK;QACH,IAAI,CAAC,IAAI,CAAC,GAAG,CAAC,UAAU,EAAE,CAAC;YACzB,OAAM;QACR,CAAC;QAED,MAAM,EAAE,SAAS,EAAE,GAAG,IAAI,CAAC,KAAK,CAAA;QAEhC,IAAI,SAAS,EAAE,CAAC;YACd,IAAI,CAAC,KAAK,EAAE,CAAA;QACd,CAAC;IACH,CAAC;IAED,KAAK;QACH,MAAM,EAAE,SAAS,EAAE,OAAO,EAAE,GAAG,IAAI,CAAC,KAAK,CAAA;QACzC,MAAM,KAAK,GAAG,IAAI,CAAC,SAAS,CAAC,SAAS,CAAC,CAAA;QACvC,MAAM,GAAG,GAAG,IAAI,CAAC,SAAS,CAAC,OAAO,CAAC,CAAA;QAEnC,IAAI,KAAK,IAAI,GAAG,EAAE,CAAC;YACjB,IAAI,CAAC,IAAI,GAAG,GAAG,CAAC,OAAO,EAAE,CAAA;YACzB,IAAI,CAAC,MAAM,GAAG,KAAK,CAAC,OAAO,EAAE,CAAA;YAC7B,IAAI,CAAC,QAAQ,EAAE,CAAA;QACjB,CAAC;IACH,CAAC;IAED,QAAQ,CAAC,KAAiB;QACxB,IAAI,WAAW,IAAI,KAAK,IAAI,SAAS,IAAI,KAAK,EAAE,CAAC;YAC/C,IAAI,CAAC,KAAK,EAAE,CAAA;QACd,CAAC;IACH,CAAC;IAED,QAAQ;QACN,IAAI,IAAI,CAAC,QAAQ,EAAE,CAAC;YAClB,OAAM;QACR,CAAC;QAED,qBAAqB,CAAC,GAAG,EAAE;YACzB,MAAM,EAAE,SAAS,EAAE,GAAG,IAAI,CAAC,KAAK,CAAA;YAChC,MAAM,SAAS,GAAG,IAAI,CAAC,SAAS,CAAA;YAEhC,IAAI,SAAS,EAAE,CAAC;gBACd,MAAM,IAAI,GAAG,MAAM,CAAC,IAAI,CAAC,GAAG,CAAC,SAAS,CAAC,EAAE,IAAI,CAAC,QAAQ,CAAC,QAAQ,CAAC,CAAC,CAAA;gBACjE,IAAI,CAAC,IAAI,GAAG,IAAI,CAAA;YAClB,CAAC;iBAAM,CAAC;gBACN,IAAI,CAAC,IAAI,GAAG,EAAE,CAAA;YAChB,CAAC;YAED,IAAI,CAAC,QAAQ,CAAC,MAAM,EAAE,IAAI,CAAC,SAAS,CAAC,CAAA;YAErC,UAAU,CAAC,GAAG,EAAE;gBACd,IAAI,CAAC,QAAQ,EAAE,CAAA;YACjB,CAAC,EAAE,IAAI,CAAC,CAAA;QACV,CAAC,CAAC,CAAA;IACJ,CAAC;IAED,MAAM,CAAC,OAAiC;QACtC,IAAI,EACF,GAAG,EACH,IAAI,EACJ,MAAM,EACN,KAAK,EACL,KAAK,GAAG,CAAC,EACT,SAAS,EACT,iBAAiB,EACjB,iBAAiB,EACjB,qBAAqB,GAAG,aAAa,EACrC,qBAAqB,GAAG,aAAa,EACrC,mBAAmB,GAAG,aAAa,EACnC,iBAAiB,GAAG,UAAU,EAC9B,iBAAiB,GAAG,CAAC,EACrB,YAAY,EACZ,SAAS,EACV,GAAG,IAAI,CAAC,KAAK,CAAA;QAEd,MAAM,QAAQ,GAAG,IAAI,CAAC,SAAS,GAAG,CAAC,CAAA;QACnC,MAAM,aAAa,GAAG,CAAC,IAAI,CAAC,IAAI,GAAG,IAAI,CAAC,MAAM,CAAC,GAAG,IAAI,CAAA;QACtD,MAAM,cAAc,GAAG,IAAI,CAAC,SAAS,GAAG,aAAa,GAAG,iBAAiB,GAAG,GAAG,CAAA;QAE/E,eAAe;QACf,OAAO,CAAC,SAAS,EAAE,CAAA;QACnB,OAAO,CAAC,SAAS,CAAC,IAAI,EAAE,GAAG,EAAE,KAAK,EAAE,MAAM,EAAE,KAAK,CAAC,CAAA;QAClD,OAAO,CAAC,IAAI,EAAE,CAAA;QACd,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC,CAAA;QAEtB,YAAY;QACZ,OAAO,CAAC,SAAS,EAAE,CAAA;QAEnB,IAAI,CAAC,YAAY,EAAE,CAAC;YAClB,OAAM;QACR,CAAC;QAED,IAAI,QAAQ,GAAG,IAAI,CAAC,GAAG,CAAC,CAAC,IAAI,CAAC,SAAS,GAAG,aAAa,CAAC,GAAG,GAAG,CAAC,CAAA;QAE/D,IAAI,CAAC,KAAK,CAAC,QAAQ,CAAC,EAAE,CAAC;YACrB,QAAQ,GAAG,KAAK,GAAG,CAAC,KAAK,GAAG,QAAQ,CAAC,GAAG,GAAG,CAAA;YAC3C,QAAQ,GAAG,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC,GAAG,CAAC,QAAQ,EAAE,KAAK,CAAC,EAAE,CAAC,CAAC,CAAA;YAEjD,IAAI,iBAAiB,IAAI,UAAU,EAAE,CAAC;gBACpC,OAAO,CAAC,IAAI,CAAC,IAAI,EAAE,GAAG,EAAE,QAAQ,EAAE,MAAM,CAAC,CAAA;YAC3C,CAAC;iBAAM,CAAC;gBACN,OAAO,CAAC,IAAI,CAAC,IAAI,GAAG,QAAQ,EAAE,GAAG,EAAE,KAAK,GAAG,QAAQ,EAAE,MAAM,CAAC,CAAA;YAC9D,CAAC;YAED,OAAO,CAAC,SAAS,GAAG,QAAQ;gBAC1B,CAAC,CAAC,cAAc;oBACd,CAAC,CAAC,mBAAmB;oBACrB,CAAC,CAAC,qBAAqB;gBACzB,CAAC,CAAC,qBAAqB,CAAA;YACzB,OAAO,CAAC,IAAI,EAAE,CAAA;YAEd,OAAO,CAAC,SAAS,EAAE,CAAA;QACrB,CAAC;QAED,IAAI,CAAC,SAAS,CAAC,OAAO,EAAE,SAAS,CAAC,IAAI,EAAE,IAAI,EAAE,GAAG,EAAE,KAAK,EAAE,MAAM,CAAC,CAAA;QACjE,OAAO,CAAC,SAAS,CAAC,IAAI,EAAE,GAAG,EAAE,KAAK,EAAE,MAAM,EAAE,KAAK,CAAC,CAAA;QAElD,IAAI,CAAC,QAAQ,CAAC,WAAW,EAAE,CAAC,QAAQ,CAAC,CAAC,CAAC,iBAAiB,CAAC,CAAC,CAAC,iBAAiB,CAAC,IAAI,SAAS,CAAC,CAAA;IAC7F,CAAC;IAED,UAAU,CAAC,OAAiC;QAC1C,IAAI,CAAC,UAAU,CAAC,OAAO,CAAC,CAAA;QACxB,IAAI,CAAC,QAAQ,CAAC,OAAO,CAAC,CAAA;IACxB,CAAC;IAED,SAAS,CAAC,UAAkB;QAC1B,IAAI,CAAC,UAAU,IAAI,UAAU,CAAC,MAAM,KAAK,EAAE,EAAE,CAAC;YAC5C,OAAO,SAAS,CAAA;QAClB,CAAC;QACD,MAAM,IAAI,GAAG,QAAQ,CAAC,UAAU,CAAC,KAAK,CAAC,CAAC,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,CAAA;QACjD,MAAM,KAAK,GAAG,QAAQ,CAAC,UAAU,CAAC,KAAK,CAAC,CAAC,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,GAAG,CAAC,CAAA;QACtD,MAAM,GAAG,GAAG,QAAQ,CAAC,UAAU,CAAC,KAAK,CAAC,CAAC,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,CAAA;QAChD,MAAM,IAAI,GAAG,QAAQ,CAAC,UAAU,CAAC,KAAK,CAAC,CAAC,EAAE,EAAE,CAAC,EAAE,EAAE,CAAC,CAAA;QAClD,MAAM,MAAM,GAAG,QAAQ,CAAC,UAAU,CAAC,KAAK,CAAC,EAAE,EAAE,EAAE,CAAC,EAAE,EAAE,CAAC,CAAA;QACrD,MAAM,MAAM,GAAG,QAAQ,CAAC,UAAU,CAAC,KAAK,CAAC,EAAE,EAAE,EAAE,CAAC,EAAE,EAAE,CAAC,CAAA;QAErD,OAAO,IAAI,IAAI,CAAC,IAAI,EAAE,KAAK,EAAE,GAAG,EAAE,IAAI,EAAE,MAAM,EAAE,MAAM,CAAC,CAAA;IACzD,CAAC;IAED,IAAI,SAAS;QACX,MAAM,GAAG,GAAG,IAAI,CAAC,IAAI,IAAI,CAAC,CAAA;QAC1B,MAAM,GAAG,GAAG,IAAI,CAAC,GAAG,EAAE,CAAA;QAEtB,OAAO,IAAI,CAAC,KAAK,CAAC,CAAC,GAAG,GAAG,GAAG,CAAC,GAAG,IAAI,CAAC,CAAA;IACvC,CAAC;IAED,IAAI,KAAK;QACP,MAAM,EAAE,SAAS,EAAE,OAAO,EAAE,GAAG,IAAI,CAAC,KAAK,CAAA;QACzC,OAAO,CAAC,SAAS,EAAE,OAAO,CAAC,CAAA;IAC7B,CAAC;IAED,IAAI,KAAK,CAAC,CAAC;QACT,IAAI,CAAC,YAAY,KAAK,EAAE,CAAC;YACvB,MAAM,CAAC,SAAS,EAAE,OAAO,CAAC,GAAG,CAAC,CAAA;YAC9B,IAAI,CAAC,QAAQ,CAAC;gBACZ,SAAS;gBACT,OAAO;aACR,CAAC,CAAA;QACJ,CAAC;aAAM,IAAI,OAAO,CAAC,IAAI,QAAQ,EAAE,CAAC;YAChC,MAAM,EAAE,SAAS,EAAE,OAAO,EAAE,GAAG,CAAC,CAAA;YAChC,IAAI,CAAC,QAAQ,CAAC;gBACZ,SAAS;gBACT,OAAO;aACR,CAAC,CAAA;QACJ,CAAC;aAAM,IAAI,OAAO,CAAC,IAAI,QAAQ,EAAE,CAAC;YAChC,MAAM,CAAC,SAAS,EAAE,OAAO,CAAC,GAAI,CAAY,CAAC,KAAK,CAAC,aAAa,CAAC,CAAA;YAC/D,IAAI,CAAC,QAAQ,CAAC;gBACZ,SAAS;gBACT,OAAO;aACR,CAAC,CAAA;QACJ,CAAC;aAAM,CAAC;YACN,IAAI,CAAC,QAAQ,CAAC;gBACZ,SAAS,EAAE,SAAS;gBACpB,OAAO,EAAE,SAAS;aACnB,CAAC,CAAA;QACJ,CAAC;IACH,CAAC;CACF;AAED,SAAS,CAAC,QAAQ,CAAC,YAAY,EAAE,SAAS,CAAC,CAAA","sourcesContent":["import { Component, ComponentNature, Properties, RectPath, Shape } from '@hatiolab/things-scene'\nimport format from './libs/format'\n\nconst mask = new URL('../icons/tact-timer-mask.svg', import.meta.url).href\n\nconst NATURE: ComponentNature = {\n mutable: false,\n resizable: true,\n rotatable: true,\n properties: [\n {\n type: 'string',\n label: 'start-time',\n name: 'startTime',\n placeholder: 'YYYYMMDDhhmmss'\n },\n {\n type: 'string',\n label: 'end-time',\n name: 'endTime',\n placeholder: 'YYYYMMDDhhmmss'\n },\n {\n type: 'string',\n label: 'format',\n name: 'format',\n placeholder: 'hh:mm:ss'\n },\n {\n type: 'select',\n label: 'progress-direction',\n name: 'progressDirection',\n property: {\n options: ['', 'increase', 'decrease']\n }\n },\n {\n type: 'color',\n label: 'increase-progress-color',\n name: 'increaseProgressColor'\n },\n {\n type: 'color',\n label: 'decrease-progress-color',\n name: 'decreaseProgressColor'\n },\n {\n type: 'color',\n label: 'increase-font-color',\n name: 'increaseFontColor'\n },\n {\n type: 'color',\n label: 'decrese-font-color',\n name: 'decreaseFontColor'\n },\n {\n type: 'color',\n label: 'under-threshold-color',\n name: 'underThresholdColor'\n },\n {\n type: 'number',\n label: 'progress-threshold',\n name: 'progressThreshold',\n placeholder: '%'\n },\n {\n type: 'number',\n label: 'round',\n name: 'round'\n },\n {\n type: 'boolean',\n label: 'auto-start',\n name: 'autoStart'\n },\n {\n type: 'boolean',\n label: 'show-progress',\n name: 'showProgress'\n },\n {\n type: 'boolean',\n label: 'show-timer',\n name: 'showTimer'\n }\n ],\n help: 'scene/component/manufacturing/tact-timer'\n}\n\nexport default class TactTimer extends RectPath(Shape) {\n static MASK: HTMLImageElement\n\n static get mask() {\n if (!TactTimer.MASK) {\n TactTimer.MASK = new Image()\n TactTimer.MASK.src = mask\n }\n\n return TactTimer.MASK\n }\n\n private _start: number = 0\n private _due: number = 0\n\n get nature() {\n return NATURE\n }\n\n ready() {\n if (!this.app.isViewMode) {\n return\n }\n\n const { autoStart } = this.state\n\n if (autoStart) {\n this.start()\n }\n }\n\n start() {\n const { startTime, endTime } = this.state\n const start = this.parseTime(startTime)\n const end = this.parseTime(endTime)\n\n if (start && end) {\n this._due = end.getTime()\n this._start = start.getTime()\n this.counting()\n }\n }\n\n onchange(after: Properties) {\n if ('startTime' in after || 'endTime' in after) {\n this.start()\n }\n }\n\n counting() {\n if (this.disposed) {\n return\n }\n\n requestAnimationFrame(() => {\n const { showTimer } = this.state\n const countdown = this.countdown\n\n if (showTimer) {\n const text = format(Math.abs(countdown), this.getState('format'))\n this.text = text\n } else {\n this.text = ''\n }\n\n this.setState('data', this.countdown)\n\n setTimeout(() => {\n this.counting()\n }, 1000)\n })\n }\n\n render(context: CanvasRenderingContext2D) {\n var {\n top,\n left,\n height,\n width,\n round = 0,\n fontColor,\n increaseFontColor,\n decreaseFontColor,\n increaseProgressColor = 'transparent',\n decreaseProgressColor = 'transparent',\n underThresholdColor = 'transparent',\n progressDirection = 'increase',\n progressThreshold = 0,\n showProgress,\n showTimer\n } = this.state\n\n const increase = this.countdown > 0\n const totalDuration = (this._due - this._start) / 1000\n const underThreshold = this.countdown / totalDuration < progressThreshold / 100\n\n // progress의 색상\n context.beginPath()\n context.roundRect(left, top, width, height, round)\n context.clip()\n this.drawFill(context)\n\n // value의 색상\n context.beginPath()\n\n if (!showProgress) {\n return\n }\n\n var progress = Math.abs((this.countdown / totalDuration) * 100)\n\n if (!isNaN(progress)) {\n progress = width - (width * progress) / 100\n progress = Math.max(Math.min(progress, width), 0)\n\n if (progressDirection == 'increase') {\n context.rect(left, top, progress, height)\n } else {\n context.rect(left + progress, top, width - progress, height)\n }\n\n context.fillStyle = increase\n ? underThreshold\n ? underThresholdColor\n : increaseProgressColor\n : decreaseProgressColor\n context.fill()\n\n context.beginPath()\n }\n\n this.drawImage(context, TactTimer.mask, left, top, width, height)\n context.roundRect(left, top, width, height, round)\n\n this.setState('fontColor', (increase ? increaseFontColor : decreaseFontColor) || fontColor)\n }\n\n postrender(context: CanvasRenderingContext2D) {\n this.drawStroke(context)\n this.drawText(context)\n }\n\n parseTime(timeString: string): Date | undefined {\n if (!timeString || timeString.length !== 14) {\n return undefined\n }\n const year = parseInt(timeString.slice(0, 4), 10)\n const month = parseInt(timeString.slice(4, 6), 10) - 1\n const day = parseInt(timeString.slice(6, 8), 10)\n const hour = parseInt(timeString.slice(8, 10), 10)\n const minute = parseInt(timeString.slice(10, 12), 10)\n const second = parseInt(timeString.slice(12, 14), 10)\n\n return new Date(year, month, day, hour, minute, second)\n }\n\n get countdown(): number {\n const due = this._due || 0\n const now = Date.now()\n\n return Math.round((due - now) / 1000)\n }\n\n get value() {\n const { startTime, endTime } = this.state\n return [startTime, endTime]\n }\n\n set value(v) {\n if (v instanceof Array) {\n const [startTime, endTime] = v\n this.setState({\n startTime,\n endTime\n })\n } else if (typeof v == 'object') {\n const { startTime, endTime } = v\n this.setState({\n startTime,\n endTime\n })\n } else if (typeof v == 'string') {\n const [startTime, endTime] = (v as string).split(/[-+/%$#_,]+/)\n this.setState({\n startTime,\n endTime\n })\n } else {\n this.setState({\n startTime: undefined,\n endTime: undefined\n })\n }\n }\n}\n\nComponent.register('tact-timer', TactTimer)\n"]}
1
+ {"version":3,"file":"tact-timer.js","sourceRoot":"","sources":["../src/tact-timer.ts"],"names":[],"mappings":"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","sourcesContent":["import { Component, ComponentNature, Properties, RectPath, Shape } from '@hatiolab/things-scene'\nimport format from './libs/format'\nimport { MASK } from './tact-timer-mask'\n\nconst NATURE: ComponentNature = {\n mutable: false,\n resizable: true,\n rotatable: true,\n properties: [\n {\n type: 'string',\n label: 'start-time',\n name: 'startTime',\n placeholder: 'YYYYMMDDhhmmss'\n },\n {\n type: 'string',\n label: 'end-time',\n name: 'endTime',\n placeholder: 'YYYYMMDDhhmmss'\n },\n {\n type: 'string',\n label: 'format',\n name: 'format',\n placeholder: 'hh:mm:ss'\n },\n {\n type: 'select',\n label: 'progress-direction',\n name: 'progressDirection',\n property: {\n options: ['', 'increase', 'decrease']\n }\n },\n {\n type: 'color',\n label: 'tact-timer-mask-color',\n name: 'maskColor'\n },\n {\n type: 'color',\n label: 'increase-progress-color',\n name: 'increaseProgressColor'\n },\n {\n type: 'color',\n label: 'decrease-progress-color',\n name: 'decreaseProgressColor'\n },\n {\n type: 'color',\n label: 'increase-font-color',\n name: 'increaseFontColor'\n },\n {\n type: 'color',\n label: 'decrese-font-color',\n name: 'decreaseFontColor'\n },\n {\n type: 'color',\n label: 'under-threshold-color',\n name: 'underThresholdColor'\n },\n {\n type: 'number',\n label: 'progress-threshold',\n name: 'progressThreshold',\n placeholder: '%'\n },\n {\n type: 'number',\n label: 'round',\n name: 'round'\n },\n {\n type: 'boolean',\n label: 'auto-start',\n name: 'autoStart'\n },\n {\n type: 'boolean',\n label: 'show-progress',\n name: 'showProgress'\n },\n {\n type: 'boolean',\n label: 'show-timer',\n name: 'showTimer'\n }\n ],\n help: 'scene/component/manufacturing/tact-timer'\n}\n\nexport default class TactTimer extends RectPath(Shape) {\n private _start: number = 0\n private _due: number = 0\n private imageElement?: HTMLImageElement\n\n get nature() {\n return NATURE\n }\n\n ready() {\n if (!this.app.isViewMode) {\n return\n }\n\n const { autoStart } = this.state\n\n if (autoStart) {\n this.start()\n }\n }\n\n start() {\n const { startTime, endTime } = this.state\n const start = this.parseTime(startTime)\n const end = this.parseTime(endTime)\n\n if (start && end) {\n this._due = end.getTime()\n this._start = start.getTime()\n this.counting()\n }\n }\n\n onchange(after: Properties) {\n if ('startTime' in after || 'endTime' in after) {\n this.start()\n }\n if ('maskColor' in after) {\n delete this.imageElement\n }\n }\n\n getImageElement(): HTMLImageElement | undefined {\n if (!this.imageElement) {\n const { maskColor = 'black' } = this.state\n\n this.imageElement = new Image()\n this.imageElement.src =\n 'data:image/svg+xml;charset=UTF-8;base64,' + btoa(MASK.replace(/{{fillColor}}/g, maskColor))\n }\n\n return this.imageElement\n }\n\n counting() {\n if (this.disposed) {\n return\n }\n\n requestAnimationFrame(() => {\n const { showTimer } = this.state\n const countdown = this.countdown\n\n if (showTimer) {\n const text = format(Math.abs(countdown), this.getState('format'))\n this.text = text\n } else {\n this.text = ''\n }\n\n this.setState('data', this.countdown)\n\n setTimeout(() => {\n this.counting()\n }, 1000)\n })\n }\n\n render(context: CanvasRenderingContext2D) {\n var {\n top,\n left,\n height,\n width,\n round = 0,\n fontColor,\n maskColor,\n increaseFontColor,\n decreaseFontColor,\n increaseProgressColor = 'transparent',\n decreaseProgressColor = 'transparent',\n underThresholdColor = 'transparent',\n progressDirection = 'increase',\n progressThreshold = 0,\n showProgress\n } = this.state\n\n const increase = this.countdown > 0\n const totalDuration = (this._due - this._start) / 1000\n const underThreshold = this.countdown / totalDuration < progressThreshold / 100\n\n // progress의 색상\n context.beginPath()\n context.roundRect(left, top, width, height, round)\n context.clip()\n this.drawFill(context)\n\n // value의 색상\n context.beginPath()\n\n if (!showProgress) {\n return\n }\n\n var progress = Math.abs((this.countdown / totalDuration) * 100)\n\n if (!isNaN(progress)) {\n progress = width - (width * progress) / 100\n progress = Math.max(Math.min(progress, width), 0)\n\n if (progressDirection == 'increase') {\n context.rect(left, top, progress, height)\n } else {\n context.rect(left + progress, top, width - progress, height)\n }\n\n context.fillStyle = increase\n ? underThreshold\n ? underThresholdColor\n : increaseProgressColor\n : decreaseProgressColor\n context.fill()\n\n context.beginPath()\n }\n\n const image = this.getImageElement()\n this.drawImage(context, image!, left, top, width, height)\n\n context.roundRect(left, top, width, height, round)\n\n this.setState('fontColor', (increase ? increaseFontColor : decreaseFontColor) || fontColor)\n }\n\n postrender(context: CanvasRenderingContext2D) {\n this.drawStroke(context)\n this.drawText(context)\n }\n\n parseTime(timeString: string): Date | undefined {\n if (!timeString || timeString.length !== 14) {\n return undefined\n }\n const year = parseInt(timeString.slice(0, 4), 10)\n const month = parseInt(timeString.slice(4, 6), 10) - 1\n const day = parseInt(timeString.slice(6, 8), 10)\n const hour = parseInt(timeString.slice(8, 10), 10)\n const minute = parseInt(timeString.slice(10, 12), 10)\n const second = parseInt(timeString.slice(12, 14), 10)\n\n return new Date(year, month, day, hour, minute, second)\n }\n\n get countdown(): number {\n const due = this._due || 0\n const now = Date.now()\n\n return Math.round((due - now) / 1000)\n }\n\n get value() {\n const { startTime, endTime } = this.state\n return [startTime, endTime]\n }\n\n set value(v) {\n if (v instanceof Array) {\n const [startTime, endTime] = v\n this.setState({\n startTime,\n endTime\n })\n } else if (typeof v == 'object') {\n const { startTime, endTime } = v\n this.setState({\n startTime,\n endTime\n })\n } else if (typeof v == 'string') {\n const [startTime, endTime] = (v as string).split(/[-+/%$#_,]+/)\n this.setState({\n startTime,\n endTime\n })\n } else {\n this.setState({\n startTime: undefined,\n endTime: undefined\n })\n }\n }\n}\n\nComponent.register('tact-timer', TactTimer)\n"]}
@@ -2,6 +2,10 @@
2
2
  <svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" viewBox="0 0 95 23">
3
3
  <defs>
4
4
  <style>
5
+ :root {
6
+ --mask-fill-color: #000;
7
+ }
8
+
5
9
  .cls-1 {
6
10
  fill: url(#linear-gradient);
7
11
  }
@@ -11,7 +15,7 @@
11
15
  }
12
16
 
13
17
  .cls-2 {
14
- fill: #000;
18
+ fill: var(--mask-fill-color);
15
19
  }
16
20
  </style>
17
21
  <linearGradient id="linear-gradient" x1="47.4" y1="85.6" x2="47.4" y2="95" gradientTransform="translate(0 -74)" gradientUnits="userSpaceOnUse">
@@ -6,29 +6,14 @@
6
6
  "auditLog": "logs/.08636eb59927f12972f6774f5947c8507b3564c2-audit.json",
7
7
  "files": [
8
8
  {
9
- "date": 1720137176328,
10
- "name": "logs/application-2024-07-05-08.log",
11
- "hash": "13691a17d94791b492d86113866bc1079c7bb9b78c9a00a3d28796b3158531e7"
9
+ "date": 1720670342063,
10
+ "name": "logs/application-2024-07-11-12.log",
11
+ "hash": "85677c40f2076ef65f5e6291a77db74beabb6e73aacc0ecf70907412bcc75a2b"
12
12
  },
13
13
  {
14
- "date": 1720150883284,
15
- "name": "logs/application-2024-07-05-12.log",
16
- "hash": "71bf59be2d6af3eab63175bf2cfd6c38b7f7f058ef817b8836a6fdadbc703b88"
17
- },
18
- {
19
- "date": 1720197806708,
20
- "name": "logs/application-2024-07-06-01.log",
21
- "hash": "0a47cab89c205e35ebfd442248476193b54674b7588588df7c5b2931690a788e"
22
- },
23
- {
24
- "date": 1720204703341,
25
- "name": "logs/application-2024-07-06-03.log",
26
- "hash": "bdce70964ce115b741d8d26b42cd4b0525f08b3fa19fe1ab431a456c5af47248"
27
- },
28
- {
29
- "date": 1720231834693,
30
- "name": "logs/application-2024-07-06-11.log",
31
- "hash": "e42102420e9d00138f3e8868e15a6ac005106287ea57d0d9cf1804a5855eb128"
14
+ "date": 1720672295153,
15
+ "name": "logs/application-2024-07-11-13.log",
16
+ "hash": "0cae176bd15f168546d80c132308f082e2c5775e3c36374db76976c46b882207"
32
17
  }
33
18
  ],
34
19
  "hashType": "sha256"
@@ -34,6 +34,21 @@
34
34
  "date": 1720231836497,
35
35
  "name": "logs/connections-2024-07-06-11.log",
36
36
  "hash": "90547f443988ace04bdcd961cefa8e473792444776e628273dd29e6cd70092c7"
37
+ },
38
+ {
39
+ "date": 1720235760768,
40
+ "name": "logs/connections-2024-07-06-12.log",
41
+ "hash": "683660cbeda45a721e399b95a8e16ab6c88ca8ef13b53eed9cc526294cae0de7"
42
+ },
43
+ {
44
+ "date": 1720670343838,
45
+ "name": "logs/connections-2024-07-11-12.log",
46
+ "hash": "1b8f201fc8ec18f5851a826c15476b6d516b5a0ccb1c9b5e92488e14d90ed899"
47
+ },
48
+ {
49
+ "date": 1720672296862,
50
+ "name": "logs/connections-2024-07-11-13.log",
51
+ "hash": "7a32a7cd575038336c75291e5a9ea2dae54a24550ff0442aed19ab30855145ea"
37
52
  }
38
53
  ],
39
54
  "hashType": "sha256"
@@ -1,7 +1,7 @@
1
- 2024-07-06T11:10:36+09:00 info: File Storage is Ready.
2
- 2024-07-06T11:10:36+09:00 error: oracledb module loading failed
3
- 2024-07-06T11:10:37+09:00 error: oracledb module loading failed
4
- 2024-07-06T11:10:37+09:00 error: Cannot find module '@thiagoelg/node-printer'
1
+ 2024-07-11T12:59:03+09:00 info: File Storage is Ready.
2
+ 2024-07-11T12:59:04+09:00 error: oracledb module loading failed
3
+ 2024-07-11T12:59:04+09:00 error: oracledb module loading failed
4
+ 2024-07-11T12:59:04+09:00 error: Cannot find module '@thiagoelg/node-printer'
5
5
  Require stack:
6
6
  - /Users/super/Documents/GitHub/operato-scene/node_modules/@things-factory/board-service/dist-server/controllers/print.js
7
7
  - /Users/super/Documents/GitHub/operato-scene/node_modules/@things-factory/board-service/dist-server/controllers/index.js
@@ -10,7 +10,7 @@ Require stack:
10
10
  - /Users/super/Documents/GitHub/operato-scene/node_modules/@things-factory/env/index.js
11
11
  - /Users/super/Documents/GitHub/operato-scene/node_modules/@things-factory/shell/dist-server/server-dev.js
12
12
  - /Users/super/Documents/GitHub/operato-scene/node_modules/@things-factory/shell/bin/things-factory-dev
13
- 2024-07-06T11:10:37+09:00 error: Cannot find module '@thiagoelg/node-printer'
13
+ 2024-07-11T12:59:04+09:00 error: Cannot find module '@thiagoelg/node-printer'
14
14
  Require stack:
15
15
  - /Users/super/Documents/GitHub/operato-scene/node_modules/@things-factory/print-service/dist-server/middlewares/index.js
16
16
  - /Users/super/Documents/GitHub/operato-scene/node_modules/@things-factory/print-service/dist-server/index.js
@@ -18,6 +18,6 @@ Require stack:
18
18
  - /Users/super/Documents/GitHub/operato-scene/node_modules/@things-factory/env/index.js
19
19
  - /Users/super/Documents/GitHub/operato-scene/node_modules/@things-factory/shell/dist-server/server-dev.js
20
20
  - /Users/super/Documents/GitHub/operato-scene/node_modules/@things-factory/shell/bin/things-factory-dev
21
- 2024-07-06T11:10:38+09:00 info: Default DataSource established
22
- 2024-07-06T11:10:39+09:00 info: 🚀 Server ready at http://0.0.0.0:3000/graphql
23
- 2024-07-06T11:10:39+09:00 info: 🚀 Subscriptions ready at ws://0.0.0.0:3000/graphql
21
+ 2024-07-11T12:59:05+09:00 info: Default DataSource established
22
+ 2024-07-11T12:59:06+09:00 info: 🚀 Server ready at http://0.0.0.0:3000/graphql
23
+ 2024-07-11T12:59:06+09:00 info: 🚀 Subscriptions ready at ws://0.0.0.0:3000/graphql
@@ -0,0 +1,23 @@
1
+ 2024-07-11T13:31:36+09:00 info: File Storage is Ready.
2
+ 2024-07-11T13:31:37+09:00 error: oracledb module loading failed
3
+ 2024-07-11T13:31:37+09:00 error: oracledb module loading failed
4
+ 2024-07-11T13:31:37+09:00 error: Cannot find module '@thiagoelg/node-printer'
5
+ Require stack:
6
+ - /Users/super/Documents/GitHub/operato-scene/node_modules/@things-factory/board-service/dist-server/controllers/print.js
7
+ - /Users/super/Documents/GitHub/operato-scene/node_modules/@things-factory/board-service/dist-server/controllers/index.js
8
+ - /Users/super/Documents/GitHub/operato-scene/node_modules/@things-factory/board-service/dist-server/index.js
9
+ - /Users/super/Documents/GitHub/operato-scene/node_modules/@things-factory/env/lib/module-loader.js
10
+ - /Users/super/Documents/GitHub/operato-scene/node_modules/@things-factory/env/index.js
11
+ - /Users/super/Documents/GitHub/operato-scene/node_modules/@things-factory/shell/dist-server/server-dev.js
12
+ - /Users/super/Documents/GitHub/operato-scene/node_modules/@things-factory/shell/bin/things-factory-dev
13
+ 2024-07-11T13:31:37+09:00 error: Cannot find module '@thiagoelg/node-printer'
14
+ Require stack:
15
+ - /Users/super/Documents/GitHub/operato-scene/node_modules/@things-factory/print-service/dist-server/middlewares/index.js
16
+ - /Users/super/Documents/GitHub/operato-scene/node_modules/@things-factory/print-service/dist-server/index.js
17
+ - /Users/super/Documents/GitHub/operato-scene/node_modules/@things-factory/env/lib/module-loader.js
18
+ - /Users/super/Documents/GitHub/operato-scene/node_modules/@things-factory/env/index.js
19
+ - /Users/super/Documents/GitHub/operato-scene/node_modules/@things-factory/shell/dist-server/server-dev.js
20
+ - /Users/super/Documents/GitHub/operato-scene/node_modules/@things-factory/shell/bin/things-factory-dev
21
+ 2024-07-11T13:31:38+09:00 info: Default DataSource established
22
+ 2024-07-11T13:31:39+09:00 info: 🚀 Server ready at http://0.0.0.0:3000/graphql
23
+ 2024-07-11T13:31:39+09:00 info: 🚀 Subscriptions ready at ws://0.0.0.0:3000/graphql
@@ -0,0 +1,50 @@
1
+ 2024-07-06T12:16:03+09:00 info: Initializing ConnectionManager...
2
+ 2024-07-06T12:16:03+09:00 info: Connector 'echo-back-server' started to ready
3
+ 2024-07-06T12:16:03+09:00 info: Connector 'echo-back' started to ready
4
+ 2024-07-06T12:16:03+09:00 info: Connector 'http-connector' started to ready
5
+ 2024-07-06T12:16:03+09:00 info: Connector 'graphql-connector' started to ready
6
+ 2024-07-06T12:16:03+09:00 info: Connector 'sqlite-connector' started to ready
7
+ 2024-07-06T12:16:03+09:00 info: Connector 'postgresql-connector' started to ready
8
+ 2024-07-06T12:16:03+09:00 info: Connector 'mqtt-connector' started to ready
9
+ 2024-07-06T12:16:03+09:00 info: Connector 'mssql-connector' started to ready
10
+ 2024-07-06T12:16:03+09:00 info: Connector 'oracle-connector' started to ready
11
+ 2024-07-06T12:16:03+09:00 info: Connector 'mysql-connector' started to ready
12
+ 2024-07-06T12:16:03+09:00 info: Connector 'socket-server' started to ready
13
+ 2024-07-06T12:16:03+09:00 info: Connector 'operato-connector' started to ready
14
+ 2024-07-06T12:16:03+09:00 info: Connector 'email-connector' started to ready
15
+ 2024-07-06T12:16:03+09:00 info: Connector 'influxdb-connector' started to ready
16
+ 2024-07-06T12:16:03+09:00 info: Connector 'msgraph-connector' started to ready
17
+ 2024-07-06T12:16:03+09:00 info: Connector 'proxy-connector' started to ready
18
+ 2024-07-06T12:16:03+09:00 info: echo-back-servers are ready
19
+ 2024-07-06T12:16:03+09:00 info: echo-back connections are ready
20
+ 2024-07-06T12:16:03+09:00 info: http-connector connections are ready
21
+ 2024-07-06T12:16:03+09:00 info: graphql-connector connections are ready
22
+ 2024-07-06T12:16:03+09:00 info: sqlite-connector connections are ready
23
+ 2024-07-06T12:16:03+09:00 info: postgresql-connector connections are ready
24
+ 2024-07-06T12:16:03+09:00 info: mqtt-connector connections are ready
25
+ 2024-07-06T12:16:03+09:00 info: mssql-connector connections are ready
26
+ 2024-07-06T12:16:03+09:00 info: oracle-connector connections are ready
27
+ 2024-07-06T12:16:03+09:00 info: mysql-connector connections are ready
28
+ 2024-07-06T12:16:03+09:00 info: socket servers are ready
29
+ 2024-07-06T12:16:03+09:00 info: operato-connector connections are ready
30
+ 2024-07-06T12:16:03+09:00 info: email connections are ready
31
+ 2024-07-06T12:16:03+09:00 info: influxdb connections are ready
32
+ 2024-07-06T12:16:03+09:00 info: msgraph-connector connections are ready
33
+ 2024-07-06T12:16:03+09:00 info: proxy-connector connections are ready
34
+ 2024-07-06T12:16:03+09:00 info: All connector for 'echo-back-server' ready
35
+ 2024-07-06T12:16:03+09:00 info: All connector for 'echo-back' ready
36
+ 2024-07-06T12:16:03+09:00 info: All connector for 'http-connector' ready
37
+ 2024-07-06T12:16:03+09:00 info: All connector for 'graphql-connector' ready
38
+ 2024-07-06T12:16:03+09:00 info: All connector for 'sqlite-connector' ready
39
+ 2024-07-06T12:16:03+09:00 info: All connector for 'postgresql-connector' ready
40
+ 2024-07-06T12:16:03+09:00 info: All connector for 'mqtt-connector' ready
41
+ 2024-07-06T12:16:03+09:00 info: All connector for 'mssql-connector' ready
42
+ 2024-07-06T12:16:03+09:00 info: All connector for 'oracle-connector' ready
43
+ 2024-07-06T12:16:03+09:00 info: All connector for 'mysql-connector' ready
44
+ 2024-07-06T12:16:03+09:00 info: All connector for 'socket-server' ready
45
+ 2024-07-06T12:16:03+09:00 info: All connector for 'operato-connector' ready
46
+ 2024-07-06T12:16:03+09:00 info: All connector for 'email-connector' ready
47
+ 2024-07-06T12:16:03+09:00 info: All connector for 'influxdb-connector' ready
48
+ 2024-07-06T12:16:03+09:00 info: All connector for 'msgraph-connector' ready
49
+ 2024-07-06T12:16:03+09:00 info: All connector for 'proxy-connector' ready
50
+ 2024-07-06T12:16:03+09:00 info: ConnectionManager initialization done:
@@ -0,0 +1,47 @@
1
+ 2024-07-11T12:59:06+09:00 info: Initializing ConnectionManager...
2
+ 2024-07-11T12:59:06+09:00 info: Connector 'echo-back-server' started to ready
3
+ 2024-07-11T12:59:06+09:00 info: Connector 'echo-back' started to ready
4
+ 2024-07-11T12:59:06+09:00 info: Connector 'http-connector' started to ready
5
+ 2024-07-11T12:59:06+09:00 info: Connector 'graphql-connector' started to ready
6
+ 2024-07-11T12:59:06+09:00 info: Connector 'sqlite-connector' started to ready
7
+ 2024-07-11T12:59:06+09:00 info: Connector 'postgresql-connector' started to ready
8
+ 2024-07-11T12:59:06+09:00 info: Connector 'mqtt-connector' started to ready
9
+ 2024-07-11T12:59:06+09:00 info: Connector 'mssql-connector' started to ready
10
+ 2024-07-11T12:59:06+09:00 info: Connector 'oracle-connector' started to ready
11
+ 2024-07-11T12:59:06+09:00 info: Connector 'mysql-connector' started to ready
12
+ 2024-07-11T12:59:06+09:00 info: Connector 'socket-server' started to ready
13
+ 2024-07-11T12:59:06+09:00 info: Connector 'operato-connector' started to ready
14
+ 2024-07-11T12:59:06+09:00 info: Connector 'email-connector' started to ready
15
+ 2024-07-11T12:59:06+09:00 info: Connector 'influxdb-connector' started to ready
16
+ 2024-07-11T12:59:06+09:00 info: Connector 'msgraph-connector' started to ready
17
+ 2024-07-11T12:59:06+09:00 info: echo-back-servers are ready
18
+ 2024-07-11T12:59:06+09:00 info: echo-back connections are ready
19
+ 2024-07-11T12:59:06+09:00 info: http-connector connections are ready
20
+ 2024-07-11T12:59:06+09:00 info: graphql-connector connections are ready
21
+ 2024-07-11T12:59:06+09:00 info: sqlite-connector connections are ready
22
+ 2024-07-11T12:59:06+09:00 info: postgresql-connector connections are ready
23
+ 2024-07-11T12:59:06+09:00 info: mqtt-connector connections are ready
24
+ 2024-07-11T12:59:06+09:00 info: mssql-connector connections are ready
25
+ 2024-07-11T12:59:06+09:00 info: oracle-connector connections are ready
26
+ 2024-07-11T12:59:06+09:00 info: mysql-connector connections are ready
27
+ 2024-07-11T12:59:06+09:00 info: socket servers are ready
28
+ 2024-07-11T12:59:06+09:00 info: graphql-connector connections are ready
29
+ 2024-07-11T12:59:06+09:00 info: email connections are ready
30
+ 2024-07-11T12:59:06+09:00 info: influxdb connections are ready
31
+ 2024-07-11T12:59:06+09:00 info: msgraph-connector connections are ready
32
+ 2024-07-11T12:59:06+09:00 info: All connector for 'echo-back-server' ready
33
+ 2024-07-11T12:59:06+09:00 info: All connector for 'echo-back' ready
34
+ 2024-07-11T12:59:06+09:00 info: All connector for 'http-connector' ready
35
+ 2024-07-11T12:59:06+09:00 info: All connector for 'graphql-connector' ready
36
+ 2024-07-11T12:59:06+09:00 info: All connector for 'sqlite-connector' ready
37
+ 2024-07-11T12:59:06+09:00 info: All connector for 'postgresql-connector' ready
38
+ 2024-07-11T12:59:06+09:00 info: All connector for 'mqtt-connector' ready
39
+ 2024-07-11T12:59:06+09:00 info: All connector for 'mssql-connector' ready
40
+ 2024-07-11T12:59:06+09:00 info: All connector for 'oracle-connector' ready
41
+ 2024-07-11T12:59:06+09:00 info: All connector for 'mysql-connector' ready
42
+ 2024-07-11T12:59:06+09:00 info: All connector for 'socket-server' ready
43
+ 2024-07-11T12:59:06+09:00 info: All connector for 'operato-connector' ready
44
+ 2024-07-11T12:59:06+09:00 info: All connector for 'email-connector' ready
45
+ 2024-07-11T12:59:06+09:00 info: All connector for 'influxdb-connector' ready
46
+ 2024-07-11T12:59:06+09:00 info: All connector for 'msgraph-connector' ready
47
+ 2024-07-11T12:59:06+09:00 info: ConnectionManager initialization done:
@@ -0,0 +1,47 @@
1
+ 2024-07-11T13:31:39+09:00 info: Initializing ConnectionManager...
2
+ 2024-07-11T13:31:39+09:00 info: Connector 'echo-back-server' started to ready
3
+ 2024-07-11T13:31:39+09:00 info: Connector 'echo-back' started to ready
4
+ 2024-07-11T13:31:39+09:00 info: Connector 'http-connector' started to ready
5
+ 2024-07-11T13:31:39+09:00 info: Connector 'graphql-connector' started to ready
6
+ 2024-07-11T13:31:39+09:00 info: Connector 'sqlite-connector' started to ready
7
+ 2024-07-11T13:31:39+09:00 info: Connector 'postgresql-connector' started to ready
8
+ 2024-07-11T13:31:39+09:00 info: Connector 'mqtt-connector' started to ready
9
+ 2024-07-11T13:31:39+09:00 info: Connector 'mssql-connector' started to ready
10
+ 2024-07-11T13:31:39+09:00 info: Connector 'oracle-connector' started to ready
11
+ 2024-07-11T13:31:39+09:00 info: Connector 'mysql-connector' started to ready
12
+ 2024-07-11T13:31:39+09:00 info: Connector 'socket-server' started to ready
13
+ 2024-07-11T13:31:39+09:00 info: Connector 'operato-connector' started to ready
14
+ 2024-07-11T13:31:39+09:00 info: Connector 'email-connector' started to ready
15
+ 2024-07-11T13:31:39+09:00 info: Connector 'influxdb-connector' started to ready
16
+ 2024-07-11T13:31:39+09:00 info: Connector 'msgraph-connector' started to ready
17
+ 2024-07-11T13:31:39+09:00 info: echo-back-servers are ready
18
+ 2024-07-11T13:31:39+09:00 info: echo-back connections are ready
19
+ 2024-07-11T13:31:39+09:00 info: http-connector connections are ready
20
+ 2024-07-11T13:31:39+09:00 info: graphql-connector connections are ready
21
+ 2024-07-11T13:31:39+09:00 info: sqlite-connector connections are ready
22
+ 2024-07-11T13:31:39+09:00 info: postgresql-connector connections are ready
23
+ 2024-07-11T13:31:39+09:00 info: mqtt-connector connections are ready
24
+ 2024-07-11T13:31:39+09:00 info: mssql-connector connections are ready
25
+ 2024-07-11T13:31:39+09:00 info: oracle-connector connections are ready
26
+ 2024-07-11T13:31:39+09:00 info: mysql-connector connections are ready
27
+ 2024-07-11T13:31:39+09:00 info: socket servers are ready
28
+ 2024-07-11T13:31:39+09:00 info: graphql-connector connections are ready
29
+ 2024-07-11T13:31:39+09:00 info: email connections are ready
30
+ 2024-07-11T13:31:39+09:00 info: influxdb connections are ready
31
+ 2024-07-11T13:31:39+09:00 info: msgraph-connector connections are ready
32
+ 2024-07-11T13:31:39+09:00 info: All connector for 'echo-back-server' ready
33
+ 2024-07-11T13:31:39+09:00 info: All connector for 'echo-back' ready
34
+ 2024-07-11T13:31:39+09:00 info: All connector for 'http-connector' ready
35
+ 2024-07-11T13:31:39+09:00 info: All connector for 'graphql-connector' ready
36
+ 2024-07-11T13:31:39+09:00 info: All connector for 'sqlite-connector' ready
37
+ 2024-07-11T13:31:39+09:00 info: All connector for 'postgresql-connector' ready
38
+ 2024-07-11T13:31:39+09:00 info: All connector for 'mqtt-connector' ready
39
+ 2024-07-11T13:31:39+09:00 info: All connector for 'mssql-connector' ready
40
+ 2024-07-11T13:31:39+09:00 info: All connector for 'oracle-connector' ready
41
+ 2024-07-11T13:31:39+09:00 info: All connector for 'mysql-connector' ready
42
+ 2024-07-11T13:31:39+09:00 info: All connector for 'socket-server' ready
43
+ 2024-07-11T13:31:39+09:00 info: All connector for 'operato-connector' ready
44
+ 2024-07-11T13:31:39+09:00 info: All connector for 'email-connector' ready
45
+ 2024-07-11T13:31:39+09:00 info: All connector for 'influxdb-connector' ready
46
+ 2024-07-11T13:31:39+09:00 info: All connector for 'msgraph-connector' ready
47
+ 2024-07-11T13:31:39+09:00 info: ConnectionManager initialization done:
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@operato/scene-manufacturing",
3
3
  "description": "Things scene components for manufacturing industry",
4
- "version": "1.3.19",
4
+ "version": "1.3.20",
5
5
  "license": "MIT",
6
6
  "things-scene": true,
7
7
  "author": "heartyoh",
@@ -57,5 +57,5 @@
57
57
  "prettier --write"
58
58
  ]
59
59
  },
60
- "gitHead": "52166269cdb9bd5e72e395ea139f4036506f97b9"
60
+ "gitHead": "0aff0a16158ae1d77d41e564a6a5a9d5ab92f39d"
61
61
  }
@@ -0,0 +1,34 @@
1
+ export const MASK: string = `
2
+ <svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" viewBox="0 0 95 23">
3
+ <defs>
4
+ <style>
5
+ .cls-1 {
6
+ fill: url(#linear-gradient);
7
+ }
8
+
9
+ .cls-1, .cls-2 {
10
+ stroke-width: 0px;
11
+ }
12
+
13
+ .cls-2 {
14
+ fill: {{fillColor}};
15
+ }
16
+ </style>
17
+ <linearGradient id="linear-gradient" x1="47.4" y1="85.6" x2="47.4" y2="95" gradientTransform="translate(0 -74)" gradientUnits="userSpaceOnUse">
18
+ <stop offset="0" stop-color="#000" stop-opacity="0"/>
19
+ <stop offset=".9" stop-color="#000" stop-opacity=".2"/>
20
+ </linearGradient>
21
+ </defs>
22
+ <rect class="cls-1" x="1.4" y="11.6" width="92.1" height="9.5" rx="2.6" ry="2.6"/>
23
+ <path class="cls-2" d="M95,0H0v23h95V0ZM92.5,17.9c0,1.4-1.2,2.6-2.6,2.6H5.1c-1.4,0-2.6-1.2-2.6-2.6V5.1c0-1.4,1.2-2.6,2.6-2.6h84.8c1.4,0,2.6,1.2,2.6,2.6v12.8Z"/>
24
+ <path class="cls-2" d="M47.9,3.1c0-.6.7-.6.7-.6v-.7h-2.5v.7s.7,0,.7.6v16.7s0,.7-.7.8v.6h2.5v-.6c-.7-.1-.7-.8-.7-.8V3.1Z"/>
25
+ <path class="cls-2" d="M38.6,3.1c0-.6.7-.6.7-.6v-.7h-2.5v.7s.7,0,.7.6v16.7s0,.7-.7.8v.6h2.5v-.6c-.7-.1-.7-.8-.7-.8V3.1Z"/>
26
+ <path class="cls-2" d="M29.3,3.1c0-.6.7-.6.7-.6v-.7h-2.5v.7s.7,0,.7.6v16.7s0,.7-.7.8v.6h2.5v-.6c-.7-.1-.7-.8-.7-.8V3.1Z"/>
27
+ <path class="cls-2" d="M19.9,3.1c0-.6.7-.6.7-.6v-.7h-2.5v.7s.7,0,.7.6v16.7s0,.7-.7.8v.6h2.5v-.6c-.7-.1-.7-.8-.7-.8V3.1Z"/>
28
+ <path class="cls-2" d="M11,3.1c0-.6.7-.6.7-.6v-.7h-2.5v.7s.7,0,.7.6v16.7s0,.7-.7.8v.6h2.5v-.6c-.7-.1-.7-.8-.7-.8V3.1Z"/>
29
+ <path class="cls-2" d="M84.9,3.1c0-.6.7-.6.7-.6v-.7h-2.5v.7s.7,0,.7.6v16.7s0,.7-.7.8v.6h2.5v-.6c-.7-.1-.7-.8-.7-.8V3.1Z"/>
30
+ <path class="cls-2" d="M75.6,3.1c0-.6.7-.6.7-.6v-.7h-2.5v.7s.7,0,.7.6v16.7s0,.7-.7.8v.6h2.5v-.6c-.7-.1-.7-.8-.7-.8V3.1Z"/>
31
+ <path class="cls-2" d="M66.4,3.1c0-.6.7-.6.7-.6v-.7h-2.5v.7s.7,0,.7.6v16.7s0,.7-.7.8v.6h2.5v-.6c-.7-.1-.7-.8-.7-.8V3.1Z"/>
32
+ <path class="cls-2" d="M57.2,3.1c0-.6.7-.6.7-.6v-.7h-2.5v.7s.7,0,.7.6v16.7s0,.7-.7.8v.6h2.5v-.6c-.7-.1-.7-.8-.7-.8V3.1Z"/>
33
+ </svg>
34
+ `
package/src/tact-timer.ts CHANGED
@@ -1,7 +1,6 @@
1
1
  import { Component, ComponentNature, Properties, RectPath, Shape } from '@hatiolab/things-scene'
2
2
  import format from './libs/format'
3
-
4
- const mask = new URL('../icons/tact-timer-mask.svg', import.meta.url).href
3
+ import { MASK } from './tact-timer-mask'
5
4
 
6
5
  const NATURE: ComponentNature = {
7
6
  mutable: false,
@@ -34,6 +33,11 @@ const NATURE: ComponentNature = {
34
33
  options: ['', 'increase', 'decrease']
35
34
  }
36
35
  },
36
+ {
37
+ type: 'color',
38
+ label: 'tact-timer-mask-color',
39
+ name: 'maskColor'
40
+ },
37
41
  {
38
42
  type: 'color',
39
43
  label: 'increase-progress-color',
@@ -90,19 +94,9 @@ const NATURE: ComponentNature = {
90
94
  }
91
95
 
92
96
  export default class TactTimer extends RectPath(Shape) {
93
- static MASK: HTMLImageElement
94
-
95
- static get mask() {
96
- if (!TactTimer.MASK) {
97
- TactTimer.MASK = new Image()
98
- TactTimer.MASK.src = mask
99
- }
100
-
101
- return TactTimer.MASK
102
- }
103
-
104
97
  private _start: number = 0
105
98
  private _due: number = 0
99
+ private imageElement?: HTMLImageElement
106
100
 
107
101
  get nature() {
108
102
  return NATURE
@@ -136,6 +130,21 @@ export default class TactTimer extends RectPath(Shape) {
136
130
  if ('startTime' in after || 'endTime' in after) {
137
131
  this.start()
138
132
  }
133
+ if ('maskColor' in after) {
134
+ delete this.imageElement
135
+ }
136
+ }
137
+
138
+ getImageElement(): HTMLImageElement | undefined {
139
+ if (!this.imageElement) {
140
+ const { maskColor = 'black' } = this.state
141
+
142
+ this.imageElement = new Image()
143
+ this.imageElement.src =
144
+ 'data:image/svg+xml;charset=UTF-8;base64,' + btoa(MASK.replace(/{{fillColor}}/g, maskColor))
145
+ }
146
+
147
+ return this.imageElement
139
148
  }
140
149
 
141
150
  counting() {
@@ -170,6 +179,7 @@ export default class TactTimer extends RectPath(Shape) {
170
179
  width,
171
180
  round = 0,
172
181
  fontColor,
182
+ maskColor,
173
183
  increaseFontColor,
174
184
  decreaseFontColor,
175
185
  increaseProgressColor = 'transparent',
@@ -177,8 +187,7 @@ export default class TactTimer extends RectPath(Shape) {
177
187
  underThresholdColor = 'transparent',
178
188
  progressDirection = 'increase',
179
189
  progressThreshold = 0,
180
- showProgress,
181
- showTimer
190
+ showProgress
182
191
  } = this.state
183
192
 
184
193
  const increase = this.countdown > 0
@@ -220,7 +229,9 @@ export default class TactTimer extends RectPath(Shape) {
220
229
  context.beginPath()
221
230
  }
222
231
 
223
- this.drawImage(context, TactTimer.mask, left, top, width, height)
232
+ const image = this.getImageElement()
233
+ this.drawImage(context, image!, left, top, width, height)
234
+
224
235
  context.roundRect(left, top, width, height, round)
225
236
 
226
237
  this.setState('fontColor', (increase ? increaseFontColor : decreaseFontColor) || fontColor)
@@ -11,5 +11,6 @@
11
11
  "label.show-progress": "show progress",
12
12
  "label.show-timer": "show timer",
13
13
  "label.start-time": "start time",
14
- "label.end-time": "end time"
14
+ "label.end-time": "end time",
15
+ "label.tact-timer-mask-color": "mask color"
15
16
  }
@@ -11,5 +11,6 @@
11
11
  "label.show-progress": "進捗を表示",
12
12
  "label.show-timer": "タイマーを表示",
13
13
  "label.start-time": "開始時間",
14
- "label.end-time": "終了時間"
14
+ "label.end-time": "終了時間",
15
+ "label.tact-timer-mask-color": "マスクの色"
15
16
  }
@@ -11,5 +11,6 @@
11
11
  "label.show-progress": "진행색상 보이기",
12
12
  "label.show-timer": "타이머 보이기",
13
13
  "label.start-time": "시작 시간",
14
- "label.end-time": "완료 시간"
14
+ "label.end-time": "완료 시간",
15
+ "label.tact-timer-mask-color": "마스크 색상"
15
16
  }
@@ -11,5 +11,6 @@
11
11
  "label.show-progress": "tunjuk kemajuan",
12
12
  "label.show-timer": "tunjuk pemasa",
13
13
  "label.start-time": "masa mula",
14
- "label.end-time": "masa tamat"
14
+ "label.end-time": "masa tamat",
15
+ "label.tact-timer-mask-color": "warna topeng"
15
16
  }
@@ -11,5 +11,6 @@
11
11
  "label.show-progress": "显示进度",
12
12
  "label.show-timer": "显示计时器",
13
13
  "label.start-time": "开始时间",
14
- "label.end-time": "完成时间"
14
+ "label.end-time": "完成时间",
15
+ "label.tact-timer-mask-color": "遮罩颜色"
15
16
  }