@operato/scene-gauge 7.3.9 → 7.3.19

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,202 +0,0 @@
1
- /*
2
- * Copyright © HatioLab Inc. All rights reserved.
3
- */
4
-
5
- import { Component, ComponentNature, RectPath, Shape, ValueHolder } from '@hatiolab/things-scene'
6
-
7
- import { PROPERTIES } from './gauge-properties'
8
-
9
- const NATURE: ComponentNature = {
10
- mutable: false,
11
- resizable: true,
12
- rotatable: true,
13
- properties: [
14
- ...PROPERTIES,
15
- {
16
- type: 'color',
17
- label: 'text-fill-style',
18
- name: 'textFillStyle',
19
- property: 'textFillStyle'
20
- },
21
- {
22
- type: 'color',
23
- label: 'needle-fill-style',
24
- name: 'needleFillStyle',
25
- property: 'needleFillStyle'
26
- },
27
- {
28
- type: 'number',
29
- label: 'needle-size',
30
- name: 'needleSize',
31
- property: 'needleSize'
32
- }
33
- ],
34
- help: 'scene/component/gauge-vertical'
35
- }
36
-
37
- export default class GaugeVertical extends ValueHolder(RectPath(Shape)) {
38
- render(context: CanvasRenderingContext2D) {
39
- var {
40
- startValue,
41
- endValue,
42
- step,
43
- subStep,
44
- colorStops,
45
- needleFillStyle,
46
- stepFillStyle,
47
- textFillStyle,
48
- needleSize,
49
- stepNeedleSize,
50
- stepTextSize,
51
- showStepText = true,
52
- showStartValue = true,
53
- showEndValue = true,
54
- showStepLine = true,
55
- showSubStep = true,
56
- width,
57
- height,
58
- top,
59
- left,
60
- animFromBase = false
61
- } = this.state
62
-
63
- startValue = Number(startValue)
64
-
65
- this.animOnValueChange(this.value, animFromBase, startValue)
66
-
67
- const totalValue = endValue - startValue // 게이지의 시작과 끝 값의 크기
68
-
69
- context.translate(left, top) // top과 left의 좌표에 영향을 받지 않기 위해 transalate를 한다음 모든 탑과 레프트의 좌표를 0으로 줌
70
-
71
- //// 메인 막대 그리기 ////
72
- context.beginPath()
73
-
74
- context.rect(0, 0, width, height)
75
-
76
- this.drawFill(context)
77
- this.drawStroke(context)
78
- context.closePath()
79
-
80
- //// 스텝별 색 칠하기 ////
81
- if (colorStops) {
82
- let beforeValue = 0
83
- colorStops.forEach(function (
84
- v: { position: number; color: string },
85
- idx: number,
86
- arr: { position: number; color: string }[]
87
- ) {
88
- context.beginPath()
89
-
90
- let value = Math.max(Math.min(v.position - startValue, totalValue), 0) // v.position 범위의 최소값은 0, 최대값은 totalValue가 되야함.
91
- let startStepPosition = (height * beforeValue) / totalValue
92
- let endStepPosition
93
-
94
- // console.log(startStepPosition + (height * value / totalValue));
95
- if (idx === arr.length - 1 || startStepPosition + (height * value) / totalValue)
96
- // 배열의 마지막 값이거나 중간 시작값 + 그려지는 값이 height 를 넘을 경우는 무조건 끝까지 채워주도록 한다
97
- endStepPosition = height - startStepPosition
98
- else endStepPosition = height - (height * value) / totalValue
99
-
100
- if (beforeValue > totalValue || beforeValue > value)
101
- // 값이 게이지의 최대 값을 넘어가거나 이전 값 보다 현재값이 작으면 다시 그릴 필요 없음
102
- return false
103
-
104
- context.rect(0, height - startStepPosition, width, -endStepPosition)
105
-
106
- context.fillStyle = v.color
107
- context.fill()
108
- beforeValue = value
109
- })
110
- }
111
-
112
- //// 바늘 그리기 ////
113
- context.beginPath()
114
- let drawingValue = this.animValue
115
- drawingValue = Math.max(Math.min(drawingValue, endValue), startValue) // 그려지는 값은 startValue보다 작을 수 없고, endValue보다 클 수 없음.
116
- let position = height - ((drawingValue - startValue) / totalValue) * height
117
-
118
- needleSize *= 4
119
- context.moveTo(width * 1.05, position)
120
- context.lineTo(width * 1.05 + needleSize, position + needleSize / 2)
121
- context.lineTo(width * 1.05 + needleSize, position - needleSize / 2)
122
-
123
- context.fillStyle = needleFillStyle
124
- context.fill()
125
- context.closePath()
126
-
127
- //// 스텝 선 그리기 ////
128
- context.fillStyle = stepFillStyle
129
- if (showStepLine) {
130
- let count = totalValue / step
131
-
132
- // Draw StartValue
133
- context.fillRect(0, height, height * 0.06, stepNeedleSize)
134
- // Draw StepValue
135
- for (let num = 1; num < count; num++) {
136
- let locate = (height / count) * num
137
-
138
- context.fillRect(0, locate, height * 0.06, stepNeedleSize)
139
- }
140
- // Draw EndValue
141
- context.fillRect(0, 0, height * 0.06, stepNeedleSize)
142
- }
143
-
144
- //// 서브 스탭 그리기 ////
145
- if (showSubStep) {
146
- let count = totalValue
147
-
148
- // Draw StartValue
149
- context.fillRect(0, 0, height * 0.027, stepNeedleSize)
150
-
151
- // Draw StepValue
152
- for (let num = 1; num <= count; num++) {
153
- if (num % step == 0 || num % subStep != 0) {
154
- // 메인 스탭과 서브 스탭은 그리지 않음
155
- continue
156
- }
157
- let locate = (height / count) * num
158
- context.fillRect(0, locate, height * 0.027, stepNeedleSize)
159
- }
160
- }
161
-
162
- //// 스텝 텍스트 그리기 ////
163
- let fontSize = (height * stepTextSize) / 150
164
- context.fillStyle = textFillStyle
165
- context.font = fontSize + 'px arial'
166
- context.textBaseline = 'middle'
167
- context.textAlign = 'center'
168
- if (showStartValue) {
169
- // Draw StartText
170
- context.fillText(startValue, -fontSize, height)
171
- }
172
-
173
- if (showEndValue) {
174
- // Draw EndText
175
- context.fillText(endValue, -fontSize, 0)
176
- }
177
-
178
- if (showStepText) {
179
- // Draw StepText
180
- let count = totalValue / step
181
-
182
- for (let num = 1; num < count; num++) {
183
- let value = startValue + Number(step) * num
184
- let locate = height - (height / count) * num
185
-
186
- context.fillText(value, -fontSize, locate)
187
- }
188
- }
189
-
190
- context.translate(-left, -top)
191
- }
192
-
193
- postrender(context: CanvasRenderingContext2D) {
194
- this.drawText(context)
195
- }
196
-
197
- get nature() {
198
- return NATURE
199
- }
200
- }
201
-
202
- Component.register('gauge-vertical', GaugeVertical)
package/src/index.ts DELETED
@@ -1,6 +0,0 @@
1
- /*
2
- * Copyright © HatioLab Inc. All rights reserved.
3
- */
4
- export { default as GaugeCircle } from './gauge-circle'
5
- export { default as GaugeVertical } from './gauge-vertical'
6
- export { default as GaugeHorizon } from './gauge-horizon'
@@ -1,67 +0,0 @@
1
- <!doctype html>
2
- <!--
3
- @license
4
- Copyright © HatioLab Inc. All rights reserved.
5
- -->
6
- <html>
7
- <head>
8
- <meta charset="utf-8">
9
- <meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1.0, user-scalable=yes">
10
-
11
- <script src="../../webcomponentsjs/webcomponents-lite.js"></script>
12
- <script src="../../web-component-tester/browser.js"></script>
13
-
14
- <!-- Step 1: import the element to test -->
15
- <link rel="import" href="../things-scene-gauge.html">
16
- </head>
17
- <body>
18
-
19
- <!-- You can use the document as a place to set up your fixtures. -->
20
- <test-fixture id="things-scene-gauge-fixture">
21
- <template>
22
- <things-scene-gauge>
23
- <h2>things-scene-gauge</h2>
24
- </things-scene-gauge>
25
- </template>
26
- </test-fixture>
27
-
28
- <script>
29
- suite('<things-scene-gauge>', function() {
30
-
31
- var myEl;
32
-
33
- setup(function() {
34
- myEl = fixture('things-scene-gauge-fixture');
35
- });
36
-
37
- test('defines the "author" property', function() {
38
- assert.equal(myEl.author.name, 'Dimitri Glazkov');
39
- assert.equal(myEl.author.image, 'http://addyosmani.com/blog/wp-content/uploads/2013/04/unicorn.jpg');
40
- });
41
-
42
- test('says hello', function() {
43
- assert.equal(myEl.sayHello(), 'things-scene-gauge says, Hello World!');
44
-
45
- var greetings = myEl.sayHello('greetings Earthlings');
46
- assert.equal(greetings, 'things-scene-gauge says, greetings Earthlings');
47
- });
48
-
49
- test('fires lasers', function(done) {
50
- myEl.addEventListener('things-scene-gauge-lasers', function(event) {
51
- assert.equal(event.detail.sound, 'Pew pew!');
52
- done();
53
- });
54
- myEl.fireLasers();
55
- });
56
-
57
- test('distributed children', function() {
58
- var els = myEl.getContentChildren();
59
- assert.equal(els.length, 1, 'one distributed node');
60
- assert.equal(els[0], myEl.querySelector('h2'), 'content distributed correctly');
61
- });
62
-
63
- });
64
- </script>
65
-
66
- </body>
67
- </html>
package/test/index.html DELETED
@@ -1,22 +0,0 @@
1
- <!doctype html>
2
- <!--
3
- @license
4
- Copyright © HatioLab Inc. All rights reserved.
5
- -->
6
- <html><head>
7
- <meta charset="utf-8">
8
- <meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1.0, user-scalable=yes">
9
-
10
- <script src="../../webcomponentsjs/webcomponents-lite.js"></script>
11
- <script src="../../web-component-tester/browser.js"></script>
12
- </head>
13
- <body>
14
- <script>
15
- // Load and run all tests (.html, .js):
16
- WCT.loadSuites([
17
- 'basic-test.html',
18
- 'basic-test.html?dom=shadow'
19
- ]);
20
- </script>
21
-
22
- </body></html>
package/tsconfig.json DELETED
@@ -1,24 +0,0 @@
1
- {
2
- "compilerOptions": {
3
- "target": "es2018",
4
- "module": "esnext",
5
- "moduleResolution": "node",
6
- "noEmitOnError": true,
7
- "lib": ["es2019", "dom"],
8
- "strict": true,
9
- "esModuleInterop": false,
10
- "allowJs": true,
11
- "allowSyntheticDefaultImports": true,
12
- "experimentalDecorators": true,
13
- "importHelpers": true,
14
- "outDir": "dist",
15
- "sourceMap": true,
16
- "inlineSources": true,
17
- "rootDir": "src",
18
- "declaration": true,
19
- "incremental": true,
20
- "skipLibCheck": true,
21
- "types": []
22
- },
23
- "include": ["**/*.ts", "*.d.ts"]
24
- }
@@ -1 +0,0 @@
1
- {"fileNames":["../../node_modules/typescript/lib/lib.es5.d.ts","../../node_modules/typescript/lib/lib.es2015.d.ts","../../node_modules/typescript/lib/lib.es2016.d.ts","../../node_modules/typescript/lib/lib.es2017.d.ts","../../node_modules/typescript/lib/lib.es2018.d.ts","../../node_modules/typescript/lib/lib.es2019.d.ts","../../node_modules/typescript/lib/lib.dom.d.ts","../../node_modules/typescript/lib/lib.es2015.core.d.ts","../../node_modules/typescript/lib/lib.es2015.collection.d.ts","../../node_modules/typescript/lib/lib.es2015.generator.d.ts","../../node_modules/typescript/lib/lib.es2015.iterable.d.ts","../../node_modules/typescript/lib/lib.es2015.promise.d.ts","../../node_modules/typescript/lib/lib.es2015.proxy.d.ts","../../node_modules/typescript/lib/lib.es2015.reflect.d.ts","../../node_modules/typescript/lib/lib.es2015.symbol.d.ts","../../node_modules/typescript/lib/lib.es2015.symbol.wellknown.d.ts","../../node_modules/typescript/lib/lib.es2016.array.include.d.ts","../../node_modules/typescript/lib/lib.es2016.intl.d.ts","../../node_modules/typescript/lib/lib.es2017.date.d.ts","../../node_modules/typescript/lib/lib.es2017.object.d.ts","../../node_modules/typescript/lib/lib.es2017.sharedmemory.d.ts","../../node_modules/typescript/lib/lib.es2017.string.d.ts","../../node_modules/typescript/lib/lib.es2017.intl.d.ts","../../node_modules/typescript/lib/lib.es2017.typedarrays.d.ts","../../node_modules/typescript/lib/lib.es2018.asyncgenerator.d.ts","../../node_modules/typescript/lib/lib.es2018.asynciterable.d.ts","../../node_modules/typescript/lib/lib.es2018.intl.d.ts","../../node_modules/typescript/lib/lib.es2018.promise.d.ts","../../node_modules/typescript/lib/lib.es2018.regexp.d.ts","../../node_modules/typescript/lib/lib.es2019.array.d.ts","../../node_modules/typescript/lib/lib.es2019.object.d.ts","../../node_modules/typescript/lib/lib.es2019.string.d.ts","../../node_modules/typescript/lib/lib.es2019.symbol.d.ts","../../node_modules/typescript/lib/lib.es2019.intl.d.ts","../../node_modules/typescript/lib/lib.decorators.d.ts","../../node_modules/typescript/lib/lib.decorators.legacy.d.ts","../../node_modules/tslib/tslib.d.ts","../../node_modules/@hatiolab/things-scene/things-scene.d.ts","./src/gauge-properties.ts","./src/gauge-circle.ts","./src/gauge-horizon.ts","./src/gauge-vertical.ts","./src/index.ts"],"fileIdsList":[[37,38,39],[37],[37,40,41,42]],"fileInfos":[{"version":"44e584d4f6444f58791784f1d530875970993129442a847597db702a073ca68c","affectsGlobalScope":true,"impliedFormat":1},{"version":"45b7ab580deca34ae9729e97c13cfd999df04416a79116c3bfb483804f85ded4","impliedFormat":1},{"version":"3facaf05f0c5fc569c5649dd359892c98a85557e3e0c847964caeb67076f4d75","impliedFormat":1},{"version":"9a68c0c07ae2fa71b44384a839b7b8d81662a236d4b9ac30916718f7510b1b2d","impliedFormat":1},{"version":"5e1c4c362065a6b95ff952c0eab010f04dcd2c3494e813b493ecfd4fcb9fc0d8","impliedFormat":1},{"version":"68d73b4a11549f9c0b7d352d10e91e5dca8faa3322bfb77b661839c42b1ddec7","impliedFormat":1},{"version":"9e8ca8ed051c2697578c023d9c29d6df689a083561feba5c14aedee895853999","affectsGlobalScope":true,"impliedFormat":1},{"version":"6920e1448680767498a0b77c6a00a8e77d14d62c3da8967b171f1ddffa3c18e4","affectsGlobalScope":true,"impliedFormat":1},{"version":"dc2df20b1bcdc8c2d34af4926e2c3ab15ffe1160a63e58b7e09833f616efff44","affectsGlobalScope":true,"impliedFormat":1},{"version":"515d0b7b9bea2e31ea4ec968e9edd2c39d3eebf4a2d5cbd04e88639819ae3b71","affectsGlobalScope":true,"impliedFormat":1},{"version":"45d8ccb3dfd57355eb29749919142d4321a0aa4df6acdfc54e30433d7176600a","affectsGlobalScope":true,"impliedFormat":1},{"version":"0dc1e7ceda9b8b9b455c3a2d67b0412feab00bd2f66656cd8850e8831b08b537","affectsGlobalScope":true,"impliedFormat":1},{"version":"ce691fb9e5c64efb9547083e4a34091bcbe5bdb41027e310ebba8f7d96a98671","affectsGlobalScope":true,"impliedFormat":1},{"version":"8d697a2a929a5fcb38b7a65594020fcef05ec1630804a33748829c5ff53640d0","affectsGlobalScope":true,"impliedFormat":1},{"version":"4ff2a353abf8a80ee399af572debb8faab2d33ad38c4b4474cff7f26e7653b8d","affectsGlobalScope":true,"impliedFormat":1},{"version":"93495ff27b8746f55d19fcbcdbaccc99fd95f19d057aed1bd2c0cafe1335fbf0","affectsGlobalScope":true,"impliedFormat":1},{"version":"6fc23bb8c3965964be8c597310a2878b53a0306edb71d4b5a4dfe760186bcc01","affectsGlobalScope":true,"impliedFormat":1},{"version":"ea011c76963fb15ef1cdd7ce6a6808b46322c527de2077b6cfdf23ae6f5f9ec7","affectsGlobalScope":true,"impliedFormat":1},{"version":"38f0219c9e23c915ef9790ab1d680440d95419ad264816fa15009a8851e79119","affectsGlobalScope":true,"impliedFormat":1},{"version":"69ab18c3b76cd9b1be3d188eaf8bba06112ebbe2f47f6c322b5105a6fbc45a2e","affectsGlobalScope":true,"impliedFormat":1},{"version":"4738f2420687fd85629c9efb470793bb753709c2379e5f85bc1815d875ceadcd","affectsGlobalScope":true,"impliedFormat":1},{"version":"2f11ff796926e0832f9ae148008138ad583bd181899ab7dd768a2666700b1893","affectsGlobalScope":true,"impliedFormat":1},{"version":"4de680d5bb41c17f7f68e0419412ca23c98d5749dcaaea1896172f06435891fc","affectsGlobalScope":true,"impliedFormat":1},{"version":"9fc46429fbe091ac5ad2608c657201eb68b6f1b8341bd6d670047d32ed0a88fa","affectsGlobalScope":true,"impliedFormat":1},{"version":"ac9538681b19688c8eae65811b329d3744af679e0bdfa5d842d0e32524c73e1c","affectsGlobalScope":true,"impliedFormat":1},{"version":"0a969edff4bd52585473d24995c5ef223f6652d6ef46193309b3921d65dd4376","affectsGlobalScope":true,"impliedFormat":1},{"version":"9e9fbd7030c440b33d021da145d3232984c8bb7916f277e8ffd3dc2e3eae2bdb","affectsGlobalScope":true,"impliedFormat":1},{"version":"811ec78f7fefcabbda4bfa93b3eb67d9ae166ef95f9bff989d964061cbf81a0c","affectsGlobalScope":true,"impliedFormat":1},{"version":"717937616a17072082152a2ef351cb51f98802fb4b2fdabd32399843875974ca","affectsGlobalScope":true,"impliedFormat":1},{"version":"d7e7d9b7b50e5f22c915b525acc5a49a7a6584cf8f62d0569e557c5cfc4b2ac2","affectsGlobalScope":true,"impliedFormat":1},{"version":"71c37f4c9543f31dfced6c7840e068c5a5aacb7b89111a4364b1d5276b852557","affectsGlobalScope":true,"impliedFormat":1},{"version":"576711e016cf4f1804676043e6a0a5414252560eb57de9faceee34d79798c850","affectsGlobalScope":true,"impliedFormat":1},{"version":"89c1b1281ba7b8a96efc676b11b264de7a8374c5ea1e6617f11880a13fc56dc6","affectsGlobalScope":true,"impliedFormat":1},{"version":"74f7fa2d027d5b33eb0471c8e82a6c87216223181ec31247c357a3e8e2fddc5b","affectsGlobalScope":true,"impliedFormat":1},{"version":"33358442698bb565130f52ba79bfd3d4d484ac85fe33f3cb1759c54d18201393","affectsGlobalScope":true,"impliedFormat":1},{"version":"782dec38049b92d4e85c1585fbea5474a219c6984a35b004963b00beb1aab538","affectsGlobalScope":true,"impliedFormat":1},{"version":"4a882ffbb4ed09d9b7734f784aebb1dfe488d63725c40759165c5d9c657ca029","impliedFormat":1},{"version":"26d1ec00a52200684283272eaed524de74adc033bdff6522f72e03c796a46ff8","impliedFormat":1},{"version":"8e1409f894fa33ed13f49fc8d503a69986b5349d16d3fa51141b6ac37e16df31","signature":"44008f04e6756cf1d3b21bb767fe5cbde6c0df6a0084c0bacd97f4aaa454f273"},{"version":"0fe57d9203d2161c5c95db565a17062f584cea4fc519c71a9b8d4777355b6092","signature":"48797414fafff497cac54f6c10d1e2e7ebb896ee9a572446fdc489901890d0fd"},{"version":"bb0c7a674d1eda5ef4fec9a55b37c50ee33f4cd769cb57d7f5341113dbe5d9ee","signature":"2be736c3a080d1b4d3158e3c5d19d3b635b3e482760655714b0dfefe5d2a3816"},{"version":"3e2848a5cccae467f459efd9aa5344baa105f0c5d81a2f2375b1d3e27bf1be48","signature":"a955feae78869a1b19c45c106aa9d74d6ddeae25c7b5b68fa7b02941b81e15d2"},{"version":"573659b567a69a7ca85bd857b3998a69edb91813c08a48951557b219f39496c3","signature":"9693c626dbb27254cb73153232a55d8c8d5d72afca3b6bbcf158abbdc4a82e9b"}],"root":[[39,43]],"options":{"allowJs":true,"allowSyntheticDefaultImports":true,"declaration":true,"esModuleInterop":false,"experimentalDecorators":true,"importHelpers":true,"inlineSources":true,"module":99,"noEmitOnError":true,"outDir":"./dist","rootDir":"./src","skipLibCheck":true,"sourceMap":true,"strict":true,"target":5},"referencedMap":[[40,1],[41,1],[39,2],[42,1],[43,3]],"version":"5.6.2"}