shaka-player 4.2.5 → 4.3.1
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/.github/workflows/build-and-test.yaml +7 -0
- package/.github/workflows/sync-labels.yaml +1 -1
- package/.github/workflows/update-issues.yaml +1 -1
- package/AUTHORS +4 -0
- package/CHANGELOG.md +114 -74
- package/CONTRIBUTORS +4 -0
- package/README.md +14 -0
- package/conditional/dummy_cast_proxy.js +120 -0
- package/demo/common/assets.js +58 -0
- package/demo/common/message_ids.js +22 -1
- package/demo/config.js +89 -5
- package/demo/demo.less +7 -1
- package/demo/index.html +8 -1
- package/demo/locales/en.json +21 -1
- package/demo/locales/source.json +82 -2
- package/demo/main.js +57 -1
- package/demo/search.js +2 -0
- package/demo/visualizer.js +337 -0
- package/demo/visualizer_button.js +103 -0
- package/dist/controls.css +1 -1
- package/dist/controls.css.map +1 -1
- package/dist/demo.compiled.debug.js +107 -88
- package/dist/demo.compiled.debug.map +4 -4
- package/dist/demo.compiled.js +107 -88
- package/dist/demo.compiled.map +4 -4
- package/dist/demo.css +1 -1
- package/dist/demo.css.map +1 -1
- package/dist/deps.js +21 -13
- package/dist/locales.js +31 -31
- package/dist/receiver.compiled.debug.js +75 -77
- package/dist/receiver.compiled.debug.map +3 -3
- package/dist/receiver.compiled.js +75 -77
- package/dist/receiver.compiled.map +3 -3
- package/dist/shaka-player.compiled.d.ts +181 -27
- package/dist/shaka-player.compiled.debug.d.ts +181 -27
- package/dist/shaka-player.compiled.debug.externs.js +169 -31
- package/dist/shaka-player.compiled.debug.js +510 -450
- package/dist/shaka-player.compiled.debug.map +4 -4
- package/dist/shaka-player.compiled.externs.js +169 -31
- package/dist/shaka-player.compiled.js +912 -874
- package/dist/shaka-player.compiled.map +4 -4
- package/dist/shaka-player.ui.d.ts +181 -27
- package/dist/shaka-player.ui.debug.d.ts +181 -27
- package/dist/shaka-player.ui.debug.externs.js +169 -31
- package/dist/shaka-player.ui.debug.js +533 -471
- package/dist/shaka-player.ui.debug.map +4 -4
- package/dist/shaka-player.ui.externs.js +169 -31
- package/dist/shaka-player.ui.js +1073 -1036
- package/dist/shaka-player.ui.map +4 -4
- package/docs/design/lcevc-architecture.png +0 -0
- package/docs/design/lcevc-demo.png +0 -0
- package/docs/design/lcevc-integration.md +72 -0
- package/docs/tutorials/fairplay.md +7 -0
- package/docs/tutorials/faq.md +1 -1
- package/docs/tutorials/ui.md +7 -7
- package/docs/tutorials/upgrade.md +6 -0
- package/externs/ima.js +13 -1
- package/externs/lcevc.js +81 -0
- package/externs/mux.js +1 -42
- package/externs/shaka/ads.js +11 -1
- package/externs/shaka/manifest_parser.js +5 -1
- package/externs/shaka/mp4_parser.js +3 -0
- package/externs/shaka/player.js +178 -15
- package/lib/abr/simple_abr_manager.js +7 -0
- package/lib/ads/ad_manager.js +0 -8
- package/lib/ads/client_side_ad.js +15 -0
- package/lib/ads/client_side_ad_manager.js +21 -8
- package/lib/ads/server_side_ad.js +15 -0
- package/lib/ads/server_side_ad_manager.js +3 -3
- package/lib/cast/cast_utils.js +2 -0
- package/lib/cea/dummy_cea_parser.js +28 -0
- package/lib/cea/i_cea_parser.js +14 -2
- package/lib/cea/mp4_cea_parser.js +108 -5
- package/lib/config/auto_show_text.js +33 -0
- package/lib/dash/dash_parser.js +1 -1
- package/lib/hls/hls_parser.js +808 -384
- package/lib/lcevc/lcevc_dil.js +152 -0
- package/lib/media/closed_caption_parser.js +9 -6
- package/lib/media/drm_engine.js +14 -6
- package/lib/media/media_source_capabilities.js +36 -0
- package/lib/media/media_source_engine.js +113 -28
- package/lib/media/presentation_timeline.js +26 -11
- package/lib/media/segment_reference.js +49 -1
- package/lib/media/streaming_engine.js +142 -12
- package/lib/media/transmuxer.js +78 -21
- package/lib/offline/storage.js +1 -0
- package/lib/player.js +456 -77
- package/lib/polyfill/media_capabilities.js +9 -5
- package/lib/polyfill/patchedmediakeys_apple.js +63 -4
- package/lib/text/vtt_text_parser.js +35 -1
- package/lib/util/dom_utils.js +0 -1
- package/lib/util/error.js +17 -0
- package/lib/util/fake_event.js +2 -0
- package/lib/util/id3_utils.js +300 -0
- package/lib/util/mime_utils.js +3 -6
- package/lib/util/mp4_box_parsers.js +39 -5
- package/lib/util/mp4_parser.js +35 -0
- package/lib/util/player_configuration.js +23 -1
- package/lib/util/stream_utils.js +5 -3
- package/lib/util/ts_parser.js +499 -0
- package/maintained-branches.md +2 -2
- package/package.json +7 -4
- package/roadmap.md +5 -3
- package/test/ads/ad_manager_unit.js +182 -29
- package/test/cast/cast_utils_unit.js +3 -1
- package/test/dash/dash_parser_content_protection_unit.js +1 -0
- package/test/dash/dash_parser_live_unit.js +1 -0
- package/test/dash/dash_parser_manifest_unit.js +93 -1
- package/test/dash/dash_parser_segment_base_unit.js +1 -0
- package/test/dash/dash_parser_segment_list_unit.js +1 -0
- package/test/dash/dash_parser_segment_template_unit.js +1 -0
- package/test/demo/demo_unit.js +2 -1
- package/test/hls/hls_live_unit.js +253 -19
- package/test/hls/hls_parser_unit.js +631 -12
- package/test/media/closed_caption_parser_unit.js +2 -1
- package/test/media/drm_engine_integration.js +3 -1
- package/test/media/media_source_engine_integration.js +71 -6
- package/test/media/media_source_engine_unit.js +10 -5
- package/test/media/streaming_engine_integration.js +4 -1
- package/test/media/streaming_engine_unit.js +144 -1
- package/test/media/transmuxer_integration.js +21 -10
- package/test/player_integration.js +224 -82
- package/test/player_unit.js +5 -2
- package/test/polyfill/media_capabilities_unit.js +21 -23
- package/test/polyfill/patchedmediakeys_apple_unit.js +130 -0
- package/test/test/assets/id3-metadata.aac +0 -0
- package/test/test/assets/id3-metadata.ts +0 -0
- package/test/test/assets/thumbnails-sprites.vtt +10 -0
- package/test/test/assets/thumbnails.vtt +10 -0
- package/test/test/util/dash_parser_util.js +2 -0
- package/test/test/util/fake_ad.js +21 -0
- package/test/test/util/fake_media_source_engine.js +7 -0
- package/test/test/util/id3_generator.js +100 -0
- package/test/test/util/manifest_generator.js +3 -6
- package/test/test/util/simple_fakes.js +4 -0
- package/test/test/util/stream_generator.js +38 -0
- package/test/test/util/test_scheme.js +43 -14
- package/test/text/vtt_text_parser_unit.js +11 -0
- package/test/util/id3_utils_unit.js +116 -0
- package/test/util/ts_parser_unit.js +77 -0
- package/third_party/closure-uri/uri.js +1 -1
- package/ui/less/containers.less +7 -0
- package/ui/ui.js +43 -4
|
@@ -0,0 +1,337 @@
|
|
|
1
|
+
/*! @license
|
|
2
|
+
* Shaka Player
|
|
3
|
+
* Copyright 2016 Google LLC
|
|
4
|
+
* SPDX-License-Identifier: Apache-2.0
|
|
5
|
+
*/
|
|
6
|
+
|
|
7
|
+
|
|
8
|
+
goog.provide('shakaDemo.Visualizer');
|
|
9
|
+
|
|
10
|
+
goog.require('shakaDemo.BoolInput');
|
|
11
|
+
|
|
12
|
+
|
|
13
|
+
/**
|
|
14
|
+
* Manages a visualizer that shows the buffering progress of the player.
|
|
15
|
+
*/
|
|
16
|
+
shakaDemo.Visualizer = class {
|
|
17
|
+
/**
|
|
18
|
+
* @param {!HTMLCanvasElement} canvas
|
|
19
|
+
* @param {!HTMLElement} div
|
|
20
|
+
* @param {!HTMLElement} screenshotDiv
|
|
21
|
+
* @param {!HTMLElement} controlsDiv
|
|
22
|
+
* @param {!HTMLVideoElement} video
|
|
23
|
+
* @param {!shaka.Player} player
|
|
24
|
+
*/
|
|
25
|
+
constructor(canvas, div, screenshotDiv, controlsDiv, video, player) {
|
|
26
|
+
/** @private {!HTMLCanvasElement} */
|
|
27
|
+
this.canvas_ = canvas;
|
|
28
|
+
|
|
29
|
+
/** @private {!HTMLElement} */
|
|
30
|
+
this.div_ = div;
|
|
31
|
+
|
|
32
|
+
this.active = false;
|
|
33
|
+
|
|
34
|
+
/** @private {!HTMLElement} */
|
|
35
|
+
this.screenshotDiv_ = screenshotDiv;
|
|
36
|
+
|
|
37
|
+
/** @private {!HTMLVideoElement} */
|
|
38
|
+
this.video_ = video;
|
|
39
|
+
|
|
40
|
+
/** @private {!shaka.Player} */
|
|
41
|
+
this.player_ = player;
|
|
42
|
+
|
|
43
|
+
/** @private {boolean} */
|
|
44
|
+
this.takeAutoScreenshots_ = false;
|
|
45
|
+
|
|
46
|
+
/** @private {shaka.util.Timer} */
|
|
47
|
+
this.timer_ = new shaka.util.Timer(() => {
|
|
48
|
+
this.ageUpdates_();
|
|
49
|
+
this.updateCanvas_();
|
|
50
|
+
this.takeAutomaticScreenshots_();
|
|
51
|
+
});
|
|
52
|
+
|
|
53
|
+
/** @private {number} */
|
|
54
|
+
this.lastCurrentTime_ = 0;
|
|
55
|
+
|
|
56
|
+
/** @private {number} */
|
|
57
|
+
this.colorIOffset_ = 0;
|
|
58
|
+
|
|
59
|
+
/** @private {boolean} */
|
|
60
|
+
this.autoScreenshotTaken_ = false;
|
|
61
|
+
|
|
62
|
+
/**
|
|
63
|
+
* @private {!Array.<{
|
|
64
|
+
* age: number,
|
|
65
|
+
* start: number,
|
|
66
|
+
* end: number,
|
|
67
|
+
* contentType: string,
|
|
68
|
+
* }>}
|
|
69
|
+
*/
|
|
70
|
+
this.updates_ = [];
|
|
71
|
+
|
|
72
|
+
// Listen for when new buffers are appended.
|
|
73
|
+
player.addEventListener('segmentappended', (event) => {
|
|
74
|
+
const start = /** @type {number} */ (event['start']);
|
|
75
|
+
const end = /** @type {number} */ (event['end']);
|
|
76
|
+
const contentType = /** @type {string} */ (event['contentType']);
|
|
77
|
+
this.updates_.push({age: 0, start, end, contentType});
|
|
78
|
+
});
|
|
79
|
+
|
|
80
|
+
// Add controls.
|
|
81
|
+
const inputContainer = new shakaDemo.InputContainer(
|
|
82
|
+
controlsDiv, null, shakaDemo.InputContainer.Style.VERTICAL, null);
|
|
83
|
+
|
|
84
|
+
inputContainer.addRow(null, null);
|
|
85
|
+
this.screenshotButton_ = document.createElement('button');
|
|
86
|
+
inputContainer.latestElementContainer.appendChild(this.screenshotButton_);
|
|
87
|
+
this.screenshotButton_.textContent = shakaDemoMain.getLocalizedString(
|
|
88
|
+
shakaDemo.MessageIds.VISUALIZER_SCREENSHOT_BUTTON);
|
|
89
|
+
this.screenshotButton_.classList.add('mdl-button');
|
|
90
|
+
this.screenshotButton_.classList.add('mdl-button--colored');
|
|
91
|
+
this.screenshotButton_.classList.add('mdl-js-button');
|
|
92
|
+
this.screenshotButton_.classList.add('mdl-js-ripple-effect');
|
|
93
|
+
this.screenshotButton_.addEventListener('click', () => {
|
|
94
|
+
this.takeScreenshot_();
|
|
95
|
+
});
|
|
96
|
+
|
|
97
|
+
inputContainer.addRow(
|
|
98
|
+
shakaDemo.MessageIds.VISUALIZER_AUTO_SCREENSHOT_TOGGLE, null);
|
|
99
|
+
/** @private {!shakaDemo.BoolInput} */
|
|
100
|
+
this.autoScreenshotToggle_ = new shakaDemo.BoolInput(
|
|
101
|
+
inputContainer, shakaDemo.MessageIds.VISUALIZER_AUTO_SCREENSHOT_TOGGLE,
|
|
102
|
+
(input) => {
|
|
103
|
+
this.takeAutoScreenshots_ = input.checked;
|
|
104
|
+
});
|
|
105
|
+
}
|
|
106
|
+
|
|
107
|
+
/** Starts the visualizer updating, and un-hides it. */
|
|
108
|
+
start() {
|
|
109
|
+
this.timer_.tickEvery(shakaDemo.Visualizer.updateFrequency_);
|
|
110
|
+
this.div_.classList.remove('hidden');
|
|
111
|
+
// Start out as though an automatic screenshot had been taken, so that it
|
|
112
|
+
// doesn't take a screenshot during the initial buffering.
|
|
113
|
+
this.autoScreenshotTaken_ = true;
|
|
114
|
+
}
|
|
115
|
+
|
|
116
|
+
/** Stops the visualizer updating, and hides it. */
|
|
117
|
+
stop() {
|
|
118
|
+
this.timer_.stop();
|
|
119
|
+
this.div_.classList.add('hidden');
|
|
120
|
+
this.updates_ = [];
|
|
121
|
+
}
|
|
122
|
+
|
|
123
|
+
/**
|
|
124
|
+
* @param {!CanvasRenderingContext2D} ctx
|
|
125
|
+
* @param {!Array.<string>} colors
|
|
126
|
+
* @param {number} y
|
|
127
|
+
* @param {number} h
|
|
128
|
+
* @param {number} scaleFactor Measured in pixels per second.
|
|
129
|
+
* @param {number} activeI
|
|
130
|
+
* @private
|
|
131
|
+
*/
|
|
132
|
+
drawBufferInfoCanvasBar_(ctx, colors, y, h, scaleFactor, activeI) {
|
|
133
|
+
// Define the muted colors. These are used to signify the end of buffered
|
|
134
|
+
// periods.
|
|
135
|
+
const mutedColors = colors.filter((color) => {
|
|
136
|
+
return color.replaceAll('F', 'A').replaceAll('0', '4');
|
|
137
|
+
});
|
|
138
|
+
|
|
139
|
+
/**
|
|
140
|
+
* Converts a time value from seconds to screen position.
|
|
141
|
+
* @param {number} time
|
|
142
|
+
* @return {number}
|
|
143
|
+
*/
|
|
144
|
+
const timeToPosition = (time) => {
|
|
145
|
+
return Math.round((time - this.video_.currentTime) * scaleFactor +
|
|
146
|
+
(this.canvas_.width / 2));
|
|
147
|
+
};
|
|
148
|
+
|
|
149
|
+
// Choose text drawing settings.
|
|
150
|
+
const fontSize = Math.floor(h / 4);
|
|
151
|
+
ctx.textAlign = 'center';
|
|
152
|
+
ctx.font = 'bold ' + fontSize + 'px serif';
|
|
153
|
+
ctx.textBaseline = 'bottom';
|
|
154
|
+
const longFormText = scaleFactor > fontSize * 4;
|
|
155
|
+
|
|
156
|
+
// Draw updates.
|
|
157
|
+
for (const update of this.updates_) {
|
|
158
|
+
let s = timeToPosition(update.start);
|
|
159
|
+
let e = timeToPosition(update.end);
|
|
160
|
+
if (e >= 0 && s < this.canvas_.width) {
|
|
161
|
+
s = Math.max(s, 0);
|
|
162
|
+
e = Math.min(e, this.canvas_.width);
|
|
163
|
+
ctx.fillStyle = '#FFFFFF';
|
|
164
|
+
// Note that these are drawn at reduced opacity, so that multiple
|
|
165
|
+
// updates in the same time range (e.g. video and audio) will visibly
|
|
166
|
+
// overlap.
|
|
167
|
+
// They also fade away further over time, until they are gone entirely.
|
|
168
|
+
ctx.globalAlpha =
|
|
169
|
+
0.1 + 0.2 * (1 - update.age / shakaDemo.Visualizer.maxUpdateAge_);
|
|
170
|
+
ctx.fillRect(s, y, e - s, h);
|
|
171
|
+
ctx.globalAlpha = 1;
|
|
172
|
+
|
|
173
|
+
// Also draw text labels, to show what type of segment this was.
|
|
174
|
+
let text = update.contentType.toUpperCase();
|
|
175
|
+
if (!longFormText) {
|
|
176
|
+
text = text[0];
|
|
177
|
+
}
|
|
178
|
+
const textX = s + (e - s) / 2;
|
|
179
|
+
let textY = y + h;
|
|
180
|
+
switch (update.contentType) {
|
|
181
|
+
case 'video':
|
|
182
|
+
textY -= fontSize * 2;
|
|
183
|
+
break;
|
|
184
|
+
case 'audio':
|
|
185
|
+
textY -= fontSize;
|
|
186
|
+
break;
|
|
187
|
+
// Text is at the bottom.
|
|
188
|
+
}
|
|
189
|
+
ctx.fillText(text, textX, textY);
|
|
190
|
+
}
|
|
191
|
+
}
|
|
192
|
+
|
|
193
|
+
// Draw buffered ranges.
|
|
194
|
+
const gapDetectionThreshold =
|
|
195
|
+
this.player_.getConfiguration().streaming.gapDetectionThreshold;
|
|
196
|
+
for (let i = 0; i < this.video_.buffered.length; i++) {
|
|
197
|
+
let s = timeToPosition(this.video_.buffered.start(i));
|
|
198
|
+
let e = timeToPosition(this.video_.buffered.end(i));
|
|
199
|
+
if (e >= 0 && s < this.canvas_.width) {
|
|
200
|
+
s = Math.max(s, 0);
|
|
201
|
+
e = Math.min(e, this.canvas_.width);
|
|
202
|
+
const colorI = (i - activeI + this.colorIOffset_ +
|
|
203
|
+
10000 * colors.length) % colors.length;
|
|
204
|
+
const barHeight = (h - 3 * fontSize) / colors.length;
|
|
205
|
+
const barY = y + (colorI * barHeight);
|
|
206
|
+
|
|
207
|
+
// Draw the bar as a richer color.
|
|
208
|
+
ctx.fillStyle = colors[colorI];
|
|
209
|
+
ctx.fillRect(s, barY, e - s, barHeight);
|
|
210
|
+
|
|
211
|
+
// Draw the gap detection threshold as a more muted color.
|
|
212
|
+
const gdtS = Math.max(s, timeToPosition(
|
|
213
|
+
this.video_.buffered.end(i) - gapDetectionThreshold));
|
|
214
|
+
ctx.fillStyle = mutedColors[colorI];
|
|
215
|
+
ctx.fillRect(gdtS, barY, e - gdtS, barHeight);
|
|
216
|
+
}
|
|
217
|
+
}
|
|
218
|
+
}
|
|
219
|
+
|
|
220
|
+
/** @private */
|
|
221
|
+
takeAutomaticScreenshots_() {
|
|
222
|
+
if (this.video_.readyState <= 2) {
|
|
223
|
+
// When the video stops, due to a lack of buffered material, take a
|
|
224
|
+
// screenshot automatically, so that this information will not be lost
|
|
225
|
+
// if this is a freeze.
|
|
226
|
+
if (!this.autoScreenshotTaken_ && this.takeAutoScreenshots_) {
|
|
227
|
+
this.takeScreenshot_();
|
|
228
|
+
this.autoScreenshotTaken_ = true;
|
|
229
|
+
}
|
|
230
|
+
} else {
|
|
231
|
+
this.autoScreenshotTaken_ = false;
|
|
232
|
+
}
|
|
233
|
+
}
|
|
234
|
+
|
|
235
|
+
/** @private */
|
|
236
|
+
ageUpdates_() {
|
|
237
|
+
for (const update of this.updates_) {
|
|
238
|
+
update.age += shakaDemo.Visualizer.updateFrequency_;
|
|
239
|
+
}
|
|
240
|
+
this.updates_ = this.updates_.filter((update) => {
|
|
241
|
+
return update.age < shakaDemo.Visualizer.maxUpdateAge_;
|
|
242
|
+
});
|
|
243
|
+
}
|
|
244
|
+
|
|
245
|
+
/** @private */
|
|
246
|
+
takeScreenshot_() {
|
|
247
|
+
shaka.util.Dom.removeAllChildren(this.screenshotDiv_);
|
|
248
|
+
|
|
249
|
+
// Make the screenshot.
|
|
250
|
+
const screenshotCanvas = /** @type {!HTMLCanvasElement} */ (
|
|
251
|
+
document.createElement('canvas'));
|
|
252
|
+
screenshotCanvas.width = this.canvas_.width;
|
|
253
|
+
screenshotCanvas.height = this.canvas_.height;
|
|
254
|
+
const ctx = /** @type {CanvasRenderingContext2D} */ (
|
|
255
|
+
screenshotCanvas.getContext('2d'));
|
|
256
|
+
ctx.drawImage(this.canvas_, 0, 0);
|
|
257
|
+
this.screenshotDiv_.appendChild(screenshotCanvas);
|
|
258
|
+
}
|
|
259
|
+
|
|
260
|
+
/** @private */
|
|
261
|
+
updateCanvas_() {
|
|
262
|
+
// Make sure the size of the canvas data is the size of the canvas element.
|
|
263
|
+
this.canvas_.width = this.canvas_.offsetWidth;
|
|
264
|
+
this.canvas_.height = this.canvas_.offsetHeight;
|
|
265
|
+
|
|
266
|
+
// Get the context.
|
|
267
|
+
const ctx = /** @type {CanvasRenderingContext2D} */ (
|
|
268
|
+
this.canvas_.getContext('2d'));
|
|
269
|
+
ctx.imageSmoothingEnabled = false;
|
|
270
|
+
|
|
271
|
+
// Make a black background.
|
|
272
|
+
ctx.fillStyle = '#000000';
|
|
273
|
+
ctx.fillRect(0, 0, this.canvas_.width, this.canvas_.height);
|
|
274
|
+
|
|
275
|
+
// Define the colors.
|
|
276
|
+
// Each buffered range is represented by a bar of a solid color, so that
|
|
277
|
+
// gaps in the presentation are more visually obvious; the two bars
|
|
278
|
+
// representing the two ranges will be at different y-positions and be
|
|
279
|
+
// drawn with different colors.
|
|
280
|
+
// These colors are, in order: red, green, and blue.
|
|
281
|
+
const colors = ['#FF0000', '#00FF00', '#0000FF'];
|
|
282
|
+
|
|
283
|
+
// Determine what buffered range is centered, so that colors can remain
|
|
284
|
+
// consistent between frames.
|
|
285
|
+
let activeI = -1;
|
|
286
|
+
let lastActiveI = -1;
|
|
287
|
+
const lastTime = this.lastCurrentTime_;
|
|
288
|
+
const currentTime = this.video_.currentTime;
|
|
289
|
+
const buffered = this.video_.buffered;
|
|
290
|
+
for (let i = 0; i < buffered.length; i++) {
|
|
291
|
+
if (lastTime >= buffered.start(i) && lastTime <= buffered.end(i)) {
|
|
292
|
+
lastActiveI = i;
|
|
293
|
+
}
|
|
294
|
+
if (currentTime >= buffered.start(i) && currentTime <= buffered.end(i)) {
|
|
295
|
+
activeI = i;
|
|
296
|
+
}
|
|
297
|
+
}
|
|
298
|
+
this.lastCurrentTime_ = currentTime;
|
|
299
|
+
|
|
300
|
+
// Determine if the video has moved between two buffered ranges. If so,
|
|
301
|
+
// update the offset so that the colors remain consistent.
|
|
302
|
+
if (activeI != -1 && lastActiveI != -1) {
|
|
303
|
+
this.colorIOffset_ += activeI - lastActiveI;
|
|
304
|
+
}
|
|
305
|
+
|
|
306
|
+
// Draw bars at various zoom levels.
|
|
307
|
+
const scaleFactors = [50, 5];
|
|
308
|
+
const overallHeight = this.canvas_.height / scaleFactors.length;
|
|
309
|
+
for (let i = 0; i < scaleFactors.length; i++) {
|
|
310
|
+
const h = overallHeight * 0.75;
|
|
311
|
+
const y = (overallHeight * i) + ((overallHeight - h) / 2);
|
|
312
|
+
this.drawBufferInfoCanvasBar_(
|
|
313
|
+
ctx, colors, y, h, scaleFactors[i], activeI);
|
|
314
|
+
}
|
|
315
|
+
|
|
316
|
+
// Draw the indicator tick at the center.
|
|
317
|
+
ctx.fillStyle = '#FFFFFF';
|
|
318
|
+
const tickWidth = 2;
|
|
319
|
+
ctx.fillRect(
|
|
320
|
+
(this.canvas_.width / 2) - (tickWidth / 2), 0,
|
|
321
|
+
tickWidth, this.canvas_.height);
|
|
322
|
+
}
|
|
323
|
+
};
|
|
324
|
+
|
|
325
|
+
|
|
326
|
+
/**
|
|
327
|
+
* How many seconds an update event should be displayed.
|
|
328
|
+
* @const {number}
|
|
329
|
+
*/
|
|
330
|
+
shakaDemo.Visualizer.maxUpdateAge_ = 20;
|
|
331
|
+
|
|
332
|
+
|
|
333
|
+
/**
|
|
334
|
+
* How often the visualizer should update, in seconds.
|
|
335
|
+
* @const {number}
|
|
336
|
+
*/
|
|
337
|
+
shakaDemo.Visualizer.updateFrequency_ = 0.05;
|
|
@@ -0,0 +1,103 @@
|
|
|
1
|
+
/*! @license
|
|
2
|
+
* Shaka Player
|
|
3
|
+
* Copyright 2016 Google LLC
|
|
4
|
+
* SPDX-License-Identifier: Apache-2.0
|
|
5
|
+
*/
|
|
6
|
+
|
|
7
|
+
|
|
8
|
+
goog.provide('shakaDemo.VisualizerButton');
|
|
9
|
+
|
|
10
|
+
goog.require('shakaDemo.MessageIds');
|
|
11
|
+
|
|
12
|
+
/**
|
|
13
|
+
* A custom UI overflow button, to allow users to show the visualizer.
|
|
14
|
+
* This cannot actually extend shaka.ui.Element, as that class does not exist
|
|
15
|
+
* at load-time when in uncompiled mode.
|
|
16
|
+
* @extends {shaka.ui.Element}
|
|
17
|
+
*/
|
|
18
|
+
shakaDemo.VisualizerButton = class extends shaka.ui.Element {
|
|
19
|
+
/**
|
|
20
|
+
* @param {!HTMLElement} parent
|
|
21
|
+
* @param {!shaka.ui.Controls} controls
|
|
22
|
+
*/
|
|
23
|
+
constructor(parent, controls) {
|
|
24
|
+
super(parent, controls);
|
|
25
|
+
|
|
26
|
+
/** @private {!HTMLButtonElement} */
|
|
27
|
+
this.button_ = /** @type {!HTMLButtonElement} */ (
|
|
28
|
+
document.createElement('button'));
|
|
29
|
+
this.button_.classList.add('shaka-pip-button');
|
|
30
|
+
this.button_.classList.add('shaka-tooltip');
|
|
31
|
+
|
|
32
|
+
/** @private {!HTMLElement} */
|
|
33
|
+
this.icon_ = /** @type {!HTMLElement} */ (
|
|
34
|
+
document.createElement('i'));
|
|
35
|
+
this.icon_.classList.add('material-icons-round');
|
|
36
|
+
this.setIcon_();
|
|
37
|
+
this.button_.appendChild(this.icon_);
|
|
38
|
+
|
|
39
|
+
const label = document.createElement('label');
|
|
40
|
+
label.classList.add('shaka-overflow-button-label');
|
|
41
|
+
label.classList.add('shaka-overflow-menu-only');
|
|
42
|
+
this.nameSpan_ = document.createElement('span');
|
|
43
|
+
label.appendChild(this.nameSpan_);
|
|
44
|
+
|
|
45
|
+
/** @private {!HTMLElement} */
|
|
46
|
+
this.currentPipState_ = /** @type {!HTMLElement} */ (
|
|
47
|
+
document.createElement('span'));
|
|
48
|
+
this.currentPipState_.classList.add('shaka-current-selection-span');
|
|
49
|
+
label.appendChild(this.currentPipState_);
|
|
50
|
+
|
|
51
|
+
this.button_.appendChild(label);
|
|
52
|
+
|
|
53
|
+
this.parent.appendChild(this.button_);
|
|
54
|
+
|
|
55
|
+
this.eventManager.listen(this.button_, 'click', () => {
|
|
56
|
+
shakaDemoMain.setIsVisualizerActive(
|
|
57
|
+
!shakaDemoMain.getIsVisualizerActive());
|
|
58
|
+
this.setIcon_();
|
|
59
|
+
});
|
|
60
|
+
|
|
61
|
+
this.eventManager.listen(
|
|
62
|
+
this.localization, shaka.ui.Localization.LOCALE_UPDATED, () => {
|
|
63
|
+
this.updateLocalizedStrings_();
|
|
64
|
+
});
|
|
65
|
+
|
|
66
|
+
this.eventManager.listen(
|
|
67
|
+
this.localization, shaka.ui.Localization.LOCALE_CHANGED, () => {
|
|
68
|
+
this.updateLocalizedStrings_();
|
|
69
|
+
});
|
|
70
|
+
}
|
|
71
|
+
|
|
72
|
+
/** @private */
|
|
73
|
+
updateLocalizedStrings_() {
|
|
74
|
+
this.nameSpan_.textContent = shakaDemoMain.getLocalizedString(
|
|
75
|
+
shakaDemo.MessageIds.VISUALIZER_BUTTON);
|
|
76
|
+
// TODO: Make sure that the screenreader description of this control is
|
|
77
|
+
// localized!
|
|
78
|
+
}
|
|
79
|
+
|
|
80
|
+
/** @private */
|
|
81
|
+
setIcon_() {
|
|
82
|
+
if (shakaDemoMain.getIsVisualizerActive()) {
|
|
83
|
+
this.icon_.textContent = 'bar_chart';
|
|
84
|
+
} else {
|
|
85
|
+
this.icon_.textContent = 'add_chart';
|
|
86
|
+
}
|
|
87
|
+
}
|
|
88
|
+
};
|
|
89
|
+
|
|
90
|
+
/**
|
|
91
|
+
* @implements {shaka.extern.IUIElement.Factory}
|
|
92
|
+
* @final
|
|
93
|
+
*/
|
|
94
|
+
shakaDemo.VisualizerButton.Factory = class {
|
|
95
|
+
/** @override */
|
|
96
|
+
create(rootElement, controls) {
|
|
97
|
+
return new shakaDemo.VisualizerButton(rootElement, controls);
|
|
98
|
+
}
|
|
99
|
+
};
|
|
100
|
+
|
|
101
|
+
// This button is registered inside setup in shakaDemo.Main, rather than
|
|
102
|
+
// statically here, since shaka.ui.Controls does not exist in this stage of the
|
|
103
|
+
// load process.
|
package/dist/controls.css
CHANGED
|
@@ -3,7 +3,7 @@
|
|
|
3
3
|
* Copyright 2016 Google LLC
|
|
4
4
|
* SPDX-License-Identifier: Apache-2.0
|
|
5
5
|
*/
|
|
6
|
-
.shaka-hidden{display:none!important}.shaka-video-container{position:relative;top:0;left:0;display:flex}.shaka-video-container .material-icons-round{font-family:"Material Icons Round";font-size:24px}.shaka-video-container *{font-family:Roboto-Regular,Roboto,sans-serif,TengwarTelcontar}.shaka-video-container:fullscreen{width:100%;height:100%;background-color:#000}.shaka-video-container:fullscreen .shaka-text-container{font-size:4.4vmin}.shaka-video-container:-webkit-full-screen{width:100%;height:100%;background-color:#000}.shaka-video-container:-webkit-full-screen .shaka-text-container{font-size:4.4vmin}.shaka-video-container:-moz-full-screen{width:100%;height:100%;background-color:#000}.shaka-video-container:-moz-full-screen .shaka-text-container{font-size:4.4vmin}.shaka-video-container:-ms-fullscreen{width:100%;height:100%;background-color:#000}.shaka-video-container:-ms-fullscreen .shaka-text-container{font-size:4.4vmin}.shaka-controls-container{position:absolute;top:0;left:0;right:0;bottom:0;margin:0;padding:0;width:100%;height:100%;box-sizing:border-box;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;z-index:1}.shaka-video-container:not([shaka-controls=true]) .shaka-controls-container{display:none}.shaka-controls-container *{flex-shrink:0}.shaka-controls-container[casting=true] .shaka-fullscreen-button{display:none}.shaka-bottom-controls{width:96%;padding:0;padding-bottom:2.5%;z-index:1}.shaka-controls-button-panel{padding:0;margin:0;display:flex;flex-direction:row;justify-content:flex-end;align-items:center;overflow:hidden;min-width:48px;font-size:12px;font-weight:400;font-style:normal;user-select:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;opacity:0;transition:opacity cubic-bezier(.4, 0, .6, 1) .6s}.shaka-controls-container[casting=true] .shaka-controls-button-panel,.shaka-controls-container[shown=true] .shaka-controls-button-panel{opacity:1}.shaka-controls-button-panel>*{color:#fff;height:32px;line-height:.5;margin:1px;padding:0 5px;background:0 0;border:0;cursor:pointer}.shaka-controls-button-panel .shaka-overflow-menu-only{display:none}.shaka-play-button-container{margin:0;width:100%;height:100%;flex-shrink:1;position:absolute;left:0;right:0;top:0;bottom:0;display:flex;justify-content:center;align-items:center}.shaka-statistics-container{overflow-x:hidden;overflow-y:auto;min-width:300px;color:#fff;background-color:rgba(35 35 35 / 90%);font-size:14px;padding:5px 10px;border-radius:2px;position:absolute;z-index:2;left:15px;top:15px;opacity:0;transition:opacity cubic-bezier(.4, 0, .6, 1) .6s}.shaka-controls-container[casting=true] .shaka-statistics-container,.shaka-controls-container[shown=true] .shaka-statistics-container{opacity:1}.shaka-statistics-container div{display:flex;justify-content:space-between}.shaka-statistics-container span{color:#969696}.shaka-context-menu{background-color:rgba(35 35 35 / 90%);border-radius:2px;position:absolute;z-index:3}.shaka-context-menu button{padding:5px 10px;width:100%;display:flex;align-items:center;color:#fff;background:0 0;border:0;cursor:pointer}.shaka-context-menu button:hover{background-color:rgba(50 50 50 / 90%)}.shaka-context-menu label{padding:0 20px;align-items:flex-start;color:#fff;cursor:pointer}.shaka-context-menu .shaka-current-selection-span{align-items:flex-start;color:#fff;cursor:pointer}.shaka-scrim-container{margin:0;width:100%;height:100%;flex-shrink:1;position:absolute;left:0;right:0;top:0;bottom:0;opacity:0;transition:opacity cubic-bezier(.4, 0, .6, 1) .6s;background:linear-gradient(to top,#000 0,transparent 15%)}.shaka-controls-container[casting=true] .shaka-scrim-container,.shaka-controls-container[shown=true] .shaka-scrim-container{opacity:1}.shaka-text-container{position:absolute;left:0;right:0;top:0;bottom:0;pointer-events:none;bottom:0;width:100%;min-width:48px;transition:bottom cubic-bezier(.4, 0, .6, 1) .1s;transition-delay:0.5s;font-size:20px;line-height:1.4;color:#fff}.shaka-text-container span.shaka-text-wrapper{display:inline;background:0 0}.shaka-controls-container[shown=true]~.shaka-text-container{bottom:15%;transition-delay:0s}.shaka-spinner-container{position:absolute;left:0;right:0;top:0;bottom:0;width:100%;height:100%;flex-shrink:1;display:flex;justify-content:center;align-items:center}.shaka-video-container:not([shaka-controls=true]) .shaka-spinner-container{display:none}.shaka-spinner{position:relative;top:0;left:0;margin:0;box-sizing:border-box;padding:calc(15.6% / 2);width:0;height:0;filter:drop-shadow(0 0 2px rgba(255 255 255 / 50%))}.shaka-play-button{box-sizing:border-box;padding:calc(15% / 2);width:0;height:0;margin:0;border-radius:50%;box-shadow:rgba(0 0 0 / 10%) 0 0 20px 0;border:none;background-size:50%;background-repeat:no-repeat;background-position:center center;background-color:rgba(255 255 255 / 90%);opacity:0;transition:opacity cubic-bezier(.4, 0, .6, 1) .6s}.shaka-controls-container[casting=true] .shaka-play-button,.shaka-controls-container[shown=true] .shaka-play-button{opacity:1}.shaka-play-button[icon=play]{background-image:url("data:image/svg+xml,%3Csvg%20fill%3D%22%23000000%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20width%3D%2224%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%20%20%20%20%3Cpath%20d%3D%22M8%205v14l11-7z%22%2F%3E%0A%20%20%20%20%3Cpath%20d%3D%22M0%200h24v24H0z%22%20fill%3D%22none%22%2F%3E%0A%3C%2Fsvg%3E")}.shaka-play-button[icon=pause]{background-image:url("data:image/svg+xml,%3Csvg%20fill%3D%22%23000000%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20width%3D%2224%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%20%20%20%20%3Cpath%20d%3D%22M6%2019h4V5H6v14zm8-14v14h4V5h-4z%22%2F%3E%0A%20%20%20%20%3Cpath%20d%3D%22M0%200h24v24H0z%22%20fill%3D%22none%22%2F%3E%0A%3C%2Fsvg%3E")}.shaka-current-time{font-size:14px;color:#fff;cursor:pointer}.shaka-current-time[disabled]{background-color:transparent;color:#fff;cursor:default}.shaka-controls-container button:focus,.shaka-controls-container input:focus{outline:1px solid Highlight}.shaka-controls-container button:-moz-focus-inner,.shaka-controls-container input:-moz-focus-outer{outline:0;border:0}.shaka-controls-container:not(.shaka-keyboard-navigation) button:focus,.shaka-controls-container:not(.shaka-keyboard-navigation) input:focus{outline:0}.shaka-range-container{position:relative;top:0;left:0;margin:calc((12px - 4px)/ 2) 6px;height:4px;border-radius:4px;background:#fff}.shaka-volume-bar-container{width:100px;padding:0}.shaka-range-element{-webkit-appearance:none;background:0 0;position:absolute;top:0;left:0;right:0;bottom:0;margin:0;padding:0;width:100%;height:100%;height:12px;top:calc((4px - 12px)/ 2);z-index:1}.shaka-range-element::-webkit-slider-runnable-track{width:100%;cursor:pointer;height:12px;background:0 0;color:transparent;border:none}.shaka-range-element::-webkit-slider-thumb{-webkit-appearance:none;border:none;border-radius:12px;height:12px;width:12px;background:#fff}.shaka-range-element::-moz-range-track{width:100%;cursor:pointer;height:12px;background:0 0;color:transparent;border:none}.shaka-range-element::-moz-range-thumb{-webkit-appearance:none;border:none;border-radius:12px;height:12px;width:12px;background:#fff}.shaka-seek-bar-container{opacity:0;transition:opacity cubic-bezier(.4, 0, .6, 1) .6s}.shaka-controls-container[casting=true] .shaka-seek-bar-container,.shaka-controls-container[shown=true] .shaka-seek-bar-container{opacity:1}.shaka-ad-markers{position:absolute;top:0;left:0;right:0;bottom:0;margin:0;padding:0;width:100%;height:100%}/*!
|
|
6
|
+
.shaka-hidden{display:none!important}.shaka-video-container{position:relative;top:0;left:0;display:flex}.shaka-video-container .material-icons-round{font-family:"Material Icons Round";font-size:24px}.shaka-video-container *{font-family:Roboto-Regular,Roboto,sans-serif,TengwarTelcontar}.shaka-video-container:fullscreen{width:100%;height:100%;background-color:#000}.shaka-video-container:fullscreen .shaka-text-container{font-size:4.4vmin}.shaka-video-container:-webkit-full-screen{width:100%;height:100%;background-color:#000}.shaka-video-container:-webkit-full-screen .shaka-text-container{font-size:4.4vmin}.shaka-video-container:-moz-full-screen{width:100%;height:100%;background-color:#000}.shaka-video-container:-moz-full-screen .shaka-text-container{font-size:4.4vmin}.shaka-video-container:-ms-fullscreen{width:100%;height:100%;background-color:#000}.shaka-video-container:-ms-fullscreen .shaka-text-container{font-size:4.4vmin}.shaka-controls-container{position:absolute;top:0;left:0;right:0;bottom:0;margin:0;padding:0;width:100%;height:100%;box-sizing:border-box;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;z-index:1}.shaka-video-container:not([shaka-controls=true]) .shaka-controls-container{display:none}.shaka-controls-container *{flex-shrink:0}.shaka-controls-container[casting=true] .shaka-fullscreen-button{display:none}.shaka-canvas-container{position:absolute;top:0;left:0;right:0;bottom:0;margin:0;padding:0;width:100%;height:100%}.shaka-bottom-controls{width:96%;padding:0;padding-bottom:2.5%;z-index:1}.shaka-controls-button-panel{padding:0;margin:0;display:flex;flex-direction:row;justify-content:flex-end;align-items:center;overflow:hidden;min-width:48px;font-size:12px;font-weight:400;font-style:normal;user-select:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;opacity:0;transition:opacity cubic-bezier(.4, 0, .6, 1) .6s}.shaka-controls-container[casting=true] .shaka-controls-button-panel,.shaka-controls-container[shown=true] .shaka-controls-button-panel{opacity:1}.shaka-controls-button-panel>*{color:#fff;height:32px;line-height:.5;margin:1px;padding:0 5px;background:0 0;border:0;cursor:pointer}.shaka-controls-button-panel .shaka-overflow-menu-only{display:none}.shaka-play-button-container{margin:0;width:100%;height:100%;flex-shrink:1;position:absolute;left:0;right:0;top:0;bottom:0;display:flex;justify-content:center;align-items:center}.shaka-statistics-container{overflow-x:hidden;overflow-y:auto;min-width:300px;color:#fff;background-color:rgba(35 35 35 / 90%);font-size:14px;padding:5px 10px;border-radius:2px;position:absolute;z-index:2;left:15px;top:15px;opacity:0;transition:opacity cubic-bezier(.4, 0, .6, 1) .6s}.shaka-controls-container[casting=true] .shaka-statistics-container,.shaka-controls-container[shown=true] .shaka-statistics-container{opacity:1}.shaka-statistics-container div{display:flex;justify-content:space-between}.shaka-statistics-container span{color:#969696}.shaka-context-menu{background-color:rgba(35 35 35 / 90%);border-radius:2px;position:absolute;z-index:3}.shaka-context-menu button{padding:5px 10px;width:100%;display:flex;align-items:center;color:#fff;background:0 0;border:0;cursor:pointer}.shaka-context-menu button:hover{background-color:rgba(50 50 50 / 90%)}.shaka-context-menu label{padding:0 20px;align-items:flex-start;color:#fff;cursor:pointer}.shaka-context-menu .shaka-current-selection-span{align-items:flex-start;color:#fff;cursor:pointer}.shaka-scrim-container{margin:0;width:100%;height:100%;flex-shrink:1;position:absolute;left:0;right:0;top:0;bottom:0;opacity:0;transition:opacity cubic-bezier(.4, 0, .6, 1) .6s;background:linear-gradient(to top,#000 0,transparent 15%)}.shaka-controls-container[casting=true] .shaka-scrim-container,.shaka-controls-container[shown=true] .shaka-scrim-container{opacity:1}.shaka-text-container{position:absolute;left:0;right:0;top:0;bottom:0;pointer-events:none;bottom:0;width:100%;min-width:48px;transition:bottom cubic-bezier(.4, 0, .6, 1) .1s;transition-delay:0.5s;font-size:20px;line-height:1.4;color:#fff}.shaka-text-container span.shaka-text-wrapper{display:inline;background:0 0}.shaka-controls-container[shown=true]~.shaka-text-container{bottom:15%;transition-delay:0s}.shaka-spinner-container{position:absolute;left:0;right:0;top:0;bottom:0;width:100%;height:100%;flex-shrink:1;display:flex;justify-content:center;align-items:center}.shaka-video-container:not([shaka-controls=true]) .shaka-spinner-container{display:none}.shaka-spinner{position:relative;top:0;left:0;margin:0;box-sizing:border-box;padding:calc(15.6% / 2);width:0;height:0;filter:drop-shadow(0 0 2px rgba(255 255 255 / 50%))}.shaka-play-button{box-sizing:border-box;padding:calc(15% / 2);width:0;height:0;margin:0;border-radius:50%;box-shadow:rgba(0 0 0 / 10%) 0 0 20px 0;border:none;background-size:50%;background-repeat:no-repeat;background-position:center center;background-color:rgba(255 255 255 / 90%);opacity:0;transition:opacity cubic-bezier(.4, 0, .6, 1) .6s}.shaka-controls-container[casting=true] .shaka-play-button,.shaka-controls-container[shown=true] .shaka-play-button{opacity:1}.shaka-play-button[icon=play]{background-image:url("data:image/svg+xml,%3Csvg%20fill%3D%22%23000000%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20width%3D%2224%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%20%20%20%20%3Cpath%20d%3D%22M8%205v14l11-7z%22%2F%3E%0A%20%20%20%20%3Cpath%20d%3D%22M0%200h24v24H0z%22%20fill%3D%22none%22%2F%3E%0A%3C%2Fsvg%3E")}.shaka-play-button[icon=pause]{background-image:url("data:image/svg+xml,%3Csvg%20fill%3D%22%23000000%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20width%3D%2224%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%20%20%20%20%3Cpath%20d%3D%22M6%2019h4V5H6v14zm8-14v14h4V5h-4z%22%2F%3E%0A%20%20%20%20%3Cpath%20d%3D%22M0%200h24v24H0z%22%20fill%3D%22none%22%2F%3E%0A%3C%2Fsvg%3E")}.shaka-current-time{font-size:14px;color:#fff;cursor:pointer}.shaka-current-time[disabled]{background-color:transparent;color:#fff;cursor:default}.shaka-controls-container button:focus,.shaka-controls-container input:focus{outline:1px solid Highlight}.shaka-controls-container button:-moz-focus-inner,.shaka-controls-container input:-moz-focus-outer{outline:0;border:0}.shaka-controls-container:not(.shaka-keyboard-navigation) button:focus,.shaka-controls-container:not(.shaka-keyboard-navigation) input:focus{outline:0}.shaka-range-container{position:relative;top:0;left:0;margin:calc((12px - 4px)/ 2) 6px;height:4px;border-radius:4px;background:#fff}.shaka-volume-bar-container{width:100px;padding:0}.shaka-range-element{-webkit-appearance:none;background:0 0;position:absolute;top:0;left:0;right:0;bottom:0;margin:0;padding:0;width:100%;height:100%;height:12px;top:calc((4px - 12px)/ 2);z-index:1}.shaka-range-element::-webkit-slider-runnable-track{width:100%;cursor:pointer;height:12px;background:0 0;color:transparent;border:none}.shaka-range-element::-webkit-slider-thumb{-webkit-appearance:none;border:none;border-radius:12px;height:12px;width:12px;background:#fff}.shaka-range-element::-moz-range-track{width:100%;cursor:pointer;height:12px;background:0 0;color:transparent;border:none}.shaka-range-element::-moz-range-thumb{-webkit-appearance:none;border:none;border-radius:12px;height:12px;width:12px;background:#fff}.shaka-seek-bar-container{opacity:0;transition:opacity cubic-bezier(.4, 0, .6, 1) .6s}.shaka-controls-container[casting=true] .shaka-seek-bar-container,.shaka-controls-container[shown=true] .shaka-seek-bar-container{opacity:1}.shaka-ad-markers{position:absolute;top:0;left:0;right:0;bottom:0;margin:0;padding:0;width:100%;height:100%}/*!
|
|
7
7
|
* @license
|
|
8
8
|
* The SVG/CSS buffering spinner is based on http://codepen.io/jczimm/pen/vEBpoL
|
|
9
9
|
* Some local modifications have been made.
|
package/dist/controls.css.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["$stdin"],"names":[],"mappings":"AAaA,cAGE,QAAS,eAkBX,uBASE,SAAU,SAIV,IAAK,EACL,KAAM,EAGN,QAAS,KAIX,6CACE,YAAa,uBACb,UAAW,KAEb,yBACE,YAAa,cAAc,CAAE,MAAM,CAAE,UAAU,CAAE,iBAQnD,kCACE,MAAO,KACP,OAAQ,KACR,iBAAkB,KAEpB,wDAIE,UAAW,QAEb,2CACE,MAAO,KACP,OAAQ,KACR,iBAAkB,KAEpB,iEAIE,UAAW,QAEb,wCACE,MAAO,KACP,OAAQ,KACR,iBAAkB,KAEpB,8DAIE,UAAW,QAEb,sCACE,MAAO,KACP,OAAQ,KACR,iBAAkB,KAEpB,4DAIE,UAAW,QAab,0BASE,SAAU,SAEV,IAAK,EACL,KAAM,EACN,MAAO,EACP,OAAQ,EACR,OAAQ,EACR,QAAS,EACT,MAAO,KACP,OAAQ,KAER,WAAY,WAEZ,QAAS,KAET,eAAgB,OAEhB,gBAAiB,SAEjB,YAAa,OAKb,QAAS,EAEX,4EACE,QAAS,KAEX,4BACE,YAAa,EAKf,iEACE,QAAS,
|
|
1
|
+
{"version":3,"sources":["$stdin"],"names":[],"mappings":"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"}
|