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

update user data icons

Browse source
This commit is contained in:
Luke Pulverenti 2013-03-29 10:12:14 -04:00
parent f3bdc1163e
commit 3d31aa2470
11 changed files with 86 additions and 51 deletions
Download patch file Download diff file Expand all files Collapse all files

BIN
dashboard-ui/css/images/userdata/heart_off.png
View file

Binary file not shown.
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 1.4 KiB

After

Width:  |  Height:  |  Size: 2.9 KiB

Before After
Before After

BIN
dashboard-ui/css/images/userdata/heart_on.png
View file

Binary file not shown.
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 1.7 KiB

After

Width:  |  Height:  |  Size: 2.9 KiB

Before After
Before After

BIN
dashboard-ui/css/images/userdata/thumbs_down_off.png
View file

Binary file not shown.
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 1.3 KiB

After

Width:  |  Height:  |  Size: 2.6 KiB

Before After
Before After

BIN
dashboard-ui/css/images/userdata/thumbs_down_on.png
View file

Binary file not shown.
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 1.6 KiB

After

Width:  |  Height:  |  Size: 2.7 KiB

Before After
Before After

BIN
dashboard-ui/css/images/userdata/thumbs_up_off.png
View file

Binary file not shown.
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 1.3 KiB

After

Width:  |  Height:  |  Size: 2.6 KiB

Before After
Before After

BIN
dashboard-ui/css/images/userdata/thumbs_up_on.png
View file

Binary file not shown.
Side by side Swipe Overlay

Before

Width:  |  Height:  |  Size: 1.6 KiB

After

Width:  |  Height:  |  Size: 2.7 KiB

Before After
Before After

56
dashboard-ui/css/site.css
View file

@ -750,6 +750,16 @@ progress {
background-position: right center; background-position: right center;
} }
.imgUserItemRating {
height: 24px;
margin-right: 1em;
cursor: pointer;
}
.imgUserItemRating:hover {
opacity: .5;
}
@media all and (min-width: 650px) { @media all and (min-width: 650px) {
.itemImageBlock { .itemImageBlock {
display: inline-block; display: inline-block;
@ -822,13 +832,20 @@ progress {
position: relative; position: relative;
width: 270px; width: 270px;
} }
#nowPlayingBar #mediaInfo, #nowPlayingBar #mediaInfo div { #nowPlayingBar #mediaInfo, #nowPlayingBar #mediaInfo div {
margin-left: 10px; margin-left: 10px;
display: inline-block; display: inline-block;
} }
#nowPlayingBar #mediaInfo {display:none;}
#nowPlayingBar #mediaInfo {
display: none;
}
@media all and (min-width: 650px) { @media all and (min-width: 650px) {
#nowPlayingBar #mediaInfo {display:inline-block;} #nowPlayingBar #mediaInfo {
display: inline-block;
}
} }
.mediaButton img { .mediaButton img {
@ -855,10 +872,10 @@ progress {
width: auto !important; width: auto !important;
} }
.vjs-quality-button div { .vjs-quality-button div {
width: auto !important; width: auto !important;
background: none !important; background: none !important;
} }
.vjs-chapter-button div { .vjs-chapter-button div {
background-position: -100px -75px !important; background-position: -100px -75px !important;
@ -870,26 +887,27 @@ progress {
overflow-y: scroll; overflow-y: scroll;
} }
.vjs-chapter-button.vjs-menu-button ul li { .vjs-chapter-button.vjs-menu-button ul li {
width: auto; width: auto;
white-space: nowrap; white-space: nowrap;
font-size: 1.1em; font-size: 1.1em;
padding-right: 10px; padding-right: 10px;
} }
.vjs-default-skin .vjs-menu-button.vjs-stop-button { .vjs-default-skin .vjs-menu-button.vjs-stop-button {
float: left; float: left;
background: none; background: none;
border: 0; border: 0;
} }
.vjs-default-skin .vjs-menu-button.vjs-stop-button div {
background: url("images/media/stop.png"); .vjs-default-skin .vjs-menu-button.vjs-stop-button div {
height: 26px; background: url("images/media/stop.png");
width: 26px; height: 26px;
margin: -.7em .5em auto 0; width: 26px;
} margin: -.7em .5em auto 0;
}
#itemFav img { #itemFav img {
width: 64px; width: 64px;
cursor: pointer; cursor: pointer;
} }

4
dashboard-ui/index.html
View file

@ -18,12 +18,12 @@
<div id="divResumableItems"></div> <div id="divResumableItems"></div>
</div> </div>
<h1>My Library <a href="#" class="imageLink"> <h1>My Library <a href="itemlist.html" class="imageLink">
<img src="css/images/rightarrow.png" /></a></h1> <img src="css/images/rightarrow.png" /></a></h1>
<div id="divMyLibrary"></div> <div id="divMyLibrary"></div>
<h1>Collections <a href="#" class="imageLink"> <h1>Collections <a href="itemlist.html" class="imageLink">
<img src="css/images/rightarrow.png" /></a></h1> <img src="css/images/rightarrow.png" /></a></h1>
<div id="divCollections"></div> <div id="divCollections"></div>

3
dashboard-ui/itemdetails.html
View file

@ -34,6 +34,9 @@
<p id="itemStudios"> <p id="itemStudios">
</p> </p>
<p id="itemRatings">
</p>
</div> </div>
</div> </div>

72
dashboard-ui/scripts/Itemdetailpage.js
View file

@ -57,7 +57,7 @@
if (!item.MediaStreams || !item.MediaStreams.length) { if (!item.MediaStreams || !item.MediaStreams.length) {
$('#mediaInfoCollapsible', page).hide(); $('#mediaInfoCollapsible', page).hide();
}else { } else {
$('#mediaInfoCollapsible', page).show(); $('#mediaInfoCollapsible', page).show();
} }
if (!item.Chapters || !item.Chapters.length) { if (!item.Chapters || !item.Chapters.length) {
@ -173,8 +173,8 @@
var overview = item.OverviewHtml || item.Overview; var overview = item.OverviewHtml || item.Overview;
$('#itemOverview', page).html(overview).show(); $('#itemOverview', page).html(overview).show();
$('#itemOverview a').each(function(){ $('#itemOverview a').each(function () {
$(this).attr("target","_blank"); $(this).attr("target", "_blank");
}); });
} else { } else {
$('#itemOverview', page).hide(); $('#itemOverview', page).hide();
@ -242,7 +242,7 @@
html += '&nbsp;&nbsp;/&nbsp;&nbsp;'; html += '&nbsp;&nbsp;/&nbsp;&nbsp;';
} }
html += '<a href="itembynamedetails.html?genre='+item.Genres[i]+'">' + item.Genres[i] + '</a>'; html += '<a href="itembynamedetails.html?genre=' + item.Genres[i] + '">' + item.Genres[i] + '</a>';
} }
elem.html(html).trigger('create'); elem.html(html).trigger('create');
@ -268,7 +268,7 @@
html += '&nbsp;&nbsp;/&nbsp;&nbsp;'; html += '&nbsp;&nbsp;/&nbsp;&nbsp;';
} }
html += '<a href="itembynamedetails.html?studio='+item.Studios[i]+'">' + item.Studios[i] + '</a>'; html += '<a href="itembynamedetails.html?studio=' + item.Studios[i] + '">' + item.Studios[i] + '</a>';
} }
elem.html(html).trigger('create'); elem.html(html).trigger('create');
@ -484,31 +484,31 @@
html += '<tr>'; html += '<tr>';
html += '<td>' + type + '</td>'; html += '<td>' + type + '</td>';
html += '<td>' + stream.Codec +'</td>'; html += '<td>' + stream.Codec + '</td>';
if (stream.Language) { if (stream.Language) {
hasLanguage = true; hasLanguage = true;
html += '<td class="language">' + stream.Language +'</td>'; html += '<td class="language">' + stream.Language + '</td>';
} else html += '<td class="language"></td>'; } else html += '<td class="language"></td>';
if (stream.Type == "Video") { if (stream.Type == "Video") {
html += '<td class="resolution">'+ stream.Width +'/'+ stream.Height +' ('+ stream.AspectRatio +')</td>'; html += '<td class="resolution">' + stream.Width + '/' + stream.Height + ' (' + stream.AspectRatio + ')</td>';
}else { } else {
html += '<td class="resolution"></td>'; html += '<td class="resolution"></td>';
} }
if (stream.Channels) { if (stream.Channels) {
html += '<td>'+ stream.Channels +'ch '+ stream.SampleRate +' khz</td>'; html += '<td>' + stream.Channels + 'ch ' + stream.SampleRate + ' khz</td>';
}else { } else {
html += '<td></td>'; html += '<td></td>';
} }
html += '<td>' + stream.BitRate +'</td>'; html += '<td>' + stream.BitRate + '</td>';
if (stream.Type == "Video") { if (stream.Type == "Video") {
var framerate = stream.AverageFrameRate || stream.RealFrameRate; var framerate = stream.AverageFrameRate || stream.RealFrameRate;
html += '<td class="framerate">'+ framerate +'</td>'; html += '<td class="framerate">' + framerate + '</td>';
}else { } else {
html += '<td></td>'; html += '<td></td>';
} }
@ -564,7 +564,7 @@
html += '<a href="#play-Trailer-' + i + '" onclick="ItemDetailPage.playTrailer(' + i + ');">'; html += '<a href="#play-Trailer-' + i + '" onclick="ItemDetailPage.playTrailer(' + i + ');">';
var imageTags = trailer.ImageTags || {}; var imageTags = trailer.ImageTags || {};
if (imageTags.Primary) { if (imageTags.Primary) {
var imgUrl = ApiClient.getImageUrl(trailer.Id, { var imgUrl = ApiClient.getImageUrl(trailer.Id, {
@ -687,7 +687,7 @@
var cast = casts[i]; var cast = casts[i];
var role = cast.Role || cast.Type; var role = cast.Role || cast.Type;
html += '<a href="itembynamedetails.html?person='+cast.Name+'">'; html += '<a href="itembynamedetails.html?person=' + cast.Name + '">';
html += '<div class="posterViewItem posterViewItemWithDualText">'; html += '<div class="posterViewItem posterViewItemWithDualText">';
if (cast.PrimaryImageTag) { if (cast.PrimaryImageTag) {
@ -717,29 +717,33 @@
var html = ''; var html = '';
var page = $.mobile.activePage; var page = $.mobile.activePage;
if (typeof(item.UserData.Likes) == "undefined") { var userData = item.UserData || {};
html += '<img src="css/images/userdata/thumbs_down_off.png" alt="Set Did Not Like" title="Set Did Not Like" onclick="ItemDetailPage.setDislike();" />';
html += '<img src="css/images/userdata/thumbs_up_off.png" alt="Set Liked" title="Set Liked" onclick="ItemDetailPage.setLike();" />'; if (typeof userData.Likes == "undefined") {
} else if (item.UserData.Likes) { html += '<img class="imgUserItemRating" src="css/images/userdata/thumbs_down_off.png" alt="Dislike" title="Dislike" onclick="ItemDetailPage.setDislike();" />';
html += '<img src="css/images/userdata/thumbs_down_off.png" alt="Set Did Not Like" title="Set Did Not Like" onclick="ItemDetailPage.setDislike();" />'; html += '<img class="imgUserItemRating" src="css/images/userdata/thumbs_up_off.png" alt="Like" title="Like" onclick="ItemDetailPage.setLike();" />';
html += '<img src="css/images/userdata/thumbs_up_on.png" alt="Liked" title="Liked" onclick="ItemDetailPage.clearLike();" />'; } else if (userData.Likes) {
html += '<img class="imgUserItemRating" src="css/images/userdata/thumbs_down_off.png" alt="Dislike" title="Dislike" onclick="ItemDetailPage.setDislike();" />';
html += '<img class="imgUserItemRating" src="css/images/userdata/thumbs_up_on.png" alt="Liked" title="Like" onclick="ItemDetailPage.clearLike();" />';
} else { } else {
html += '<img src="css/images/userdata/thumbs_down_on.png" alt="Did Not Like" title="Did Not Like" onclick="ItemDetailPage.clearLike();" />'; html += '<img class="imgUserItemRating" src="css/images/userdata/thumbs_down_on.png" alt="Dislike" title="Dislike" onclick="ItemDetailPage.clearLike();" />';
html += '<img src="css/images/userdata/thumbs_up_off.png" alt="Set Liked" title="Set Liked" onclick="ItemDetailPage.setLike();" />'; html += '<img class="imgUserItemRating" src="css/images/userdata/thumbs_up_off.png" alt="Like" title="Like" onclick="ItemDetailPage.setLike();" />';
} }
if (item.UserData.IsFavorite) { if (userData.IsFavorite) {
html += '<img class="favorite" src="css/images/userdata/heart_on.png" alt="Make Not Favorite" title="Make Not Favorite" onclick="ItemDetailPage.setFavorite();" />'; html += '<img class="imgUserItemRating" src="css/images/userdata/heart_on.png" alt="Remove favorite" title="Remove favorite" onclick="ItemDetailPage.setFavorite();" />';
}else { } else {
html += '<img class="favorite" src="css/images/userdata/heart_off.png" alt="Make Favorite" title="Make Favorite" onclick="ItemDetailPage.setFavorite();" />'; html += '<img class="imgUserItemRating" src="css/images/userdata/heart_off.png" alt="Mark favorite" title="Mark favorite" onclick="ItemDetailPage.setFavorite();" />';
} }
$('#itemFav', page).html(html); $('#itemRatings', page).html(html);
}, },
setFavorite: function () { setFavorite: function () {
var item = ItemDetailPage.item; var item = ItemDetailPage.item;
item.UserData = item.UserData || {};
var setting = !item.UserData.IsFavorite; var setting = !item.UserData.IsFavorite;
item.UserData.IsFavorite = setting; item.UserData.IsFavorite = setting;
@ -749,8 +753,11 @@
}, },
setLike: function () { setLike: function () {
var item = ItemDetailPage.item; var item = ItemDetailPage.item;
item.UserData = item.UserData || {};
item.UserData.Likes = true; item.UserData.Likes = true;
ApiClient.updateUserItemRating(Dashboard.getCurrentUserId(), item.Id, true); ApiClient.updateUserItemRating(Dashboard.getCurrentUserId(), item.Id, true);
@ -759,9 +766,12 @@
}, },
clearLike: function () { clearLike: function () {
var item = ItemDetailPage.item; var item = ItemDetailPage.item;
delete item.UserData.Likes; item.UserData = item.UserData || {};
item.UserData.Likes = undefined;
ApiClient.clearUserItemRating(Dashboard.getCurrentUserId(), item.Id); ApiClient.clearUserItemRating(Dashboard.getCurrentUserId(), item.Id);
@ -771,6 +781,8 @@
setDislike: function () { setDislike: function () {
var item = ItemDetailPage.item; var item = ItemDetailPage.item;
item.UserData = item.UserData || {};
item.UserData.Likes = false; item.UserData.Likes = false;
ApiClient.updateUserItemRating(Dashboard.getCurrentUserId(), item.Id, false); ApiClient.updateUserItemRating(Dashboard.getCurrentUserId(), item.Id, false);

2
dashboard-ui/scripts/itemlistpage.js
View file

@ -18,6 +18,8 @@
query.parentId = parentId; query.parentId = parentId;
ApiClient.getItem(Dashboard.getCurrentUserId(), parentId).done(ItemListPage.renderTitle); ApiClient.getItem(Dashboard.getCurrentUserId(), parentId).done(ItemListPage.renderTitle);
} else {
$('#itemName', $.mobile.activePage).html("Media Library");
} }
ItemListPage.refreshItems(query); ItemListPage.refreshItems(query);