@hkdigital/lib-sveltekit 0.2.7 → 0.2.8

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 (242) hide show
  1. package/README.md +135 -135
  2. package/dist/assets/autospuiten/car-paint-picker.js +41 -41
  3. package/dist/assets/autospuiten/labels.js +7 -7
  4. package/dist/classes/cache/IndexedDbCache.js +1407 -1407
  5. package/dist/classes/cache/MemoryResponseCache.js +138 -138
  6. package/dist/classes/cache/index.js +5 -5
  7. package/dist/classes/cache/typedef.js +41 -41
  8. package/dist/classes/data/IterableTree.js +243 -243
  9. package/dist/classes/data/Selector.js +190 -190
  10. package/dist/classes/data/index.js +2 -2
  11. package/dist/classes/events/EventEmitter.js +275 -275
  12. package/dist/classes/events/index.js +2 -2
  13. package/dist/classes/index.js +4 -4
  14. package/dist/classes/logging/Logger.js +158 -158
  15. package/dist/classes/logging/constants.js +18 -18
  16. package/dist/classes/logging/index.js +4 -4
  17. package/dist/classes/promise/HkPromise.js +377 -377
  18. package/dist/classes/promise/index.js +1 -1
  19. package/dist/classes/services/ServiceBase.js +409 -409
  20. package/dist/classes/services/ServiceManager.js +1114 -1114
  21. package/dist/classes/services/constants.js +12 -12
  22. package/dist/classes/services/index.js +5 -5
  23. package/dist/classes/stores/SubscribersCount.js +107 -107
  24. package/dist/classes/stores/index.js +1 -1
  25. package/dist/classes/streams/LogTransformStream.js +19 -19
  26. package/dist/classes/streams/ServerEventsStore.js +110 -110
  27. package/dist/classes/streams/TimeStampSource.js +26 -26
  28. package/dist/classes/streams/index.js +3 -3
  29. package/dist/classes/svelte/audio/AudioLoader.svelte.js +58 -58
  30. package/dist/classes/svelte/audio/AudioScene.svelte.js +324 -324
  31. package/dist/classes/svelte/audio/mocks.js +35 -35
  32. package/dist/classes/svelte/finite-state-machine/FiniteStateMachine.svelte.js +133 -133
  33. package/dist/classes/svelte/finite-state-machine/index.js +1 -1
  34. package/dist/classes/svelte/image/ImageLoader.svelte.js +45 -45
  35. package/dist/classes/svelte/image/ImageScene.svelte.js +249 -249
  36. package/dist/classes/svelte/image/ImageVariantsLoader.svelte.js +152 -152
  37. package/dist/classes/svelte/image/index.js +4 -4
  38. package/dist/classes/svelte/image/mocks.js +35 -35
  39. package/dist/classes/svelte/image/typedef.js +8 -8
  40. package/dist/classes/svelte/index.js +14 -14
  41. package/dist/classes/svelte/loading-state-machine/LoadingStateMachine.svelte.js +109 -109
  42. package/dist/classes/svelte/loading-state-machine/constants.js +16 -16
  43. package/dist/classes/svelte/loading-state-machine/index.js +3 -3
  44. package/dist/classes/svelte/network-loader/NetworkLoader.svelte.js +338 -338
  45. package/dist/classes/svelte/network-loader/constants.js +3 -3
  46. package/dist/classes/svelte/network-loader/index.js +3 -3
  47. package/dist/classes/svelte/network-loader/mocks.js +30 -30
  48. package/dist/classes/svelte/network-loader/typedef.js +8 -8
  49. package/dist/components/area/HkArea.svelte +49 -49
  50. package/dist/components/area/HkGridArea.svelte +77 -77
  51. package/dist/components/area/index.js +2 -2
  52. package/dist/components/buttons/button/Button.svelte +82 -82
  53. package/dist/components/buttons/button-icon-steeze/SteezeIconButton.svelte +30 -30
  54. package/dist/components/buttons/button-text/TextButton.svelte +21 -21
  55. package/dist/components/buttons/index.js +3 -3
  56. package/dist/components/debug/debug-panel-design-scaling/DebugPanelDesignScaling.svelte +146 -146
  57. package/dist/components/debug/index.js +1 -1
  58. package/dist/components/drag-drop/DragController.js +44 -44
  59. package/dist/components/drag-drop/DragDropContext.svelte +110 -110
  60. package/dist/components/drag-drop/Draggable.svelte +512 -512
  61. package/dist/components/drag-drop/DropZoneArea.svelte +119 -119
  62. package/dist/components/drag-drop/DropZoneList.svelte +125 -125
  63. package/dist/components/drag-drop/{DropZone.svelte → Dropzone.svelte} +258 -258
  64. package/dist/components/drag-drop/drag-state.svelte.js +319 -319
  65. package/dist/components/drag-drop/index.js +7 -7
  66. package/dist/components/drag-drop/util.js +85 -85
  67. package/dist/components/hkdev/blocks/TextBlock.svelte +46 -46
  68. package/dist/components/hkdev/buttons/CheckButton.svelte +62 -62
  69. package/dist/components/icons/HkIcon.svelte +86 -86
  70. package/dist/components/icons/HkTabIcon.svelte +116 -116
  71. package/dist/components/icons/SteezeIcon.svelte +97 -97
  72. package/dist/components/icons/index.js +6 -6
  73. package/dist/components/icons/typedef.js +16 -16
  74. package/dist/components/index.js +2 -2
  75. package/dist/components/inputs/index.js +1 -1
  76. package/dist/components/inputs/text-input/TestTextInput.svelte__ +102 -102
  77. package/dist/components/inputs/text-input/TextInput.svelte +223 -223
  78. package/dist/components/inputs/text-input/TextInput.svelte___ +83 -83
  79. package/dist/components/inputs/text-input/assets/IconInvalid.svelte +14 -14
  80. package/dist/components/inputs/text-input/assets/IconValid.svelte +12 -12
  81. package/dist/components/layout/grid-layers/GridLayers.svelte +63 -63
  82. package/dist/components/layout/grid-layers/util.js +74 -74
  83. package/dist/components/layout/index.js +1 -1
  84. package/dist/components/panels/index.js +1 -1
  85. package/dist/components/panels/panel/Panel.svelte +43 -43
  86. package/dist/components/rows/index.js +3 -3
  87. package/dist/components/rows/panel-grid-row/PanelGridRow.svelte +104 -104
  88. package/dist/components/rows/panel-row-2/PanelRow2.svelte +40 -40
  89. package/dist/components/tab-bar/HkTabBar.state.svelte.js +149 -149
  90. package/dist/components/tab-bar/HkTabBar.svelte +74 -74
  91. package/dist/components/tab-bar/HkTabBarSelector.state.svelte.js +93 -93
  92. package/dist/components/tab-bar/HkTabBarSelector.svelte +49 -49
  93. package/dist/components/tab-bar/index.js +17 -17
  94. package/dist/components/tab-bar/typedef.js +11 -11
  95. package/dist/config/imagetools-config.js +189 -189
  96. package/dist/config/imagetools.d.ts +72 -72
  97. package/dist/constants/bases.js +13 -13
  98. package/dist/constants/errors/api.js +9 -9
  99. package/dist/constants/errors/generic.js +5 -5
  100. package/dist/constants/errors/index.js +3 -3
  101. package/dist/constants/errors/jwt.js +5 -5
  102. package/dist/constants/http/headers.js +6 -6
  103. package/dist/constants/http/index.js +2 -2
  104. package/dist/constants/http/methods.js +2 -2
  105. package/dist/constants/index.js +3 -3
  106. package/dist/constants/mime/application.js +5 -5
  107. package/dist/constants/mime/audio.js +13 -13
  108. package/dist/constants/mime/image.js +3 -3
  109. package/dist/constants/mime/index.js +4 -4
  110. package/dist/constants/mime/text.js +2 -2
  111. package/dist/constants/regexp/index.js +31 -31
  112. package/dist/constants/regexp/inspiratie.js__ +95 -95
  113. package/dist/constants/regexp/text.js +49 -49
  114. package/dist/constants/regexp/user.js +32 -32
  115. package/dist/constants/regexp/web.js +3 -3
  116. package/dist/constants/state-labels/drag-states.js +6 -6
  117. package/dist/constants/state-labels/drop-states.js +6 -6
  118. package/dist/constants/state-labels/input-states.js +11 -11
  119. package/dist/constants/state-labels/submit-states.js +4 -4
  120. package/dist/constants/time.js +28 -28
  121. package/dist/css/utilities.css +43 -43
  122. package/dist/design/design-config.js +73 -73
  123. package/dist/design/tailwind-theme-extend.js +158 -158
  124. package/dist/features/button-group/ButtonGroup.svelte +82 -82
  125. package/dist/features/button-group/typedef.js +10 -10
  126. package/dist/features/compare-left-right/CompareLeftRight.svelte +179 -179
  127. package/dist/features/compare-left-right/index.js +1 -1
  128. package/dist/features/game-box/GameBox.svelte +577 -577
  129. package/dist/features/game-box/gamebox.util.js +83 -83
  130. package/dist/features/hk-app-layout/HkAppLayout.state.svelte.js +25 -25
  131. package/dist/features/hk-app-layout/HkAppLayout.svelte +251 -251
  132. package/dist/features/image-box/ImageBox.svelte +210 -210
  133. package/dist/features/image-box/index.js +5 -5
  134. package/dist/features/image-box/typedef.js +32 -32
  135. package/dist/features/index.js +23 -23
  136. package/dist/features/presenter/ImageSlide.svelte +64 -64
  137. package/dist/features/presenter/Presenter.state.svelte.js +638 -638
  138. package/dist/features/presenter/Presenter.svelte +142 -142
  139. package/dist/features/presenter/constants.js +7 -7
  140. package/dist/features/presenter/index.js +10 -10
  141. package/dist/features/presenter/typedef.js +106 -106
  142. package/dist/features/presenter/util.js +210 -210
  143. package/dist/features/virtual-viewport/VirtualViewport.svelte +196 -196
  144. package/dist/schemas/index.js +1 -1
  145. package/dist/schemas/validate-url.js +180 -180
  146. package/dist/server/index.js +1 -1
  147. package/dist/server/logger.js +94 -94
  148. package/dist/states/index.js +1 -1
  149. package/dist/states/navigation.svelte.js +55 -55
  150. package/dist/stores/index.js +1 -1
  151. package/dist/stores/theme.js +80 -80
  152. package/dist/themes/hkdev/components/blocks/text-block.css +41 -41
  153. package/dist/themes/hkdev/components/boxes/game-box.css +12 -12
  154. package/dist/themes/hkdev/components/buttons/button-icon-steeze.css +22 -22
  155. package/dist/themes/hkdev/components/buttons/button-text.css +32 -32
  156. package/dist/themes/hkdev/components/buttons/button.css +146 -146
  157. package/dist/themes/hkdev/components/buttons/skip-button.css +6 -6
  158. package/dist/themes/hkdev/components/drag-drop/draggable.css +73 -73
  159. package/dist/themes/hkdev/components/drag-drop/drop-zone.css +48 -48
  160. package/dist/themes/hkdev/components/icons/icon-steeze.css +22 -22
  161. package/dist/themes/hkdev/components/inputs/text-input.css +104 -104
  162. package/dist/themes/hkdev/components/panels/panel.css +27 -27
  163. package/dist/themes/hkdev/components/rows/panel-grid-row.css +6 -6
  164. package/dist/themes/hkdev/components/rows/panel-row-2.css +7 -7
  165. package/dist/themes/hkdev/components.css +53 -53
  166. package/dist/themes/hkdev/debug.css +1 -1
  167. package/dist/themes/hkdev/global/layout.css +39 -39
  168. package/dist/themes/hkdev/global/on-colors.css +53 -53
  169. package/dist/themes/hkdev/globals.css +11 -11
  170. package/dist/themes/hkdev/responsive.css +12 -12
  171. package/dist/themes/hkdev/theme-ext.js +15 -15
  172. package/dist/themes/hkdev/theme.js +235 -235
  173. package/dist/themes/index.js +1 -1
  174. package/dist/typedef/context.js +6 -6
  175. package/dist/typedef/drag.js +25 -25
  176. package/dist/typedef/drop.js +12 -12
  177. package/dist/typedef/image.js +38 -38
  178. package/dist/typedef/index.js +4 -4
  179. package/dist/util/array/index.js +436 -436
  180. package/dist/util/bases/base58.js +262 -262
  181. package/dist/util/bases/index.js +1 -1
  182. package/dist/util/compare/index.js +247 -247
  183. package/dist/util/css/css-vars.js +83 -83
  184. package/dist/util/css/index.js +1 -1
  185. package/dist/util/design-system/components/states.js +22 -22
  186. package/dist/util/design-system/css/clamp.js +66 -66
  187. package/dist/util/design-system/css/root-design-vars.js +102 -102
  188. package/dist/util/design-system/index.js +5 -5
  189. package/dist/util/design-system/layout/scaling.js +228 -228
  190. package/dist/util/design-system/skeleton.js +208 -208
  191. package/dist/util/design-system/tailwind.js +288 -288
  192. package/dist/util/env/index.js +9 -9
  193. package/dist/util/expect/arrays.js +47 -47
  194. package/dist/util/expect/index.js +259 -259
  195. package/dist/util/expect/primitives.js +55 -55
  196. package/dist/util/expect/url.js +60 -60
  197. package/dist/util/function/index.js +218 -218
  198. package/dist/util/geo/index.js +26 -26
  199. package/dist/util/http/caching.js +263 -263
  200. package/dist/util/http/errors.js +97 -97
  201. package/dist/util/http/headers.js +75 -75
  202. package/dist/util/http/http-request.js +379 -379
  203. package/dist/util/http/index.js +22 -22
  204. package/dist/util/http/json-request.js +224 -224
  205. package/dist/util/http/mocks.js +65 -65
  206. package/dist/util/http/response.js +294 -294
  207. package/dist/util/http/typedef.js +93 -93
  208. package/dist/util/http/url.js +52 -52
  209. package/dist/util/image/index.js +86 -86
  210. package/dist/util/index.js +2 -2
  211. package/dist/util/is/index.js +140 -140
  212. package/dist/util/iterate/index.js +234 -234
  213. package/dist/util/object/index.js +1361 -1361
  214. package/dist/util/singleton/index.js +97 -97
  215. package/dist/util/string/array-path.js +75 -75
  216. package/dist/util/string/convert.js +54 -54
  217. package/dist/util/string/fs.js +226 -226
  218. package/dist/util/string/index.js +5 -5
  219. package/dist/util/string/interpolate.js +61 -61
  220. package/dist/util/string/pad.js +10 -10
  221. package/dist/util/svelte/index.js +4 -4
  222. package/dist/util/svelte/loading/loading-tracker.svelte.js +108 -108
  223. package/dist/util/svelte/observe/index.js +49 -49
  224. package/dist/util/svelte/state-context/index.js +117 -117
  225. package/dist/util/svelte/wait/index.js +38 -38
  226. package/dist/util/sveltekit/index.js +1 -1
  227. package/dist/util/sveltekit/route-folders/index.js +101 -101
  228. package/dist/util/time/index.js +323 -323
  229. package/dist/util/unique/index.js +249 -249
  230. package/dist/valibot/date.js__ +10 -10
  231. package/dist/valibot/index.js +9 -9
  232. package/dist/valibot/url.js +95 -95
  233. package/dist/valibot/user.js +23 -23
  234. package/dist/zod/all.js +33 -33
  235. package/dist/zod/generic.js +11 -11
  236. package/dist/zod/javascript.js +32 -32
  237. package/dist/zod/user.js +16 -16
  238. package/dist/zod/web.js +52 -52
  239. package/package.json +112 -112
  240. package/dist/components/drag-drop/drag-state.svelte.js__ +0 -323
  241. package/dist/components/layout/grid-layers/GridLayers.svelte__heightFrom__ +0 -372
  242. package/dist/util/http/test-data__/content-length-test-hkdigital-small.V4HfZyBQ.avif +0 -0
@@ -1,338 +1,338 @@
1
- import { CONTENT_TYPE } from '../../../constants/http/index.js';
2
-
3
- import {
4
- LoadingStateMachine,
5
- STATE_INITIAL,
6
- STATE_LOADING,
7
- STATE_UNLOADING,
8
- STATE_LOADED,
9
- STATE_CANCELLED,
10
- STATE_ERROR,
11
- LOAD,
12
- ERROR,
13
- LOADED,
14
- UNLOAD,
15
- INITIAL
16
- } from '../loading-state-machine/index.js';
17
-
18
- import * as expect from '../../../util/expect/index.js';
19
-
20
- import { httpGet, loadResponseBuffer } from '../../../util/http/index.js';
21
-
22
- import { ERROR_NOT_LOADED, ERROR_TRANSFERRED } from './constants.js';
23
-
24
- /**
25
- * NetworkLoader instance
26
- * - Loads network data from network into an ArrayBuffer
27
- * - Loaded data can be transferred to an AudioBufferSourceNode
28
- */
29
- export default class NetworkLoader {
30
- // _state = $state(new LoadingStateMachine());
31
- _state = new LoadingStateMachine();
32
-
33
- state = $derived.by(() => {
34
- return this._state.current;
35
- });
36
-
37
- initial = $derived.by(() => {
38
- return this._state.current === STATE_INITIAL;
39
- });
40
-
41
- loaded = $derived.by(() => {
42
- return this._state.current === STATE_LOADED;
43
- });
44
-
45
- /** @type {string|null} */
46
- _url = null;
47
-
48
- /** @type {number} */
49
- _bytesLoaded = $state(0);
50
-
51
- /** @type {number} */
52
- _size = $state(0);
53
-
54
- /**
55
- * Response headers
56
- * @type {Headers|null}
57
- */
58
- _headers = $state(null);
59
-
60
- /** @type {ArrayBuffer|null} */
61
- _buffer = null;
62
-
63
- // Export state property as readonly
64
-
65
- /** @type {import('./typedef.js').LoadingProgress} */
66
- progress = $derived.by(() => {
67
- return {
68
- bytesLoaded: this._bytesLoaded,
69
- size: this._size,
70
- loaded: this.loaded
71
- };
72
- });
73
-
74
- /** @type {null|(()=>void)} */
75
- _abortLoading = null;
76
-
77
- /**
78
- * Construct NetworkLoader
79
- *
80
- * @param {object} _
81
- * @param {string} _.url
82
- */
83
- constructor({ url }) {
84
- expect.absOrRelUrl(url);
85
-
86
- this._url = url;
87
-
88
- const state = this._state;
89
- const progress = this.progress;
90
-
91
- //
92
- // ISSUE: $effect is not triggered by this._state changes,
93
- // using onenter instead
94
- //
95
- this._state.onenter = () => {
96
- switch (state.current) {
97
- case STATE_LOADING:
98
- {
99
- // console.log('**** NetworkLoader:loading');
100
- this.#load();
101
- }
102
- break;
103
-
104
- case STATE_UNLOADING:
105
- {
106
- // console.log('NetworkLoader:unloading');
107
- this.#unload();
108
- }
109
- break;
110
-
111
- case STATE_LOADED:
112
- {
113
- // console.debug('NetworkLoader:loaded', $state.snapshot(state));
114
-
115
- // setTimeout(() => {
116
- // console.debug(
117
- // 'NetworkLoader:loaded',
118
- // $state.snapshot(state),
119
- // progress
120
- // );
121
- // }, 500);
122
-
123
- // Abort function is no longer needed
124
- this._abortLoading = null;
125
- }
126
- break;
127
-
128
- case STATE_CANCELLED:
129
- {
130
- // console.log('NetworkLoader:cancelled');
131
- // TODO
132
- }
133
- break;
134
-
135
- case STATE_ERROR:
136
- {
137
- console.log('NetworkLoader:error', state.error);
138
- }
139
- break;
140
- } // end switch
141
- };
142
- }
143
-
144
- /**
145
- * Start loading all network data
146
- */
147
- load() {
148
- // console.debug('NetworkLoader: load() called');
149
- this._state.send(LOAD);
150
- }
151
-
152
- /**
153
- * Unoad all network data
154
- */
155
- unload() {
156
- this._state.send(UNLOAD);
157
- }
158
-
159
- /**
160
- * Get network data size in bytes
161
- * - Info comes from the content length response header
162
- *
163
- * @returns {number}
164
- */
165
- get size() {
166
- return this._size;
167
- }
168
-
169
- /**
170
- * Get content type from response header
171
- *
172
- * @returns {string|null}
173
- */
174
- getContentType() {
175
- if (!this._headers) {
176
- throw new Error(ERROR_NOT_LOADED);
177
- }
178
-
179
- return this._headers.get(CONTENT_TYPE);
180
- }
181
-
182
- /**
183
- * Get data as array buffer
184
- *
185
- * @note If the data has been transferred, the data is
186
- * no longer available as ArrayBuffer
187
- *
188
- * @returns {ArrayBuffer}
189
- */
190
- getArrayBuffer() {
191
- if (!this._buffer) {
192
- throw new Error(ERROR_NOT_LOADED);
193
- }
194
-
195
- if (this._buffer.detached) {
196
- throw new Error(ERROR_TRANSFERRED);
197
- }
198
-
199
- return this._buffer;
200
- }
201
-
202
- /**
203
- * Get data as Uint8Array
204
- *
205
- * @returns {Uint8Array}
206
- */
207
- getUint8Array() {
208
- return new Uint8Array(this.getArrayBuffer());
209
- }
210
-
211
- /**
212
- * Get data as Blob
213
- * - The Blob type is set using the response header
214
- * content type
215
- *
216
- * @returns {Blob}
217
- */
218
- getBlob() {
219
- const type = this.getContentType();
220
-
221
- const options = {};
222
-
223
- if (type) {
224
- options.type = type;
225
- }
226
-
227
- return new Blob([this.getArrayBuffer()], options);
228
- }
229
-
230
- /**
231
- * Get object URL
232
- *
233
- * @note the objectURL should be revoked when no longer used
234
- *
235
- * @returns {string}
236
- */
237
- getObjectURL() {
238
- //
239
- // Example usage:
240
- //
241
- // $effect(() => {
242
- // if (loader.loaded) {
243
- // // @ts-ignore
244
- // objectUrl = loader.getObjectURL();
245
- // }
246
- //
247
- // return () => {
248
- // if (objectUrl) {
249
- // URL.revokeObjectURL(objectUrl);
250
- // objectUrl = null;
251
- // }
252
- // };
253
- // });
254
-
255
- return URL.createObjectURL(this.getBlob());
256
- }
257
-
258
- /**
259
- * Internal method that initializes the loading process
260
- * and transitions to state LOADED when done
261
- */
262
- async #load() {
263
- try {
264
- // console.log('>>>> NetworkLoader:#load', this._url);
265
-
266
- if (this._abortLoading) {
267
- // console.log('Abort loading');
268
- this._abortLoading();
269
- this._abortLoading = null;
270
- }
271
-
272
- /** @type {()=>void} */
273
- let abortRequest;
274
-
275
- /**
276
- * @param {object} _
277
- * @param {()=>void} _.abort
278
- */
279
- const requestHandler = ({ abort }) => {
280
- abortRequest = abort;
281
- };
282
-
283
- this._bytesLoaded = 0;
284
- this._size = 0;
285
-
286
- // @ts-ignore
287
- const response = await httpGet({ url: this._url, requestHandler });
288
-
289
- this._headers = response.headers;
290
-
291
- // console.log('headers', this._headers);
292
- // console.log('response', response);
293
-
294
- const { bufferPromise, abort: abortLoadBody } = loadResponseBuffer(
295
- response,
296
- ({ bytesLoaded, size }) => {
297
- this._bytesLoaded = bytesLoaded;
298
- this._size = size;
299
- }
300
- );
301
-
302
- this._abortLoading = () => {
303
- abortRequest();
304
- abortLoadBody();
305
- };
306
-
307
- this._buffer = await bufferPromise;
308
-
309
- // console.debug('#load', this._buffer, this._bytesLoaded);
310
-
311
- this._state.send(LOADED);
312
- } catch (e) {
313
- this._state.send(ERROR, e);
314
- }
315
- }
316
-
317
- /**
318
- * Internal method that initializes the unloading process
319
- * and transitions to state INITIAL when done
320
- */
321
- async #unload() {
322
- try {
323
- if (this._abortLoading) {
324
- this._abortLoading();
325
- this._abortLoading = null;
326
- }
327
-
328
- this._bytesLoaded = 0;
329
- this._size = 0;
330
- this._headers = null;
331
- this._buffer = null;
332
-
333
- this._state.send(INITIAL);
334
- } catch (e) {
335
- this._state.send(ERROR, e);
336
- }
337
- }
338
- } // end class
1
+ import { CONTENT_TYPE } from '../../../constants/http/index.js';
2
+
3
+ import {
4
+ LoadingStateMachine,
5
+ STATE_INITIAL,
6
+ STATE_LOADING,
7
+ STATE_UNLOADING,
8
+ STATE_LOADED,
9
+ STATE_CANCELLED,
10
+ STATE_ERROR,
11
+ LOAD,
12
+ ERROR,
13
+ LOADED,
14
+ UNLOAD,
15
+ INITIAL
16
+ } from '../loading-state-machine/index.js';
17
+
18
+ import * as expect from '../../../util/expect/index.js';
19
+
20
+ import { httpGet, loadResponseBuffer } from '../../../util/http/index.js';
21
+
22
+ import { ERROR_NOT_LOADED, ERROR_TRANSFERRED } from './constants.js';
23
+
24
+ /**
25
+ * NetworkLoader instance
26
+ * - Loads network data from network into an ArrayBuffer
27
+ * - Loaded data can be transferred to an AudioBufferSourceNode
28
+ */
29
+ export default class NetworkLoader {
30
+ // _state = $state(new LoadingStateMachine());
31
+ _state = new LoadingStateMachine();
32
+
33
+ state = $derived.by(() => {
34
+ return this._state.current;
35
+ });
36
+
37
+ initial = $derived.by(() => {
38
+ return this._state.current === STATE_INITIAL;
39
+ });
40
+
41
+ loaded = $derived.by(() => {
42
+ return this._state.current === STATE_LOADED;
43
+ });
44
+
45
+ /** @type {string|null} */
46
+ _url = null;
47
+
48
+ /** @type {number} */
49
+ _bytesLoaded = $state(0);
50
+
51
+ /** @type {number} */
52
+ _size = $state(0);
53
+
54
+ /**
55
+ * Response headers
56
+ * @type {Headers|null}
57
+ */
58
+ _headers = $state(null);
59
+
60
+ /** @type {ArrayBuffer|null} */
61
+ _buffer = null;
62
+
63
+ // Export state property as readonly
64
+
65
+ /** @type {import('./typedef.js').LoadingProgress} */
66
+ progress = $derived.by(() => {
67
+ return {
68
+ bytesLoaded: this._bytesLoaded,
69
+ size: this._size,
70
+ loaded: this.loaded
71
+ };
72
+ });
73
+
74
+ /** @type {null|(()=>void)} */
75
+ _abortLoading = null;
76
+
77
+ /**
78
+ * Construct NetworkLoader
79
+ *
80
+ * @param {object} _
81
+ * @param {string} _.url
82
+ */
83
+ constructor({ url }) {
84
+ expect.absOrRelUrl(url);
85
+
86
+ this._url = url;
87
+
88
+ const state = this._state;
89
+ const progress = this.progress;
90
+
91
+ //
92
+ // ISSUE: $effect is not triggered by this._state changes,
93
+ // using onenter instead
94
+ //
95
+ this._state.onenter = () => {
96
+ switch (state.current) {
97
+ case STATE_LOADING:
98
+ {
99
+ // console.log('**** NetworkLoader:loading');
100
+ this.#load();
101
+ }
102
+ break;
103
+
104
+ case STATE_UNLOADING:
105
+ {
106
+ // console.log('NetworkLoader:unloading');
107
+ this.#unload();
108
+ }
109
+ break;
110
+
111
+ case STATE_LOADED:
112
+ {
113
+ // console.debug('NetworkLoader:loaded', $state.snapshot(state));
114
+
115
+ // setTimeout(() => {
116
+ // console.debug(
117
+ // 'NetworkLoader:loaded',
118
+ // $state.snapshot(state),
119
+ // progress
120
+ // );
121
+ // }, 500);
122
+
123
+ // Abort function is no longer needed
124
+ this._abortLoading = null;
125
+ }
126
+ break;
127
+
128
+ case STATE_CANCELLED:
129
+ {
130
+ // console.log('NetworkLoader:cancelled');
131
+ // TODO
132
+ }
133
+ break;
134
+
135
+ case STATE_ERROR:
136
+ {
137
+ console.log('NetworkLoader:error', state.error);
138
+ }
139
+ break;
140
+ } // end switch
141
+ };
142
+ }
143
+
144
+ /**
145
+ * Start loading all network data
146
+ */
147
+ load() {
148
+ // console.debug('NetworkLoader: load() called');
149
+ this._state.send(LOAD);
150
+ }
151
+
152
+ /**
153
+ * Unoad all network data
154
+ */
155
+ unload() {
156
+ this._state.send(UNLOAD);
157
+ }
158
+
159
+ /**
160
+ * Get network data size in bytes
161
+ * - Info comes from the content length response header
162
+ *
163
+ * @returns {number}
164
+ */
165
+ get size() {
166
+ return this._size;
167
+ }
168
+
169
+ /**
170
+ * Get content type from response header
171
+ *
172
+ * @returns {string|null}
173
+ */
174
+ getContentType() {
175
+ if (!this._headers) {
176
+ throw new Error(ERROR_NOT_LOADED);
177
+ }
178
+
179
+ return this._headers.get(CONTENT_TYPE);
180
+ }
181
+
182
+ /**
183
+ * Get data as array buffer
184
+ *
185
+ * @note If the data has been transferred, the data is
186
+ * no longer available as ArrayBuffer
187
+ *
188
+ * @returns {ArrayBuffer}
189
+ */
190
+ getArrayBuffer() {
191
+ if (!this._buffer) {
192
+ throw new Error(ERROR_NOT_LOADED);
193
+ }
194
+
195
+ if (this._buffer.detached) {
196
+ throw new Error(ERROR_TRANSFERRED);
197
+ }
198
+
199
+ return this._buffer;
200
+ }
201
+
202
+ /**
203
+ * Get data as Uint8Array
204
+ *
205
+ * @returns {Uint8Array}
206
+ */
207
+ getUint8Array() {
208
+ return new Uint8Array(this.getArrayBuffer());
209
+ }
210
+
211
+ /**
212
+ * Get data as Blob
213
+ * - The Blob type is set using the response header
214
+ * content type
215
+ *
216
+ * @returns {Blob}
217
+ */
218
+ getBlob() {
219
+ const type = this.getContentType();
220
+
221
+ const options = {};
222
+
223
+ if (type) {
224
+ options.type = type;
225
+ }
226
+
227
+ return new Blob([this.getArrayBuffer()], options);
228
+ }
229
+
230
+ /**
231
+ * Get object URL
232
+ *
233
+ * @note the objectURL should be revoked when no longer used
234
+ *
235
+ * @returns {string}
236
+ */
237
+ getObjectURL() {
238
+ //
239
+ // Example usage:
240
+ //
241
+ // $effect(() => {
242
+ // if (loader.loaded) {
243
+ // // @ts-ignore
244
+ // objectUrl = loader.getObjectURL();
245
+ // }
246
+ //
247
+ // return () => {
248
+ // if (objectUrl) {
249
+ // URL.revokeObjectURL(objectUrl);
250
+ // objectUrl = null;
251
+ // }
252
+ // };
253
+ // });
254
+
255
+ return URL.createObjectURL(this.getBlob());
256
+ }
257
+
258
+ /**
259
+ * Internal method that initializes the loading process
260
+ * and transitions to state LOADED when done
261
+ */
262
+ async #load() {
263
+ try {
264
+ // console.log('>>>> NetworkLoader:#load', this._url);
265
+
266
+ if (this._abortLoading) {
267
+ // console.log('Abort loading');
268
+ this._abortLoading();
269
+ this._abortLoading = null;
270
+ }
271
+
272
+ /** @type {()=>void} */
273
+ let abortRequest;
274
+
275
+ /**
276
+ * @param {object} _
277
+ * @param {()=>void} _.abort
278
+ */
279
+ const requestHandler = ({ abort }) => {
280
+ abortRequest = abort;
281
+ };
282
+
283
+ this._bytesLoaded = 0;
284
+ this._size = 0;
285
+
286
+ // @ts-ignore
287
+ const response = await httpGet({ url: this._url, requestHandler });
288
+
289
+ this._headers = response.headers;
290
+
291
+ // console.log('headers', this._headers);
292
+ // console.log('response', response);
293
+
294
+ const { bufferPromise, abort: abortLoadBody } = loadResponseBuffer(
295
+ response,
296
+ ({ bytesLoaded, size }) => {
297
+ this._bytesLoaded = bytesLoaded;
298
+ this._size = size;
299
+ }
300
+ );
301
+
302
+ this._abortLoading = () => {
303
+ abortRequest();
304
+ abortLoadBody();
305
+ };
306
+
307
+ this._buffer = await bufferPromise;
308
+
309
+ // console.debug('#load', this._buffer, this._bytesLoaded);
310
+
311
+ this._state.send(LOADED);
312
+ } catch (e) {
313
+ this._state.send(ERROR, e);
314
+ }
315
+ }
316
+
317
+ /**
318
+ * Internal method that initializes the unloading process
319
+ * and transitions to state INITIAL when done
320
+ */
321
+ async #unload() {
322
+ try {
323
+ if (this._abortLoading) {
324
+ this._abortLoading();
325
+ this._abortLoading = null;
326
+ }
327
+
328
+ this._bytesLoaded = 0;
329
+ this._size = 0;
330
+ this._headers = null;
331
+ this._buffer = null;
332
+
333
+ this._state.send(INITIAL);
334
+ } catch (e) {
335
+ this._state.send(ERROR, e);
336
+ }
337
+ }
338
+ } // end class
@@ -1,3 +1,3 @@
1
- export const ERROR_NOT_LOADED = 'No data loaded yet';
2
- export const ERROR_TRANSFERRED =
3
- 'Buffer data has been transferred and is no longer available';
1
+ export const ERROR_NOT_LOADED = 'No data loaded yet';
2
+ export const ERROR_TRANSFERRED =
3
+ 'Buffer data has been transferred and is no longer available';
@@ -1,3 +1,3 @@
1
- export { default as NetworkLoader } from './NetworkLoader.svelte.js';
2
-
3
- export * from './constants.js';
1
+ export { default as NetworkLoader } from './NetworkLoader.svelte.js';
2
+
3
+ export * from './constants.js';