vidply 1.0.8 → 1.0.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/dist/vidply.css +154 -52
- package/dist/vidply.esm.js +1867 -731
- package/dist/vidply.esm.js.map +3 -3
- package/dist/vidply.esm.min.js +3 -3
- package/dist/vidply.esm.min.meta.json +28 -10
- package/dist/vidply.js +1867 -731
- package/dist/vidply.js.map +3 -3
- package/dist/vidply.min.css +1 -1
- package/dist/vidply.min.js +3 -3
- package/dist/vidply.min.meta.json +27 -9
- package/package.json +1 -1
- package/src/controls/ControlBar.js +24 -14
- package/src/controls/TranscriptManager.js +658 -591
- package/src/core/Player.js +831 -331
- package/src/i18n/translations.js +55 -5
- package/src/icons/Icons.js +2 -2
- package/src/styles/vidply.css +154 -52
- package/src/utils/DraggableResizable.js +771 -0
|
@@ -11,7 +11,7 @@
|
|
|
11
11
|
"format": "esm"
|
|
12
12
|
},
|
|
13
13
|
"src/i18n/translations.js": {
|
|
14
|
-
"bytes":
|
|
14
|
+
"bytes": 26879,
|
|
15
15
|
"imports": [],
|
|
16
16
|
"format": "esm"
|
|
17
17
|
},
|
|
@@ -43,7 +43,7 @@
|
|
|
43
43
|
"format": "esm"
|
|
44
44
|
},
|
|
45
45
|
"src/controls/ControlBar.js": {
|
|
46
|
-
"bytes":
|
|
46
|
+
"bytes": 75511,
|
|
47
47
|
"imports": [
|
|
48
48
|
{
|
|
49
49
|
"path": "src/utils/DOMUtils.js",
|
|
@@ -99,8 +99,13 @@
|
|
|
99
99
|
"imports": [],
|
|
100
100
|
"format": "esm"
|
|
101
101
|
},
|
|
102
|
+
"src/utils/DraggableResizable.js": {
|
|
103
|
+
"bytes": 24698,
|
|
104
|
+
"imports": [],
|
|
105
|
+
"format": "esm"
|
|
106
|
+
},
|
|
102
107
|
"src/controls/TranscriptManager.js": {
|
|
103
|
-
"bytes":
|
|
108
|
+
"bytes": 63077,
|
|
104
109
|
"imports": [
|
|
105
110
|
{
|
|
106
111
|
"path": "src/utils/DOMUtils.js",
|
|
@@ -126,6 +131,11 @@
|
|
|
126
131
|
"path": "src/utils/StorageManager.js",
|
|
127
132
|
"kind": "import-statement",
|
|
128
133
|
"original": "../utils/StorageManager.js"
|
|
134
|
+
},
|
|
135
|
+
{
|
|
136
|
+
"path": "src/utils/DraggableResizable.js",
|
|
137
|
+
"kind": "import-statement",
|
|
138
|
+
"original": "../utils/DraggableResizable.js"
|
|
129
139
|
}
|
|
130
140
|
],
|
|
131
141
|
"format": "esm"
|
|
@@ -157,7 +167,7 @@
|
|
|
157
167
|
"format": "esm"
|
|
158
168
|
},
|
|
159
169
|
"src/core/Player.js": {
|
|
160
|
-
"bytes":
|
|
170
|
+
"bytes": 130878,
|
|
161
171
|
"imports": [
|
|
162
172
|
{
|
|
163
173
|
"path": "src/utils/EventEmitter.js",
|
|
@@ -223,6 +233,11 @@
|
|
|
223
233
|
"path": "src/utils/StorageManager.js",
|
|
224
234
|
"kind": "import-statement",
|
|
225
235
|
"original": "../utils/StorageManager.js"
|
|
236
|
+
},
|
|
237
|
+
{
|
|
238
|
+
"path": "src/utils/DraggableResizable.js",
|
|
239
|
+
"kind": "import-statement",
|
|
240
|
+
"original": "../utils/DraggableResizable.js"
|
|
226
241
|
}
|
|
227
242
|
],
|
|
228
243
|
"format": "esm"
|
|
@@ -279,7 +294,7 @@
|
|
|
279
294
|
"bytesInOutput": 1581
|
|
280
295
|
},
|
|
281
296
|
"src/i18n/translations.js": {
|
|
282
|
-
"bytesInOutput":
|
|
297
|
+
"bytesInOutput": 24492
|
|
283
298
|
},
|
|
284
299
|
"src/i18n/i18n.js": {
|
|
285
300
|
"bytesInOutput": 720
|
|
@@ -291,7 +306,7 @@
|
|
|
291
306
|
"bytesInOutput": 10590
|
|
292
307
|
},
|
|
293
308
|
"src/controls/ControlBar.js": {
|
|
294
|
-
"bytesInOutput":
|
|
309
|
+
"bytesInOutput": 36758
|
|
295
310
|
},
|
|
296
311
|
"src/utils/StorageManager.js": {
|
|
297
312
|
"bytesInOutput": 1606
|
|
@@ -302,11 +317,14 @@
|
|
|
302
317
|
"src/controls/KeyboardManager.js": {
|
|
303
318
|
"bytesInOutput": 3738
|
|
304
319
|
},
|
|
320
|
+
"src/utils/DraggableResizable.js": {
|
|
321
|
+
"bytesInOutput": 13781
|
|
322
|
+
},
|
|
305
323
|
"src/controls/TranscriptManager.js": {
|
|
306
|
-
"bytesInOutput":
|
|
324
|
+
"bytesInOutput": 33381
|
|
307
325
|
},
|
|
308
326
|
"src/core/Player.js": {
|
|
309
|
-
"bytesInOutput":
|
|
327
|
+
"bytesInOutput": 43999
|
|
310
328
|
},
|
|
311
329
|
"src/renderers/YouTubeRenderer.js": {
|
|
312
330
|
"bytesInOutput": 4140
|
|
@@ -321,7 +339,7 @@
|
|
|
321
339
|
"bytesInOutput": 8100
|
|
322
340
|
}
|
|
323
341
|
},
|
|
324
|
-
"bytes":
|
|
342
|
+
"bytes": 204514
|
|
325
343
|
}
|
|
326
344
|
}
|
|
327
345
|
}
|
package/package.json
CHANGED
|
@@ -712,12 +712,9 @@ export class ControlBar {
|
|
|
712
712
|
}
|
|
713
713
|
});
|
|
714
714
|
|
|
715
|
-
// Current time - visual text hidden,
|
|
715
|
+
// Current time - visual text hidden, accessible text provided via sr-only span
|
|
716
716
|
this.controls.currentTimeDisplay = DOMUtils.createElement('span', {
|
|
717
|
-
className: `${this.player.options.classPrefix}-current-time
|
|
718
|
-
attributes: {
|
|
719
|
-
'aria-label': i18n.t('time.seconds', { count: 0 })
|
|
720
|
-
}
|
|
717
|
+
className: `${this.player.options.classPrefix}-current-time`
|
|
721
718
|
});
|
|
722
719
|
|
|
723
720
|
// Create visual text inside, hidden from screen readers
|
|
@@ -727,8 +724,15 @@ export class ControlBar {
|
|
|
727
724
|
'aria-hidden': 'true'
|
|
728
725
|
}
|
|
729
726
|
});
|
|
727
|
+
const currentTimeAccessible = DOMUtils.createElement('span', {
|
|
728
|
+
className: 'vidply-sr-only',
|
|
729
|
+
textContent: i18n.t('time.seconds', { count: 0 })
|
|
730
|
+
});
|
|
731
|
+
|
|
730
732
|
this.controls.currentTimeDisplay.appendChild(currentTimeVisual);
|
|
733
|
+
this.controls.currentTimeDisplay.appendChild(currentTimeAccessible);
|
|
731
734
|
this.controls.currentTimeVisual = currentTimeVisual;
|
|
735
|
+
this.controls.currentTimeAccessible = currentTimeAccessible;
|
|
732
736
|
|
|
733
737
|
const separator = DOMUtils.createElement('span', {
|
|
734
738
|
textContent: ' / ',
|
|
@@ -737,12 +741,9 @@ export class ControlBar {
|
|
|
737
741
|
}
|
|
738
742
|
});
|
|
739
743
|
|
|
740
|
-
// Duration - visual text hidden,
|
|
744
|
+
// Duration - visual text hidden, accessible text provided via sr-only span
|
|
741
745
|
this.controls.durationDisplay = DOMUtils.createElement('span', {
|
|
742
|
-
className: `${this.player.options.classPrefix}-duration
|
|
743
|
-
attributes: {
|
|
744
|
-
'aria-label': i18n.t('time.durationPrefix') + i18n.t('time.seconds', { count: 0 })
|
|
745
|
-
}
|
|
746
|
+
className: `${this.player.options.classPrefix}-duration`
|
|
746
747
|
});
|
|
747
748
|
|
|
748
749
|
// Create visual text inside, hidden from screen readers
|
|
@@ -752,8 +753,15 @@ export class ControlBar {
|
|
|
752
753
|
'aria-hidden': 'true'
|
|
753
754
|
}
|
|
754
755
|
});
|
|
756
|
+
const durationAccessible = DOMUtils.createElement('span', {
|
|
757
|
+
className: 'vidply-sr-only',
|
|
758
|
+
textContent: i18n.t('time.durationPrefix') + i18n.t('time.seconds', { count: 0 })
|
|
759
|
+
});
|
|
760
|
+
|
|
755
761
|
this.controls.durationDisplay.appendChild(durationVisual);
|
|
762
|
+
this.controls.durationDisplay.appendChild(durationAccessible);
|
|
756
763
|
this.controls.durationVisual = durationVisual;
|
|
764
|
+
this.controls.durationAccessible = durationAccessible;
|
|
757
765
|
|
|
758
766
|
container.appendChild(this.controls.currentTimeDisplay);
|
|
759
767
|
container.appendChild(separator);
|
|
@@ -1831,8 +1839,9 @@ export class ControlBar {
|
|
|
1831
1839
|
const currentTime = this.player.state.currentTime;
|
|
1832
1840
|
// Update visual text (hidden from screen readers)
|
|
1833
1841
|
this.controls.currentTimeVisual.textContent = TimeUtils.formatTime(currentTime);
|
|
1834
|
-
|
|
1835
|
-
|
|
1842
|
+
if (this.controls.currentTimeAccessible) {
|
|
1843
|
+
this.controls.currentTimeAccessible.textContent = TimeUtils.formatDuration(currentTime);
|
|
1844
|
+
}
|
|
1836
1845
|
}
|
|
1837
1846
|
}
|
|
1838
1847
|
|
|
@@ -1841,8 +1850,9 @@ export class ControlBar {
|
|
|
1841
1850
|
const duration = this.player.state.duration;
|
|
1842
1851
|
// Update visual text (hidden from screen readers)
|
|
1843
1852
|
this.controls.durationVisual.textContent = TimeUtils.formatTime(duration);
|
|
1844
|
-
|
|
1845
|
-
|
|
1853
|
+
if (this.controls.durationAccessible) {
|
|
1854
|
+
this.controls.durationAccessible.textContent = i18n.t('time.durationPrefix') + TimeUtils.formatDuration(duration);
|
|
1855
|
+
}
|
|
1846
1856
|
}
|
|
1847
1857
|
}
|
|
1848
1858
|
|