@operato/scene-manufacturing 8.0.0-alpha.1 → 8.0.0-alpha.10

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.
package/CHANGELOG.md CHANGED
@@ -3,6 +3,33 @@
3
3
  All notable changes to this project will be documented in this file.
4
4
  See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
5
5
 
6
+ ## [8.0.0-alpha.10](https://github.com/things-scene/operato-scene/compare/v8.0.0-alpha.9...v8.0.0-alpha.10) (2024-12-20)
7
+
8
+
9
+ ### :bug: Bug Fix
10
+
11
+ * typo tact-timer ([71cc1db](https://github.com/things-scene/operato-scene/commit/71cc1db7ac6278d478f831c6100acf90c8e4743c))
12
+
13
+
14
+
15
+ ## [8.0.0-alpha.9](https://github.com/things-scene/operato-scene/compare/v8.0.0-alpha.8...v8.0.0-alpha.9) (2024-10-14)
16
+
17
+
18
+ ### :bug: Bug Fix
19
+
20
+ * set started automatically when autostart is set on starting time ([20d6da5](https://github.com/things-scene/operato-scene/commit/20d6da5504f7ebe9f6441194b2ea48bcfb212ce4))
21
+
22
+
23
+
24
+ ## [8.0.0-alpha.8](https://github.com/things-scene/operato-scene/compare/v8.0.0-alpha.7...v8.0.0-alpha.8) (2024-10-12)
25
+
26
+
27
+ ### :bug: Bug Fix
28
+
29
+ * support started property for tact-timer ([c77bade](https://github.com/things-scene/operato-scene/commit/c77bade352a526405163e5fce331a021f8a9a4c4))
30
+
31
+
32
+
6
33
  ## [8.0.0-alpha.1](https://github.com/things-scene/operato-scene/compare/v8.0.0-alpha.0...v8.0.0-alpha.1) (2024-09-09)
7
34
 
8
35
 
@@ -7,6 +7,7 @@ export default class TactTimer extends TactTimer_base {
7
7
  get nature(): ComponentNature;
8
8
  ready(): void;
9
9
  start(): void;
10
+ stop(): void;
10
11
  onchange(after: Properties): void;
11
12
  getImageElement(): HTMLImageElement | undefined;
12
13
  counting(): void;
@@ -16,5 +17,7 @@ export default class TactTimer extends TactTimer_base {
16
17
  get countdown(): number;
17
18
  get value(): any[];
18
19
  set value(v: any[]);
20
+ get started(): any;
21
+ set started(started: any);
19
22
  }
20
23
  export {};
@@ -104,8 +104,9 @@ export default class TactTimer extends RectPath(Shape) {
104
104
  if (!this.app.isViewMode) {
105
105
  return;
106
106
  }
107
- const { autoStart } = this.state;
108
- if (autoStart) {
107
+ const { autoStart, started } = this.state;
108
+ if (autoStart || started) {
109
+ this.setState('started', true);
109
110
  this.start();
110
111
  }
111
112
  }
@@ -119,6 +120,9 @@ export default class TactTimer extends RectPath(Shape) {
119
120
  this.counting();
120
121
  }
121
122
  }
123
+ stop() {
124
+ this.started = false;
125
+ }
122
126
  onchange(after) {
123
127
  if ('startTime' in after || 'endTime' in after || 'hidden' in after) {
124
128
  this.start();
@@ -137,8 +141,8 @@ export default class TactTimer extends RectPath(Shape) {
137
141
  return this.imageElement;
138
142
  }
139
143
  counting() {
140
- const { hidden } = this.state;
141
- if (this.disposed || hidden) {
144
+ const { hidden, started } = this.state;
145
+ if (this.disposed || hidden || !started) {
142
146
  return;
143
147
  }
144
148
  requestAnimationFrame(() => {
@@ -250,6 +254,17 @@ export default class TactTimer extends RectPath(Shape) {
250
254
  });
251
255
  }
252
256
  }
257
+ get started() {
258
+ return this.getState('started');
259
+ }
260
+ set started(started) {
261
+ if (this.started !== started) {
262
+ this.setState('started', started);
263
+ if (started) {
264
+ this.start();
265
+ }
266
+ }
267
+ }
253
268
  }
254
269
  Component.register('tact-timer', TactTimer);
255
270
  //# sourceMappingURL=tact-timer.js.map
@@ -1 +1 @@
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: 'before-due-progress-color',\n name: 'beforeDueProgressColor'\n },\n {\n type: 'color',\n label: 'over-due-progress-color',\n name: 'overDueProgressColor'\n },\n {\n type: 'color',\n label: 'before-due-font-color',\n name: 'beforeDueFontColor'\n },\n {\n type: 'color',\n label: 'over-due-font-color',\n name: 'overDueFontColor'\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, hidden } = this.state\n const start = this.parseTime(startTime)\n const end = this.parseTime(endTime)\n\n if (start && end && !hidden) {\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 || 'hidden' in after) {\n this.start()\n }\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 const { hidden } = this.state\n if (this.disposed || hidden) {\n return\n }\n\n requestAnimationFrame(() => {\n const { showTimer, beforeDueFontColor, overDueFontColor, fontColor } = this.state\n const countdown = this.countdown\n\n this.setState('fontColor', (this.countdown > 0 ? beforeDueFontColor : overDueFontColor) || fontColor)\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 beforeDueFontColor,\n overDueFontColor,\n beforeDueProgressColor = 'transparent',\n overDueProgressColor = '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 : beforeDueProgressColor\n : overDueProgressColor\n context.fill()\n\n context.beginPath()\n }\n\n const image = this.getImageElement()\n this.drawImage(context, image!, left - 2, top - 2, width + 4, height + 4)\n\n context.roundRect(left, top, width, height, round)\n\n this.setState('fontColor', (increase ? beforeDueFontColor : overDueFontColor) || 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: 'before-due-progress-color',\n name: 'beforeDueProgressColor'\n },\n {\n type: 'color',\n label: 'over-due-progress-color',\n name: 'overDueProgressColor'\n },\n {\n type: 'color',\n label: 'before-due-font-color',\n name: 'beforeDueFontColor'\n },\n {\n type: 'color',\n label: 'over-due-font-color',\n name: 'overDueFontColor'\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, started } = this.state\n\n if (autoStart || started) {\n this.setState('started', true)\n\n this.start()\n }\n }\n\n start() {\n const { startTime, endTime, hidden } = this.state\n const start = this.parseTime(startTime)\n const end = this.parseTime(endTime)\n\n if (start && end && !hidden) {\n this._due = end.getTime()\n this._start = start.getTime()\n this.counting()\n }\n }\n\n stop() {\n this.started = false\n }\n\n onchange(after: Properties) {\n if ('startTime' in after || 'endTime' in after || 'hidden' in after) {\n this.start()\n }\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 const { hidden, started } = this.state\n if (this.disposed || hidden || !started) {\n return\n }\n\n requestAnimationFrame(() => {\n const { showTimer, beforeDueFontColor, overDueFontColor, fontColor } = this.state\n const countdown = this.countdown\n\n this.setState('fontColor', (this.countdown > 0 ? beforeDueFontColor : overDueFontColor) || fontColor)\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 beforeDueFontColor,\n overDueFontColor,\n beforeDueProgressColor = 'transparent',\n overDueProgressColor = '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 : beforeDueProgressColor\n : overDueProgressColor\n context.fill()\n\n context.beginPath()\n }\n\n const image = this.getImageElement()\n this.drawImage(context, image!, left - 2, top - 2, width + 4, height + 4)\n\n context.roundRect(left, top, width, height, round)\n\n this.setState('fontColor', (increase ? beforeDueFontColor : overDueFontColor) || 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 get started() {\n return this.getState('started')\n }\n\n set started(started) {\n if (this.started !== started) {\n this.setState('started', started)\n if (started) {\n this.start()\n }\n }\n }\n}\n\nComponent.register('tact-timer', TactTimer)\n"]}
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": "8.0.0-alpha.1",
4
+ "version": "8.0.0-alpha.10",
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": "73793b35016b1c52bbf3b6e73c6320307bddaf16"
60
+ "gitHead": "646298de053b491069b9a51342e96ca76479da21"
61
61
  }
package/src/tact-timer.ts CHANGED
@@ -107,9 +107,11 @@ export default class TactTimer extends RectPath(Shape) {
107
107
  return
108
108
  }
109
109
 
110
- const { autoStart } = this.state
110
+ const { autoStart, started } = this.state
111
+
112
+ if (autoStart || started) {
113
+ this.setState('started', true)
111
114
 
112
- if (autoStart) {
113
115
  this.start()
114
116
  }
115
117
  }
@@ -126,6 +128,10 @@ export default class TactTimer extends RectPath(Shape) {
126
128
  }
127
129
  }
128
130
 
131
+ stop() {
132
+ this.started = false
133
+ }
134
+
129
135
  onchange(after: Properties) {
130
136
  if ('startTime' in after || 'endTime' in after || 'hidden' in after) {
131
137
  this.start()
@@ -149,8 +155,8 @@ export default class TactTimer extends RectPath(Shape) {
149
155
  }
150
156
 
151
157
  counting() {
152
- const { hidden } = this.state
153
- if (this.disposed || hidden) {
158
+ const { hidden, started } = this.state
159
+ if (this.disposed || hidden || !started) {
154
160
  return
155
161
  }
156
162
 
@@ -298,6 +304,19 @@ export default class TactTimer extends RectPath(Shape) {
298
304
  })
299
305
  }
300
306
  }
307
+
308
+ get started() {
309
+ return this.getState('started')
310
+ }
311
+
312
+ set started(started) {
313
+ if (this.started !== started) {
314
+ this.setState('started', started)
315
+ if (started) {
316
+ this.start()
317
+ }
318
+ }
319
+ }
301
320
  }
302
321
 
303
322
  Component.register('tact-timer', TactTimer)