bfg-common 1.0.75 → 1.0.77

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 (63) hide show
  1. package/components/atoms/alert/Notification.vue +167 -167
  2. package/components/atoms/autocomplete/Autocomplete.vue +236 -236
  3. package/components/atoms/datepicker/Datepicker.vue +612 -612
  4. package/components/atoms/list/SelectList.vue +62 -62
  5. package/components/atoms/modal/bySteps/BySteps.vue +234 -234
  6. package/components/atoms/nav/NavBar.vue +116 -116
  7. package/components/atoms/nav/VerticalNavBar.vue +89 -89
  8. package/components/atoms/notificationBar/NotificationBar.vue +174 -174
  9. package/components/atoms/perPage/PerPage.vue +52 -52
  10. package/components/atoms/popup/SimplePopup.vue +90 -90
  11. package/components/atoms/step/VerticalStep.vue +104 -104
  12. package/components/atoms/switch/Switch.vue +107 -107
  13. package/components/atoms/table/dataGrid/DataGrid.vue +180 -80
  14. package/components/atoms/table/dataGrid/DataGridColumnSwitch.vue +204 -204
  15. package/components/atoms/table/dataGrid/DataGridPage.vue +189 -189
  16. package/components/atoms/table/dataGrid/DataGridPagination.vue +8 -2
  17. package/components/atoms/table/dataGrid/utils/constructDataTable.ts +19 -20
  18. package/components/atoms/tabs/Tabs.vue +189 -189
  19. package/components/atoms/tooltip/Signpost.vue +224 -224
  20. package/components/common/accordion/Recursion.vue +6 -2
  21. package/components/common/adapterManager/AddAdapterWarningModal.vue +82 -82
  22. package/components/common/adapterManager/NoActiveAdaptersModal.vue +62 -62
  23. package/components/common/adapterManager/NoConnectedActiveAdaptersModal.vue +62 -62
  24. package/components/common/browse/Browse.vue +182 -182
  25. package/components/common/browse/blocks/Title.vue +66 -66
  26. package/components/common/diagramMain/adapter/AdapterItem.vue +227 -227
  27. package/components/common/diagramMain/adapter/AdapterItems.vue +57 -57
  28. package/components/common/diagramMain/modals/editSettings/tabs/port/IpvFourSettings.vue +339 -339
  29. package/components/common/diagramMain/modals/editSettings/tabs/port/PortProperties.vue +202 -202
  30. package/components/common/diagramMain/modals/remove/RemoveModal.vue +226 -226
  31. package/components/common/diagramMain/modals/viewSettings/Info.vue +96 -94
  32. package/components/common/diagramMain/network/Contents.vue +238 -238
  33. package/components/common/feedback/Buttons.vue +232 -232
  34. package/components/common/feedback/Message.vue +468 -468
  35. package/components/common/feedback/VisitPortal.vue +54 -54
  36. package/components/common/mainNavigationPanel/MainNavigationPanel.vue +359 -359
  37. package/components/common/modals/Rename.vue +165 -165
  38. package/components/common/perPage/PerPage.vue +51 -51
  39. package/components/common/recursionTree/RecursionTree.vue +201 -201
  40. package/components/common/select/radio/RadioGroup.vue +50 -13
  41. package/components/common/select/radio/models/interfaces.ts +2 -6
  42. package/components/common/wizards/datastore/add/nfs/configuration/Configuration.vue +373 -373
  43. package/components/common/wizards/datastore/add/nfs/configuration/serversList/ServersList.vue +123 -123
  44. package/components/common/wizards/datastore/add/nfs/kerberosAuthentication/KerberosAuthentication.vue +54 -54
  45. package/components/common/wizards/datastore/add/nfs/version/Version.vue +9 -37
  46. package/components/common/wizards/datastore/add/nfs/version/config/versionOptions.ts +4 -4
  47. package/components/common/wizards/datastore/add/sharedStorm/deviceSelection/hostTable/HostTable.vue +131 -131
  48. package/components/common/wizards/datastore/add/sharedStorm/partitionConfiguration/PartitionConfiguration.vue +230 -230
  49. package/components/common/wizards/datastore/add/sharedStorm/version/Version.vue +6 -37
  50. package/components/common/wizards/datastore/add/sharedStorm/version/config/versionOptions.ts +6 -4
  51. package/components/common/wizards/datastore/add/types/Types.vue +6 -66
  52. package/components/common/wizards/datastore/add/types/config/typeOptions.ts +11 -11
  53. package/models/store/storage/interfaces.ts +32 -32
  54. package/package.json +1 -1
  55. package/public/spice-console/application/codec.js +257 -257
  56. package/public/spice-console/lib/rasterEngine.js +907 -907
  57. package/public/spice-console/network/spicechannel.js +369 -369
  58. package/public/spice-console-minify/lib/decoder/dixie.min.js +4 -4
  59. package/public/spice-console-minify/lib/jgestures.min.js +24 -24
  60. package/public/spice-console-minify/lib/jquery-2.0.3.min.js +24 -24
  61. package/public/spice-console-minify/lib/jquery-mousewheel.min.js +11 -11
  62. package/public/spice-console-minify/lib/jquery-visibility.min.js +1 -1
  63. package/public/spice-console-minify/lib/lodash.4.0.0.min.js +5 -5
@@ -1,33 +1,33 @@
1
1
  import { UI_I_Localization } from '~/models/interfaces'
2
- import { UI_I_DatastoreTypeOption } from '~/components/common/select/radio/models/interfaces'
2
+ import { UI_I_RadioOption } from '~/components/common/select/radio/models/interfaces'
3
3
 
4
4
  export const datastoreTypesFunc = (
5
5
  localization: UI_I_Localization
6
- ): UI_I_DatastoreTypeOption[] => {
6
+ ): UI_I_RadioOption[] => {
7
7
  return [
8
8
  {
9
9
  label: localization.localStorage,
10
10
  value: 'local',
11
11
  disabled: false,
12
- desc: localization.localDesc,
13
- isShowHelp: false,
14
- helpDesc: localization.localStorageHelpDesc,
12
+ description: localization.localDesc,
13
+ isTooltip: false,
14
+ tooltipContent: localization.localStorageHelpDesc,
15
15
  },
16
16
  {
17
17
  label: localization.stormSharedStorage,
18
18
  value: 'shared-storm',
19
19
  disabled: false,
20
- desc: localization.sharedStormDesc,
21
- isShowHelp: false,
22
- helpDesc: localization.stormSharedStorageHelpDesc,
20
+ description: localization.sharedStormDesc,
21
+ isTooltip: false,
22
+ tooltipContent: localization.stormSharedStorageHelpDesc,
23
23
  },
24
24
  {
25
25
  label: localization.nfs,
26
26
  value: 'nfs',
27
27
  disabled: false,
28
- desc: localization.nfsDesc,
29
- isShowHelp: false,
30
- helpDesc: localization.nfsHelpDesc,
28
+ description: localization.nfsDesc,
29
+ isTooltip: false,
30
+ tooltipContent: localization.nfsHelpDesc,
31
31
  },
32
32
  // {
33
33
  // label: localization.vVol,
@@ -1,32 +1,32 @@
1
- import { API_UI_I_Node } from '~/models/store/interfaces'
2
-
3
- export interface API_UI_I_DatastoreTableItemCapacity {
4
- capacity_mb: number
5
- provisioned_mb: number
6
- free_mb: number
7
- used_mb: number
8
- }
9
-
10
- export interface API_UI_I_DatastoreTableItem extends API_UI_I_Node {
11
- pool_name: string
12
- type_code: number
13
- type_text: string
14
- drive_type: string
15
- capacity: API_UI_I_DatastoreTableItemCapacity
16
- thin_provisioning: boolean
17
- access_mode: string
18
- hardware_acceleration: string
19
- device: string
20
- storage_io_control: boolean
21
- storage_compatibility: string
22
- }
23
-
24
- export interface UI_I_DatastoreTableItem extends API_UI_I_DatastoreTableItem {}
25
-
26
- export interface UI_I_FolderOrFileTreePayload {
27
- type: string
28
- id: string
29
- path: string
30
- merge: boolean
31
- show: boolean
32
- }
1
+ import { API_UI_I_Node } from '~/models/store/interfaces'
2
+
3
+ export interface API_UI_I_DatastoreTableItemCapacity {
4
+ capacity_mb: number
5
+ provisioned_mb: number
6
+ free_mb: number
7
+ used_mb: number
8
+ }
9
+
10
+ export interface API_UI_I_DatastoreTableItem extends API_UI_I_Node {
11
+ pool_name: string
12
+ type_code: number
13
+ type_text: string
14
+ drive_type: string
15
+ capacity: API_UI_I_DatastoreTableItemCapacity
16
+ thin_provisioning: boolean
17
+ access_mode: string
18
+ hardware_acceleration: string
19
+ device: string
20
+ storage_io_control: boolean
21
+ storage_compatibility: string
22
+ }
23
+
24
+ export interface UI_I_DatastoreTableItem extends API_UI_I_DatastoreTableItem {}
25
+
26
+ export interface UI_I_FolderOrFileTreePayload {
27
+ type: string
28
+ id: string
29
+ path: string
30
+ merge: boolean
31
+ show: boolean
32
+ }
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "bfg-common",
3
3
  "private": false,
4
- "version": "1.0.75",
4
+ "version": "1.0.77",
5
5
  "scripts": {
6
6
  "build": "nuxt build",
7
7
  "dev": "nuxt dev --port=3002",
@@ -1,257 +1,257 @@
1
- wdi.CodecH264 = {
2
- video: {},
3
- jmuxer: {},
4
- loadedVideo: {},
5
- queues: {},
6
- isReady: {},
7
-
8
- create: function (streamId) {
9
- if (this.video[streamId]) return
10
-
11
- const video = document.createElement('video')
12
- video.id = `video${streamId}`
13
- video.setAttribute('autoplay', '')
14
-
15
- this.video[streamId] = video
16
-
17
- this.jmuxer[streamId] = new JMuxer({
18
- node: video,
19
- mode: 'video',
20
- flushingTime: 0,
21
- fps: 60,
22
- onReady: () => {
23
- this.isReady[streamId] = true
24
- },
25
- })
26
- },
27
-
28
- addQueue: function (streamId, imageData) {
29
- if (!this.queues[streamId]) this.queues[streamId] = []
30
- this.queues[streamId].push(imageData)
31
- },
32
-
33
- resetQueues: function (streamId) {
34
- this.queues[streamId] = []
35
- },
36
-
37
- feed: function (streamId, data) {
38
- this._addListener(streamId)
39
-
40
- if (this.queues[streamId]?.length) {
41
- this.queues[streamId].forEach((queue) => {
42
- this.jmuxer[streamId].feed({
43
- video: queue,
44
- })
45
- })
46
- this.resetQueues(streamId)
47
- }
48
-
49
- this.jmuxer[streamId].feed({
50
- video: data,
51
- })
52
- },
53
-
54
- destroy: function (streamId) {
55
- this._removeListener(streamId)
56
- this.video[streamId]?.remove()
57
- this.video = {}
58
- this.jmuxer = {}
59
- this.loadedVideo = {}
60
- },
61
-
62
- _addListener: function (streamId) {
63
- this.video[streamId]?.removeEventListener(
64
- 'loadedmetadata',
65
- this.loadedVideo[streamId]
66
- )
67
- this.video[streamId].addEventListener(
68
- 'loadedmetadata',
69
- this.loadedVideo[streamId]
70
- )
71
- },
72
-
73
- _removeListener: function (streamId) {
74
- this.video[streamId]?.removeEventListener(
75
- 'loadedmetadata',
76
- this.loadedVideo[streamId]
77
- )
78
- },
79
- }
80
-
81
- wdi.CodecVp8 = {
82
- decoders: {},
83
-
84
- create: function (streamId) {
85
- this.decoders[streamId] = new vp8_decoder_ctx()
86
- },
87
-
88
- destroy: function () {
89
- this.decoders = {}
90
- },
91
-
92
- feed: function (streamId, imageData, context, box) {
93
- const errorCode = vp8_dixie_decode_frame(
94
- this.decoders[streamId],
95
- imageData,
96
- imageData.length
97
- )
98
- if (VPX_CODEC_OK === errorCode) {
99
- this._I420toRGBA(this.decoders[streamId].ref_frames[0].img, context, box)
100
- }
101
- },
102
-
103
- _I420toRGBA: function (vp8, context, box) {
104
- const yuvwidth = vp8.w
105
- const height = vp8.d_h
106
- const width = vp8.d_w
107
-
108
- let output = context.createImageData(width, height)
109
- let outputData = output.data
110
- let R, G, B
111
-
112
- for (let h = 0; h < height; h++) {
113
- for (let w = 0; w < width; w++) {
114
- const Y = vp8.planes[0][vp8.planes_off[0] + 0 + w + yuvwidth * h]
115
- const U =
116
- vp8.planes[1][
117
- vp8.planes_off[1] + 0 + (w >> 1) + (yuvwidth >> 1) * (h >> 1)
118
- ]
119
- const V =
120
- vp8.planes[2][
121
- vp8.planes_off[2] + 0 + (w >> 1) + (yuvwidth >> 1) * (h >> 1)
122
- ]
123
-
124
- R = Math.round(Y + 1.13983 * (V - 128))
125
- G = Math.round(Y - 0.39465 * (U - 128) - 0.5806 * (V - 128))
126
- B = Math.round(Y + 2.03211 * (U - 128))
127
-
128
- outputData[0 + w * 4 + width * 4 * h] = R
129
- outputData[1 + w * 4 + width * 4 * h] = G
130
- outputData[2 + w * 4 + width * 4 * h] = B
131
- outputData[3 + w * 4 + width * 4 * h] = 255
132
- }
133
- }
134
-
135
- context.putImageData(output, box.x, box.y)
136
- },
137
- }
138
-
139
- wdi.CodecH265 = {
140
- queue: {},
141
- configed: {},
142
- isReady: {},
143
- decoders: {},
144
- pendingFrames: {},
145
- underflow: {},
146
- baseTime: {},
147
-
148
- create: async function (streamId, context, box) {
149
- const init = {
150
- output: this._handleFrame.bind(this, streamId, context, box),
151
- error: (e) => {
152
- console.log(e)
153
- },
154
- }
155
- const config = {
156
- codec: wdi.SpiceVideoCodecValue[wdi.currentCodec],
157
- codedWidth: 640,
158
- codedHeight: 480,
159
- }
160
- const { supported } = await VideoDecoder.isConfigSupported(config)
161
- // Проверяем поддерживает ли браузер VideoDecoder
162
- if (supported) {
163
- this.decoders[streamId] = new VideoDecoder(init)
164
- this.decoders[streamId].configure(config)
165
- this.isReady[streamId] = true
166
- } else {
167
- // Try another config.
168
- console.log('not supported')
169
- }
170
- },
171
-
172
- destroy: function () {
173
- this.queue = {}
174
- this.configed = {}
175
- this.isReady = {}
176
- this.decoders = {}
177
- this.pendingFrames = {}
178
- this.underflow = {}
179
- this.baseTime = {}
180
- },
181
-
182
- addQueue: function (streamId, imageData) {
183
- if (!this.queues[streamId]) this.queues[streamId] = []
184
- this.queues[streamId].push(imageData)
185
- },
186
-
187
- resetQueues: function (streamId) {
188
- this.queues[streamId] = []
189
- },
190
-
191
- setConfig: function (streamId, box) {
192
- const config = {
193
- codec: wdi.SpiceVideoCodecValue[wdi.currentCodec],
194
- codedWidth: box.width,
195
- codedHeight: box.height,
196
- }
197
- this.decoders[streamId].configure(config)
198
- this.configed[streamId] = true
199
- },
200
-
201
- decode: function (streamId, imageData) {
202
- if (this.queue[streamId]?.length) {
203
- this.queue[streamId].forEach((data) => {
204
- const chunk = new EncodedVideoChunk({
205
- type: 'key',
206
- data: data,
207
- timestamp: performance.now(),
208
- })
209
- this.decoders[streamId].decode(chunk)
210
- })
211
- this.resetQueues(streamId)
212
- }
213
-
214
- const chunk = new EncodedVideoChunk({
215
- type: 'key',
216
- data: imageData,
217
- timestamp: performance.now(),
218
- })
219
- this.decoders[streamId].decode(chunk)
220
- },
221
-
222
- _handleFrame: function (streamId, context, box, frame) {
223
- if (!this.pendingFrames[streamId]) this.pendingFrames[streamId] = []
224
- this.pendingFrames[streamId].push(frame)
225
-
226
- if (this.underflow[streamId] === undefined) this.underflow[streamId] = true
227
- if (this.underflow[streamId])
228
- setTimeout(this._renderFrame.bind(this, streamId, context, box), 0)
229
- },
230
- _renderFrame: async function (streamId, context, box) {
231
- this.underflow[streamId] = this.pendingFrames[streamId].length === 0
232
- if (this.underflow[streamId]) return
233
-
234
- const frame = this.pendingFrames[streamId].shift()
235
-
236
- // Based on the frame's timestamp calculate how much of real time waiting
237
- // is needed before showing the next frame.
238
- const timeUntilNextFrame = this._calculateTimeUntilNextFrame(
239
- frame.timestamp,
240
- streamId
241
- )
242
- await new Promise((r) => {
243
- setTimeout(r, timeUntilNextFrame)
244
- })
245
-
246
- context.drawImage(frame, box.x, box.y, box.width, box.height)
247
- frame.close()
248
-
249
- // Immediately schedule rendering of the next frame
250
- setTimeout(this._renderFrame.bind(this, streamId, context, box), 0)
251
- },
252
- _calculateTimeUntilNextFrame: function (timestamp, streamId) {
253
- if (!this.baseTime[streamId]) this.baseTime[streamId] = performance.now()
254
- const mediaTime = performance.now() - this.baseTime[streamId]
255
- return Math.max(0, timestamp / 1000 - mediaTime)
256
- },
257
- }
1
+ wdi.CodecH264 = {
2
+ video: {},
3
+ jmuxer: {},
4
+ loadedVideo: {},
5
+ queues: {},
6
+ isReady: {},
7
+
8
+ create: function (streamId) {
9
+ if (this.video[streamId]) return
10
+
11
+ const video = document.createElement('video')
12
+ video.id = `video${streamId}`
13
+ video.setAttribute('autoplay', '')
14
+
15
+ this.video[streamId] = video
16
+
17
+ this.jmuxer[streamId] = new JMuxer({
18
+ node: video,
19
+ mode: 'video',
20
+ flushingTime: 0,
21
+ fps: 60,
22
+ onReady: () => {
23
+ this.isReady[streamId] = true
24
+ },
25
+ })
26
+ },
27
+
28
+ addQueue: function (streamId, imageData) {
29
+ if (!this.queues[streamId]) this.queues[streamId] = []
30
+ this.queues[streamId].push(imageData)
31
+ },
32
+
33
+ resetQueues: function (streamId) {
34
+ this.queues[streamId] = []
35
+ },
36
+
37
+ feed: function (streamId, data) {
38
+ this._addListener(streamId)
39
+
40
+ if (this.queues[streamId]?.length) {
41
+ this.queues[streamId].forEach((queue) => {
42
+ this.jmuxer[streamId].feed({
43
+ video: queue,
44
+ })
45
+ })
46
+ this.resetQueues(streamId)
47
+ }
48
+
49
+ this.jmuxer[streamId].feed({
50
+ video: data,
51
+ })
52
+ },
53
+
54
+ destroy: function (streamId) {
55
+ this._removeListener(streamId)
56
+ this.video[streamId]?.remove()
57
+ this.video = {}
58
+ this.jmuxer = {}
59
+ this.loadedVideo = {}
60
+ },
61
+
62
+ _addListener: function (streamId) {
63
+ this.video[streamId]?.removeEventListener(
64
+ 'loadedmetadata',
65
+ this.loadedVideo[streamId]
66
+ )
67
+ this.video[streamId].addEventListener(
68
+ 'loadedmetadata',
69
+ this.loadedVideo[streamId]
70
+ )
71
+ },
72
+
73
+ _removeListener: function (streamId) {
74
+ this.video[streamId]?.removeEventListener(
75
+ 'loadedmetadata',
76
+ this.loadedVideo[streamId]
77
+ )
78
+ },
79
+ }
80
+
81
+ wdi.CodecVp8 = {
82
+ decoders: {},
83
+
84
+ create: function (streamId) {
85
+ this.decoders[streamId] = new vp8_decoder_ctx()
86
+ },
87
+
88
+ destroy: function () {
89
+ this.decoders = {}
90
+ },
91
+
92
+ feed: function (streamId, imageData, context, box) {
93
+ const errorCode = vp8_dixie_decode_frame(
94
+ this.decoders[streamId],
95
+ imageData,
96
+ imageData.length
97
+ )
98
+ if (VPX_CODEC_OK === errorCode) {
99
+ this._I420toRGBA(this.decoders[streamId].ref_frames[0].img, context, box)
100
+ }
101
+ },
102
+
103
+ _I420toRGBA: function (vp8, context, box) {
104
+ const yuvwidth = vp8.w
105
+ const height = vp8.d_h
106
+ const width = vp8.d_w
107
+
108
+ let output = context.createImageData(width, height)
109
+ let outputData = output.data
110
+ let R, G, B
111
+
112
+ for (let h = 0; h < height; h++) {
113
+ for (let w = 0; w < width; w++) {
114
+ const Y = vp8.planes[0][vp8.planes_off[0] + 0 + w + yuvwidth * h]
115
+ const U =
116
+ vp8.planes[1][
117
+ vp8.planes_off[1] + 0 + (w >> 1) + (yuvwidth >> 1) * (h >> 1)
118
+ ]
119
+ const V =
120
+ vp8.planes[2][
121
+ vp8.planes_off[2] + 0 + (w >> 1) + (yuvwidth >> 1) * (h >> 1)
122
+ ]
123
+
124
+ R = Math.round(Y + 1.13983 * (V - 128))
125
+ G = Math.round(Y - 0.39465 * (U - 128) - 0.5806 * (V - 128))
126
+ B = Math.round(Y + 2.03211 * (U - 128))
127
+
128
+ outputData[0 + w * 4 + width * 4 * h] = R
129
+ outputData[1 + w * 4 + width * 4 * h] = G
130
+ outputData[2 + w * 4 + width * 4 * h] = B
131
+ outputData[3 + w * 4 + width * 4 * h] = 255
132
+ }
133
+ }
134
+
135
+ context.putImageData(output, box.x, box.y)
136
+ },
137
+ }
138
+
139
+ wdi.CodecH265 = {
140
+ queue: {},
141
+ configed: {},
142
+ isReady: {},
143
+ decoders: {},
144
+ pendingFrames: {},
145
+ underflow: {},
146
+ baseTime: {},
147
+
148
+ create: async function (streamId, context, box) {
149
+ const init = {
150
+ output: this._handleFrame.bind(this, streamId, context, box),
151
+ error: (e) => {
152
+ console.log(e)
153
+ },
154
+ }
155
+ const config = {
156
+ codec: wdi.SpiceVideoCodecValue[wdi.currentCodec],
157
+ codedWidth: 640,
158
+ codedHeight: 480,
159
+ }
160
+ const { supported } = await VideoDecoder.isConfigSupported(config)
161
+ // Проверяем поддерживает ли браузер VideoDecoder
162
+ if (supported) {
163
+ this.decoders[streamId] = new VideoDecoder(init)
164
+ this.decoders[streamId].configure(config)
165
+ this.isReady[streamId] = true
166
+ } else {
167
+ // Try another config.
168
+ console.log('not supported')
169
+ }
170
+ },
171
+
172
+ destroy: function () {
173
+ this.queue = {}
174
+ this.configed = {}
175
+ this.isReady = {}
176
+ this.decoders = {}
177
+ this.pendingFrames = {}
178
+ this.underflow = {}
179
+ this.baseTime = {}
180
+ },
181
+
182
+ addQueue: function (streamId, imageData) {
183
+ if (!this.queues[streamId]) this.queues[streamId] = []
184
+ this.queues[streamId].push(imageData)
185
+ },
186
+
187
+ resetQueues: function (streamId) {
188
+ this.queues[streamId] = []
189
+ },
190
+
191
+ setConfig: function (streamId, box) {
192
+ const config = {
193
+ codec: wdi.SpiceVideoCodecValue[wdi.currentCodec],
194
+ codedWidth: box.width,
195
+ codedHeight: box.height,
196
+ }
197
+ this.decoders[streamId].configure(config)
198
+ this.configed[streamId] = true
199
+ },
200
+
201
+ decode: function (streamId, imageData) {
202
+ if (this.queue[streamId]?.length) {
203
+ this.queue[streamId].forEach((data) => {
204
+ const chunk = new EncodedVideoChunk({
205
+ type: 'key',
206
+ data: data,
207
+ timestamp: performance.now(),
208
+ })
209
+ this.decoders[streamId].decode(chunk)
210
+ })
211
+ this.resetQueues(streamId)
212
+ }
213
+
214
+ const chunk = new EncodedVideoChunk({
215
+ type: 'key',
216
+ data: imageData,
217
+ timestamp: performance.now(),
218
+ })
219
+ this.decoders[streamId].decode(chunk)
220
+ },
221
+
222
+ _handleFrame: function (streamId, context, box, frame) {
223
+ if (!this.pendingFrames[streamId]) this.pendingFrames[streamId] = []
224
+ this.pendingFrames[streamId].push(frame)
225
+
226
+ if (this.underflow[streamId] === undefined) this.underflow[streamId] = true
227
+ if (this.underflow[streamId])
228
+ setTimeout(this._renderFrame.bind(this, streamId, context, box), 0)
229
+ },
230
+ _renderFrame: async function (streamId, context, box) {
231
+ this.underflow[streamId] = this.pendingFrames[streamId].length === 0
232
+ if (this.underflow[streamId]) return
233
+
234
+ const frame = this.pendingFrames[streamId].shift()
235
+
236
+ // Based on the frame's timestamp calculate how much of real time waiting
237
+ // is needed before showing the next frame.
238
+ const timeUntilNextFrame = this._calculateTimeUntilNextFrame(
239
+ frame.timestamp,
240
+ streamId
241
+ )
242
+ await new Promise((r) => {
243
+ setTimeout(r, timeUntilNextFrame)
244
+ })
245
+
246
+ context.drawImage(frame, box.x, box.y, box.width, box.height)
247
+ frame.close()
248
+
249
+ // Immediately schedule rendering of the next frame
250
+ setTimeout(this._renderFrame.bind(this, streamId, context, box), 0)
251
+ },
252
+ _calculateTimeUntilNextFrame: function (timestamp, streamId) {
253
+ if (!this.baseTime[streamId]) this.baseTime[streamId] = performance.now()
254
+ const mediaTime = performance.now() - this.baseTime[streamId]
255
+ return Math.max(0, timestamp / 1000 - mediaTime)
256
+ },
257
+ }