@adcops/autocore-react 3.3.9 → 3.3.14

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (223) hide show
  1. package/LICENSE +58 -58
  2. package/additional-docs/AutoCoreTagContext.md +441 -441
  3. package/additional-docs/ButtonApiSpecs.md +48 -48
  4. package/additional-docs/GlobalEventEmitter.md +243 -243
  5. package/additional-docs/general_recommendations.md +22 -22
  6. package/additional-docs/react_performance_notes.md +94 -94
  7. package/dist/assets/svg/blockly_logo.svg +82 -82
  8. package/dist/assets/svg/distance.svg +40 -40
  9. package/dist/assets/svg/python_logo.svg +246 -246
  10. package/dist/assets/svg/rotation_ccw.svg +50 -50
  11. package/dist/assets/svg/rotation_ccw_a.svg +57 -57
  12. package/dist/assets/svg/rotation_ccw_b.svg +57 -57
  13. package/dist/assets/svg/rotation_ccw_c.svg +57 -57
  14. package/dist/assets/svg/rotation_cw.svg +49 -49
  15. package/dist/assets/svg/rotation_cw_a.svg +30 -30
  16. package/dist/assets/svg/rotation_cw_b.svg +30 -30
  17. package/dist/assets/svg/rotation_cw_c.svg +30 -30
  18. package/dist/assets/svg/speed.svg +39 -39
  19. package/dist/components/BlocklyEditor.css +93 -93
  20. package/dist/components/Indicator.js +1 -1
  21. package/dist/components/IndicatorRect.d.ts.map +1 -1
  22. package/dist/components/IndicatorRect.js +1 -1
  23. package/dist/components/JogPanel.css +41 -41
  24. package/dist/components/ProgressBarWithValue.css +27 -27
  25. package/dist/components/TextInput.js +1 -1
  26. package/dist/components/ToggleGroup.js +1 -1
  27. package/dist/components/ValueIndicator.css +29 -31
  28. package/dist/components/ValueInput.js +1 -1
  29. package/dist/components/osk.css +123 -123
  30. package/dist/core/AutoCoreTagContext.d.ts.map +1 -1
  31. package/dist/core/AutoCoreTagContext.js +1 -1
  32. package/dist/hub/HubBase.d.ts +3 -3
  33. package/dist/hub/HubBase.d.ts.map +1 -1
  34. package/dist/hub/HubBase.js +1 -1
  35. package/dist/themes/adc-dark/blue/theme.css +3 -0
  36. package/dist/themes/adc-dark/blue/theme.css.map +1 -1
  37. package/package.json +104 -104
  38. package/readme.md +343 -343
  39. package/src/assets/BlocklyLogo.tsx +27 -27
  40. package/src/assets/Distance.tsx +18 -18
  41. package/src/assets/JogLong.tsx +13 -13
  42. package/src/assets/JogMedium.tsx +13 -13
  43. package/src/assets/JogShort.tsx +13 -13
  44. package/src/assets/PythonLogo.tsx +83 -83
  45. package/src/assets/Rotation3D.tsx +13 -13
  46. package/src/assets/RotationCcw.tsx +33 -33
  47. package/src/assets/RotationCcwA.tsx +45 -45
  48. package/src/assets/RotationCcwB.tsx +45 -45
  49. package/src/assets/RotationCcwC.tsx +45 -45
  50. package/src/assets/RotationCw.tsx +31 -31
  51. package/src/assets/RotationCwA.tsx +42 -42
  52. package/src/assets/RotationCwB.tsx +42 -42
  53. package/src/assets/RotationCwC.tsx +42 -42
  54. package/src/assets/Run.tsx +13 -13
  55. package/src/assets/Speed.tsx +18 -18
  56. package/src/assets/SpeedFast.tsx +13 -13
  57. package/src/assets/SpeedMedium.tsx +13 -13
  58. package/src/assets/SpeedNone.tsx +13 -13
  59. package/src/assets/SpeedSlow.tsx +13 -13
  60. package/src/assets/Walk.tsx +13 -13
  61. package/src/assets/index.ts +22 -22
  62. package/src/assets/svg/blockly_logo.svg +82 -82
  63. package/src/assets/svg/distance.svg +40 -40
  64. package/src/assets/svg/python_logo.svg +246 -246
  65. package/src/assets/svg/rotation_ccw.svg +50 -50
  66. package/src/assets/svg/rotation_ccw_a.svg +57 -57
  67. package/src/assets/svg/rotation_ccw_b.svg +57 -57
  68. package/src/assets/svg/rotation_ccw_c.svg +57 -57
  69. package/src/assets/svg/rotation_cw.svg +49 -49
  70. package/src/assets/svg/rotation_cw_a.svg +30 -30
  71. package/src/assets/svg/rotation_cw_b.svg +30 -30
  72. package/src/assets/svg/rotation_cw_c.svg +30 -30
  73. package/src/assets/svg/speed.svg +39 -39
  74. package/src/components/AutoCoreDevPanel.tsx +414 -414
  75. package/src/components/BlocklyEditor.css +93 -93
  76. package/src/components/BlocklyEditor.tsx +609 -609
  77. package/src/components/CodeEditor.tsx +155 -155
  78. package/src/components/FileList.tsx +390 -390
  79. package/src/components/FileSelect.tsx +128 -128
  80. package/src/components/FitText.tsx +35 -35
  81. package/src/components/Indicator.tsx +188 -188
  82. package/src/components/IndicatorButton.tsx +214 -214
  83. package/src/components/IndicatorRect.tsx +170 -172
  84. package/src/components/JogPanel.css +41 -41
  85. package/src/components/JogPanel.tsx +461 -461
  86. package/src/components/Lamp.tsx +243 -243
  87. package/src/components/Osk.tsx +192 -192
  88. package/src/components/OskDialog.tsx +164 -164
  89. package/src/components/ProgressBarWithValue.css +27 -27
  90. package/src/components/ProgressBarWithValue.tsx +48 -48
  91. package/src/components/TextInput.tsx +195 -195
  92. package/src/components/ToggleGroup.tsx +322 -322
  93. package/src/components/ValueDisplay.tsx +236 -236
  94. package/src/components/ValueIndicator.css +29 -31
  95. package/src/components/ValueIndicator.tsx +135 -135
  96. package/src/components/ValueInput.tsx +368 -368
  97. package/src/components/osk.css +123 -123
  98. package/src/core/ActionMode.ts +19 -19
  99. package/src/core/AutoCoreTagContext.tsx +625 -614
  100. package/src/core/AutoCoreTagTypes.ts +334 -334
  101. package/src/core/CoreStreamTypes.ts +512 -512
  102. package/src/core/EventEmitterContext.tsx +434 -434
  103. package/src/core/IndicatorButtonState.ts +34 -34
  104. package/src/core/IndicatorColor.ts +35 -35
  105. package/src/core/MaskPatterns.ts +87 -87
  106. package/src/core/NumerableTypes.ts +80 -80
  107. package/src/core/PositionContext.ts +59 -59
  108. package/src/core/UniqueId.ts +41 -41
  109. package/src/core/ValueSimulator.ts +166 -166
  110. package/src/core/hoc.tsx +65 -65
  111. package/src/hooks/adsHooks.tsx +287 -287
  112. package/src/hooks/commandHooks.tsx +300 -300
  113. package/src/hooks/index.ts +12 -12
  114. package/src/hooks/useAutoCoreTag.ts +103 -103
  115. package/src/hooks/useScaledValue.tsx +99 -99
  116. package/src/hub/CommandMessage.ts +89 -89
  117. package/src/hub/DebugPanel.ts +307 -307
  118. package/src/hub/HubBase.ts +249 -236
  119. package/src/hub/HubSimulate.ts +124 -124
  120. package/src/hub/HubTauri.ts +140 -140
  121. package/src/hub/HubWebSocket.ts +250 -250
  122. package/src/hub/debug.ts +211 -211
  123. package/src/hub/index.ts +81 -81
  124. package/src/themes/adc-dark/_extensions.scss +166 -166
  125. package/src/themes/adc-dark/_variables.scss +913 -913
  126. package/src/themes/adc-dark/blue/_fonts.scss +23 -23
  127. package/src/themes/adc-dark/blue/adc_theme.scss +31 -31
  128. package/src/themes/adc-dark/blue/theme.scss +14 -14
  129. package/src/themes/theme-base/_colors.scss +17 -17
  130. package/src/themes/theme-base/_common.scss +78 -74
  131. package/src/themes/theme-base/_components.scss +111 -111
  132. package/src/themes/theme-base/_mixins.scss +243 -243
  133. package/src/themes/theme-base/components/button/_button.scss +644 -644
  134. package/src/themes/theme-base/components/button/_speeddial.scss +91 -91
  135. package/src/themes/theme-base/components/button/_splitbutton.scss +358 -358
  136. package/src/themes/theme-base/components/data/_carousel.scss +39 -39
  137. package/src/themes/theme-base/components/data/_datascroller.scss +47 -47
  138. package/src/themes/theme-base/components/data/_datatable.scss +388 -388
  139. package/src/themes/theme-base/components/data/_dataview.scss +47 -47
  140. package/src/themes/theme-base/components/data/_filter.scss +137 -137
  141. package/src/themes/theme-base/components/data/_orderlist.scss +86 -86
  142. package/src/themes/theme-base/components/data/_organizationchart.scss +50 -50
  143. package/src/themes/theme-base/components/data/_paginator.scss +91 -91
  144. package/src/themes/theme-base/components/data/_picklist.scss +73 -73
  145. package/src/themes/theme-base/components/data/_timeline.scss +38 -38
  146. package/src/themes/theme-base/components/data/_tree.scss +184 -184
  147. package/src/themes/theme-base/components/data/_treetable.scss +431 -431
  148. package/src/themes/theme-base/components/file/_fileupload.scss +41 -41
  149. package/src/themes/theme-base/components/input/_autocomplete.scss +94 -94
  150. package/src/themes/theme-base/components/input/_calendar.scss +251 -251
  151. package/src/themes/theme-base/components/input/_cascadeselect.scss +107 -107
  152. package/src/themes/theme-base/components/input/_checkbox.scss +181 -181
  153. package/src/themes/theme-base/components/input/_chips.scss +102 -102
  154. package/src/themes/theme-base/components/input/_colorpicker.scss +17 -17
  155. package/src/themes/theme-base/components/input/_dropdown.scss +252 -252
  156. package/src/themes/theme-base/components/input/_editor.scss +122 -122
  157. package/src/themes/theme-base/components/input/_iconfield.scss +9 -9
  158. package/src/themes/theme-base/components/input/_inputgroup.scss +74 -74
  159. package/src/themes/theme-base/components/input/_inputicon.scss +14 -14
  160. package/src/themes/theme-base/components/input/_inputnumber.scss +4 -4
  161. package/src/themes/theme-base/components/input/_inputotp.scss +10 -10
  162. package/src/themes/theme-base/components/input/_inputswitch.scss +99 -99
  163. package/src/themes/theme-base/components/input/_inputtext.scss +101 -101
  164. package/src/themes/theme-base/components/input/_listbox.scss +138 -138
  165. package/src/themes/theme-base/components/input/_mention.scss +30 -30
  166. package/src/themes/theme-base/components/input/_multiselect.scss +278 -278
  167. package/src/themes/theme-base/components/input/_password.scss +32 -32
  168. package/src/themes/theme-base/components/input/_radiobutton.scss +169 -169
  169. package/src/themes/theme-base/components/input/_rating.scss +80 -80
  170. package/src/themes/theme-base/components/input/_selectbutton.scss +49 -49
  171. package/src/themes/theme-base/components/input/_slider.scss +49 -49
  172. package/src/themes/theme-base/components/input/_togglebutton.scss +99 -99
  173. package/src/themes/theme-base/components/input/_treeselect.scss +151 -151
  174. package/src/themes/theme-base/components/input/_tristatecheckbox.scss +46 -46
  175. package/src/themes/theme-base/components/menu/_breadcrumb.scss +42 -42
  176. package/src/themes/theme-base/components/menu/_contextmenu.scss +39 -39
  177. package/src/themes/theme-base/components/menu/_dock.scss +109 -109
  178. package/src/themes/theme-base/components/menu/_megamenu.scss +141 -141
  179. package/src/themes/theme-base/components/menu/_menu.scss +33 -33
  180. package/src/themes/theme-base/components/menu/_menubar.scss +216 -216
  181. package/src/themes/theme-base/components/menu/_panelmenu.scss +153 -153
  182. package/src/themes/theme-base/components/menu/_slidemenu.scss +60 -60
  183. package/src/themes/theme-base/components/menu/_steps.scss +57 -57
  184. package/src/themes/theme-base/components/menu/_tabmenu.scss +50 -50
  185. package/src/themes/theme-base/components/menu/_tieredmenu.scss +43 -43
  186. package/src/themes/theme-base/components/messages/_inlinemessage.scss +69 -69
  187. package/src/themes/theme-base/components/messages/_message.scss +107 -107
  188. package/src/themes/theme-base/components/messages/_toast.scss +100 -100
  189. package/src/themes/theme-base/components/misc/_avatar.scss +33 -33
  190. package/src/themes/theme-base/components/misc/_badge.scss +76 -76
  191. package/src/themes/theme-base/components/misc/_chip.scss +38 -38
  192. package/src/themes/theme-base/components/misc/_inplace.scss +17 -17
  193. package/src/themes/theme-base/components/misc/_metergroup.scss +80 -80
  194. package/src/themes/theme-base/components/misc/_progressbar.scss +17 -17
  195. package/src/themes/theme-base/components/misc/_scrolltop.scss +24 -24
  196. package/src/themes/theme-base/components/misc/_skeleton.scss +7 -7
  197. package/src/themes/theme-base/components/misc/_tag.scss +39 -39
  198. package/src/themes/theme-base/components/misc/_terminal.scss +12 -12
  199. package/src/themes/theme-base/components/multimedia/_galleria.scss +153 -153
  200. package/src/themes/theme-base/components/multimedia/_image.scss +53 -53
  201. package/src/themes/theme-base/components/overlay/_confirmpopup.scss +72 -72
  202. package/src/themes/theme-base/components/overlay/_dialog.scss +78 -78
  203. package/src/themes/theme-base/components/overlay/_overlaypanel.scss +64 -64
  204. package/src/themes/theme-base/components/overlay/_sidebar.scss +23 -23
  205. package/src/themes/theme-base/components/overlay/_tooltip.scss +33 -33
  206. package/src/themes/theme-base/components/panel/_accordion.scss +118 -118
  207. package/src/themes/theme-base/components/panel/_card.scss +30 -30
  208. package/src/themes/theme-base/components/panel/_divider.scss +30 -30
  209. package/src/themes/theme-base/components/panel/_fieldset.scss +47 -47
  210. package/src/themes/theme-base/components/panel/_panel.scss +47 -47
  211. package/src/themes/theme-base/components/panel/_scrollpanel.scss +10 -10
  212. package/src/themes/theme-base/components/panel/_splitter.scss +23 -23
  213. package/src/themes/theme-base/components/panel/_stepper.scss +136 -136
  214. package/src/themes/theme-base/components/panel/_tabview.scss +147 -147
  215. package/src/themes/theme-base/components/panel/_toolbar.scss +11 -11
  216. package/terser.config.cjs +25 -25
  217. package/todo.md +18 -18
  218. package/tools/build-themes.cjs +65 -65
  219. package/tools/copy-distribution-files.cjs +77 -77
  220. package/tools/minify.cjs +55 -55
  221. package/tsconfig.json +48 -48
  222. package/typedoc.json +12 -12
  223. package/.claude/settings.local.json +0 -7
@@ -1,251 +1,251 @@
1
- /*
2
- * Copyright (C) 2024 Automated Design Corp.. All Rights Reserved.
3
- * Created Date: 2024-04-17 09:13:07
4
- * -----
5
- * Last Modified: 2026-01-29 09:34:31
6
- * Modified By: ADC
7
- * -----
8
- *
9
- */
10
-
11
- /**
12
- * @module hub/HubWebSocket
13
- *
14
- * Implementation of `HubBase` using standard WebSockets.
15
- *
16
- * ## Functionality
17
- *
18
- * - **Transport**: Connects to `ws://host:port/ws/` (or `wss://`).
19
- * - **Request/Response**: Correlates requests to responses using `transaction_id`.
20
- * - **Broadcasts**: Handles unsolicited messages (subscriptions) and routes them via `HubBase.publish`.
21
- * - **Binary Data**: Handles `FILE_DOWNLOAD` events by decoding Base64 payloads into Blobs.
22
- *
23
- * ## Protocol
24
- *
25
- * Messages are JSON-serialized `CommandMessage` objects.
26
- * - **Requests**: Client sends `message_type` (Read/Write/etc) + `transaction_id`.
27
- * - **Responses**: Server replies with same `transaction_id` + `success`/`data`.
28
- * - **Broadcasts**: Server sends `message_type: Broadcast` + `topic` (FQDN) + `data`.
29
- */
30
-
31
- import { HubBase } from './HubBase';
32
- import { MessageType, type CommandMessage } from "./CommandMessage";
33
- import { getDebugPanel } from './DebugPanel';
34
-
35
- /**
36
- * Internal tracking record for pending requests.
37
- * Allows the `invoke` promise to be resolved/rejected when the response arrives.
38
- */
39
- interface RequestRecord {
40
- resolve: (value?: any) => void;
41
- reject: (reason?: any) => void;
42
- }
43
-
44
-
45
- /**
46
- * Converts a Base64 encoded string into a Blob object.
47
- * Used for file downloads.
48
- *
49
- * @param {string} b64Data The base64 encoded string.
50
- * @param {string} [contentType='application/octet-stream'] The MIME type.
51
- * @param {number} [sliceSize=512] Chunk size for processing.
52
- * @returns {Blob} The decoded binary blob.
53
- */
54
- function b64toBlob(
55
- b64Data: string,
56
- contentType: string = "application/octet-stream",
57
- sliceSize: number = 512
58
- ): Blob {
59
- const byteCharacters = atob(b64Data);
60
- const buffers: ArrayBuffer[] = [];
61
-
62
- for (let offset = 0; offset < byteCharacters.length; offset += sliceSize) {
63
- const slice = byteCharacters.slice(offset, offset + sliceSize);
64
-
65
- const byteNumbers = new Array<number>(slice.length);
66
- for (let i = 0; i < slice.length; i++) byteNumbers[i] = slice.charCodeAt(i);
67
-
68
- const uint8 = new Uint8Array(byteNumbers);
69
- buffers.push(uint8.buffer as ArrayBuffer);
70
- }
71
-
72
- return new Blob(buffers, { type: contentType });
73
- }
74
-
75
-
76
-
77
- /**
78
- * Triggers a browser download for a Blob object.
79
- *
80
- * @param {Blob} blob The binary data.
81
- * @param {string} filename The suggested filename.
82
- */
83
- function downloadBlob(blob: Blob, filename: string): void {
84
- const url = window.URL.createObjectURL(blob);
85
- const a = document.createElement('a');
86
- a.href = url;
87
- a.download = filename;
88
- document.body.appendChild(a);
89
- a.click();
90
- document.body.removeChild(a);
91
- window.URL.revokeObjectURL(url);
92
- }
93
-
94
-
95
- /**
96
- * WebSocket implementation of the Hub communication layer.
97
- */
98
- export class HubWebSocket extends HubBase {
99
- private socket: WebSocket;
100
- private requestId = 0;
101
-
102
- /**
103
- * Map of pending Transaction ID -> Promise Resolvers.
104
- * Used to match asynchronous WebSocket responses to their original requests.
105
- */
106
- private pendingRequests = new Map<number, RequestRecord>();
107
-
108
- /**
109
- * Initializes the WebSocket connection immediately.
110
- */
111
- constructor() {
112
- super();
113
- console.log("[HubWebSocket] Constructor called");
114
- getDebugPanel().hubCreated();
115
-
116
- const host = window.location.hostname;
117
- const port = window.location.port;
118
-
119
- const proto = window.location.protocol === 'https:' ? 'wss://' : 'ws://';
120
- const wsUrl = `${proto}${host}${port ? ':' + port : ''}/ws/`;
121
-
122
- this.socket = new WebSocket(wsUrl);
123
- let self = this;
124
-
125
- // --- Connection Handlers ---
126
-
127
- this.socket.onopen = function () {
128
- console.log("WebSocket connection established.");
129
- getDebugPanel().wsOpened(wsUrl);
130
- // Notify app that we are online
131
- self.publish("HUB/connected", true);
132
- self.setIsConnected(true);
133
- };
134
-
135
- // --- Message Handler ---
136
-
137
- this.socket.onmessage = (event) => {
138
- const data: CommandMessage = JSON.parse(event.data);
139
- getDebugPanel().messageReceived(
140
- MessageType[data.message_type] || String(data.message_type),
141
- data.topic,
142
- data.transaction_id
143
- );
144
-
145
- console.log(`HUB MSG RX: ${JSON.stringify(data)}`);
146
-
147
- // Check if this message is a response to a pending request (has ID)
148
- if (data.transaction_id && this.pendingRequests.has(data.transaction_id)) {
149
- const { resolve, reject } = this.pendingRequests.get(data.transaction_id)!;
150
-
151
- // SPECIAL CASE: File Download Response
152
- if (data.topic === "FILE_DOWNLOAD"
153
- && data.data["file_name"] !== undefined && data.data["file_name"] !== null
154
- && data.data["file_name"].length > 0
155
- ) {
156
- let tokens = data.data["file_name"].split("/");
157
- const filename = tokens[tokens.length - 1];
158
-
159
- if (data.success) {
160
- // Decode and trigger download
161
- const blob = b64toBlob(data.data);
162
- downloadBlob(blob, filename);
163
-
164
- // Clean up response data to avoid passing giant string to app
165
- data.data = filename;
166
- resolve(data);
167
- } else {
168
- reject(new Error(data.error_message));
169
- }
170
- }
171
- // STANDARD CASE: Normal Command Response
172
- else {
173
- if (!data.success) {
174
- reject(new Error(data.error_message));
175
- } else {
176
- // Success: resolve with the full message
177
- resolve(data);
178
- }
179
- }
180
- // Cleanup request record
181
- this.pendingRequests.delete(data.transaction_id);
182
- } else {
183
- // No transaction ID means it's an unsolicited broadcast (subscription update)
184
- console.log(`HUB BROADCAST: ${JSON.stringify(data)}`);
185
- this.handleUnsolicitedMessage(data);
186
- }
187
- };
188
-
189
- this.socket.onerror = (error: Event) => {
190
- console.error('WebSocket error:', error);
191
- getDebugPanel().wsError(String(error));
192
- };
193
-
194
- this.socket.onclose = (event: CloseEvent) => {
195
- self.setIsConnected(false);
196
- console.log('WebSocket connection closed.');
197
- getDebugPanel().wsClosed(event.code, event.reason || 'No reason');
198
- };
199
- }
200
-
201
-
202
- /**
203
- * Sends a command to the server via WebSocket.
204
- *
205
- * Wraps the operation in a Promise that resolves when the server replies
206
- * with a matching `transaction_id`.
207
- */
208
- invoke = (topic: string, messageType: MessageType, payload?: object): Promise<CommandMessage> => {
209
-
210
- return new Promise((resolve, reject) => {
211
- const id = ++this.requestId; // Generate unique ID
212
- this.pendingRequests.set(id, { resolve, reject });
213
-
214
- const data = payload ? payload : {};
215
-
216
- const cm: CommandMessage = {
217
- transaction_id: id,
218
- topic: topic,
219
- data: data,
220
- timecode: Date.now(),
221
- message_type: messageType,
222
- success: false,
223
- error_message: ''
224
- };
225
-
226
- getDebugPanel().messageSent(MessageType[messageType], topic, id);
227
- this.socket.send(JSON.stringify(cm));
228
- });
229
- }
230
-
231
- /**
232
- * Processes messages that are not responses to a specific request.
233
- * Usually these are subscription updates (Broadcasts).
234
- */
235
- handleUnsolicitedMessage = (msg: CommandMessage) => {
236
- if (msg.message_type == MessageType.Broadcast && msg.topic.length > 1) {
237
- console.log(`HUB PUBLISHING: ${msg.topic} : ${JSON.stringify(msg.data)}`);
238
-
239
- // Pass to HubBase to map the FQDN topic to a local tagName and dispatch
240
- this.publish(msg.topic, msg.data);
241
- }
242
- }
243
-
244
- disconnect = (): void => {
245
- this.socket.close();
246
- }
247
-
248
- protected emit = (eventName: string, payload?: object): void => {
249
- this.socket.send(JSON.stringify({ eventName, payload }));
250
- }
1
+ /*
2
+ * Copyright (C) 2024 Automated Design Corp.. All Rights Reserved.
3
+ * Created Date: 2024-04-17 09:13:07
4
+ * -----
5
+ * Last Modified: 2026-01-29 09:34:31
6
+ * Modified By: ADC
7
+ * -----
8
+ *
9
+ */
10
+
11
+ /**
12
+ * @module hub/HubWebSocket
13
+ *
14
+ * Implementation of `HubBase` using standard WebSockets.
15
+ *
16
+ * ## Functionality
17
+ *
18
+ * - **Transport**: Connects to `ws://host:port/ws/` (or `wss://`).
19
+ * - **Request/Response**: Correlates requests to responses using `transaction_id`.
20
+ * - **Broadcasts**: Handles unsolicited messages (subscriptions) and routes them via `HubBase.publish`.
21
+ * - **Binary Data**: Handles `FILE_DOWNLOAD` events by decoding Base64 payloads into Blobs.
22
+ *
23
+ * ## Protocol
24
+ *
25
+ * Messages are JSON-serialized `CommandMessage` objects.
26
+ * - **Requests**: Client sends `message_type` (Read/Write/etc) + `transaction_id`.
27
+ * - **Responses**: Server replies with same `transaction_id` + `success`/`data`.
28
+ * - **Broadcasts**: Server sends `message_type: Broadcast` + `topic` (FQDN) + `data`.
29
+ */
30
+
31
+ import { HubBase } from './HubBase';
32
+ import { MessageType, type CommandMessage } from "./CommandMessage";
33
+ import { getDebugPanel } from './DebugPanel';
34
+
35
+ /**
36
+ * Internal tracking record for pending requests.
37
+ * Allows the `invoke` promise to be resolved/rejected when the response arrives.
38
+ */
39
+ interface RequestRecord {
40
+ resolve: (value?: any) => void;
41
+ reject: (reason?: any) => void;
42
+ }
43
+
44
+
45
+ /**
46
+ * Converts a Base64 encoded string into a Blob object.
47
+ * Used for file downloads.
48
+ *
49
+ * @param {string} b64Data The base64 encoded string.
50
+ * @param {string} [contentType='application/octet-stream'] The MIME type.
51
+ * @param {number} [sliceSize=512] Chunk size for processing.
52
+ * @returns {Blob} The decoded binary blob.
53
+ */
54
+ function b64toBlob(
55
+ b64Data: string,
56
+ contentType: string = "application/octet-stream",
57
+ sliceSize: number = 512
58
+ ): Blob {
59
+ const byteCharacters = atob(b64Data);
60
+ const buffers: ArrayBuffer[] = [];
61
+
62
+ for (let offset = 0; offset < byteCharacters.length; offset += sliceSize) {
63
+ const slice = byteCharacters.slice(offset, offset + sliceSize);
64
+
65
+ const byteNumbers = new Array<number>(slice.length);
66
+ for (let i = 0; i < slice.length; i++) byteNumbers[i] = slice.charCodeAt(i);
67
+
68
+ const uint8 = new Uint8Array(byteNumbers);
69
+ buffers.push(uint8.buffer as ArrayBuffer);
70
+ }
71
+
72
+ return new Blob(buffers, { type: contentType });
73
+ }
74
+
75
+
76
+
77
+ /**
78
+ * Triggers a browser download for a Blob object.
79
+ *
80
+ * @param {Blob} blob The binary data.
81
+ * @param {string} filename The suggested filename.
82
+ */
83
+ function downloadBlob(blob: Blob, filename: string): void {
84
+ const url = window.URL.createObjectURL(blob);
85
+ const a = document.createElement('a');
86
+ a.href = url;
87
+ a.download = filename;
88
+ document.body.appendChild(a);
89
+ a.click();
90
+ document.body.removeChild(a);
91
+ window.URL.revokeObjectURL(url);
92
+ }
93
+
94
+
95
+ /**
96
+ * WebSocket implementation of the Hub communication layer.
97
+ */
98
+ export class HubWebSocket extends HubBase {
99
+ private socket: WebSocket;
100
+ private requestId = 0;
101
+
102
+ /**
103
+ * Map of pending Transaction ID -> Promise Resolvers.
104
+ * Used to match asynchronous WebSocket responses to their original requests.
105
+ */
106
+ private pendingRequests = new Map<number, RequestRecord>();
107
+
108
+ /**
109
+ * Initializes the WebSocket connection immediately.
110
+ */
111
+ constructor() {
112
+ super();
113
+ console.log("[HubWebSocket] Constructor called");
114
+ getDebugPanel().hubCreated();
115
+
116
+ const host = window.location.hostname;
117
+ const port = window.location.port;
118
+
119
+ const proto = window.location.protocol === 'https:' ? 'wss://' : 'ws://';
120
+ const wsUrl = `${proto}${host}${port ? ':' + port : ''}/ws/`;
121
+
122
+ this.socket = new WebSocket(wsUrl);
123
+ let self = this;
124
+
125
+ // --- Connection Handlers ---
126
+
127
+ this.socket.onopen = function () {
128
+ console.log("WebSocket connection established.");
129
+ getDebugPanel().wsOpened(wsUrl);
130
+ // Notify app that we are online
131
+ self.publish("HUB/connected", true);
132
+ self.setIsConnected(true);
133
+ };
134
+
135
+ // --- Message Handler ---
136
+
137
+ this.socket.onmessage = (event) => {
138
+ const data: CommandMessage = JSON.parse(event.data);
139
+ getDebugPanel().messageReceived(
140
+ MessageType[data.message_type] || String(data.message_type),
141
+ data.topic,
142
+ data.transaction_id
143
+ );
144
+
145
+ console.log(`HUB MSG RX: ${JSON.stringify(data)}`);
146
+
147
+ // Check if this message is a response to a pending request (has ID)
148
+ if (data.transaction_id && this.pendingRequests.has(data.transaction_id)) {
149
+ const { resolve, reject } = this.pendingRequests.get(data.transaction_id)!;
150
+
151
+ // SPECIAL CASE: File Download Response
152
+ if (data.topic === "FILE_DOWNLOAD"
153
+ && data.data["file_name"] !== undefined && data.data["file_name"] !== null
154
+ && data.data["file_name"].length > 0
155
+ ) {
156
+ let tokens = data.data["file_name"].split("/");
157
+ const filename = tokens[tokens.length - 1];
158
+
159
+ if (data.success) {
160
+ // Decode and trigger download
161
+ const blob = b64toBlob(data.data);
162
+ downloadBlob(blob, filename);
163
+
164
+ // Clean up response data to avoid passing giant string to app
165
+ data.data = filename;
166
+ resolve(data);
167
+ } else {
168
+ reject(new Error(data.error_message));
169
+ }
170
+ }
171
+ // STANDARD CASE: Normal Command Response
172
+ else {
173
+ if (!data.success) {
174
+ reject(new Error(data.error_message));
175
+ } else {
176
+ // Success: resolve with the full message
177
+ resolve(data);
178
+ }
179
+ }
180
+ // Cleanup request record
181
+ this.pendingRequests.delete(data.transaction_id);
182
+ } else {
183
+ // No transaction ID means it's an unsolicited broadcast (subscription update)
184
+ console.log(`HUB BROADCAST: ${JSON.stringify(data)}`);
185
+ this.handleUnsolicitedMessage(data);
186
+ }
187
+ };
188
+
189
+ this.socket.onerror = (error: Event) => {
190
+ console.error('WebSocket error:', error);
191
+ getDebugPanel().wsError(String(error));
192
+ };
193
+
194
+ this.socket.onclose = (event: CloseEvent) => {
195
+ self.setIsConnected(false);
196
+ console.log('WebSocket connection closed.');
197
+ getDebugPanel().wsClosed(event.code, event.reason || 'No reason');
198
+ };
199
+ }
200
+
201
+
202
+ /**
203
+ * Sends a command to the server via WebSocket.
204
+ *
205
+ * Wraps the operation in a Promise that resolves when the server replies
206
+ * with a matching `transaction_id`.
207
+ */
208
+ invoke = (topic: string, messageType: MessageType, payload?: object): Promise<CommandMessage> => {
209
+
210
+ return new Promise((resolve, reject) => {
211
+ const id = ++this.requestId; // Generate unique ID
212
+ this.pendingRequests.set(id, { resolve, reject });
213
+
214
+ const data = payload ? payload : {};
215
+
216
+ const cm: CommandMessage = {
217
+ transaction_id: id,
218
+ topic: topic,
219
+ data: data,
220
+ timecode: Date.now(),
221
+ message_type: messageType,
222
+ success: false,
223
+ error_message: ''
224
+ };
225
+
226
+ getDebugPanel().messageSent(MessageType[messageType], topic, id);
227
+ this.socket.send(JSON.stringify(cm));
228
+ });
229
+ }
230
+
231
+ /**
232
+ * Processes messages that are not responses to a specific request.
233
+ * Usually these are subscription updates (Broadcasts).
234
+ */
235
+ handleUnsolicitedMessage = (msg: CommandMessage) => {
236
+ if (msg.message_type == MessageType.Broadcast && msg.topic.length > 1) {
237
+ console.log(`HUB PUBLISHING: ${msg.topic} : ${JSON.stringify(msg.data)}`);
238
+
239
+ // Pass to HubBase to map the FQDN topic to a local tagName and dispatch
240
+ this.publish(msg.topic, msg.data);
241
+ }
242
+ }
243
+
244
+ disconnect = (): void => {
245
+ this.socket.close();
246
+ }
247
+
248
+ protected emit = (eventName: string, payload?: object): void => {
249
+ this.socket.send(JSON.stringify({ eventName, payload }));
250
+ }
251
251
  }