@adcops/autocore-react 3.3.8 → 3.3.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/LICENSE +58 -58
- package/additional-docs/AutoCoreTagContext.md +441 -441
- package/additional-docs/ButtonApiSpecs.md +48 -48
- package/additional-docs/GlobalEventEmitter.md +243 -243
- package/additional-docs/general_recommendations.md +22 -22
- package/additional-docs/react_performance_notes.md +94 -94
- package/dist/assets/svg/blockly_logo.svg +82 -82
- package/dist/assets/svg/distance.svg +40 -40
- package/dist/assets/svg/python_logo.svg +246 -246
- package/dist/assets/svg/rotation_ccw.svg +50 -50
- package/dist/assets/svg/rotation_ccw_a.svg +57 -57
- package/dist/assets/svg/rotation_ccw_b.svg +57 -57
- package/dist/assets/svg/rotation_ccw_c.svg +57 -57
- package/dist/assets/svg/rotation_cw.svg +49 -49
- package/dist/assets/svg/rotation_cw_a.svg +30 -30
- package/dist/assets/svg/rotation_cw_b.svg +30 -30
- package/dist/assets/svg/rotation_cw_c.svg +30 -30
- package/dist/assets/svg/speed.svg +39 -39
- package/dist/components/BlocklyEditor.css +93 -93
- package/dist/components/JogPanel.css +41 -41
- package/dist/components/ProgressBarWithValue.css +27 -27
- package/dist/components/ValueIndicator.css +31 -31
- package/dist/components/osk.css +123 -123
- package/dist/core/AutoCoreTagContext.d.ts.map +1 -1
- package/dist/core/AutoCoreTagContext.js +1 -1
- package/dist/hub/HubBase.d.ts +3 -3
- package/dist/hub/HubBase.d.ts.map +1 -1
- package/dist/hub/HubBase.js +1 -1
- package/package.json +104 -104
- package/readme.md +343 -343
- package/src/assets/BlocklyLogo.tsx +27 -27
- package/src/assets/Distance.tsx +18 -18
- package/src/assets/JogLong.tsx +13 -13
- package/src/assets/JogMedium.tsx +13 -13
- package/src/assets/JogShort.tsx +13 -13
- package/src/assets/PythonLogo.tsx +83 -83
- package/src/assets/Rotation3D.tsx +13 -13
- package/src/assets/RotationCcw.tsx +33 -33
- package/src/assets/RotationCcwA.tsx +45 -45
- package/src/assets/RotationCcwB.tsx +45 -45
- package/src/assets/RotationCcwC.tsx +45 -45
- package/src/assets/RotationCw.tsx +31 -31
- package/src/assets/RotationCwA.tsx +42 -42
- package/src/assets/RotationCwB.tsx +42 -42
- package/src/assets/RotationCwC.tsx +42 -42
- package/src/assets/Run.tsx +13 -13
- package/src/assets/Speed.tsx +18 -18
- package/src/assets/SpeedFast.tsx +13 -13
- package/src/assets/SpeedMedium.tsx +13 -13
- package/src/assets/SpeedNone.tsx +13 -13
- package/src/assets/SpeedSlow.tsx +13 -13
- package/src/assets/Walk.tsx +13 -13
- package/src/assets/index.ts +22 -22
- package/src/assets/svg/blockly_logo.svg +82 -82
- package/src/assets/svg/distance.svg +40 -40
- package/src/assets/svg/python_logo.svg +246 -246
- package/src/assets/svg/rotation_ccw.svg +50 -50
- package/src/assets/svg/rotation_ccw_a.svg +57 -57
- package/src/assets/svg/rotation_ccw_b.svg +57 -57
- package/src/assets/svg/rotation_ccw_c.svg +57 -57
- package/src/assets/svg/rotation_cw.svg +49 -49
- package/src/assets/svg/rotation_cw_a.svg +30 -30
- package/src/assets/svg/rotation_cw_b.svg +30 -30
- package/src/assets/svg/rotation_cw_c.svg +30 -30
- package/src/assets/svg/speed.svg +39 -39
- package/src/components/AutoCoreDevPanel.tsx +414 -414
- package/src/components/BlocklyEditor.css +93 -93
- package/src/components/BlocklyEditor.tsx +609 -609
- package/src/components/CodeEditor.tsx +155 -155
- package/src/components/FileList.tsx +390 -390
- package/src/components/FileSelect.tsx +128 -128
- package/src/components/FitText.tsx +35 -35
- package/src/components/Indicator.tsx +188 -188
- package/src/components/IndicatorButton.tsx +214 -214
- package/src/components/IndicatorRect.tsx +172 -172
- package/src/components/JogPanel.css +41 -41
- package/src/components/JogPanel.tsx +461 -461
- package/src/components/Lamp.tsx +243 -243
- package/src/components/Osk.tsx +192 -192
- package/src/components/OskDialog.tsx +164 -164
- package/src/components/ProgressBarWithValue.css +27 -27
- package/src/components/ProgressBarWithValue.tsx +48 -48
- package/src/components/TextInput.tsx +195 -195
- package/src/components/ToggleGroup.tsx +322 -322
- package/src/components/ValueDisplay.tsx +236 -236
- package/src/components/ValueIndicator.css +31 -31
- package/src/components/ValueIndicator.tsx +135 -135
- package/src/components/ValueInput.tsx +368 -368
- package/src/components/osk.css +123 -123
- package/src/core/ActionMode.ts +19 -19
- package/src/core/AutoCoreTagContext.tsx +625 -614
- package/src/core/AutoCoreTagTypes.ts +334 -334
- package/src/core/CoreStreamTypes.ts +512 -512
- package/src/core/EventEmitterContext.tsx +434 -434
- package/src/core/IndicatorButtonState.ts +34 -34
- package/src/core/IndicatorColor.ts +35 -35
- package/src/core/MaskPatterns.ts +87 -87
- package/src/core/NumerableTypes.ts +80 -80
- package/src/core/PositionContext.ts +59 -59
- package/src/core/UniqueId.ts +41 -41
- package/src/core/ValueSimulator.ts +166 -166
- package/src/core/hoc.tsx +65 -65
- package/src/hooks/adsHooks.tsx +287 -287
- package/src/hooks/commandHooks.tsx +300 -300
- package/src/hooks/index.ts +12 -12
- package/src/hooks/useAutoCoreTag.ts +103 -103
- package/src/hooks/useScaledValue.tsx +99 -99
- package/src/hub/CommandMessage.ts +89 -89
- package/src/hub/DebugPanel.ts +307 -307
- package/src/hub/HubBase.ts +249 -236
- package/src/hub/HubSimulate.ts +124 -124
- package/src/hub/HubTauri.ts +140 -140
- package/src/hub/HubWebSocket.ts +250 -250
- package/src/hub/debug.ts +211 -211
- package/src/hub/index.ts +81 -81
- package/src/themes/adc-dark/_extensions.scss +166 -166
- package/src/themes/adc-dark/_variables.scss +913 -913
- package/src/themes/adc-dark/blue/_fonts.scss +23 -23
- package/src/themes/adc-dark/blue/adc_theme.scss +31 -31
- package/src/themes/adc-dark/blue/theme.scss +14 -14
- package/src/themes/theme-base/_colors.scss +17 -17
- package/src/themes/theme-base/_common.scss +74 -74
- package/src/themes/theme-base/_components.scss +111 -111
- package/src/themes/theme-base/_mixins.scss +243 -243
- package/src/themes/theme-base/components/button/_button.scss +644 -644
- package/src/themes/theme-base/components/button/_speeddial.scss +91 -91
- package/src/themes/theme-base/components/button/_splitbutton.scss +358 -358
- package/src/themes/theme-base/components/data/_carousel.scss +39 -39
- package/src/themes/theme-base/components/data/_datascroller.scss +47 -47
- package/src/themes/theme-base/components/data/_datatable.scss +388 -388
- package/src/themes/theme-base/components/data/_dataview.scss +47 -47
- package/src/themes/theme-base/components/data/_filter.scss +137 -137
- package/src/themes/theme-base/components/data/_orderlist.scss +86 -86
- package/src/themes/theme-base/components/data/_organizationchart.scss +50 -50
- package/src/themes/theme-base/components/data/_paginator.scss +91 -91
- package/src/themes/theme-base/components/data/_picklist.scss +73 -73
- package/src/themes/theme-base/components/data/_timeline.scss +38 -38
- package/src/themes/theme-base/components/data/_tree.scss +184 -184
- package/src/themes/theme-base/components/data/_treetable.scss +431 -431
- package/src/themes/theme-base/components/file/_fileupload.scss +41 -41
- package/src/themes/theme-base/components/input/_autocomplete.scss +94 -94
- package/src/themes/theme-base/components/input/_calendar.scss +251 -251
- package/src/themes/theme-base/components/input/_cascadeselect.scss +107 -107
- package/src/themes/theme-base/components/input/_checkbox.scss +181 -181
- package/src/themes/theme-base/components/input/_chips.scss +102 -102
- package/src/themes/theme-base/components/input/_colorpicker.scss +17 -17
- package/src/themes/theme-base/components/input/_dropdown.scss +252 -252
- package/src/themes/theme-base/components/input/_editor.scss +122 -122
- package/src/themes/theme-base/components/input/_iconfield.scss +9 -9
- package/src/themes/theme-base/components/input/_inputgroup.scss +74 -74
- package/src/themes/theme-base/components/input/_inputicon.scss +14 -14
- package/src/themes/theme-base/components/input/_inputnumber.scss +4 -4
- package/src/themes/theme-base/components/input/_inputotp.scss +10 -10
- package/src/themes/theme-base/components/input/_inputswitch.scss +99 -99
- package/src/themes/theme-base/components/input/_inputtext.scss +101 -101
- package/src/themes/theme-base/components/input/_listbox.scss +138 -138
- package/src/themes/theme-base/components/input/_mention.scss +30 -30
- package/src/themes/theme-base/components/input/_multiselect.scss +278 -278
- package/src/themes/theme-base/components/input/_password.scss +32 -32
- package/src/themes/theme-base/components/input/_radiobutton.scss +169 -169
- package/src/themes/theme-base/components/input/_rating.scss +80 -80
- package/src/themes/theme-base/components/input/_selectbutton.scss +49 -49
- package/src/themes/theme-base/components/input/_slider.scss +49 -49
- package/src/themes/theme-base/components/input/_togglebutton.scss +99 -99
- package/src/themes/theme-base/components/input/_treeselect.scss +151 -151
- package/src/themes/theme-base/components/input/_tristatecheckbox.scss +46 -46
- package/src/themes/theme-base/components/menu/_breadcrumb.scss +42 -42
- package/src/themes/theme-base/components/menu/_contextmenu.scss +39 -39
- package/src/themes/theme-base/components/menu/_dock.scss +109 -109
- package/src/themes/theme-base/components/menu/_megamenu.scss +141 -141
- package/src/themes/theme-base/components/menu/_menu.scss +33 -33
- package/src/themes/theme-base/components/menu/_menubar.scss +216 -216
- package/src/themes/theme-base/components/menu/_panelmenu.scss +153 -153
- package/src/themes/theme-base/components/menu/_slidemenu.scss +60 -60
- package/src/themes/theme-base/components/menu/_steps.scss +57 -57
- package/src/themes/theme-base/components/menu/_tabmenu.scss +50 -50
- package/src/themes/theme-base/components/menu/_tieredmenu.scss +43 -43
- package/src/themes/theme-base/components/messages/_inlinemessage.scss +69 -69
- package/src/themes/theme-base/components/messages/_message.scss +107 -107
- package/src/themes/theme-base/components/messages/_toast.scss +100 -100
- package/src/themes/theme-base/components/misc/_avatar.scss +33 -33
- package/src/themes/theme-base/components/misc/_badge.scss +76 -76
- package/src/themes/theme-base/components/misc/_chip.scss +38 -38
- package/src/themes/theme-base/components/misc/_inplace.scss +17 -17
- package/src/themes/theme-base/components/misc/_metergroup.scss +80 -80
- package/src/themes/theme-base/components/misc/_progressbar.scss +17 -17
- package/src/themes/theme-base/components/misc/_scrolltop.scss +24 -24
- package/src/themes/theme-base/components/misc/_skeleton.scss +7 -7
- package/src/themes/theme-base/components/misc/_tag.scss +39 -39
- package/src/themes/theme-base/components/misc/_terminal.scss +12 -12
- package/src/themes/theme-base/components/multimedia/_galleria.scss +153 -153
- package/src/themes/theme-base/components/multimedia/_image.scss +53 -53
- package/src/themes/theme-base/components/overlay/_confirmpopup.scss +72 -72
- package/src/themes/theme-base/components/overlay/_dialog.scss +78 -78
- package/src/themes/theme-base/components/overlay/_overlaypanel.scss +64 -64
- package/src/themes/theme-base/components/overlay/_sidebar.scss +23 -23
- package/src/themes/theme-base/components/overlay/_tooltip.scss +33 -33
- package/src/themes/theme-base/components/panel/_accordion.scss +118 -118
- package/src/themes/theme-base/components/panel/_card.scss +30 -30
- package/src/themes/theme-base/components/panel/_divider.scss +30 -30
- package/src/themes/theme-base/components/panel/_fieldset.scss +47 -47
- package/src/themes/theme-base/components/panel/_panel.scss +47 -47
- package/src/themes/theme-base/components/panel/_scrollpanel.scss +10 -10
- package/src/themes/theme-base/components/panel/_splitter.scss +23 -23
- package/src/themes/theme-base/components/panel/_stepper.scss +136 -136
- package/src/themes/theme-base/components/panel/_tabview.scss +147 -147
- package/src/themes/theme-base/components/panel/_toolbar.scss +11 -11
- package/terser.config.cjs +25 -25
- package/todo.md +18 -18
- package/tools/build-themes.cjs +65 -65
- package/tools/copy-distribution-files.cjs +77 -77
- package/tools/minify.cjs +55 -55
- package/tsconfig.json +48 -48
- package/typedoc.json +12 -12
- package/.claude/settings.local.json +0 -7
package/src/core/UniqueId.ts
CHANGED
|
@@ -1,41 +1,41 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
/**
|
|
5
|
-
* Generate a unique UUID in the form of RF4122.
|
|
6
|
-
* @returns string
|
|
7
|
-
*/
|
|
8
|
-
const PrivateUniqueId = (function()
|
|
9
|
-
{
|
|
10
|
-
function chr4()
|
|
11
|
-
{
|
|
12
|
-
return Math.random().toString(16).slice(-4);
|
|
13
|
-
}
|
|
14
|
-
|
|
15
|
-
return chr4() + chr4() +
|
|
16
|
-
'-' + chr4() +
|
|
17
|
-
'-' + chr4() +
|
|
18
|
-
'-' + chr4() +
|
|
19
|
-
'-' + chr4() + chr4() + chr4();
|
|
20
|
-
});
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
/**
|
|
24
|
-
* Generates a unique UUID per RFC4122.
|
|
25
|
-
* 8 chars, followed by 3 groups of 4 chars, followed by 12 chars.
|
|
26
|
-
*
|
|
27
|
-
* @returns string UUID
|
|
28
|
-
*
|
|
29
|
-
* ## Remarks
|
|
30
|
-
* NOTE: This format of 8 chars, followed by 3 groups of 4 chars, followed by 12 chars
|
|
31
|
-
* is known as a UUID and is defined in RFC4122 and is a standard for generating unique IDs.
|
|
32
|
-
* This function DOES NOT implement this standard. It simply outputs a string
|
|
33
|
-
* that looks similar. The standard is found here: https://www.ietf.org/rfc/rfc4122.txt
|
|
34
|
-
*
|
|
35
|
-
* Should avoid duplicates over 10-millions subsequent calls.
|
|
36
|
-
*
|
|
37
|
-
*/
|
|
38
|
-
export function UniqueId() : string {
|
|
39
|
-
return PrivateUniqueId();
|
|
40
|
-
}
|
|
41
|
-
|
|
1
|
+
|
|
2
|
+
|
|
3
|
+
|
|
4
|
+
/**
|
|
5
|
+
* Generate a unique UUID in the form of RF4122.
|
|
6
|
+
* @returns string
|
|
7
|
+
*/
|
|
8
|
+
const PrivateUniqueId = (function()
|
|
9
|
+
{
|
|
10
|
+
function chr4()
|
|
11
|
+
{
|
|
12
|
+
return Math.random().toString(16).slice(-4);
|
|
13
|
+
}
|
|
14
|
+
|
|
15
|
+
return chr4() + chr4() +
|
|
16
|
+
'-' + chr4() +
|
|
17
|
+
'-' + chr4() +
|
|
18
|
+
'-' + chr4() +
|
|
19
|
+
'-' + chr4() + chr4() + chr4();
|
|
20
|
+
});
|
|
21
|
+
|
|
22
|
+
|
|
23
|
+
/**
|
|
24
|
+
* Generates a unique UUID per RFC4122.
|
|
25
|
+
* 8 chars, followed by 3 groups of 4 chars, followed by 12 chars.
|
|
26
|
+
*
|
|
27
|
+
* @returns string UUID
|
|
28
|
+
*
|
|
29
|
+
* ## Remarks
|
|
30
|
+
* NOTE: This format of 8 chars, followed by 3 groups of 4 chars, followed by 12 chars
|
|
31
|
+
* is known as a UUID and is defined in RFC4122 and is a standard for generating unique IDs.
|
|
32
|
+
* This function DOES NOT implement this standard. It simply outputs a string
|
|
33
|
+
* that looks similar. The standard is found here: https://www.ietf.org/rfc/rfc4122.txt
|
|
34
|
+
*
|
|
35
|
+
* Should avoid duplicates over 10-millions subsequent calls.
|
|
36
|
+
*
|
|
37
|
+
*/
|
|
38
|
+
export function UniqueId() : string {
|
|
39
|
+
return PrivateUniqueId();
|
|
40
|
+
}
|
|
41
|
+
|
|
@@ -1,167 +1,167 @@
|
|
|
1
|
-
/*
|
|
2
|
-
* Copyright (C) 2024 Automated Design Corp. All Rights Reserved.
|
|
3
|
-
* Created Date: 2024-01-18 12:49:58
|
|
4
|
-
* Author: Thomas C. Bitsky Jr.
|
|
5
|
-
* -----
|
|
6
|
-
* Last Modified: 2025-09-05 14:50:12
|
|
7
|
-
* Modified By: ADC
|
|
8
|
-
* -----
|
|
9
|
-
*
|
|
10
|
-
*/
|
|
11
|
-
|
|
12
|
-
import type { EmitterDispatchFunction } from "./EventEmitterContext";
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
/**
|
|
16
|
-
* Generates values for simulating data into an HMI.
|
|
17
|
-
* Used for demonstration and development testing.
|
|
18
|
-
*/
|
|
19
|
-
export class ValueSimulator {
|
|
20
|
-
|
|
21
|
-
protected bBit1: boolean = false;
|
|
22
|
-
protected bBit2: boolean = true;
|
|
23
|
-
|
|
24
|
-
protected iRamp1: number = 0;
|
|
25
|
-
protected iRamp2: number = 0;
|
|
26
|
-
protected fRamp1: number = 0;
|
|
27
|
-
protected fRamp2: number = 0;
|
|
28
|
-
|
|
29
|
-
protected iSin1: number = 0;
|
|
30
|
-
protected iSin2: number = 0;
|
|
31
|
-
protected fSin1: number = 0;
|
|
32
|
-
protected fSin2: number = 0;
|
|
33
|
-
|
|
34
|
-
protected iRamp1DirectionUp : boolean = true;
|
|
35
|
-
protected iRamp2DirectionUp : boolean = true;
|
|
36
|
-
protected fRamp1DirectionUp : boolean = true;
|
|
37
|
-
protected fRamp2DirectionUp : boolean = true;
|
|
38
|
-
|
|
39
|
-
protected iSin1Angle : number = Math.random() * Math.PI * 2;
|
|
40
|
-
protected iSin2Angle : number = Math.random() * Math.PI * 2;
|
|
41
|
-
protected fSin1Angle : number = (Math.random() * Math.PI * 2) / 10;
|
|
42
|
-
protected fSin2Angle : number = (Math.random() * Math.PI * 2) / 10;
|
|
43
|
-
|
|
44
|
-
protected intervalId: number = 0;
|
|
45
|
-
|
|
46
|
-
protected dispatch: EmitterDispatchFunction;
|
|
47
|
-
|
|
48
|
-
/**
|
|
49
|
-
* Constructor
|
|
50
|
-
* @param dispatch EmitterDispatchFunction Dispatch function from the application's EventEmiterContext.
|
|
51
|
-
*/
|
|
52
|
-
constructor(dispatch: EmitterDispatchFunction) {
|
|
53
|
-
this.dispatch = dispatch;
|
|
54
|
-
}
|
|
55
|
-
|
|
56
|
-
/**
|
|
57
|
-
* Start simulating values on a tick
|
|
58
|
-
*/
|
|
59
|
-
start() {
|
|
60
|
-
|
|
61
|
-
if (this.intervalId === 0) {
|
|
62
|
-
this.intervalId = setInterval(
|
|
63
|
-
() => this.update(),
|
|
64
|
-
1000
|
|
65
|
-
);
|
|
66
|
-
}
|
|
67
|
-
}
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
/**
|
|
71
|
-
* Stop simulating values.
|
|
72
|
-
*/
|
|
73
|
-
stop() {
|
|
74
|
-
if (this.intervalId !== 0) {
|
|
75
|
-
clearInterval(this.intervalId);
|
|
76
|
-
this.intervalId = 0;
|
|
77
|
-
}
|
|
78
|
-
}
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
/**
|
|
82
|
-
* Update and dispatch the values.
|
|
83
|
-
*/
|
|
84
|
-
protected update() {
|
|
85
|
-
|
|
86
|
-
this.bBit1 = !this.bBit1;
|
|
87
|
-
this.bBit2 = !this.bBit2;
|
|
88
|
-
|
|
89
|
-
[this.iRamp1, this.iRamp1DirectionUp] = this.updateRamp(this.iRamp1, this.iRamp1DirectionUp, 32767);
|
|
90
|
-
[this.iRamp2, this.iRamp2DirectionUp] = this.updateRamp(this.iRamp2, this.iRamp2DirectionUp, 32767);
|
|
91
|
-
[this.fRamp1, this.fRamp1DirectionUp] = this.updateRamp(this.fRamp1, this.fRamp1DirectionUp, 3276.7);
|
|
92
|
-
[this.fRamp2, this.fRamp2DirectionUp] = this.updateRamp(this.fRamp2, this.fRamp2DirectionUp, 3276.7);
|
|
93
|
-
|
|
94
|
-
[this.iSin1, this.iSin1Angle] = this.updateSin(this.iSin1, this.iSin1Angle, Math.PI / 180, 32767);
|
|
95
|
-
[this.iSin2, this.iSin2Angle] = this.updateSin(this.iSin2, this.iSin2Angle, Math.PI / 180, 32767);
|
|
96
|
-
[this.fSin1, this.fSin1Angle] = this.updateSin(this.fSin1, this.fSin1Angle, Math.PI / 180, 3276.7);
|
|
97
|
-
[this.fSin2, this.fSin2Angle] = this.updateSin(this.fSin2, this.fSin2Angle, Math.PI / 180, 3276.7);
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
this.updateTopic("value-simulator-bBit1", this.bBit1);
|
|
101
|
-
this.updateTopic("value-simulator-bBit2", this.bBit2);
|
|
102
|
-
this.updateTopic("value-simulator-iRamp1", this.iRamp1);
|
|
103
|
-
this.updateTopic("value-simulator-iRamp2", this.iRamp2);
|
|
104
|
-
this.updateTopic("value-simulator-fRamp1", this.fRamp1);
|
|
105
|
-
this.updateTopic("value-simulator-fRamp2", this.fRamp2);
|
|
106
|
-
|
|
107
|
-
this.updateTopic("value-simulator-iSin1", this.iSin1);
|
|
108
|
-
this.updateTopic("value-simulator-iSin2", this.iSin2);
|
|
109
|
-
this.updateTopic("value-simulator-fSin1", this.fSin1);
|
|
110
|
-
this.updateTopic("value-simulator-fSin2", this.fSin2);
|
|
111
|
-
|
|
112
|
-
}
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
/**
|
|
116
|
-
* Updates the value of a ramp variable, changing its direction when limits are reached.
|
|
117
|
-
* @param {number} value The current value of the ramp variable.
|
|
118
|
-
* @param {boolean} directionUp Indicates if the ramp variable is currently increasing.
|
|
119
|
-
* @param {number} max The maximum value for the ramp.
|
|
120
|
-
* @returns {[number, boolean]} The updated value and direction.
|
|
121
|
-
*/
|
|
122
|
-
protected updateRamp(value: number, directionUp: boolean, max: number): [number, boolean] {
|
|
123
|
-
if (directionUp) {
|
|
124
|
-
value++;
|
|
125
|
-
if (value >= max) return [value, false];
|
|
126
|
-
} else {
|
|
127
|
-
value--;
|
|
128
|
-
if (value <= 0) return [value, true];
|
|
129
|
-
}
|
|
130
|
-
return [value, directionUp];
|
|
131
|
-
}
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
/**
|
|
135
|
-
* Updates a sine wave value based on the given angle and increments, then calculates the new value and angle.
|
|
136
|
-
* This method is useful for scenarios where a sine wave value needs to be progressively updated, such as in animations
|
|
137
|
-
* or simulations. The sine of the updated angle is calculated, multiplied by the maximum value to scale it, and both
|
|
138
|
-
* the new value and the updated angle are returned.
|
|
139
|
-
*
|
|
140
|
-
* @param {number} value The current value of the sine wave. This parameter is not directly used in the calculation of the new value,
|
|
141
|
-
* but it can be utilized if the method is extended or modified.
|
|
142
|
-
* @param {number} angle The current angle in radians. This is the phase of the sine wave.
|
|
143
|
-
* @param {number} increment The value by which the angle is to be incremented, in radians. This controls the progression of the wave.
|
|
144
|
-
* @param {number} max The maximum value (amplitude) of the sine wave. The calculated sine value will be scaled by this factor.
|
|
145
|
-
* @returns {[number,number]} A tuple where the first element is the new sine wave value and the second element is the updated angle.
|
|
146
|
-
*/
|
|
147
|
-
protected updateSin(value: number, angle: number, increment: number, max: number): [number, number] {
|
|
148
|
-
angle += increment;
|
|
149
|
-
value = Math.sin(angle) * max;
|
|
150
|
-
return [value, angle];
|
|
151
|
-
}
|
|
152
|
-
|
|
153
|
-
|
|
154
|
-
/**
|
|
155
|
-
* Dispatch the update for a particular topic.
|
|
156
|
-
*/
|
|
157
|
-
protected updateTopic(topic: string, value: any) {
|
|
158
|
-
|
|
159
|
-
this.dispatch({
|
|
160
|
-
topic: topic,
|
|
161
|
-
payload: value
|
|
162
|
-
});
|
|
163
|
-
|
|
164
|
-
}
|
|
165
|
-
}
|
|
166
|
-
|
|
1
|
+
/*
|
|
2
|
+
* Copyright (C) 2024 Automated Design Corp. All Rights Reserved.
|
|
3
|
+
* Created Date: 2024-01-18 12:49:58
|
|
4
|
+
* Author: Thomas C. Bitsky Jr.
|
|
5
|
+
* -----
|
|
6
|
+
* Last Modified: 2025-09-05 14:50:12
|
|
7
|
+
* Modified By: ADC
|
|
8
|
+
* -----
|
|
9
|
+
*
|
|
10
|
+
*/
|
|
11
|
+
|
|
12
|
+
import type { EmitterDispatchFunction } from "./EventEmitterContext";
|
|
13
|
+
|
|
14
|
+
|
|
15
|
+
/**
|
|
16
|
+
* Generates values for simulating data into an HMI.
|
|
17
|
+
* Used for demonstration and development testing.
|
|
18
|
+
*/
|
|
19
|
+
export class ValueSimulator {
|
|
20
|
+
|
|
21
|
+
protected bBit1: boolean = false;
|
|
22
|
+
protected bBit2: boolean = true;
|
|
23
|
+
|
|
24
|
+
protected iRamp1: number = 0;
|
|
25
|
+
protected iRamp2: number = 0;
|
|
26
|
+
protected fRamp1: number = 0;
|
|
27
|
+
protected fRamp2: number = 0;
|
|
28
|
+
|
|
29
|
+
protected iSin1: number = 0;
|
|
30
|
+
protected iSin2: number = 0;
|
|
31
|
+
protected fSin1: number = 0;
|
|
32
|
+
protected fSin2: number = 0;
|
|
33
|
+
|
|
34
|
+
protected iRamp1DirectionUp : boolean = true;
|
|
35
|
+
protected iRamp2DirectionUp : boolean = true;
|
|
36
|
+
protected fRamp1DirectionUp : boolean = true;
|
|
37
|
+
protected fRamp2DirectionUp : boolean = true;
|
|
38
|
+
|
|
39
|
+
protected iSin1Angle : number = Math.random() * Math.PI * 2;
|
|
40
|
+
protected iSin2Angle : number = Math.random() * Math.PI * 2;
|
|
41
|
+
protected fSin1Angle : number = (Math.random() * Math.PI * 2) / 10;
|
|
42
|
+
protected fSin2Angle : number = (Math.random() * Math.PI * 2) / 10;
|
|
43
|
+
|
|
44
|
+
protected intervalId: number = 0;
|
|
45
|
+
|
|
46
|
+
protected dispatch: EmitterDispatchFunction;
|
|
47
|
+
|
|
48
|
+
/**
|
|
49
|
+
* Constructor
|
|
50
|
+
* @param dispatch EmitterDispatchFunction Dispatch function from the application's EventEmiterContext.
|
|
51
|
+
*/
|
|
52
|
+
constructor(dispatch: EmitterDispatchFunction) {
|
|
53
|
+
this.dispatch = dispatch;
|
|
54
|
+
}
|
|
55
|
+
|
|
56
|
+
/**
|
|
57
|
+
* Start simulating values on a tick
|
|
58
|
+
*/
|
|
59
|
+
start() {
|
|
60
|
+
|
|
61
|
+
if (this.intervalId === 0) {
|
|
62
|
+
this.intervalId = setInterval(
|
|
63
|
+
() => this.update(),
|
|
64
|
+
1000
|
|
65
|
+
);
|
|
66
|
+
}
|
|
67
|
+
}
|
|
68
|
+
|
|
69
|
+
|
|
70
|
+
/**
|
|
71
|
+
* Stop simulating values.
|
|
72
|
+
*/
|
|
73
|
+
stop() {
|
|
74
|
+
if (this.intervalId !== 0) {
|
|
75
|
+
clearInterval(this.intervalId);
|
|
76
|
+
this.intervalId = 0;
|
|
77
|
+
}
|
|
78
|
+
}
|
|
79
|
+
|
|
80
|
+
|
|
81
|
+
/**
|
|
82
|
+
* Update and dispatch the values.
|
|
83
|
+
*/
|
|
84
|
+
protected update() {
|
|
85
|
+
|
|
86
|
+
this.bBit1 = !this.bBit1;
|
|
87
|
+
this.bBit2 = !this.bBit2;
|
|
88
|
+
|
|
89
|
+
[this.iRamp1, this.iRamp1DirectionUp] = this.updateRamp(this.iRamp1, this.iRamp1DirectionUp, 32767);
|
|
90
|
+
[this.iRamp2, this.iRamp2DirectionUp] = this.updateRamp(this.iRamp2, this.iRamp2DirectionUp, 32767);
|
|
91
|
+
[this.fRamp1, this.fRamp1DirectionUp] = this.updateRamp(this.fRamp1, this.fRamp1DirectionUp, 3276.7);
|
|
92
|
+
[this.fRamp2, this.fRamp2DirectionUp] = this.updateRamp(this.fRamp2, this.fRamp2DirectionUp, 3276.7);
|
|
93
|
+
|
|
94
|
+
[this.iSin1, this.iSin1Angle] = this.updateSin(this.iSin1, this.iSin1Angle, Math.PI / 180, 32767);
|
|
95
|
+
[this.iSin2, this.iSin2Angle] = this.updateSin(this.iSin2, this.iSin2Angle, Math.PI / 180, 32767);
|
|
96
|
+
[this.fSin1, this.fSin1Angle] = this.updateSin(this.fSin1, this.fSin1Angle, Math.PI / 180, 3276.7);
|
|
97
|
+
[this.fSin2, this.fSin2Angle] = this.updateSin(this.fSin2, this.fSin2Angle, Math.PI / 180, 3276.7);
|
|
98
|
+
|
|
99
|
+
|
|
100
|
+
this.updateTopic("value-simulator-bBit1", this.bBit1);
|
|
101
|
+
this.updateTopic("value-simulator-bBit2", this.bBit2);
|
|
102
|
+
this.updateTopic("value-simulator-iRamp1", this.iRamp1);
|
|
103
|
+
this.updateTopic("value-simulator-iRamp2", this.iRamp2);
|
|
104
|
+
this.updateTopic("value-simulator-fRamp1", this.fRamp1);
|
|
105
|
+
this.updateTopic("value-simulator-fRamp2", this.fRamp2);
|
|
106
|
+
|
|
107
|
+
this.updateTopic("value-simulator-iSin1", this.iSin1);
|
|
108
|
+
this.updateTopic("value-simulator-iSin2", this.iSin2);
|
|
109
|
+
this.updateTopic("value-simulator-fSin1", this.fSin1);
|
|
110
|
+
this.updateTopic("value-simulator-fSin2", this.fSin2);
|
|
111
|
+
|
|
112
|
+
}
|
|
113
|
+
|
|
114
|
+
|
|
115
|
+
/**
|
|
116
|
+
* Updates the value of a ramp variable, changing its direction when limits are reached.
|
|
117
|
+
* @param {number} value The current value of the ramp variable.
|
|
118
|
+
* @param {boolean} directionUp Indicates if the ramp variable is currently increasing.
|
|
119
|
+
* @param {number} max The maximum value for the ramp.
|
|
120
|
+
* @returns {[number, boolean]} The updated value and direction.
|
|
121
|
+
*/
|
|
122
|
+
protected updateRamp(value: number, directionUp: boolean, max: number): [number, boolean] {
|
|
123
|
+
if (directionUp) {
|
|
124
|
+
value++;
|
|
125
|
+
if (value >= max) return [value, false];
|
|
126
|
+
} else {
|
|
127
|
+
value--;
|
|
128
|
+
if (value <= 0) return [value, true];
|
|
129
|
+
}
|
|
130
|
+
return [value, directionUp];
|
|
131
|
+
}
|
|
132
|
+
|
|
133
|
+
|
|
134
|
+
/**
|
|
135
|
+
* Updates a sine wave value based on the given angle and increments, then calculates the new value and angle.
|
|
136
|
+
* This method is useful for scenarios where a sine wave value needs to be progressively updated, such as in animations
|
|
137
|
+
* or simulations. The sine of the updated angle is calculated, multiplied by the maximum value to scale it, and both
|
|
138
|
+
* the new value and the updated angle are returned.
|
|
139
|
+
*
|
|
140
|
+
* @param {number} value The current value of the sine wave. This parameter is not directly used in the calculation of the new value,
|
|
141
|
+
* but it can be utilized if the method is extended or modified.
|
|
142
|
+
* @param {number} angle The current angle in radians. This is the phase of the sine wave.
|
|
143
|
+
* @param {number} increment The value by which the angle is to be incremented, in radians. This controls the progression of the wave.
|
|
144
|
+
* @param {number} max The maximum value (amplitude) of the sine wave. The calculated sine value will be scaled by this factor.
|
|
145
|
+
* @returns {[number,number]} A tuple where the first element is the new sine wave value and the second element is the updated angle.
|
|
146
|
+
*/
|
|
147
|
+
protected updateSin(value: number, angle: number, increment: number, max: number): [number, number] {
|
|
148
|
+
angle += increment;
|
|
149
|
+
value = Math.sin(angle) * max;
|
|
150
|
+
return [value, angle];
|
|
151
|
+
}
|
|
152
|
+
|
|
153
|
+
|
|
154
|
+
/**
|
|
155
|
+
* Dispatch the update for a particular topic.
|
|
156
|
+
*/
|
|
157
|
+
protected updateTopic(topic: string, value: any) {
|
|
158
|
+
|
|
159
|
+
this.dispatch({
|
|
160
|
+
topic: topic,
|
|
161
|
+
payload: value
|
|
162
|
+
});
|
|
163
|
+
|
|
164
|
+
}
|
|
165
|
+
}
|
|
166
|
+
|
|
167
167
|
export default ValueSimulator;
|
package/src/core/hoc.tsx
CHANGED
|
@@ -1,65 +1,65 @@
|
|
|
1
|
-
/*
|
|
2
|
-
* Copyright (C) 2024 Automated Design Corp. All Rights Reserved.
|
|
3
|
-
* Created Date: 2024-01-18 16:14:20
|
|
4
|
-
* -----
|
|
5
|
-
* Last Modified: 2026-01-29 09:32:17
|
|
6
|
-
* Modified By: ADC
|
|
7
|
-
* -----
|
|
8
|
-
*/
|
|
9
|
-
|
|
10
|
-
/**
|
|
11
|
-
* @fileinfo
|
|
12
|
-
* Explanation:
|
|
13
|
-
* React.ComponentType<P>: This is a generic type that can accept any React component (functional or class) with props of type P.
|
|
14
|
-
* P extends WithSubscriptionProps: Here, P is a generic type parameter that extends WithSubscriptionProps,
|
|
15
|
-
* meaning it can be any type that includes the properties of WithSubscriptionProps.
|
|
16
|
-
* Omit<P, keyof WithSubscriptionProps>: This utility type creates a new type by omitting properties from
|
|
17
|
-
* P that are also in WithSubscriptionProps. This is useful to prevent type clashes.
|
|
18
|
-
* useState<any>(): The state is typed as any since the value received from the subscription
|
|
19
|
-
* can be of any type. You may choose to make this more specific based on your application's needs.
|
|
20
|
-
*
|
|
21
|
-
*/
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
import React, { useState, useEffect, useContext } from 'react';
|
|
25
|
-
import { EventEmitterContext } from './EventEmitterContext';
|
|
26
|
-
|
|
27
|
-
/**
|
|
28
|
-
* High Order Component Subscription properties.
|
|
29
|
-
*/
|
|
30
|
-
export type HocAddSubscriptionProps = {
|
|
31
|
-
/** The topic to subscribe to. */
|
|
32
|
-
topic: string;
|
|
33
|
-
/** The name of the prop through which the subscription data is passed to the WrappedComponent. */
|
|
34
|
-
propName?: string;
|
|
35
|
-
};
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
/**
|
|
39
|
-
* Creates a higher-order component that subscribes to a specified topic and passes the data to the wrapped component.
|
|
40
|
-
*
|
|
41
|
-
* @param WrappedComponent The component to be wrapped and enhanced with subscription data.
|
|
42
|
-
* @param topic The topic to subscribe to.
|
|
43
|
-
* @param propName The name of the prop through which the subscription data is passed to the WrappedComponent.
|
|
44
|
-
* @returns A component that subscribes to the given topic and updates its specified prop with the received data.
|
|
45
|
-
*/
|
|
46
|
-
export function hocAddSubscription<P extends HocAddSubscriptionProps>(
|
|
47
|
-
WrappedComponent: React.ComponentType<P>,
|
|
48
|
-
topic: string,
|
|
49
|
-
propName: keyof P
|
|
50
|
-
) {
|
|
51
|
-
return function(props: Omit<P, keyof HocAddSubscriptionProps>) {
|
|
52
|
-
const [value, setValue] = useState<any>();
|
|
53
|
-
const { subscribe, unsubscribe } = useContext(EventEmitterContext);
|
|
54
|
-
|
|
55
|
-
useEffect(() => {
|
|
56
|
-
const unsubscribeToken = subscribe(topic, setValue);
|
|
57
|
-
return () => unsubscribe(unsubscribeToken);
|
|
58
|
-
}, [topic, subscribe, unsubscribe]);
|
|
59
|
-
|
|
60
|
-
// Use propName to pass the updated value
|
|
61
|
-
const additionalProps = { [propName]: value } as Pick<P, keyof P>;
|
|
62
|
-
|
|
63
|
-
return <WrappedComponent {...props as P} {...additionalProps} />;
|
|
64
|
-
};
|
|
65
|
-
}
|
|
1
|
+
/*
|
|
2
|
+
* Copyright (C) 2024 Automated Design Corp. All Rights Reserved.
|
|
3
|
+
* Created Date: 2024-01-18 16:14:20
|
|
4
|
+
* -----
|
|
5
|
+
* Last Modified: 2026-01-29 09:32:17
|
|
6
|
+
* Modified By: ADC
|
|
7
|
+
* -----
|
|
8
|
+
*/
|
|
9
|
+
|
|
10
|
+
/**
|
|
11
|
+
* @fileinfo
|
|
12
|
+
* Explanation:
|
|
13
|
+
* React.ComponentType<P>: This is a generic type that can accept any React component (functional or class) with props of type P.
|
|
14
|
+
* P extends WithSubscriptionProps: Here, P is a generic type parameter that extends WithSubscriptionProps,
|
|
15
|
+
* meaning it can be any type that includes the properties of WithSubscriptionProps.
|
|
16
|
+
* Omit<P, keyof WithSubscriptionProps>: This utility type creates a new type by omitting properties from
|
|
17
|
+
* P that are also in WithSubscriptionProps. This is useful to prevent type clashes.
|
|
18
|
+
* useState<any>(): The state is typed as any since the value received from the subscription
|
|
19
|
+
* can be of any type. You may choose to make this more specific based on your application's needs.
|
|
20
|
+
*
|
|
21
|
+
*/
|
|
22
|
+
|
|
23
|
+
|
|
24
|
+
import React, { useState, useEffect, useContext } from 'react';
|
|
25
|
+
import { EventEmitterContext } from './EventEmitterContext';
|
|
26
|
+
|
|
27
|
+
/**
|
|
28
|
+
* High Order Component Subscription properties.
|
|
29
|
+
*/
|
|
30
|
+
export type HocAddSubscriptionProps = {
|
|
31
|
+
/** The topic to subscribe to. */
|
|
32
|
+
topic: string;
|
|
33
|
+
/** The name of the prop through which the subscription data is passed to the WrappedComponent. */
|
|
34
|
+
propName?: string;
|
|
35
|
+
};
|
|
36
|
+
|
|
37
|
+
|
|
38
|
+
/**
|
|
39
|
+
* Creates a higher-order component that subscribes to a specified topic and passes the data to the wrapped component.
|
|
40
|
+
*
|
|
41
|
+
* @param WrappedComponent The component to be wrapped and enhanced with subscription data.
|
|
42
|
+
* @param topic The topic to subscribe to.
|
|
43
|
+
* @param propName The name of the prop through which the subscription data is passed to the WrappedComponent.
|
|
44
|
+
* @returns A component that subscribes to the given topic and updates its specified prop with the received data.
|
|
45
|
+
*/
|
|
46
|
+
export function hocAddSubscription<P extends HocAddSubscriptionProps>(
|
|
47
|
+
WrappedComponent: React.ComponentType<P>,
|
|
48
|
+
topic: string,
|
|
49
|
+
propName: keyof P
|
|
50
|
+
) {
|
|
51
|
+
return function(props: Omit<P, keyof HocAddSubscriptionProps>) {
|
|
52
|
+
const [value, setValue] = useState<any>();
|
|
53
|
+
const { subscribe, unsubscribe } = useContext(EventEmitterContext);
|
|
54
|
+
|
|
55
|
+
useEffect(() => {
|
|
56
|
+
const unsubscribeToken = subscribe(topic, setValue);
|
|
57
|
+
return () => unsubscribe(unsubscribeToken);
|
|
58
|
+
}, [topic, subscribe, unsubscribe]);
|
|
59
|
+
|
|
60
|
+
// Use propName to pass the updated value
|
|
61
|
+
const additionalProps = { [propName]: value } as Pick<P, keyof P>;
|
|
62
|
+
|
|
63
|
+
return <WrappedComponent {...props as P} {...additionalProps} />;
|
|
64
|
+
};
|
|
65
|
+
}
|