myetv-player 1.1.5 → 1.1.6
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/README.md +2 -0
- package/dist/myetv-player.js +51 -1
- package/dist/myetv-player.min.js +49 -0
- package/package.json +2 -1
- package/plugins/facebook/README.md +3 -0
- package/plugins/facebook/myetv-player-facebook-plugin.js +283 -17
- package/plugins/vimeo/README.md +3 -0
- package/plugins/vimeo/myetv-player-vimeo.js +333 -39
- package/plugins/youtube/README.md +7 -0
- package/plugins/youtube/myetv-player-youtube-plugin.js +711 -174
- package/src/controls.js +46 -0
- package/src/core.js +5 -1
package/src/controls.js
CHANGED
|
@@ -229,6 +229,52 @@ clearControlsTimeout() {
|
|
|
229
229
|
}
|
|
230
230
|
}
|
|
231
231
|
|
|
232
|
+
// Default controlbar styles injection
|
|
233
|
+
injectDefaultControlbarStyles() {
|
|
234
|
+
if (document.getElementById('default-controlbar-styles')) {
|
|
235
|
+
return;
|
|
236
|
+
}
|
|
237
|
+
|
|
238
|
+
const controlBarOpacity = Math.max(0, Math.min(1, this.options.controlBarOpacity));
|
|
239
|
+
const titleOverlayOpacity = Math.max(0, Math.min(1, this.options.titleOverlayOpacity));
|
|
240
|
+
|
|
241
|
+
const style = document.createElement('style');
|
|
242
|
+
style.id = 'default-controlbar-styles';
|
|
243
|
+
style.textContent = `
|
|
244
|
+
.video-wrapper:not(.youtube-active):not(.vimeo-active):not(.facebook-active) .controls {
|
|
245
|
+
background: linear-gradient(
|
|
246
|
+
to top,
|
|
247
|
+
rgba(0, 0, 0, ${controlBarOpacity}) 0%,
|
|
248
|
+
rgba(0, 0, 0, ${controlBarOpacity * 0.89}) 20%,
|
|
249
|
+
rgba(0, 0, 0, ${controlBarOpacity * 0.74}) 40%,
|
|
250
|
+
rgba(0, 0, 0, ${controlBarOpacity * 0.53}) 60%,
|
|
251
|
+
rgba(0, 0, 0, ${controlBarOpacity * 0.32}) 80%,
|
|
252
|
+
rgba(0, 0, 0, ${controlBarOpacity * 0.21}) 100%
|
|
253
|
+
);
|
|
254
|
+
backdrop-filter: blur(3px);
|
|
255
|
+
min-height: 60px;
|
|
256
|
+
padding-bottom: 10px;
|
|
257
|
+
}
|
|
258
|
+
|
|
259
|
+
.video-wrapper:not(.youtube-active):not(.vimeo-active):not(.facebook-active) .title-overlay {
|
|
260
|
+
background: linear-gradient(
|
|
261
|
+
to bottom,
|
|
262
|
+
rgba(0, 0, 0, ${titleOverlayOpacity}) 0%,
|
|
263
|
+
rgba(0, 0, 0, ${titleOverlayOpacity * 0.89}) 20%,
|
|
264
|
+
rgba(0, 0, 0, ${titleOverlayOpacity * 0.74}) 40%,
|
|
265
|
+
rgba(0, 0, 0, ${titleOverlayOpacity * 0.53}) 60%,
|
|
266
|
+
rgba(0, 0, 0, ${titleOverlayOpacity * 0.32}) 80%,
|
|
267
|
+
rgba(0, 0, 0, ${titleOverlayOpacity * 0.21}) 100%
|
|
268
|
+
);
|
|
269
|
+
backdrop-filter: blur(3px);
|
|
270
|
+
min-height: 80px;
|
|
271
|
+
padding-top: 20px;
|
|
272
|
+
}
|
|
273
|
+
`;
|
|
274
|
+
|
|
275
|
+
document.head.appendChild(style);
|
|
276
|
+
}
|
|
277
|
+
|
|
232
278
|
// Debug methods
|
|
233
279
|
enableAutoHideDebug() {
|
|
234
280
|
this.autoHideDebug = true;
|
package/src/core.js
CHANGED
|
@@ -29,6 +29,8 @@ constructor(videoElement, options = {}) {
|
|
|
29
29
|
videoTitle: '', // Title text to show in overlay
|
|
30
30
|
videoSubtitle: '', // Subtitle text to show in overlay
|
|
31
31
|
persistentTitle: false, // If true, title overlay stays visible
|
|
32
|
+
controlBarOpacity: options.controlBarOpacity !== undefined ? options.controlBarOpacity : 0.95, // Opacity of control bar (0.0 to 1.0)
|
|
33
|
+
titleOverlayOpacity: options.titleOverlayOpacity !== undefined ? options.titleOverlayOpacity : 0.95, // Opacity of title overlay (0.0 to 1.0)
|
|
32
34
|
debug: false, // Enable/disable debug logging
|
|
33
35
|
autoplay: false, // if video should autoplay at start
|
|
34
36
|
defaultQuality: 'auto', // 'auto', '1080p', '720p', '480p', etc.
|
|
@@ -169,7 +171,9 @@ constructor(videoElement, options = {}) {
|
|
|
169
171
|
};
|
|
170
172
|
|
|
171
173
|
this.lastTimeUpdate = 0; // For throttling timeupdate events
|
|
172
|
-
|
|
174
|
+
// Inject default styles
|
|
175
|
+
this.injectDefaultControlbarStyles();
|
|
176
|
+
// Set language if specified
|
|
173
177
|
if (this.options.language && this.isI18nAvailable()) {
|
|
174
178
|
VideoPlayerTranslations.setLanguage(this.options.language);
|
|
175
179
|
}
|