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

add Add to collection buttons

This commit is contained in:
Luke Pulverenti 2015-01-23 23:50:45 -05:00
parent 9b452f3b53
commit 218e086d94
19 changed files with 481 additions and 214 deletions

View file

@ -35,29 +35,6 @@
<p>${MessageNoCollectionsAvailable}</p> <p>${MessageNoCollectionsAvailable}</p>
</div> </div>
</div> </div>
<div data-role="panel" class="newCollectionPanel" data-position="right" data-display="overlay" data-position-fixed="true" data-theme="a">
<form class="newCollectionForm">
<h3>${HeaderNewCollection}</h3>
<br />
<div>
<label for="txtNewCollectionName">${LabelName}</label>
<input type="text" id="txtNewCollectionName" required="required" />
<div class="fieldDescription">${NewCollectionNameExample}</div>
</div>
<br />
<div>
<label for="chkEnableInternetMetadata">${OptionSearchForInternetMetadata}</label>
<input type="checkbox" id="chkEnableInternetMetadata" data-mini="true" />
</div>
<br />
<p>
<button type="submit" data-icon="plus" data-theme="b">${ButtonCreate}</button>
</p>
</form>
</div>
<div data-role="panel" class="viewPanel" data-theme="a" data-position="right" data-display="overlay" data-position-fixed="true"> <div data-role="panel" class="viewPanel" data-theme="a" data-position="right" data-display="overlay" data-position-fixed="true">
<form> <form>

View file

@ -160,12 +160,6 @@
vertical-align: middle; vertical-align: middle;
} }
.viewMenuTextLink:hover {
background-color: #38c;
color: #fff !important;
opacity: 1;
}
.headerButtonRight:hover { .headerButtonRight:hover {
opacity: .5; opacity: .5;
} }
@ -183,36 +177,27 @@
vertical-align: top; vertical-align: top;
} }
.viewMenuTextLink { .librarySidebarLinks a {
display: block;
padding: .7em .5em .6em 38px !important;
font-size: 14px;
font-weight: 300 !important; font-weight: 300 !important;
font-family: Roboto;
background-repeat: no-repeat;
background-size: 13px 13px;
background-position: 12px center;
} }
.librarySidebarLinks a:hover {
background-color: #38c !important;
color: #fff !important;
}
.musicViewMenu { .musicViewMenu {
background-image: url(images/items/folders/music.png); background-image: url(images/items/folders/music.png);
} }
.homeViewMenu { .homeViewMenu {
background-image: url(images/mblogoicon.png); background-image: url(images/mblogoicon.png) !important;
background-size: 39px 26px; background-size: 39px 26px !important;
background-position: 10px center; background-position: 13px center !important;
padding-left: 60px !important; padding-left: 66px !important;
background-repeat: no-repeat !important;
} }
.iconViewMenu {
padding-left: 13px !important;
}
.iconViewMenu span {
margin-right: 11px !important;
}
.viewMenuSecondary { .viewMenuSecondary {
position: absolute; position: absolute;
top: 0; top: 0;

183
dashboard-ui/css/materialize.css vendored Normal file
View file

@ -0,0 +1,183 @@
.z-depth-1, nav, .card-panel, .toast, .btn, .btn-large, .btn-floating, .dropdown-content, .collapsible, ul.side-nav.full, ul.side-nav.fixed {
-webkit-box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);
-moz-box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);
box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);
}
.z-depth-1-half, .btn:hover, .btn-large:hover, .btn-floating:hover, .modal {
-webkit-box-shadow: 0 5px 11px 0 rgba(0, 0, 0, 0.18), 0 4px 15px 0 rgba(0, 0, 0, 0.15);
-moz-box-shadow: 0 5px 11px 0 rgba(0, 0, 0, 0.18), 0 4px 15px 0 rgba(0, 0, 0, 0.15);
box-shadow: 0 5px 11px 0 rgba(0, 0, 0, 0.18), 0 4px 15px 0 rgba(0, 0, 0, 0.15);
}
.toast .btn, .toast .btn-large, .toast .btn-flat {
margin: 0;
margin-left: 3rem;
}
.btn, .btn-large, .btn-flat {
display: block;
padding: 0 2rem;
-webkit-border-radius: 2px;
-moz-border-radius: 2px;
border-radius: 2px;
background-clip: padding-box;
text-transform: uppercase;
border: none;
outline: 0;
-webkit-tap-highlight-color: transparent;
margin-bottom: 15px;
}
.btn.disabled, .disabled.btn-large, .btn-floating.disabled, .btn-large.disabled, .btn:disabled, .btn-large:disabled, .btn-large:disabled, .btn-floating:disabled {
background-color: #DFDFDF;
box-shadow: none;
color: #9F9F9F;
}
.btn.disabled:hover, .disabled.btn-large:hover, .btn-floating.disabled:hover, .btn-large.disabled:hover, .btn:disabled:hover, .btn-large:disabled:hover, .btn-large:disabled:hover, .btn-floating:disabled:hover {
background-color: #DFDFDF;
color: #9F9F9F;
}
.btn i, .btn-large i, .btn-floating i, .btn-large i, .btn-flat i {
font-size: 1.3rem;
}
.btn, .btn-large {
text-decoration: none;
color: #FFF;
background-color: #2196F3;
text-align: center;
letter-spacing: 0.5px;
-webkit-transition: 0.2s ease-out;
-moz-transition: 0.2s ease-out;
-o-transition: 0.2s ease-out;
-ms-transition: 0.2s ease-out;
transition: 0.2s ease-out;
cursor: pointer;
}
.btn-floating {
display: inline-block;
position: relative;
z-index: 1;
width: 37px;
height: 37px;
line-height: 37px;
padding: 0;
background-color: #2196F3;
-webkit-border-radius: 50%;
-moz-border-radius: 50%;
border-radius: 50%;
background-clip: padding-box;
-webkit-transition: 0.3s;
-moz-transition: 0.3s;
-o-transition: 0.3s;
-ms-transition: 0.3s;
transition: 0.3s;
cursor: pointer;
}
.btn-floating i {
width: inherit;
display: inline-block;
text-align: center;
color: #FFF;
font-size: 1.6rem;
line-height: 37px;
}
.btn-floating.btn-large {
width: 55.5px;
height: 55.5px;
}
.btn-floating.btn-large i {
line-height: 55.5px;
}
.btn-flat {
box-shadow: none;
background-color: transparent;
color: #343434;
cursor: pointer;
}
.btn-flat.disabled {
color: #b3b3b3;
}
.btn {
padding: .6em 2em;
}
.btn-large {
padding: 1em 2em;
}
.btn-large i {
font-size: 1.6rem;
}
.btn, .btn-large {
background-color: #38c;
}
.btnAction {
background-color: #ee6e73;
}
.btnAltAction {
background-color: #ff8f00;
}
.btnActionAccent {
background-color: #52B54B;
}
.btn, .btn-large {
color: #fff !important;
font-weight: 500 !important;
font-size: 15px;
font-family: Roboto !important;
}
.btnCancel {
background-color: #444;
}
.ui-page-theme-a .btnCancel {
background-color: #e8e8e8;
color: #333!important;
}
.ui-page-theme-a .btnCancel i {
color: #666!important;
}
.btn-inline {
display: inline-block;
width: auto;
margin-bottom: 0;
}
button.btn:not(.btn-inline),button.btn-large:not(.btn-inline) {
width: 100%;
}
.btn i, .btn-large i, .btn span, .btn-large span {
vertical-align: middle;
}
.btn i {
position: absolute;
left: 24px;
}
.btn-large i {
position: absolute;
left: 24px;
top: 22px;
}

View file

@ -136,46 +136,3 @@
.imgNotificationWarning .imgNotificationInner { .imgNotificationWarning .imgNotificationInner {
background-image: url(images/notifications/error.png); background-image: url(images/notifications/error.png);
} }
.waves-effect {
position: relative;
cursor: pointer;
display: inline-block;
overflow: hidden;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
-webkit-tap-highlight-color: transparent;
z-index: 1;
will-change: opacity, transform;
-webkit-transition: all 0.3s ease-out;
-moz-transition: all 0.3s ease-out;
-o-transition: all 0.3s ease-out;
-ms-transition: all 0.3s ease-out;
transition: all 0.3s ease-out;
}
.btn-flat {
box-shadow: none;
background-color: transparent;
color: #343434;
cursor: pointer;
}
.btn, .btn-large, .btn-flat {
display: inline-block;
height: 36px;
margin-bottom: 15px;
padding: 0 2rem;
-webkit-border-radius: 2px;
-moz-border-radius: 2px;
border-radius: 2px;
background-clip: padding-box;
line-height: 36px;
text-transform: uppercase;
border: none;
outline: 0;
-webkit-tap-highlight-color: transparent;
}

View file

@ -140,39 +140,37 @@
} }
.headerSearchInput { .headerSearchInput {
width: 100%; margin: 0;
margin-top: 12px;
background: #222; background: #222;
border: 0; border: 0;
color: #ddd; color: #ddd;
border-radius: 3px; border-radius: 3px;
padding: 5px 7px 4px 50px; padding: 4px 7px 3px 50px;
font-size: 14px; font-size: 14px;
font-family: Roboto; font-family: Roboto;
outline: none; outline: none;
vertical-align: middle;
width: 200px;
} }
.searchInputIcon { .searchInputIcon {
position: absolute; position: absolute;
left: 20px; left: 20px;
top: 19px; top: 6px;
font-size: 14px !important; font-size: 14px !important;
color: #ddd !important; color: #ddd !important;
} }
.viewMenuSearch { .viewMenuSearch {
position: absolute; position: relative;
top: 0;
left: 40%;
right: 40%;
display: none; display: none;
padding-right: 55px; margin-left: 2em;
} }
@media all and (min-width: 800px) { @media all and (min-width: 900px) {
.viewMenuSearch { .viewMenuSearch {
display: block; display: inline-block;
} }
.headerSearchButton { .headerSearchButton {
@ -180,17 +178,9 @@
} }
} }
@media all and (min-width: 1200px) {
.viewMenuSearch {
left: 42%;
right: 42%;
}
}
.searchResultsOverlay { .searchResultsOverlay {
position: fixed; position: fixed;
background: #222 !important; background: rgba(34, 34, 34, 1);
top: 50px; top: 50px;
left: 0; left: 0;
right: 0; right: 0;
@ -202,3 +192,8 @@
.searchResultsContainer { .searchResultsContainer {
padding: 2em; padding: 2em;
} }
.btnCloseSearch {
margin-left: 5px;
outline: 0;
}

View file

@ -1042,3 +1042,17 @@ h1 + .accentButton {
.dashboardFooter .appLinks img { .dashboardFooter .appLinks img {
height: 16px; height: 16px;
} }
.supporterPromotion {
margin: 1em 0;
}
@media all and (min-width: 1200px) {
.supporterPromotion {
position: absolute;
top: 70px;
right: 20px;
margin: 0;
}
}

View file

@ -14,6 +14,16 @@
<a href="dashboardgeneral.html" data-role="button">${TabSettings}</a> <a href="dashboardgeneral.html" data-role="button">${TabSettings}</a>
</div> </div>
<div class="dashboardContent"> <div class="dashboardContent">
<div class="supporterPromotion" style="display:none;">
<a class="btn btnActionAccent" href="supporter.html">
<div>
${HeaderBecomeMediaBrowserSupporter}
</div>
<div style="font-weight:normal;font-size:90%;margin-top:5px;">
${TextAccessPremiumFeatures}
</div>
</a>
</div>
<div class="ui-bar-a welcomeMessage" style="display: none; padding: 2em; border-radius: 10px; margin: 2em 0; font-weight: normal; max-width: 800px;"> <div class="ui-bar-a welcomeMessage" style="display: none; padding: 2em; border-radius: 10px; margin: 2em 0; font-weight: normal; max-width: 800px;">
<h1 style="margin-top: 0;" class="tourHeader"></h1> <h1 style="margin-top: 0;" class="tourHeader"></h1>
<p> <p>
@ -131,7 +141,7 @@
<div style="margin-top:1em;"> <div style="margin-top:1em;">
<a href="http://mediabrowser.tv" target="_blank">Media Browser</a> <a href="http://mediabrowser.tv" target="_blank">Media Browser</a>
<a href="http://mediabrowser.tv/community" target="_blank">${LinkCommunity}</a> <a href="http://mediabrowser.tv/community" target="_blank">${LinkCommunity}</a>
<a href="https://github.com/MediaBrowser/MediaBrowser" target="_blank">${LinkGithub}</a> <a href="https://github.com/MediaBrowser" target="_blank">${LinkGithub}</a>
<a href="../swagger-ui/index.html" target="_blank">${LinkApi}</a> <a href="../swagger-ui/index.html" target="_blank">${LinkApi}</a>
</div> </div>
</div> </div>

View file

@ -46,7 +46,7 @@
<li> <li>
<label for="txtTranscodingTempPath">${LabelTranscodingTempPath}</label> <label for="txtTranscodingTempPath">${LabelTranscodingTempPath}</label>
<div style="display: inline-block; width: 92%;"> <div style="display: inline-block; width: 92%;">
<input type="text" id="txtTranscodingTempPath" name="txtTranscodingTempPath" data-mini="true" /> <input type="text" id="txtTranscodingTempPath" />
</div> </div>
<button id="btnSelectTranscodingTempPath" type="button" data-icon="search" data-iconpos="notext" data-inline="true">${ButtonSelectDirectory}</button> <button id="btnSelectTranscodingTempPath" type="button" data-icon="search" data-iconpos="notext" data-inline="true">${ButtonSelectDirectory}</button>
<div class="fieldDescription"> <div class="fieldDescription">

View file

@ -227,42 +227,6 @@
</div> </div>
</form> </form>
</div> </div>
<div data-role="panel" class="newCollectionPanel" data-position="right" data-display="overlay" data-position-fixed="true" data-theme="a">
<form class="newCollectionForm">
<h3>${HeaderAddToCollection}</h3>
<br />
<div>
<label for="selectCollectionToAddTo">${LabelSelectCollection}</label>
<select id="selectCollectionToAddTo" data-mini="true"></select>
</div>
<br />
<div class="newCollectionInfo">
<div>
<label for="txtNewCollectionName">${LabelName}</label>
<input type="text" id="txtNewCollectionName" required="required" />
<div class="fieldDescription">${NewCollectionNameExample}</div>
</div>
<br />
<div>
<label for="chkEnableInternetMetadata">${OptionSearchForInternetMetadata}</label>
<input type="checkbox" id="chkEnableInternetMetadata" data-mini="true" />
</div>
<br />
</div>
<p>
<input class="fldSelectedItemIds" type="hidden" />
<button type="submit" data-icon="plus" data-mini="true" data-theme="b">${ButtonSubmit}</button>
</p>
</form>
</div>
<script type="text/javascript">
$('.newCollectionForm').off('submit', BoxSetEditor.onNewCollectionSubmit).on('submit', BoxSetEditor.onNewCollectionSubmit);
</script>
</div> </div>
</body> </body>
</html> </html>

View file

@ -28,9 +28,16 @@
</div> </div>
<br /> <br />
<div>
<div data-role="controlgroup"> <div data-role="controlgroup">
<label for="chkDisplayCollectionView">${LabelDisplayCollectionsView}</label> <label for="chkDisplayCollectionView">${LabelDisplayCollectionsView}</label>
<input id="chkDisplayCollectionView" type="checkbox" /> <input id="chkDisplayCollectionView" type="checkbox" />
</div>
<div class="fieldDescription">${LabelDisplayCollectionsViewHelp}</div>
</div>
<br />
<div data-role="controlgroup">
<label for="chkDisplayFolderView">${LabelDisplayFoldersView}</label> <label for="chkDisplayFolderView">${LabelDisplayFoldersView}</label>
<input id="chkDisplayFolderView" type="checkbox" /> <input id="chkDisplayFolderView" type="checkbox" />
</div> </div>

View file

@ -24,6 +24,12 @@
Dashboard.getPluginSecurityInfo().done(function (pluginSecurityInfo) { Dashboard.getPluginSecurityInfo().done(function (pluginSecurityInfo) {
if (pluginSecurityInfo.IsMBSupporter) {
$('.supporterPromotion', page).hide();
} else {
$('.supporterPromotion', page).show();
}
DashboardPage.renderSupporterIcon(page, pluginSecurityInfo); DashboardPage.renderSupporterIcon(page, pluginSecurityInfo);
}); });

View file

@ -90,7 +90,7 @@
fileOptions.includeFiles = options.includeFiles; fileOptions.includeFiles = options.includeFiles;
} }
options.header = options.header || Globalize.translate('HeaderSelectMediaPath'); options.header = options.header || Globalize.translate('HeaderSelectPath');
options.instruction = options.instruction || ""; options.instruction = options.instruction || "";
var html = '<div data-role="popup" id="popupDirectoryPicker" class="popup" style="min-width:65%;">'; var html = '<div data-role="popup" id="popupDirectoryPicker" class="popup" style="min-width:65%;">';

View file

@ -908,13 +908,17 @@
} }
} }
if (BoxSetEditor.supportsAddingToCollection(item)) {
itemCommands.push('addtocollection');
}
if (options.playFromHere) { if (options.playFromHere) {
itemCommands.push('playfromhere'); itemCommands.push('playfromhere');
itemCommands.push('queuefromhere'); itemCommands.push('queuefromhere');
} }
// There's no detail page with a dedicated delete function // There's no detail page with a dedicated delete function
if (item.Type == 'Playlist') { if (item.Type == 'Playlist' || item.Type == 'BoxSet') {
itemCommands.push('delete'); itemCommands.push('delete');
} }

View file

@ -185,6 +185,17 @@
return false; return false;
} }
function onAddToCollectionButtonClick() {
var id = this.getAttribute('data-itemid');
closeContextMenu();
BoxSetEditor.showPanel([id]);
return false;
}
function onAddToPlaylistButtonClick() { function onAddToPlaylistButtonClick() {
var id = this.getAttribute('data-itemid'); var id = this.getAttribute('data-itemid');
@ -377,6 +388,10 @@
var href = card.getAttribute('data-href') || card.href || $('a', card).attr('href'); var href = card.getAttribute('data-href') || card.href || $('a', card).attr('href');
if (commands.indexOf('addtocollection') != -1) {
html += '<li data-icon="plus"><a href="#" class="btnAddToCollection" data-itemid="' + itemId + '">' + Globalize.translate('ButtonAddToCollection') + '</a></li>';
}
if (commands.indexOf('playlist') != -1) { if (commands.indexOf('playlist') != -1) {
html += '<li data-icon="plus"><a href="#" class="btnAddToPlaylist" data-itemid="' + itemId + '">' + Globalize.translate('ButtonAddToPlaylist') + '</a></li>'; html += '<li data-icon="plus"><a href="#" class="btnAddToPlaylist" data-itemid="' + itemId + '">' + Globalize.translate('ButtonAddToPlaylist') + '</a></li>';
} }
@ -464,6 +479,7 @@
$('.btnExternalPlayer', elem).on('click', onExternalPlayerButtonClick); $('.btnExternalPlayer', elem).on('click', onExternalPlayerButtonClick);
$('.btnDelete', elem).on('click', onDeleteButtonClick); $('.btnDelete', elem).on('click', onDeleteButtonClick);
$('.btnSync', elem).on('click', onSyncButtonClick); $('.btnSync', elem).on('click', onSyncButtonClick);
$('.btnAddToCollection', elem).on('click', onAddToCollectionButtonClick);
}); });
} }
@ -826,7 +842,7 @@
return; return;
} }
BoxSetEditor.showPanel(page, selection); BoxSetEditor.showPanel(selection);
} }
function addToPlaylist(page) { function addToPlaylist(page) {

View file

@ -15,12 +15,14 @@
html += '</button>'; html += '</button>';
html += '<div class="libraryMenuButtonText headerButton"><span>MEDIA</span><span class="mediaBrowserAccent">BROWSER</span></div>'; html += '<div class="libraryMenuButtonText headerButton"><span>MEDIA</span><span class="mediaBrowserAccent">BROWSER</span></div>';
html += '<div class="viewMenuSearch">'; html += '<div class="viewMenuSearch">';
html += '<input type="text" data-role="none" class="headerSearchInput" autocomplete="off" spellcheck="off" />'; html += '<input type="text" data-role="none" class="headerSearchInput" autocomplete="off" spellcheck="off" />';
html += '<div class="searchInputIcon fa fa-search"></div>'; html += '<div class="searchInputIcon fa fa-search"></div>';
html += '<button data-role="none" type="button" data-iconpos="notext" class="imageButton btnCloseSearch" style="display:none;"><i class="fa fa-close"></i></button>';
html += '</div>'; html += '</div>';
html += '<div class="viewMenuSecondary">'; html += '<div class="viewMenuSecondary">';
if (user.localUser) { if (user.localUser) {
@ -84,11 +86,11 @@
html += '<div class="libraryMenuDivider"></div>'; html += '<div class="libraryMenuDivider"></div>';
html += '<div class="adminMenuOptions">'; html += '<div class="adminMenuOptions">';
html += '<a class="viewMenuLink viewMenuTextLink lnkMediaFolder iconViewMenu" data-itemid="dashboard" href="dashboard.html"><span class="fa fa-dashboard"></span>' + Globalize.translate('ButtonDashboard') + '</a>'; html += '<a class="sidebarLink lnkMediaFolder" data-itemid="dashboard" href="dashboard.html"><span class="fa fa-dashboard sidebarLinkIcon"></span>' + Globalize.translate('ButtonDashboard') + '</a>';
html += '<a class="viewMenuLink viewMenuTextLink lnkMediaFolder editorViewMenu iconViewMenu" data-itemid="editor" href="edititemmetadata.html"><span class="fa fa-edit"></span>' + Globalize.translate('ButtonMetadataManager') + '</a>'; html += '<a class="sidebarLink lnkMediaFolder editorViewMenu" data-itemid="editor" href="edititemmetadata.html"><span class="fa fa-edit sidebarLinkIcon"></span>' + Globalize.translate('ButtonMetadataManager') + '</a>';
html += '<a class="viewMenuLink viewMenuTextLink lnkMediaFolder iconViewMenu" data-itemid="reports" href="reports.html"><span class="fa fa-bar-chart"></span>' + Globalize.translate('ButtonReports') + '</a>'; html += '<a class="sidebarLink lnkMediaFolder" data-itemid="reports" href="reports.html"><span class="fa fa-bar-chart sidebarLinkIcon"></span>' + Globalize.translate('ButtonReports') + '</a>';
html += '</div>'; html += '</div>';
html += '<a class="viewMenuLink viewMenuTextLink lnkMediaFolder iconViewMenu syncViewMenu" data-itemid="mysync" href="mysync.html"><span class="fa fa-cloud"></span>' + Globalize.translate('ButtonSync') + '</a>'; html += '<a class="sidebarLink lnkMediaFolder syncViewMenu" data-itemid="mysync" href="mysync.html"><span class="fa fa-cloud sidebarLinkIcon"></span>' + Globalize.translate('ButtonSync') + '</a>';
return html; return html;
} }
@ -181,13 +183,13 @@
iconCssClass += ' fa-folder-open-o'; iconCssClass += ' fa-folder-open-o';
} }
return '<a data-itemid="' + itemId + '" class="lnkMediaFolder viewMenuLink viewMenuTextLink iconViewMenu" href="' + getItemHref(i, i.CollectionType) + '"><span class="' + iconCssClass + '"></span><span class="sectionName">' + i.Name + '</span></a>'; return '<a data-itemid="' + itemId + '" class="lnkMediaFolder sidebarLink" href="' + getItemHref(i, i.CollectionType) + '"><span class="' + iconCssClass + ' sidebarLinkIcon"></span><span class="sectionName">' + i.Name + '</span></a>';
}).join(''); }).join('');
var elem = $('.libraryMenuOptions').html(html); var elem = $('.libraryMenuOptions').html(html);
$('.viewMenuTextLink', elem).on('click', function () { $('.sidebarLink', elem).on('click', function () {
var section = $('.sectionName', this)[0]; var section = $('.sectionName', this)[0];
var text = section ? section.innerHTML : this.innerHTML; var text = section ? section.innerHTML : this.innerHTML;
@ -225,11 +227,11 @@
html += '<div data-role="panel" id="libraryPanel" class="libraryPanel" data-position="left" data-display="overlay" data-position-fixed="true" data-theme="b">'; html += '<div data-role="panel" id="libraryPanel" class="libraryPanel" data-position="left" data-display="overlay" data-position-fixed="true" data-theme="b">';
html += '<div style="margin: 0 -1em;">'; html += '<div class="sidebarLinks librarySidebarLinks" style="margin-top: 0;margin-left: -1em;margin-right: -1em;">';
var homeHref = ConnectionManager.currentApiClient() ? 'index.html' : 'selectserver.html'; var homeHref = ConnectionManager.currentApiClient() ? 'index.html' : 'selectserver.html';
html += '<a class="lnkMediaFolder viewMenuLink viewMenuTextLink homeViewMenu" href="' + homeHref + '">' + Globalize.translate('ButtonHome') + '</a>'; html += '<a class="lnkMediaFolder sidebarLink homeViewMenu" href="' + homeHref + '">' + Globalize.translate('ButtonHome') + '</a>';
html += '<div class="libraryMenuDivider"></div>'; html += '<div class="libraryMenuDivider"></div>';

View file

@ -270,25 +270,92 @@
(function ($, document) { (function ($, document) {
function showNewCollectionPanel(page, items) { function getNewCollectionPanel(createIfNeeded) {
$('.fldSelectedItemIds', page).val(items.join(',')); var panel = $('.newCollectionPanel');
var panel = $('.newCollectionPanel', page).panel('toggle'); if (createIfNeeded && !panel.length) {
var html = '';
html += '<div>';
html += '<div data-role="panel" class="newCollectionPanel" data-position="right" data-display="overlay" data-position-fixed="true" data-theme="a">';
html += '<form class="newCollectionForm">';
html += '<h3>' + Globalize.translate('HeaderAddToCollection') + '</h3>';
html += '<div class="fldSelectCollection">';
html += '<br />';
html += '<label for="selectCollectionToAddTo">' + Globalize.translate('LabelSelectCollection') + '</label>';
html += '<select id="selectCollectionToAddTo" data-mini="true"></select>';
html += '</div>';
html += '<div class="newCollectionInfo">';
html += '<br />';
html += '<div>';
html += '<label for="txtNewCollectionName">' + Globalize.translate('LabelName') + '</label>';
html += '<input type="text" id="txtNewCollectionName" required="required" />';
html += '<div class="fieldDescription">' + Globalize.translate('NewCollectionNameExample') + '</div>';
html += '</div>';
html += '<br />';
html += '<div>';
html += '<label for="chkEnableInternetMetadata">' + Globalize.translate('OptionSearchForInternetMetadata') + '</label>';
html += '<input type="checkbox" id="chkEnableInternetMetadata" data-mini="true" />';
html += '</div>';
// newCollectionInfo
html += '</div>';
html += '<br />';
html += '<p>';
html += '<input class="fldSelectedItemIds" type="hidden" />';
html += '<button type="submit" data-icon="plus" data-mini="true" data-theme="b">' + Globalize.translate('ButtonSubmit') + '</button>';
html += '</p>';
html += '</form>';
html += '</div>';
html += '</div>';
panel = $(html).appendTo(document.body).trigger('create').find('.newCollectionPanel');
$('#selectCollectionToAddTo', panel).on('change', function () {
if (this.value) {
$('.newCollectionInfo', panel).hide();
$('#txtNewCollectionName', panel).removeAttr('required');
} else {
$('.newCollectionInfo', panel).show();
$('#txtNewCollectionName', panel).attr('required', 'required');
}
});
$('.newCollectionForm', panel).off('submit', BoxSetEditor.onNewCollectionSubmit).on('submit', BoxSetEditor.onNewCollectionSubmit);
}
return panel;
}
function showCollectionPanel(items) {
var panel = getNewCollectionPanel(true).panel('toggle');
$('.fldSelectedItemIds', panel).val(items.join(','));
if (items.length) {
$('.fldSelectCollection', panel).show();
populateCollections(panel); populateCollections(panel);
} else {
$('.fldSelectCollection', panel).hide();
$('#selectCollectionToAddTo', panel).html('').val('').selectmenu('refresh').trigger('change');
}
} }
function populateCollections(panel) { function populateCollections(panel) {
var select = $('#selectCollectionToAddTo', panel); var select = $('#selectCollectionToAddTo', panel);
if (!select.length) {
$('#txtNewCollectionName', panel).val('').focus();
return;
}
$('.newCollectionInfo', panel).hide(); $('.newCollectionInfo', panel).hide();
var options = { var options = {
@ -320,18 +387,7 @@
// The button is created dynamically // The button is created dynamically
$(page).on('click', '.btnNewCollection', function () { $(page).on('click', '.btnNewCollection', function () {
showNewCollectionPanel(page, []); showCollectionPanel(page, []);
});
$('#selectCollectionToAddTo', page).on('change', function () {
if (this.value) {
$('.newCollectionInfo', page).hide();
$('#txtNewCollectionName', page).removeAttr('required');
} else {
$('.newCollectionInfo', page).show();
$('#txtNewCollectionName', page).attr('required', 'required');
}
}); });
}); });
@ -346,13 +402,13 @@
}); });
} }
function createCollection(page) { function createCollection(panel) {
var url = ApiClient.getUrl("Collections", { var url = ApiClient.getUrl("Collections", {
Name: $('#txtNewCollectionName', page).val(), Name: $('#txtNewCollectionName', panel).val(),
IsLocked: !$('#chkEnableInternetMetadata', page).checked(), IsLocked: !$('#chkEnableInternetMetadata', panel).checked(),
Ids: $('.fldSelectedItemIds', page).val() || '' Ids: $('.fldSelectedItemIds', panel).val() || ''
//ParentId: getParameterByName('parentId') || LibraryMenu.getTopParentId() //ParentId: getParameterByName('parentId') || LibraryMenu.getTopParentId()
@ -369,17 +425,17 @@
var id = result.Id; var id = result.Id;
$('.newCollectionPanel', page).panel('toggle'); panel.panel('toggle');
redirectToCollection(id); redirectToCollection(id);
}); });
} }
function addToCollection(page, id) { function addToCollection(panel, id) {
var url = ApiClient.getUrl("Collections/" + id + "/Items", { var url = ApiClient.getUrl("Collections/" + id + "/Items", {
Ids: $('.fldSelectedItemIds', page).val() || '' Ids: $('.fldSelectedItemIds', panel).val() || ''
}); });
ApiClient.ajax({ ApiClient.ajax({
@ -390,33 +446,39 @@
Dashboard.hideLoadingMsg(); Dashboard.hideLoadingMsg();
$('.newCollectionPanel', page).panel('toggle'); panel.panel('toggle');
redirectToCollection(id);
Dashboard.alert(Globalize.translate('MessageItemsAdded'));
}); });
} }
window.BoxSetEditor = { window.BoxSetEditor = {
showPanel: function (page, items) { showPanel: function (items) {
showNewCollectionPanel(page, items); showCollectionPanel(items);
}, },
onNewCollectionSubmit: function () { onNewCollectionSubmit: function () {
Dashboard.showLoadingMsg(); Dashboard.showLoadingMsg();
var page = $(this).parents('.page'); var panel = getNewCollectionPanel(false);
var collectionId = $('#selectCollectionToAddTo', page).val(); var collectionId = $('#selectCollectionToAddTo', panel).val();
if (collectionId) { if (collectionId) {
addToCollection(page, collectionId); addToCollection(panel, collectionId);
} else { } else {
createCollection(page); createCollection(panel);
} }
return false; return false;
},
supportsAddingToCollection: function (item) {
return item.LocationType == 'FileSystem';
} }
}; };

View file

@ -356,19 +356,13 @@
if (createIfNeeded && !elem.length) { if (createIfNeeded && !elem.length) {
var html = '<div class="searchResultsOverlay ui-page-theme-b"><div style="text-align:right;padding: 1em 2em 0 0;"><button class="btnCloseSearch" data-icon="delete" data-mini="true" data-inline="true" style="margin:0;">Close</button></div>'; var html = '<div class="searchResultsOverlay ui-page-theme-b">';
html += '<div class="searchResultsContainer"><div class="itemsContainer"></div></div></div>'; html += '<div class="searchResultsContainer"><div class="itemsContainer"></div></div></div>';
elem = $(html).appendTo(document.body).hide().trigger('create'); elem = $(html).appendTo(document.body).hide().trigger('create');
elem.createCardMenus(); elem.createCardMenus();
$('.btnCloseSearch', elem).on('click', function () {
$('.headerSearchInput').val('');
onHeaderSearchChange('');
});
} }
return elem; return elem;
@ -377,11 +371,12 @@
function onHeaderSearchChange(val) { function onHeaderSearchChange(val) {
if (val) { if (val) {
$('.btnCloseSearch').show();
updateSearchOverlay(getSearchOverlay(true).fadeIn('fast'), val); updateSearchOverlay(getSearchOverlay(true).fadeIn('fast'), val);
} else { } else {
$('.btnCloseSearch').hide();
updateSearchOverlay(getSearchOverlay(false).fadeOut('fast'), val); updateSearchOverlay(getSearchOverlay(false).fadeOut('fast'), val);
} }
} }
@ -414,6 +409,11 @@
} }
}); });
$('.btnCloseSearch').on('click', function () {
$('.headerSearchInput').val('');
onHeaderSearchChange('');
});
} }
$(document).on('pagehide', ".libraryPage", function () { $(document).on('pagehide', ".libraryPage", function () {

View file

@ -1 +1,63 @@
 (function ($, document, window) {
function loadPage(page, config) {
$('#txtSyncTempPath', page).val(config.TemporaryPath || '');
Dashboard.hideLoadingMsg();
}
$(document).on('pageinit', "#syncSettingsPage", function () {
var page = this;
$('#btnSelectSyncTempPath', page).on("click.selectDirectory", function () {
var picker = new DirectoryBrowser(page);
picker.show({
callback: function (path) {
if (path) {
$('#txtSyncTempPath', page).val(path);
}
picker.close();
}
});
});
}).on('pageshow', "#syncSettingsPage", function () {
Dashboard.showLoadingMsg();
var page = this;
ApiClient.getNamedConfiguration("sync").done(function (config) {
loadPage(page, config);
});
});
window.SyncSettingsPage = {
onSubmit: function () {
Dashboard.showLoadingMsg();
var form = this;
ApiClient.getNamedConfiguration("sync").done(function (config) {
config.TemporaryPath = $('#txtSyncTempPath', form).val();
ApiClient.updateNamedConfiguration("sync", config).done(Dashboard.processServerConfigurationUpdateResult);
});
// Disable default form submission
return false;
}
};
})(jQuery, document, window);

View file

@ -14,11 +14,34 @@
<a href="#" data-role="button" class="ui-btn-active">${TabSettings}</a> <a href="#" data-role="button" class="ui-btn-active">${TabSettings}</a>
</div> </div>
<div class="syncActivity"> <form class="syncSettingsForm">
<ul data-role="listview" class="ulForm">
<li>
<label for="txtSyncTempPath">${LabelSyncTempPath}</label>
<div style="display: inline-block; width: 92%;">
<input type="text" id="txtSyncTempPath" />
</div>
<button id="btnSelectSyncTempPath" type="button" data-icon="search" data-iconpos="notext" data-inline="true">${ButtonSelectDirectory}</button>
<div class="fieldDescription">
${LabelSyncTempPathHelp}
</div>
</li>
</ul>
<ul data-role="listview" class="ulForm">
<li>
<button type="submit" data-theme="b" data-icon="check" data-mini="true">
${ButtonSave}
</button>
</li>
</ul>
</form>
</div> </div>
</div> </div>
</div> <script type="text/javascript">
$('.syncSettingsForm').off('submit', SyncSettingsPage.onSubmit).on('submit', SyncSettingsPage.onSubmit);
</script>
</div> </div>
</body> </body>
</html> </html>