mirror of
https://github.com/jellyfin/jellyfin-web
synced 2025-03-30 19:56:21 +00:00
add setting for photo libraries
This commit is contained in:
parent
89c8c73cab
commit
775db5c5e8
16 changed files with 119 additions and 68 deletions
|
@ -14,12 +14,12 @@
|
||||||
},
|
},
|
||||||
"devDependencies": {},
|
"devDependencies": {},
|
||||||
"ignore": [],
|
"ignore": [],
|
||||||
"version": "1.4.170",
|
"version": "1.4.171",
|
||||||
"_release": "1.4.170",
|
"_release": "1.4.171",
|
||||||
"_resolution": {
|
"_resolution": {
|
||||||
"type": "version",
|
"type": "version",
|
||||||
"tag": "1.4.170",
|
"tag": "1.4.171",
|
||||||
"commit": "61f0b1c9783d19db9b76882badbf575500dea6e9"
|
"commit": "388435c54b3b15c417b8d76701cf09b42b968a08"
|
||||||
},
|
},
|
||||||
"_source": "https://github.com/MediaBrowser/emby-webcomponents.git",
|
"_source": "https://github.com/MediaBrowser/emby-webcomponents.git",
|
||||||
"_target": "^1.2.1",
|
"_target": "^1.2.1",
|
||||||
|
|
|
@ -65,6 +65,8 @@
|
||||||
margin: 0;
|
margin: 0;
|
||||||
transition: none;
|
transition: none;
|
||||||
border: 3px solid transparent;
|
border: 3px solid transparent;
|
||||||
|
/* Needed in case cardBox is a button */
|
||||||
|
background-color: transparent;
|
||||||
}
|
}
|
||||||
|
|
||||||
.cardBox-focustransform {
|
.cardBox-focustransform {
|
||||||
|
|
|
@ -355,6 +355,10 @@
|
||||||
return true;
|
return true;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
if (options.size) {
|
||||||
|
return true;
|
||||||
|
}
|
||||||
|
|
||||||
return browser.touch;
|
return browser.touch;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -424,8 +428,8 @@
|
||||||
var exitAnimation = options.exitAnimation || defaultExitAnimation;
|
var exitAnimation = options.exitAnimation || defaultExitAnimation;
|
||||||
|
|
||||||
// If it's not fullscreen then lower the default animation speed to make it open really fast
|
// If it's not fullscreen then lower the default animation speed to make it open really fast
|
||||||
var entryAnimationDuration = options.entryAnimationDuration || (options.size ? 200 : 300);
|
var entryAnimationDuration = options.entryAnimationDuration || (options.size ? 180 : 280);
|
||||||
var exitAnimationDuration = options.exitAnimationDuration || (options.size ? 200 : 300);
|
var exitAnimationDuration = options.exitAnimationDuration || (options.size ? 180 : 280);
|
||||||
|
|
||||||
dlg.animationConfig = {
|
dlg.animationConfig = {
|
||||||
// scale up
|
// scale up
|
||||||
|
|
|
@ -63,32 +63,5 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
.emby-tab-button-ripple-effect {
|
.emby-tab-button-ripple-effect {
|
||||||
position: absolute !important;
|
background: #141414 !important;
|
||||||
top: 0 !important;
|
|
||||||
left: 0 !important;
|
|
||||||
right: 0 !important;
|
|
||||||
bottom: 0 !important;
|
|
||||||
width: auto !important;
|
|
||||||
height: auto !important;
|
|
||||||
background: #181818 !important;
|
|
||||||
animation: emby-tab-button-ripple-animation .5s !important;
|
|
||||||
transform-origin: center center !important;
|
|
||||||
border-radius: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
@keyframes emby-tab-button-ripple-animation {
|
|
||||||
0% {
|
|
||||||
transform: scale(.2, 1);
|
|
||||||
opacity: 0.5;
|
|
||||||
}
|
|
||||||
|
|
||||||
50% {
|
|
||||||
transform: none;
|
|
||||||
opacity: 1;
|
|
||||||
}
|
|
||||||
|
|
||||||
100% {
|
|
||||||
transform: none;
|
|
||||||
opacity: 0;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
|
@ -42,13 +42,16 @@
|
||||||
elem.classList.add('emby-tab-button-selection-bar-active');
|
elem.classList.add('emby-tab-button-selection-bar-active');
|
||||||
}
|
}
|
||||||
|
|
||||||
function animtateSelectionBar(bar, start, pos, duration) {
|
function animtateSelectionBar(bar, start, pos, duration, onFinish) {
|
||||||
|
|
||||||
var endTransform = pos ? ('translateX(' + pos + 'px)') : 'none';
|
var endTransform = pos ? ('translateX(' + pos + 'px)') : 'none';
|
||||||
var startTransform = start ? ('translateX(' + start + 'px)') : 'none';
|
var startTransform = start ? ('translateX(' + start + 'px)') : 'none';
|
||||||
|
|
||||||
if (!duration || !bar.animate) {
|
if (!duration || !bar.animate) {
|
||||||
bar.style.transform = endTransform;
|
bar.style.transform = endTransform;
|
||||||
|
if (onFinish) {
|
||||||
|
onFinish();
|
||||||
|
}
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -61,9 +64,9 @@
|
||||||
bar.animate(keyframes, {
|
bar.animate(keyframes, {
|
||||||
duration: duration,
|
duration: duration,
|
||||||
iterations: 1,
|
iterations: 1,
|
||||||
easing: 'ease-out',
|
easing: 'linear',
|
||||||
fill: 'forwards'
|
fill: 'forwards'
|
||||||
});
|
}).onFinish = onFinish;
|
||||||
}
|
}
|
||||||
|
|
||||||
function moveSelectionBar(tabs, newButton, oldButton, animate) {
|
function moveSelectionBar(tabs, newButton, oldButton, animate) {
|
||||||
|
@ -99,22 +102,26 @@
|
||||||
endPosition = tabButtonOffset.left - tabsOffset.left;
|
endPosition = tabButtonOffset.left - tabsOffset.left;
|
||||||
}
|
}
|
||||||
|
|
||||||
var delay = animate ? 180 : 0;
|
var delay = animate ? 100 : 0;
|
||||||
if (selectionBar) {
|
|
||||||
animtateSelectionBar(selectionBar, startOffset, endPosition, delay);
|
|
||||||
}
|
|
||||||
tabs.currentOffset = endPosition;
|
tabs.currentOffset = endPosition;
|
||||||
|
|
||||||
newButton.classList.add(activeButtonClass);
|
newButton.classList.add(activeButtonClass);
|
||||||
|
|
||||||
setTimeout(function () {
|
var onAnimationFinish = function() {
|
||||||
|
|
||||||
|
if (tabs.getAttribute('data-selectionbar') != 'false') {
|
||||||
showButtonSelectionBar(newButton);
|
showButtonSelectionBar(newButton);
|
||||||
|
}
|
||||||
if (selectionBar) {
|
if (selectionBar) {
|
||||||
selectionBar.classList.add('hide');
|
selectionBar.classList.add('hide');
|
||||||
}
|
}
|
||||||
|
|
||||||
}, delay);
|
};
|
||||||
|
|
||||||
|
if (selectionBar) {
|
||||||
|
animtateSelectionBar(selectionBar, startOffset, endPosition, delay, onAnimationFinish);
|
||||||
|
} else {
|
||||||
|
onAnimationFinish();
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
function onClick(e) {
|
function onClick(e) {
|
||||||
|
@ -207,6 +214,10 @@
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
if (tabs.getAttribute('data-selectionbar') == 'false') {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
var elem = document.createElement('div');
|
var elem = document.createElement('div');
|
||||||
elem.classList.add('emby-tabs-selection-bar');
|
elem.classList.add('emby-tabs-selection-bar');
|
||||||
|
|
||||||
|
|
|
@ -1172,9 +1172,6 @@
|
||||||
|
|
||||||
var dlg = dialogHelper.createDialog(dialogOptions);
|
var dlg = dialogHelper.createDialog(dialogOptions);
|
||||||
|
|
||||||
dlg.classList.add('ui-body-b');
|
|
||||||
dlg.classList.add('background-theme-b');
|
|
||||||
|
|
||||||
dlg.classList.add('formDialog');
|
dlg.classList.add('formDialog');
|
||||||
|
|
||||||
var html = '';
|
var html = '';
|
||||||
|
|
|
@ -25,9 +25,6 @@
|
||||||
|
|
||||||
var dlg = dialogHelper.createDialog(dialogOptions);
|
var dlg = dialogHelper.createDialog(dialogOptions);
|
||||||
|
|
||||||
dlg.classList.add('ui-body-b');
|
|
||||||
dlg.classList.add('background-theme-b');
|
|
||||||
|
|
||||||
dlg.classList.add('formDialog');
|
dlg.classList.add('formDialog');
|
||||||
|
|
||||||
var html = '';
|
var html = '';
|
||||||
|
|
|
@ -32,14 +32,14 @@
|
||||||
"web-component-tester": "^4.0.0",
|
"web-component-tester": "^4.0.0",
|
||||||
"webcomponentsjs": "webcomponents/webcomponentsjs#^0.7.0"
|
"webcomponentsjs": "webcomponents/webcomponentsjs#^0.7.0"
|
||||||
},
|
},
|
||||||
"homepage": "https://github.com/polymerelements/iron-icon",
|
"homepage": "https://github.com/PolymerElements/iron-icon",
|
||||||
"_release": "1.0.10",
|
"_release": "1.0.10",
|
||||||
"_resolution": {
|
"_resolution": {
|
||||||
"type": "version",
|
"type": "version",
|
||||||
"tag": "v1.0.10",
|
"tag": "v1.0.10",
|
||||||
"commit": "f4e146da4982ff96bb25db85290c09e8de4ec734"
|
"commit": "f4e146da4982ff96bb25db85290c09e8de4ec734"
|
||||||
},
|
},
|
||||||
"_source": "git://github.com/polymerelements/iron-icon.git",
|
"_source": "git://github.com/PolymerElements/iron-icon.git",
|
||||||
"_target": "^1.0.0",
|
"_target": "^1.0.0",
|
||||||
"_originalSource": "polymerelements/iron-icon"
|
"_originalSource": "PolymerElements/iron-icon"
|
||||||
}
|
}
|
|
@ -32,14 +32,14 @@
|
||||||
"iron-component-page": "polymerElements/iron-component-page#^1.1.6"
|
"iron-component-page": "polymerElements/iron-component-page#^1.1.6"
|
||||||
},
|
},
|
||||||
"private": true,
|
"private": true,
|
||||||
"homepage": "https://github.com/polymer/polymer",
|
"homepage": "https://github.com/Polymer/polymer",
|
||||||
"_release": "1.6.1",
|
"_release": "1.6.1",
|
||||||
"_resolution": {
|
"_resolution": {
|
||||||
"type": "version",
|
"type": "version",
|
||||||
"tag": "v1.6.1",
|
"tag": "v1.6.1",
|
||||||
"commit": "1f197d9d7874b1e5808b2a5c26f34446a7d912fc"
|
"commit": "1f197d9d7874b1e5808b2a5c26f34446a7d912fc"
|
||||||
},
|
},
|
||||||
"_source": "git://github.com/polymer/polymer.git",
|
"_source": "git://github.com/Polymer/polymer.git",
|
||||||
"_target": "^1.1.0",
|
"_target": "^1.1.0",
|
||||||
"_originalSource": "polymer/polymer"
|
"_originalSource": "Polymer/polymer"
|
||||||
}
|
}
|
|
@ -1,10 +1,11 @@
|
||||||
.dockedtabs {
|
.dockedtabs {
|
||||||
height: 60px;
|
height: 54px;
|
||||||
background: #212121;
|
background: #212121;
|
||||||
position: fixed;
|
position: fixed;
|
||||||
left: 0;
|
left: 0;
|
||||||
right: 0;
|
right: 0;
|
||||||
z-index: 99999;
|
z-index: 1;
|
||||||
|
display: flex;
|
||||||
}
|
}
|
||||||
|
|
||||||
.dockedtabs-bottom {
|
.dockedtabs-bottom {
|
||||||
|
@ -22,3 +23,29 @@
|
||||||
.dockedtabs--unpinned {
|
.dockedtabs--unpinned {
|
||||||
transform: translateY(100%);
|
transform: translateY(100%);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.dockedtabs-tabs {
|
||||||
|
flex-grow: 1;
|
||||||
|
display: flex;
|
||||||
|
}
|
||||||
|
|
||||||
|
.dockedtabs-tab-button {
|
||||||
|
flex-grow: 1;
|
||||||
|
display: flex !important;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
text-transform: none !important;
|
||||||
|
font-size: 12px !important;
|
||||||
|
padding: 0 !important;
|
||||||
|
margin: 0 !important;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.dockedtabs-tab-button, .dockedtabs-tab-button-foreground {
|
||||||
|
font-weight: normal !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.dockedtabs-tab-button-icon {
|
||||||
|
margin-bottom: .25em;
|
||||||
|
font-size: 20px;
|
||||||
|
}
|
||||||
|
|
|
@ -1,4 +1,4 @@
|
||||||
define(['css!./dockedtabs'], function () {
|
define(['css!./dockedtabs', 'emby-tabs'], function () {
|
||||||
|
|
||||||
function render(options) {
|
function render(options) {
|
||||||
|
|
||||||
|
@ -13,6 +13,29 @@
|
||||||
// live tv
|
// live tv
|
||||||
// now playing
|
// now playing
|
||||||
|
|
||||||
|
var html = '';
|
||||||
|
|
||||||
|
html += ' <div is="emby-tabs" class="dockedtabs-tabs" data-selectionbar="false">\
|
||||||
|
<button is="emby-button" class="dockedtabs-tab-button emby-tab-button emby-tab-button-active" data-index="0">\
|
||||||
|
<div class="dockedtabs-tab-button-foreground emby-button-foreground"><i class="dockedtabs-tab-button-icon md-icon">home</i><div>Home</div></div>\
|
||||||
|
</button>\
|
||||||
|
<button is="emby-button" class="dockedtabs-tab-button emby-tab-button" data-index="1">\
|
||||||
|
<div class="dockedtabs-tab-button-foreground emby-button-foreground"><i class="dockedtabs-tab-button-icon md-icon">dvr</i><div>Live TV</div></div>\
|
||||||
|
</button>\
|
||||||
|
<button is="emby-button" class="dockedtabs-tab-button emby-tab-button homeFavoritesTab" data-index="2">\
|
||||||
|
<div class="dockedtabs-tab-button-foreground emby-button-foreground"><i class="dockedtabs-tab-button-icon md-icon">favorite</i><div>Favorites</div></div>\
|
||||||
|
</button>\
|
||||||
|
<button is="emby-button" class="dockedtabs-tab-button emby-tab-button" data-index="3">\
|
||||||
|
<div class="dockedtabs-tab-button-foreground emby-button-foreground"><i class="dockedtabs-tab-button-icon md-icon">playlist_play</i><div>Now Playing</div></div>\
|
||||||
|
</button>\
|
||||||
|
<button is="emby-button" class="dockedtabs-tab-button emby-tab-button" data-index="3">\
|
||||||
|
<div class="dockedtabs-tab-button-foreground emby-button-foreground"><i class="dockedtabs-tab-button-icon md-icon">menu</i><div>More</div></div>\
|
||||||
|
</button>\
|
||||||
|
</div>\
|
||||||
|
';
|
||||||
|
|
||||||
|
elem.innerHTML = html;
|
||||||
|
|
||||||
document.body.appendChild(elem);
|
document.body.appendChild(elem);
|
||||||
|
|
||||||
return elem;
|
return elem;
|
||||||
|
|
|
@ -33,6 +33,12 @@
|
||||||
parent.querySelector('.chkArhiveAsMediaContainer').classList.add('hide');
|
parent.querySelector('.chkArhiveAsMediaContainer').classList.add('hide');
|
||||||
}
|
}
|
||||||
|
|
||||||
|
if (contentType == 'homevideos') {
|
||||||
|
parent.querySelector('.chkEnablePhotosContainer').classList.remove('hide');
|
||||||
|
} else {
|
||||||
|
parent.querySelector('.chkEnablePhotosContainer').classList.add('hide');
|
||||||
|
}
|
||||||
|
|
||||||
if (contentType == 'music' || contentType == 'tvshows' || contentType == 'movies' || contentType == 'homevideos' || contentType == 'musicvideos' || contentType == 'mixed') {
|
if (contentType == 'music' || contentType == 'tvshows' || contentType == 'movies' || contentType == 'homevideos' || contentType == 'musicvideos' || contentType == 'mixed') {
|
||||||
parent.classList.remove('hide');
|
parent.classList.remove('hide');
|
||||||
} else {
|
} else {
|
||||||
|
@ -43,7 +49,8 @@
|
||||||
function getLibraryOptions(parent) {
|
function getLibraryOptions(parent) {
|
||||||
|
|
||||||
var options = {
|
var options = {
|
||||||
EnableArchiveMediaFiles: parent.querySelector('.chkArhiveAsMedia').checked
|
EnableArchiveMediaFiles: parent.querySelector('.chkArhiveAsMedia').checked,
|
||||||
|
EnablePhotos: parent.querySelector('.chkEnablePhotos').checked
|
||||||
};
|
};
|
||||||
|
|
||||||
return options;
|
return options;
|
||||||
|
@ -51,7 +58,8 @@
|
||||||
|
|
||||||
function setLibraryOptions(parent, options) {
|
function setLibraryOptions(parent, options) {
|
||||||
|
|
||||||
parent.querySelector('.chkArhiveAsMedia').checked = options.EnableArchiveMediaFiles;;
|
parent.querySelector('.chkArhiveAsMedia').checked = options.EnableArchiveMediaFiles;
|
||||||
|
parent.querySelector('.chkEnablePhotos').checked = options.EnablePhotos;
|
||||||
}
|
}
|
||||||
|
|
||||||
return {
|
return {
|
||||||
|
|
|
@ -1,4 +1,11 @@
|
||||||
<h1>${HeaderSettings}</h1>
|
<h1>${HeaderSettings}</h1>
|
||||||
|
<div class="checkboxContainer checkboxContainer-withDescription chkEnablePhotosContainer">
|
||||||
|
<label>
|
||||||
|
<input type="checkbox" is="emby-checkbox" class="chkEnablePhotos" checked />
|
||||||
|
<span>${EnablePhotos}</span>
|
||||||
|
</label>
|
||||||
|
<div class="fieldDescription checkboxFieldDescription">${EnablePhotosHelp}</div>
|
||||||
|
</div>
|
||||||
<div class="checkboxContainer checkboxContainer-withDescription chkArhiveAsMediaContainer">
|
<div class="checkboxContainer checkboxContainer-withDescription chkArhiveAsMediaContainer">
|
||||||
<label>
|
<label>
|
||||||
<input type="checkbox" is="emby-checkbox" class="chkArhiveAsMedia" />
|
<input type="checkbox" is="emby-checkbox" class="chkArhiveAsMedia" />
|
||||||
|
|
|
@ -62,7 +62,7 @@
|
||||||
color: #fff;
|
color: #fff;
|
||||||
background-color: #1C1C1F;
|
background-color: #1C1C1F;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
box-shadow: 0 -2px 2px 0 rgba(0,0,0,.14),-1px 5px 1px rgba(0,0,0,.12);
|
/*box-shadow: 0 -2px 2px 0 rgba(0,0,0,.14),-1px 5px 1px rgba(0,0,0,.12);*/
|
||||||
will-change: transform;
|
will-change: transform;
|
||||||
contain: layout style;
|
contain: layout style;
|
||||||
height: 100%;
|
height: 100%;
|
||||||
|
|
|
@ -978,7 +978,7 @@ var AppInfo = {};
|
||||||
}
|
}
|
||||||
|
|
||||||
// This doesn't perform well on iOS
|
// This doesn't perform well on iOS
|
||||||
AppInfo.enableHeadRoom = !isIOS;
|
AppInfo.enableHeadRoom = !isIOS && !browserInfo.msie;
|
||||||
|
|
||||||
// This currently isn't working on android, unfortunately
|
// This currently isn't working on android, unfortunately
|
||||||
AppInfo.supportsFileInput = !(AppInfo.isNativeApp && isAndroid);
|
AppInfo.supportsFileInput = !(AppInfo.isNativeApp && isAndroid);
|
||||||
|
@ -1636,9 +1636,9 @@ var AppInfo = {};
|
||||||
|
|
||||||
function onDialogOpen(dlg) {
|
function onDialogOpen(dlg) {
|
||||||
if (dlg.classList.contains('formDialog')) {
|
if (dlg.classList.contains('formDialog')) {
|
||||||
if (!dlg.classList.contains('background-theme-b')) {
|
if (!dlg.classList.contains('background-theme-a')) {
|
||||||
dlg.classList.add('background-theme-a');
|
dlg.classList.add('background-theme-b');
|
||||||
dlg.classList.add('ui-body-a');
|
dlg.classList.add('ui-body-b');
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -2310,5 +2310,7 @@
|
||||||
"FFmpegSavePathNotFound": "We're unable to locate FFmpeg using the path you've entered. FFprobe is also required and must exist in the same folder. These components are normally bundled together in the same download. Please check the path and try again.",
|
"FFmpegSavePathNotFound": "We're unable to locate FFmpeg using the path you've entered. FFprobe is also required and must exist in the same folder. These components are normally bundled together in the same download. Please check the path and try again.",
|
||||||
"XmlTvPremiere": "By default, Emby will import {0} hours of guide data. Importing unlimited data requires an active Emby Premiere subscription.",
|
"XmlTvPremiere": "By default, Emby will import {0} hours of guide data. Importing unlimited data requires an active Emby Premiere subscription.",
|
||||||
"MoreFromValue": "More from {0}",
|
"MoreFromValue": "More from {0}",
|
||||||
"OptionSaveMetadataAsHiddenHelp": "Changing this will apply to new metadata saved going forward. Existing metadata files will be updated the next time they are saved by Emby Server."
|
"OptionSaveMetadataAsHiddenHelp": "Changing this will apply to new metadata saved going forward. Existing metadata files will be updated the next time they are saved by Emby Server.",
|
||||||
|
"EnablePhotos": "Enable photos",
|
||||||
|
"EnablePhotosHelp": "Photos will be detected and displayed alongside other media files."
|
||||||
}
|
}
|
||||||
|
|
Loading…
Add table
Add a link
Reference in a new issue