mirror of
https://github.com/jellyfin/jellyfin-web
synced 2025-03-30 19:56:21 +00:00
update now playing bar
This commit is contained in:
parent
7dbc6ede62
commit
8ba393c549
13 changed files with 101 additions and 123 deletions
|
@ -7,9 +7,9 @@
|
|||
${HeaderCameraUpload}
|
||||
</h1>
|
||||
|
||||
<br />
|
||||
<p>${SelectCameraUploadServers}</p>
|
||||
|
||||
<br />
|
||||
<div class="checkboxList uploadServerList">
|
||||
</div>
|
||||
|
||||
|
|
|
@ -20,7 +20,7 @@
|
|||
});
|
||||
}
|
||||
|
||||
function dockedTabs(options) {
|
||||
function appFooter(options) {
|
||||
|
||||
var self = this;
|
||||
|
||||
|
@ -41,7 +41,7 @@
|
|||
initHeadRoom(self, self.element);
|
||||
}
|
||||
|
||||
dockedTabs.prototype.destroy = function () {
|
||||
appFooter.prototype.destroy = function () {
|
||||
var self = this;
|
||||
|
||||
if (self.headroom) {
|
||||
|
@ -52,5 +52,5 @@
|
|||
self.element = null;
|
||||
};
|
||||
|
||||
return dockedTabs;
|
||||
return appFooter;
|
||||
});
|
|
@ -56,7 +56,6 @@
|
|||
bottom: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
top : 100%;
|
||||
/* Above everything, except for the video player and popup overlays */
|
||||
z-index: 1097;
|
||||
color: #fff;
|
||||
|
@ -65,8 +64,6 @@
|
|||
/*box-shadow: 0 -2px 2px 0 rgba(0,0,0,.14),-1px 5px 1px rgba(0,0,0,.12);*/
|
||||
will-change: transform;
|
||||
contain: layout style;
|
||||
height: 100%;
|
||||
transform: translateY(-64px);
|
||||
}
|
||||
|
||||
.hiddenNowPlayingBar .nowPlayingBar {
|
||||
|
|
|
@ -1,5 +1,7 @@
|
|||
// TODO: This needs to be deprecated, but it's used heavily by plugins
|
||||
$.fn.selectmenu = function () {
|
||||
// No-op. This implementation only exists to prevent script errors
|
||||
return this;
|
||||
};
|
||||
define(['jQuery'], function ($) {
|
||||
// TODO: This needs to be deprecated, but it's used heavily by plugins
|
||||
$.fn.selectmenu = function () {
|
||||
// No-op. This implementation only exists to prevent script errors
|
||||
return this;
|
||||
};
|
||||
});
|
|
@ -1,4 +1,4 @@
|
|||
<div id="myPreferencesMenuPage" data-role="page" class="page libraryPage userPreferencesPage noSecondaryNavPage" data-contextname="${HeaderSettings}" data-require="scripts/mypreferencescommon,listViewStyle">
|
||||
<div id="myPreferencesMenuPage" data-role="page" class="page libraryPage userPreferencesPage noSecondaryNavPage" data-contextname="${HeaderSettings}">
|
||||
|
||||
<div data-role="content">
|
||||
<div class="readOnlyContent" style="margin: 0 auto;">
|
||||
|
@ -6,7 +6,7 @@
|
|||
<div>
|
||||
<a href="#" class="clearLink lnkDisplayPreferences">
|
||||
<div class="listItem">
|
||||
<button type="button" is="emby-button" class="fab mini autoSize blue listItemButton" item-icon><i class="md-icon">tv</i></button>
|
||||
<i class="md-icon listItemIcon" style="background-color: #03a9f4;">tv</i>
|
||||
<div class="listItemBody two-line">
|
||||
<div>${ButtonDisplaySettings}</div>
|
||||
<div class="secondary">${ButtonDisplaySettingsHelp}</div>
|
||||
|
@ -16,7 +16,7 @@
|
|||
|
||||
<a href="#" class="clearLink lnkHomeScreenPreferences">
|
||||
<div class="listItem">
|
||||
<button type="button" is="emby-button" class="fab mini autoSize red listItemButton" item-icon><i class="md-icon">home</i></button>
|
||||
<i class="md-icon listItemIcon" style="background-color: #e57373;">home</i>
|
||||
<div class="listItemBody two-line">
|
||||
<div>${ButtonHomeScreenSettings}</div>
|
||||
<div class="secondary">${ButtonHomeScreenSettingsHelp}</div>
|
||||
|
@ -26,7 +26,7 @@
|
|||
|
||||
<a href="#" class="clearLink lnkLanguagePreferences">
|
||||
<div class="listItem">
|
||||
<button type="button" is="emby-button" class="fab mini autoSize green listItemButton" item-icon><i class="md-icon">play_circle_filled</i></button>
|
||||
<i class="md-icon listItemIcon" style="background-color: #81c784;">play_circle_filled</i>
|
||||
<div class="listItemBody two-line">
|
||||
<div>${ButtonPlaybackSettings}</div>
|
||||
<div class="secondary">${ButtonPlaybackSettingsHelp}</div>
|
||||
|
@ -36,7 +36,7 @@
|
|||
|
||||
<a href="#" class="clearLink lnkMyProfile">
|
||||
<div class="listItem">
|
||||
<button type="button" is="emby-button" class="fab mini autoSize orange listItemButton" item-icon><i class="md-icon">person</i></button>
|
||||
<i class="md-icon listItemIcon" style="background-color: #ffd54f;">person</i>
|
||||
<div class="listItemBody two-line">
|
||||
<div>${ButtonProfile}</div>
|
||||
<div class="secondary">${ButtonProfileHelp}</div>
|
||||
|
@ -44,12 +44,20 @@
|
|||
</div>
|
||||
</a>
|
||||
|
||||
<a href="#" class="clearLink lnkCameraUpload hide">
|
||||
<div class="listItem">
|
||||
<i class="md-icon listItemIcon" style="background-color: #673AB7;">photo</i>
|
||||
<div class="listItemBody">
|
||||
<div>${TabCameraUpload}</div>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
|
||||
<a href="#" class="clearLink lnkSync hide">
|
||||
<div class="listItem">
|
||||
<button type="button" is="emby-button" class="fab mini autoSize listItemButton" style="background-color: #673AB7;" item-icon><i class="md-icon">sync</i></button>
|
||||
<div class="listItemBody two-line">
|
||||
<div>${ButtonSyncSettings}</div>
|
||||
<div class="secondary">${ButtonSyncSettingsHelp}</div>
|
||||
<i class="md-icon listItemIcon">file_download</i>
|
||||
<div class="listItemBody">
|
||||
<div>${HeaderOfflineSync}</div>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
|
@ -60,15 +68,15 @@
|
|||
<div>
|
||||
<a href="selectserver.html" class="clearLink selectServer hide">
|
||||
<div class="listItem">
|
||||
<button type="button" is="emby-button" class="fab mini autoSize"><i class="md-icon">wifi</i></button>
|
||||
<div class="listItemBody two-line">
|
||||
<i class="md-icon listItemIcon">wifi</i>
|
||||
<div class="listItemBody">
|
||||
<div>${HeaderSelectServer}</div>
|
||||
</div>
|
||||
</div>
|
||||
</a>
|
||||
<div class="listItem btnLogout">
|
||||
<button type="button" is="emby-button" class="fab mini autoSize"><i class="md-icon">lock</i></button>
|
||||
<div class="listItemBody two-line">
|
||||
<i class="md-icon listItemIcon" style="background-color:#444;">lock</i>
|
||||
<div class="listItemBody">
|
||||
<div>${ButtonSignOut}</div>
|
||||
</div>
|
||||
</div>
|
||||
|
@ -81,8 +89,8 @@
|
|||
<div>
|
||||
<a href="dashboard.html" class="clearLink">
|
||||
<div class="listItem">
|
||||
<button type="button" is="emby-button" class="fab mini autoSize"><i class="md-icon">settings</i></button>
|
||||
<div class="listItemBody two-line">
|
||||
<i class="md-icon listItemIcon">settings</i>
|
||||
<div class="listItemBody">
|
||||
<div>${ButtonServerDashboard}</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
@ -4,7 +4,7 @@
|
|||
<form class="userProfileSettingsForm" style="margin: 0 auto;">
|
||||
|
||||
<h1>
|
||||
${HeaderSync}
|
||||
${HeaderOfflineSync}
|
||||
</h1>
|
||||
|
||||
<br />
|
||||
|
|
|
@ -1,4 +1,4 @@
|
|||
define(['appSettings'], function (appSettings) {
|
||||
define(['appSettings', 'emby-checkbox'], function (appSettings) {
|
||||
|
||||
function loadForm(page, user) {
|
||||
|
||||
|
@ -34,7 +34,7 @@
|
|||
toast(Globalize.translate('SettingsSaved'));
|
||||
});
|
||||
|
||||
if (cameraUploadServers.length || syncPath) {
|
||||
if (cameraUploadServers.length) {
|
||||
if (window.MainActivity) {
|
||||
MainActivity.authorizeStorage();
|
||||
}
|
||||
|
@ -60,18 +60,6 @@
|
|||
return false;
|
||||
});
|
||||
|
||||
view.querySelector('#btnSelectSyncPath').addEventListener('click', function () {
|
||||
|
||||
require(['nativedirectorychooser'], function () {
|
||||
NativeDirectoryChooser.chooseDirectory().then(function (path) {
|
||||
|
||||
if (path) {
|
||||
view.querySelector('#txtSyncPath').value = path;
|
||||
}
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
view.addEventListener('viewshow', function () {
|
||||
var page = this;
|
||||
|
||||
|
@ -83,12 +71,6 @@
|
|||
|
||||
loadForm(page, user);
|
||||
});
|
||||
|
||||
if (AppInfo.supportsSyncPathSetting) {
|
||||
page.querySelector('.fldSyncPath').classList.remove('hide');
|
||||
} else {
|
||||
page.querySelector('.fldSyncPath').classList.add('hide');
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
|
|
|
@ -1046,12 +1046,9 @@
|
|||
|
||||
setDrawerClass();
|
||||
|
||||
//require(['appfooter'], function (appfooter) {
|
||||
// var footer = new appfooter({});
|
||||
// require(['dockedtabs'], function (dockedtabs) {
|
||||
// new dockedtabs({
|
||||
// appFooter: footer
|
||||
// });
|
||||
//require(['appfooter-shared', 'dockedtabs'], function (footer, dockedtabs) {
|
||||
// new dockedtabs({
|
||||
// appFooter: footer
|
||||
// });
|
||||
//});
|
||||
});
|
|
@ -1,47 +1,53 @@
|
|||
pageIdOn('pageinit', 'myPreferencesMenuPage', function () {
|
||||
define(['apphost', 'listViewStyle'], function (appHost) {
|
||||
|
||||
var page = this;
|
||||
return function (view, params) {
|
||||
|
||||
page.querySelector('.btnLogout').addEventListener('click', function () {
|
||||
view.querySelector('.btnLogout').addEventListener('click', function () {
|
||||
|
||||
Dashboard.logout();
|
||||
});
|
||||
Dashboard.logout();
|
||||
});
|
||||
|
||||
});
|
||||
view.addEventListener('viewshow', function () {
|
||||
|
||||
pageIdOn('pageshow', 'myPreferencesMenuPage', function () {
|
||||
var page = this;
|
||||
|
||||
var page = this;
|
||||
var userId = params.userId || Dashboard.getCurrentUserId();
|
||||
|
||||
var userId = getParameterByName('userId') || Dashboard.getCurrentUserId();
|
||||
page.querySelector('.lnkDisplayPreferences').setAttribute('href', 'mypreferencesdisplay.html?userId=' + userId);
|
||||
page.querySelector('.lnkLanguagePreferences').setAttribute('href', 'mypreferenceslanguages.html?userId=' + userId);
|
||||
page.querySelector('.lnkHomeScreenPreferences').setAttribute('href', 'mypreferenceshome.html?userId=' + userId);
|
||||
page.querySelector('.lnkMyProfile').setAttribute('href', 'myprofile.html?userId=' + userId);
|
||||
page.querySelector('.lnkSync').setAttribute('href', 'mysyncsettings.html?userId=' + userId);
|
||||
page.querySelector('.lnkCameraUpload').setAttribute('href', 'camerauploadsettings.html?userId=' + userId);
|
||||
|
||||
page.querySelector('.lnkDisplayPreferences').setAttribute('href', 'mypreferencesdisplay.html?userId=' + userId);
|
||||
page.querySelector('.lnkLanguagePreferences').setAttribute('href', 'mypreferenceslanguages.html?userId=' + userId);
|
||||
page.querySelector('.lnkHomeScreenPreferences').setAttribute('href', 'mypreferenceshome.html?userId=' + userId);
|
||||
page.querySelector('.lnkMyProfile').setAttribute('href', 'myprofile.html?userId=' + userId);
|
||||
page.querySelector('.lnkSync').setAttribute('href', 'mysyncsettings.html?userId=' + userId);
|
||||
if (appHost.supports('cameraupload')) {
|
||||
page.querySelector('.lnkCameraUpload').classList.remove('hide');
|
||||
} else {
|
||||
page.querySelector('.lnkCameraUpload').classList.add('hide');
|
||||
}
|
||||
|
||||
if (Dashboard.capabilities().SupportsSync) {
|
||||
page.querySelector('.lnkSync').classList.remove('hide');
|
||||
} else {
|
||||
page.querySelector('.lnkSync').classList.add('hide');
|
||||
}
|
||||
if (appHost.supports('sync')) {
|
||||
page.querySelector('.lnkSync').classList.remove('hide');
|
||||
} else {
|
||||
page.querySelector('.lnkSync').classList.add('hide');
|
||||
}
|
||||
|
||||
Dashboard.getCurrentUser().then(function (user) {
|
||||
Dashboard.getCurrentUser().then(function (user) {
|
||||
|
||||
page.querySelector('.headerUser').innerHTML = user.Name;
|
||||
page.querySelector('.headerUser').innerHTML = user.Name;
|
||||
|
||||
if (user.Policy.IsAdministrator) {
|
||||
page.querySelector('.adminSection').classList.remove('hide');
|
||||
} else {
|
||||
page.querySelector('.adminSection').classList.add('hide');
|
||||
}
|
||||
});
|
||||
|
||||
if (Dashboard.isConnectMode()) {
|
||||
page.querySelector('.selectServer').classList.remove('hide');
|
||||
} else {
|
||||
page.querySelector('.selectServer').classList.add('hide');
|
||||
}
|
||||
if (user.Policy.IsAdministrator) {
|
||||
page.querySelector('.adminSection').classList.remove('hide');
|
||||
} else {
|
||||
page.querySelector('.adminSection').classList.add('hide');
|
||||
}
|
||||
});
|
||||
|
||||
if (Dashboard.isConnectMode()) {
|
||||
page.querySelector('.selectServer').classList.remove('hide');
|
||||
} else {
|
||||
page.querySelector('.selectServer').classList.add('hide');
|
||||
}
|
||||
});
|
||||
};
|
||||
});
|
|
@ -1,4 +1,4 @@
|
|||
define(['appSettings'], function (appSettings) {
|
||||
define(['appSettings', 'apphost'], function (appSettings, appHost) {
|
||||
|
||||
function loadForm(page, user) {
|
||||
|
||||
|
@ -20,7 +20,7 @@
|
|||
toast(Globalize.translate('SettingsSaved'));
|
||||
});
|
||||
|
||||
if (cameraUploadServers.length || syncPath) {
|
||||
if (syncPath) {
|
||||
if (window.MainActivity) {
|
||||
MainActivity.authorizeStorage();
|
||||
}
|
||||
|
@ -70,7 +70,7 @@
|
|||
loadForm(page, user);
|
||||
});
|
||||
|
||||
if (AppInfo.supportsSyncPathSetting) {
|
||||
if (appHost.supports('customsyncpath')) {
|
||||
page.querySelector('.fldSyncPath').classList.remove('hide');
|
||||
} else {
|
||||
page.querySelector('.fldSyncPath').classList.add('hide');
|
||||
|
|
|
@ -75,7 +75,6 @@
|
|||
return html;
|
||||
}
|
||||
|
||||
var translateY = '-64px';
|
||||
function slideDown(elem) {
|
||||
|
||||
if (elem.classList.contains('hide')) {
|
||||
|
@ -93,8 +92,8 @@
|
|||
|
||||
requestAnimationFrame(function () {
|
||||
var keyframes = [
|
||||
{ transform: 'translateY(' + translateY + ')', offset: 0 },
|
||||
{ transform: 'none', offset: 1 }];
|
||||
{ transform: 'none', offset: 0 },
|
||||
{ transform: 'translateY(100%)', offset: 1 }];
|
||||
var timing = { duration: 200, iterations: 1, fill: 'both', easing: 'ease-out' };
|
||||
elem.animate(keyframes, timing).onfinish = onfinish;
|
||||
});
|
||||
|
@ -115,8 +114,8 @@
|
|||
requestAnimationFrame(function () {
|
||||
|
||||
var keyframes = [
|
||||
{ transform: 'none', offset: 0 },
|
||||
{ transform: 'translateY(' + translateY + ')', offset: 1 }];
|
||||
{ transform: 'translateY(100%)', offset: 0 },
|
||||
{ transform: 'none', offset: 1 }];
|
||||
var timing = { duration: 200, iterations: 1, fill: 'both', easing: 'ease-out' };
|
||||
elem.animate(keyframes, timing);
|
||||
});
|
||||
|
@ -308,17 +307,18 @@
|
|||
|
||||
return new Promise(function (resolve, reject) {
|
||||
|
||||
require(['itemShortcuts', 'css!css/nowplayingbar.css', 'emby-slider'], function (itemShortcuts) {
|
||||
require(['appfooter-shared', 'itemShortcuts', 'css!css/nowplayingbar.css', 'emby-slider'], function (appfooter, itemShortcuts) {
|
||||
|
||||
nowPlayingBarElement = document.querySelector('.nowPlayingBar');
|
||||
var parentContainer = appfooter.element;
|
||||
nowPlayingBarElement = parentContainer.querySelector('.nowPlayingBar');
|
||||
|
||||
if (nowPlayingBarElement) {
|
||||
resolve(nowPlayingBarElement);
|
||||
return;
|
||||
}
|
||||
|
||||
document.body.insertAdjacentHTML('beforeend', getNowPlayingBarHtml());
|
||||
nowPlayingBarElement = document.querySelector('.nowPlayingBar');
|
||||
parentContainer.insertAdjacentHTML('beforeend', getNowPlayingBarHtml());
|
||||
nowPlayingBarElement = parentContainer.querySelector('.nowPlayingBar');
|
||||
|
||||
if (browser.safari && browser.slow) {
|
||||
// Not handled well here. The wrong elements receive events, bar doesn't update quickly enough, etc.
|
||||
|
|
|
@ -861,7 +861,7 @@ var Dashboard = {
|
|||
if (enableVlcAudio) {
|
||||
|
||||
profile.DirectPlayProfiles.push({
|
||||
Container: "aac,mp3,mpa,wav,wma,mp2,ogg,oga,webma,ape,opus",
|
||||
Container: "aac,mp3,mpa,wav,wma,mp2,ogg,oga,webma,ape,m4a,opus,flac",
|
||||
Type: 'Audio'
|
||||
});
|
||||
|
||||
|
@ -987,8 +987,6 @@ var AppInfo = {};
|
|||
|
||||
AppInfo.enableBackButton = isIOS && (window.navigator.standalone || AppInfo.isNativeApp);
|
||||
|
||||
AppInfo.supportsSyncPathSetting = isCordova && isAndroid;
|
||||
|
||||
if (isCordova && isIOS) {
|
||||
AppInfo.moreIcon = 'more-horiz';
|
||||
} else {
|
||||
|
@ -1206,6 +1204,11 @@ var AppInfo = {};
|
|||
return hammer;
|
||||
}
|
||||
|
||||
function createSharedAppFooter(appFooter) {
|
||||
var footer = new appFooter({});
|
||||
return footer;
|
||||
}
|
||||
|
||||
function initRequire() {
|
||||
|
||||
var urlArgs = "v=" + (window.dashboardVersion || new Date().getDate());
|
||||
|
@ -1503,6 +1506,7 @@ var AppInfo = {};
|
|||
|
||||
define("headroom-window", ['headroom'], createWindowHeadroom);
|
||||
define("hammer-main", ['hammer'], createMainContentHammer);
|
||||
define("appfooter-shared", ['appfooter'], createSharedAppFooter);
|
||||
|
||||
// mock this for now. not used in this app
|
||||
define("playbackManager", [], function () {
|
||||
|
@ -2330,7 +2334,8 @@ var AppInfo = {};
|
|||
path: '/mypreferencesmenu.html',
|
||||
dependencies: ['emby-button'],
|
||||
autoFocus: false,
|
||||
transition: 'fade'
|
||||
transition: 'fade',
|
||||
controller: 'scripts/mypreferencescommon'
|
||||
});
|
||||
|
||||
defineRoute({
|
||||
|
@ -2753,10 +2758,7 @@ var AppInfo = {};
|
|||
postInitDependencies.push('cordova/ios/orientation');
|
||||
postInitDependencies.push('cordova/ios/remotecontrols');
|
||||
|
||||
if (Dashboard.capabilities().SupportsSync) {
|
||||
|
||||
postInitDependencies.push('cordova/ios/backgroundfetch');
|
||||
}
|
||||
//postInitDependencies.push('cordova/ios/backgroundfetch');
|
||||
}
|
||||
|
||||
} else if (browserInfo.chrome) {
|
||||
|
|
16
dashboard-ui/thirdparty/paper-button-style.css
vendored
16
dashboard-ui/thirdparty/paper-button-style.css
vendored
|
@ -6,10 +6,6 @@
|
|||
background: #e1f5f3;
|
||||
}
|
||||
|
||||
button.emby-button.fab.blue {
|
||||
background: #03a9f4;
|
||||
}
|
||||
|
||||
button.emby-button.menuButton {
|
||||
color: #212121;
|
||||
text-align: left;
|
||||
|
@ -126,18 +122,6 @@ button.emby-button.notext {
|
|||
padding-right: .25em !important;
|
||||
}
|
||||
|
||||
.fab.green {
|
||||
background-color: #81c784 !important;
|
||||
}
|
||||
|
||||
.fab.orange {
|
||||
background-color: #ffd54f !important;
|
||||
}
|
||||
|
||||
.fab.red {
|
||||
background-color: #e57373 !important;
|
||||
}
|
||||
|
||||
.ui-body-b .paperListLabel, .ui-body-b .fieldDescription, .ui-body-b .selectLabelUnfocused, .ui-body-b .inputLabelUnfocused, .ui-body-b .textareaLabelUnfocused {
|
||||
color: #ccc;
|
||||
}
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue