cotugno/jellyfin-web
2
Fork 0
mirror of https://github.com/jellyfin/jellyfin-web.git synced 2024-11-17 19:08:18 -07:00
Code Issues Packages Projects Releases Wiki Activity

added more card layouts

Browse Source
This commit is contained in:
Luke Pulverenti 2014-11-11 23:51:40 -05:00
parent c6064c9e96
commit 98d59dbc02
15 changed files with 95 additions and 40 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
dashboard-ui/css/card.css
View File

@ -416,10 +416,6 @@
@media all and (min-width: 1920px) {
.squareCard {
width: 9.0909090909090909090909090909091%;
}
.bannerCard {
width: 25%;
}
@ -430,6 +426,14 @@
}
@media all and (min-width: 2300px) {
.squareCard {
width: 9.0909090909090909090909090909091%;
}
}
/** detailPage169 */
.detailPage169Card .cardPadder {
padding-bottom: 56.25%;

8
dashboard-ui/livetvnewrecording.html
View File

@ -81,8 +81,8 @@
<br />
<ul data-role="listview" class="ulForm">
<li>
<label for="txtPrePaddingSeconds">${LabelPrePaddingMinutes}</label>
<input type="number" id="txtPrePaddingSeconds" pattern="[0-9]*" required="required" min="0" max="30" step="1" />
<label for="txtPrePaddingMinutes">${LabelPrePaddingMinutes}</label>
<input type="number" id="txtPrePaddingMinutes" pattern="[0-9]*" required="required" min="0" max="30" step="1" />
</li>
<li>
<input type="checkbox" data-mini="true" id="chkPrePaddingRequired" />
@ -92,8 +92,8 @@
<div style="height: .5em;"></div>
</li>
<li>
<label for="txtPostPaddingSeconds">${LabelPostPaddingMinutes}</label>
<input type="number" id="txtPostPaddingSeconds" pattern="[0-9]*" required="required" min="0" max="30" step="1" />
<label for="txtPostPaddingMinutes">${LabelPostPaddingMinutes}</label>
<input type="number" id="txtPostPaddingMinutes" pattern="[0-9]*" required="required" min="0" max="30" step="1" />
</li>
<li>
<input type="checkbox" data-mini="true" id="chkPostPaddingRequired" />

8
dashboard-ui/livetvseriestimer.html
View File

@ -78,8 +78,8 @@
<br />
<ul data-role="listview" class="ulForm">
<li>
<label for="txtPrePaddingSeconds">${LabelPrePaddingMinutes}</label>
<input type="number" id="txtPrePaddingSeconds" pattern="[0-9]*" required="required" min="0" max="30" step="1" />
<label for="txtPrePaddingMinutes">${LabelPrePaddingMinutes}</label>
<input type="number" id="txtPrePaddingMinutes" pattern="[0-9]*" required="required" min="0" max="30" step="1" />
</li>
<li>
<input type="checkbox" data-mini="true" id="chkPrePaddingRequired" />
@ -89,8 +89,8 @@
<div style="height: .5em;"></div>
</li>
<li>
<label for="txtPostPaddingSeconds">${LabelPostPaddingMinutes}</label>
<input type="number" id="txtPostPaddingSeconds" pattern="[0-9]*" required="required" min="0" max="30" step="1" />
<label for="txtPostPaddingMinutes">${LabelPostPaddingMinutes}</label>
<input type="number" id="txtPostPaddingMinutes" pattern="[0-9]*" required="required" min="0" max="30" step="1" />
</li>
<li>
<input type="checkbox" data-mini="true" id="chkPostPaddingRequired" />

8
dashboard-ui/livetvtimer.html
View File

@ -45,8 +45,8 @@
<br />
<ul data-role="listview" class="ulForm">
<li>
<label for="txtPrePaddingSeconds">${LabelPrePaddingMinutes}</label>
<input type="number" id="txtPrePaddingSeconds" pattern="[0-9]*" required="required" min="0" max="30" step="1" />
<label for="txtPrePaddingMinutes">${LabelPrePaddingMinutes}</label>
<input type="number" id="txtPrePaddingMinutes" pattern="[0-9]*" required="required" min="0" max="30" step="1" />
</li>
<li>
<input type="checkbox" data-mini="true" id="chkPrePaddingRequired" />
@ -56,8 +56,8 @@
<div style="height: .5em;"></div>
</li>
<li>
<label for="txtPostPaddingSeconds">${LabelPostPaddingMinutes}</label>
<input type="number" id="txtPostPaddingSeconds" pattern="[0-9]*" required="required" min="0" max="30" step="1" />
<label for="txtPostPaddingMinutes">${LabelPostPaddingMinutes}</label>
<input type="number" id="txtPostPaddingMinutes" pattern="[0-9]*" required="required" min="0" max="30" step="1" />
</li>
<li>
<input type="checkbox" data-mini="true" id="chkPostPaddingRequired" />

1
dashboard-ui/movies.html
View File

@ -52,6 +52,7 @@
<option value="Banner">${OptionBanner}</option>
<option value="List">${OptionList}</option>
<option value="Poster">${OptionPoster}</option>
<option value="PosterCard">${OptionPosterCard}</option>
<option value="Thumb">${OptionThumb}</option>
<option value="ThumbCard">${OptionThumbCard}</option>
<option value="Timeline">${OptionTimeline}</option>

13
dashboard-ui/scripts/librarybrowser.js
View File

@ -1213,10 +1213,6 @@
var defaultActionAttribute = options.defaultAction ? (' data-action="' + options.defaultAction + '"') : '';
if (options.defaultAction) {
cssClass += ' itemWithAction';
}
html += '<div' + dataAttributes + ' class="' + cssClass + '">';
var style = "";
@ -1250,7 +1246,14 @@
html += '<div class="cardScalable">';
html += '<div class="cardPadder"></div>';
html += '<a class="cardContent" href="' + href + '"' + defaultActionAttribute + '>';
var anchorCssClass = "cardContent";
if (options.defaultAction) {
anchorCssClass += ' itemWithAction';
}
html += '<a class="' + anchorCssClass + '" href="' + href + '"' + defaultActionAttribute + '>';
html += '<div class="' + imageCssClass + '" style="' + style + '"' + dataSrc + '></div>';
html += '<div class="cardOverlayTarget"></div>';

23
dashboard-ui/scripts/librarylist.js
View File

@ -557,6 +557,8 @@
function onShowTimerExpired(elem) {
elem = $('a', elem)[0];
if ($(elem).hasClass('hasContextMenu')) {
return;
}
@ -566,8 +568,14 @@
}
var innerElem = $('.cardOverlayTarget', elem);
var id = elem.getAttribute('data-itemid');
var commands = elem.getAttribute('data-commands').split(',');
var dataElement = elem;
while (!dataElement.getAttribute('data-itemid')) {
dataElement = dataElement.parentNode;
}
var id = dataElement.getAttribute('data-itemid');
var commands = dataElement.getAttribute('data-commands').split(',');
var promise1 = ApiClient.getItem(Dashboard.getCurrentUserId(), id);
var promise2 = Dashboard.getCurrentUser();
@ -767,11 +775,18 @@
PlaylistManager.showPanel(selection);
}
function onItemWithActionClick() {
function onItemWithActionClick(e) {
var elem = this;
var action = elem.getAttribute('data-action');
var elemWithAttributes = elem.getAttribute('data-itemid') ? elem : elem.parentNode;
var elemWithAttributes = elem;
if (action) {
while (!elemWithAttributes.getAttribute('data-itemid')) {
elemWithAttributes = elemWithAttributes.parentNode;
}
}
var index;
var itemsContainer;

8
dashboard-ui/scripts/livetvnewrecording.js
View File

@ -25,8 +25,8 @@
$('#chkAllChannels', page).checked(defaultTimer.RecordAnyChannel).checkboxradio('refresh');
$('#chkAnyTime', page).checked(defaultTimer.RecordAnyTime).checkboxradio('refresh');
$('#txtPrePaddingSeconds', page).val(defaultTimer.PrePaddingSeconds / 60);
$('#txtPostPaddingSeconds', page).val(defaultTimer.PostPaddingSeconds / 60);
$('#txtPrePaddingMinutes', page).val(defaultTimer.PrePaddingSeconds / 60);
$('#txtPostPaddingMinutes', page).val(defaultTimer.PostPaddingSeconds / 60);
$('#chkPrePaddingRequired', page).checked(defaultTimer.IsPrePaddingRequired).checkboxradio('refresh');
$('#chkPostPaddingRequired', page).checked(defaultTimer.IsPostPaddingRequired).checkboxradio('refresh');
@ -110,8 +110,8 @@
ApiClient.getNewLiveTvTimerDefaults({ programId: programId }).done(function (item) {
item.PrePaddingSeconds = $('#txtPrePaddingSeconds', form).val() * 60;
item.PostPaddingSeconds = $('#txtPostPaddingSeconds', form).val() * 60;
item.PrePaddingSeconds = $('#txtPrePaddingMinutes', form).val() * 60;
item.PostPaddingSeconds = $('#txtPostPaddingMinutes', form).val() * 60;
item.IsPrePaddingRequired = $('#chkPrePaddingRequired', form).checked();
item.IsPostPaddingRequired = $('#chkPostPaddingRequired', form).checked();

8
dashboard-ui/scripts/livetvseriestimer.js
View File

@ -27,8 +27,8 @@
$('.itemName', page).html(item.Name);
$('#txtPrePaddingSeconds', page).val(item.PrePaddingSeconds / 60);
$('#txtPostPaddingSeconds', page).val(item.PostPaddingSeconds / 60);
$('#txtPrePaddingMinutes', page).val(item.PrePaddingSeconds / 60);
$('#txtPostPaddingMinutes', page).val(item.PostPaddingSeconds / 60);
$('#chkPrePaddingRequired', page).checked(item.IsPrePaddingRequired).checkboxradio('refresh');
$('#chkPostPaddingRequired', page).checked(item.IsPostPaddingRequired).checkboxradio('refresh');
@ -107,8 +107,8 @@
ApiClient.getLiveTvSeriesTimer(currentItem.Id).done(function (item) {
item.PrePaddingSeconds = $('#txtPrePaddingSeconds', form).val() * 60;
item.PostPaddingSeconds = $('#txtPostPaddingSeconds', form).val() * 60;
item.PrePaddingSeconds = $('#txtPrePaddingMinutes', form).val() * 60;
item.PostPaddingSeconds = $('#txtPostPaddingMinutes', form).val() * 60;
item.IsPrePaddingRequired = $('#chkPrePaddingRequired', form).checked();
item.IsPostPaddingRequired = $('#chkPostPaddingRequired', form).checked();

8
dashboard-ui/scripts/livetvtimer.js
View File

@ -57,8 +57,8 @@
LiveTvHelpers.renderMiscProgramInfo($('.miscTvProgramInfo', page), programInfo);
$('#txtPrePaddingSeconds', page).val(item.PrePaddingSeconds / 60);
$('#txtPostPaddingSeconds', page).val(item.PostPaddingSeconds / 60);
$('#txtPrePaddingMinutes', page).val(item.PrePaddingSeconds / 60);
$('#txtPostPaddingMinutes', page).val(item.PostPaddingSeconds / 60);
$('#chkPrePaddingRequired', page).checked(item.IsPrePaddingRequired).checkboxradio('refresh');
$('#chkPostPaddingRequired', page).checked(item.IsPostPaddingRequired).checkboxradio('refresh');
@ -75,8 +75,8 @@
ApiClient.getLiveTvTimer(currentItem.Id).done(function (item) {
item.PrePaddingSeconds = $('#txtPrePaddingSeconds', form).val() * 60;
item.PostPaddingSeconds = $('#txtPostPaddingSeconds', form).val() * 60;
item.PrePaddingSeconds = $('#txtPrePaddingMinutes', form).val() * 60;
item.PostPaddingSeconds = $('#txtPostPaddingMinutes', form).val() * 60;
item.IsPrePaddingRequired = $('#chkPrePaddingRequired', form).checked();
item.IsPostPaddingRequired = $('#chkPostPaddingRequired', form).checked();

2
dashboard-ui/scripts/moviegenres.js
View File

@ -79,7 +79,7 @@
html += pagingHtml;
$('#items', page).html(html).trigger('create');
$('#items', page).html(html).trigger('create').createCardMenus();
$('.btnNextPage', page).on('click', function () {
query.StartIndex += query.Limit;

12
dashboard-ui/scripts/movies.js
View File

@ -102,6 +102,18 @@
});
$('.itemsContainer', page).removeClass('timelineItemsContainer');
}
else if (view == "PosterCard") {
html = LibraryBrowser.getPosterViewHtml({
items: result.Items,
shape: "portrait",
context: 'movies',
showTitle: true,
showYear: true,
lazy: true,
cardLayout: true
});
$('.itemsContainer', page).removeClass('timelineItemsContainer');
}
else if (view == "Timeline") {
html = LibraryBrowser.getPosterViewHtml({
items: result.Items,

12
dashboard-ui/scripts/tvshows.js
View File

@ -87,6 +87,18 @@
});
$('.itemsContainer', page).removeClass('timelineItemsContainer');
}
else if (view == "PosterCard") {
html = LibraryBrowser.getPosterViewHtml({
items: result.Items,
shape: "portrait",
context: 'tv',
showTitle: true,
showYear: true,
lazy: true,
cardLayout: true
});
$('.itemsContainer', page).removeClass('timelineItemsContainer');
}
else {
// Poster

9
dashboard-ui/thirdparty/apiclient/connectionmanager.js vendored
View File

@ -248,6 +248,13 @@
function addAuthenticationInfoFromConnect(server, connectionMode, credentials) {
if (!server.ExchangeToken) {
throw new Error("server.ExchangeToken cannot be null");
}
if (!credentials.ConnectUserId) {
throw new Error("credentials.ConnectUserId cannot be null");
}
var url = connectionMode == MediaBrowser.ConnectionMode.Local ? server.LocalAddress : server.RemoteAddress;
url += "/mediabrowser/Connect/Exchange?format=json&ConnectUserId=" + credentials.ConnectUserId;
@ -641,7 +648,7 @@
function onEnsureConnectUserDone() {
if (credentials.ConnectUserId && credentials.ConnectAccessToken) {
if (credentials.ConnectUserId && credentials.ConnectAccessToken && server.ExchangeToken) {
addAuthenticationInfoFromConnect(server, connectionMode, credentials).always(onExchangeTokenDone);

3
dashboard-ui/tvshows.html
View File

@ -42,7 +42,8 @@
<option value="Banner">${OptionBanner}</option>
<option value="List">${OptionList}</option>
<option value="Poster">${OptionPoster}</option>
<option value="Thumb">${OptionThumb}</option>
<option value="PosterCard">${OptionPosterCard}</option>
<option value="Thumb">${OptionThumb}</option>
<option value="ThumbCard">${OptionThumbCard}</option>
</select>
</div>