fix up media library editor

This commit is contained in:
Luke Pulverenti 2016-07-30 16:47:18 -04:00
parent a4a7f03459
commit 17547b019c
4 changed files with 27 additions and 23 deletions

View File

@ -23,6 +23,10 @@ paper-input + .fieldDescription {
margin-bottom: 30px !important;
}
.ui-body-a .visualCardBox .cardScalable, .ui-body-a .visualCardBox .cardFooter {
background-color: #fff;
}
@media all and (min-width: 800px) {
.type-interior > .ui-content, .type-interior > .ui-panel-content-wrap > .ui-content {

View File

@ -1,4 +1,4 @@
define(['jQuery', 'apphost'], function ($, appHost) {
define(['jQuery', 'apphost', 'cardStyle'], function ($, appHost) {
function changeCollectionType(page, virtualFolder) {
@ -197,6 +197,8 @@
var divVirtualFolders = page.querySelector('#divVirtualFolders');
divVirtualFolders.innerHTML = html;
divVirtualFolders.classList.add('itemsContainer');
divVirtualFolders.classList.add('vertical-wrap');
$('.btnCardMenu', divVirtualFolders).on('click', function () {
showCardMenu(page, this, virtualFolders);
@ -255,23 +257,23 @@
switch (type) {
case "movies":
return "local-movies";
return "local_movies";
case "music":
return "library-music";
return "library_music";
case "photos":
return "photo";
case "livetv":
return "live-tv";
return "live_tv";
case "tvshows":
return "live-tv";
return "live_tv";
case "games":
return "folder";
case "trailers":
return "local-movies";
return "local_movies";
case "homevideos":
return "video-library";
return "video_library";
case "musicvideos":
return "video-library";
return "video_library";
case "books":
return "folder";
case "channels":
@ -293,7 +295,7 @@
style += "min-width:33.3%;";
}
html += '<div class="card backdropCard" style="' + style + '" data-index="' + index + '">';
html += '<div class="card backdropCard scalableCard" style="' + style + '" data-index="' + index + '">';
html += '<div class="cardBox visualCardBox">';
html += '<div class="cardScalable">';
@ -310,10 +312,10 @@
}
if (imgUrl) {
html += '<div class="cardImage editLibrary" style="cursor:pointer;background-image:url(\'' + imgUrl + '\');"></div>';
html += '<div class="cardImageContainer editLibrary" style="cursor:pointer;background-image:url(\'' + imgUrl + '\');"></div>';
} else if (!virtualFolder.showNameWithIcon) {
html += '<div class="cardImage editLibrary iconCardImage" style="cursor:pointer;">';
html += '<i class="md-icon">' + (virtualFolder.icon || getIcon(virtualFolder.CollectionType)) + '</i>';
html += '<div class="cardImageContainer editLibrary" style="cursor:pointer;">';
html += '<i class="cardImageIcon md-icon" style="color:#444;">' + (virtualFolder.icon || getIcon(virtualFolder.CollectionType)) + '</i>';
html += '</div>';
}
@ -325,17 +327,15 @@
html += "</div>";
if (!imgUrl && virtualFolder.showNameWithIcon) {
html += '<h1 class="cardImage iconCardImage addLibrary" style="position:absolute;top:0;left:0;right:0;bottom:0;cursor:pointer;">';
html += '<h1 class="cardImageContainer addLibrary" style="position:absolute;top:0;left:0;right:0;bottom:0;cursor:pointer;flex-direction:column;">';
html += '<div>';
html += '<i class="md-icon" style="font-size:400%;color:#888;">' + (virtualFolder.icon || getIcon(virtualFolder.CollectionType)) + '</i>';
html += '<i class="cardImageIcon md-icon" style="font-size:400%;color:#888;">' + (virtualFolder.icon || getIcon(virtualFolder.CollectionType)) + '</i>';
if (virtualFolder.showNameWithIcon) {
html += '<div style="margin:1.5em 0;position:width:100%;font-weight:500;color:#444;">';
html += virtualFolder.Name;
html += "</div>";
}
html += "</div>";
html += '</h1>';
}
@ -345,7 +345,7 @@
if (virtualFolder.showMenu !== false) {
var moreIcon = appHost.moreIcon == 'dots-horiz' ? '&#xE5D3;' : '&#xE5D4;';
html += '<div class="cardText" style="text-align:right; float:right;padding-top:5px;">';
html += '<div style="text-align:right; float:right;padding-top:5px;">';
html += '<button type="button" is="paper-icon-button-light" class="btnCardMenu autoSize"><i class="md-icon">' + moreIcon + '</i></button>';
html += "</div>";
}

View File

@ -1,4 +1,4 @@
define(['jQuery', 'paper-icon-button-light'], function ($) {
define(['jQuery', 'paper-icon-button-light', 'cardStyle'], function ($) {
function deleteUser(page, id) {
@ -85,7 +85,7 @@
var html = '';
var cssClass = "card squareCard bottomPaddedCard";
var cssClass = "card squareCard scalableCard";
if (user.Policy.IsDisabled) {
cssClass += ' grayscale';
@ -135,7 +135,7 @@
html += '<div class="cardFooter">';
html += '<div class="cardText" style="text-align:right; float:right;padding:0;">';
html += '<div style="text-align:right; float:right;padding:0;">';
html += '<button type="button" is="paper-icon-button-light" class="btnUserMenu autoSize"><i class="md-icon">' + AppInfo.moreIcon.replace('-', '_') + '</i></button>';
html += "</div>";

View File

@ -11,7 +11,7 @@
<span>${ButtonAdd}</span>
</button>
</div>
<div class="localUsers" style="text-align:left;margin-top:.5em;"></div>
<div class="localUsers itemsContainer vertical-wrap" style="text-align:left;margin-top:.5em;"></div>
<div class="detailSectionHeader" style="margin-top:2.5em;">
<h3 style="margin:.6em 0;vertical-align:middle;display:inline-block;">
@ -22,7 +22,7 @@
<span>${ButtonAdd}</span>
</button>
</div>
<div class="connectUsers" style="text-align:left;margin-top:.5em;"></div>
<div class="connectUsers itemsContainer vertical-wrap" style="text-align:left;margin-top:.5em;"></div>
<div class="sectionPendingGuests" style="display:none;margin-top:2.5em;">
<div class="detailSectionHeader" style="margin-top:2.5em;">
@ -30,7 +30,7 @@
${HeaderPendingInvitations}
</h3>
</div>
<div class="itemsContainer pending" style="text-align:left;margin-top:.5em;"></div>
<div class="itemsContainer vertical-wrap pending" style="text-align:left;margin-top:.5em;"></div>
</div>
</div>