1
0
Fork 0
mirror of https://github.com/jellyfin/jellyfin-web synced 2025-03-30 19:56:21 +00:00

update video osd

This commit is contained in:
Luke Pulverenti 2017-01-10 15:17:29 -05:00
parent 84679843fe
commit 93ae2c18db
10 changed files with 123 additions and 39 deletions

View file

@ -14,12 +14,12 @@
},
"devDependencies": {},
"ignore": [],
"version": "1.4.457",
"_release": "1.4.457",
"version": "1.4.458",
"_release": "1.4.458",
"_resolution": {
"type": "version",
"tag": "1.4.457",
"commit": "a5034b1f89c9097d2ca2849fe987ac5aa1c360d0"
"tag": "1.4.458",
"commit": "122cc814d3faca2afd6ebc3b406016e382e0b026"
},
"_source": "https://github.com/MediaBrowser/emby-webcomponents.git",
"_target": "^1.2.1",

View file

@ -370,6 +370,16 @@ define(['browser'], function (browser) {
profile.TranscodingProfiles = [];
if (canPlayNativeHls() && browser.iOS) {
profile.TranscodingProfiles.push({
Container: 'ts',
Type: 'Audio',
AudioCodec: 'aac',
Context: 'Streaming',
Protocol: 'hls'
});
}
['opus', 'mp3', 'aac', 'wav'].filter(canPlayAudioFormat).forEach(function (audioFormat) {
profile.TranscodingProfiles.push({
@ -435,7 +445,6 @@ define(['browser'], function (browser) {
}
if (canPlayWebm) {
profile.TranscodingProfiles.push({
Container: 'webm',
Type: 'Video',

View file

@ -73,15 +73,35 @@ define(['events', 'browser', 'pluginManager', 'apphost', 'appSettings'], functio
currentSrc = val;
// Chrome now returns a promise
var promise = elem.play();
if (promise && promise.then) {
return promise;
}
return Promise.resolve();
return playWithPromise(elem);
};
function playWithPromise(elem) {
try {
var promise = elem.play();
if (promise && promise.then) {
// Chrome now returns a promise
return promise.catch(function (e) {
var errorName = (e.name || '').toLowerCase();
// safari uses aborterror
if (errorName === 'notallowederror' ||
errorName === 'aborterror') {
// swallow this error because the user can still click the play button on the video element
return Promise.resolve();
}
return Promise.reject();
});
} else {
return Promise.resolve();
}
} catch (err) {
console.log('error calling video.play: ' + err);
return Promise.reject();
}
}
function getCrossOriginValue(mediaSource) {
return 'anonymous';

View file

@ -17,7 +17,6 @@ define(['browser', 'pluginManager', 'events', 'apphost', 'loading', 'playbackMan
var currentSrc;
var started = false;
var hlsPlayer;
var enableCustomControls;
var winJsPlaybackItem;
var currentPlayOptions;
@ -63,7 +62,6 @@ define(['browser', 'pluginManager', 'events', 'apphost', 'loading', 'playbackMan
var enableMkvProgressive = (item.RunTimeTicks && browser.edgeUwp) ? true : false;
return {
supportsCustomSeeking: appHost.supports('htmlvideoautoplay'),
enableMkvProgressive: enableMkvProgressive,
disableHlsVideoAudioCodecs: disableHlsVideoAudioCodecs
};
@ -76,7 +74,6 @@ define(['browser', 'pluginManager', 'events', 'apphost', 'loading', 'playbackMan
require(['browserdeviceprofile', 'environments/windows-uwp/mediacaps'], function (profileBuilder, uwpMediaCaps) {
var profileOptions = getBaseProfileOptions(item);
profileOptions.supportsCustomSeeking = true;
profileOptions.supportsDts = uwpMediaCaps.supportsDTS();
profileOptions.supportsTrueHd = uwpMediaCaps.supportsDolby();
profileOptions.audioChannels = uwpMediaCaps.getAudioChannels();
@ -130,6 +127,52 @@ define(['browser', 'pluginManager', 'events', 'apphost', 'loading', 'playbackMan
});
};
var supportedFeatures;
function getSupportedFeatures() {
var list = [];
var video = document.createElement('video');
if (video.webkitSupportsPresentationMode && video.webkitSupportsPresentationMode('picture-in-picture') && typeof video.webkitSetPresentationMode === "function") {
list.push('pictureinpicture');
}
return list;
}
self.supports = function (feature) {
if (!supportedFeatures) {
supportedFeatures = getSupportedFeatures();
}
return supportedFeatures.indexOf(feature) !== -1;
};
self.togglePictureInPicture = function () {
return self.setPictureInPictureEnabled(!self.isPictureInPictureEnabled());
};
self.setPictureInPictureEnabled = function (isEnabled) {
var video = mediaElement;
if (video) {
if (video.webkitSupportsPresentationMode && typeof video.webkitSetPresentationMode === "function") {
video.webkitSetPresentationMode(isEnabled ? "picture-in-picture" : "inline");
}
}
};
self.isPictureInPictureEnabled = function (isEnabled) {
var video = mediaElement;
if (video) {
return video.webkitPresentationMode === "picture-in-picture";
}
return false;
};
function getCrossOriginValue(mediaSource) {
return 'anonymous';
@ -619,9 +662,7 @@ define(['browser', 'pluginManager', 'events', 'apphost', 'loading', 'playbackMan
setCurrentTrackElement(subtitleTrackIndexToSetOnPlaying);
if (enableCustomControls) {
this.removeAttribute('controls');
}
seekOnPlaybackStart(e.target);
@ -766,15 +807,6 @@ define(['browser', 'pluginManager', 'events', 'apphost', 'loading', 'playbackMan
return false;
}
function enableCustomVideoControls() {
if (browser.ipad) {
return false;
}
return true;
}
function setTracks(elem, tracks, mediaSource, serverId) {
elem.innerHTML = getTracksHtml(tracks, mediaSource, serverId);
@ -1186,8 +1218,6 @@ define(['browser', 'pluginManager', 'events', 'apphost', 'loading', 'playbackMan
loading.show();
enableCustomControls = enableCustomVideoControls();
var dlg = document.createElement('div');
dlg.classList.add('videoPlayerContainer');
@ -1206,8 +1236,8 @@ define(['browser', 'pluginManager', 'events', 'apphost', 'loading', 'playbackMan
// https://developer.apple.com/library/content/releasenotes/General/WhatsNewInSafari/Articles/Safari_10_0.html
var html = '';
// Can't autoplay in these browsers so we need to use the full controls
if (!enableCustomControls || !appHost.supports('htmlvideoautoplay')) {
// Can't autoplay in these browsers so we need to use the full controls, at least until playback starts
if (!appHost.supports('htmlvideoautoplay')) {
html += '<video class="htmlvideoplayer" preload="metadata" autoplay="autoplay" controls="controls" webkit-playsinline playsinline>';
} else {

View file

@ -208,6 +208,10 @@ define(['events', 'datetime', 'appSettings', 'pluginManager', 'userSettings', 'g
list.push('ToggleFullscreen');
}
if (player.supports && player.supports('pictureinpicture')) {
list.push('PictureInPicture');
}
return list;
}
@ -744,6 +748,11 @@ define(['events', 'datetime', 'appSettings', 'pluginManager', 'userSettings', 'g
}
};
self.togglePictureInPicture = function (player) {
player = player || currentPlayer;
return player.togglePictureInPicture();
};
self.getSubtitleStreamIndex = function (player) {
player = player || currentPlayer;
@ -2369,7 +2378,7 @@ define(['events', 'datetime', 'appSettings', 'pluginManager', 'userSettings', 'g
startProgressInterval(player);
events.trigger(player, 'playbackstart', [state]);
events.trigger(self, 'playbackstart', [player]);
events.trigger(self, 'playbackstart', [player, state]);
});
}

View file

@ -560,6 +560,10 @@
imageLoader.lazyImage(nowPlayingImageElement, url);
userdataButtons.destroy({
element: nowPlayingUserData
});
if (nowPlayingItem.Id) {
ApiClient.getItem(Dashboard.getCurrentUserId(), nowPlayingItem.Id).then(function (item) {
userdataButtons.fill({
@ -568,10 +572,6 @@
element: nowPlayingUserData
});
});
} else {
userdataButtons.destroy({
element: nowPlayingUserData
});
}
}

View file

@ -2384,11 +2384,12 @@ var AppInfo = {};
list.push('bower_components/emby-webcomponents/htmlaudioplayer/plugin');
} else {
// use vlc player
list.push('cordova/vlcplayer');
window.VlcAudio = true;
}
// Needed for video
list.push('cordova/vlcplayer');
} else if (Dashboard.isRunningInCordova() && browser.safari) {
list.push('cordova/audioplayer');
} else {
@ -2535,6 +2536,7 @@ var AppInfo = {};
} else if (browserInfo.safari) {
postInitDependencies.push('cordova/volume');
postInitDependencies.push('cordova/statusbar');
postInitDependencies.push('cordova/chromecast');
postInitDependencies.push('cordova/orientation');
postInitDependencies.push('cordova/remotecontrols');

View file

@ -448,6 +448,10 @@
playbackManager.toggleFullscreen(currentPlayer);
});
view.querySelector('.btnPip').addEventListener('click', function () {
playbackManager.togglePictureInPicture(currentPlayer);
});
view.querySelector('.btnSettings').addEventListener('click', onSettingsButtonClick);
function onPlayerChange() {
@ -652,6 +656,12 @@
view.querySelector('.btnFullscreen').classList.remove('hide');
}
if (supportedCommands.indexOf('PictureInPicture') === -1) {
view.querySelector('.btnPip').classList.add('hide');
} else {
view.querySelector('.btnPip').classList.remove('hide');
}
updateFullscreenIcon();
}

View file

@ -596,6 +596,7 @@
"Rewind": "Rewind",
"Fullscreen": "Full screen",
"ExitFullscreen": "Exit full screen",
"PictureInPicture": "Picture in picture",
"PlayOnAnotherDevice": "Play on another device",
"FastForward": "Fast-forward",
"ButtonTakeScreenshot": "Capture Screenshot",

View file

@ -234,6 +234,9 @@
<button is="paper-icon-button-light" class="btnFullscreen hide autoSize" title="${Fullscreen}">
<i class="xlargePaperIconButton md-icon">&#xE5D0;</i>
</button>
<button is="paper-icon-button-light" class="btnPip hide autoSize" title="${PictureInPicture}">
<i class="xlargePaperIconButton md-icon">&#xE911;</i>
</button>
<div class="osdTimeText"><span class="osdPositionText"></span><span class="osdDurationText"></span><span class="endsAtText"></span></div>