diff --git a/css/mediarack.css b/css/mediarack.css
index f3aaf9bd1348ec57c5ce9138f0ea9249c8ff04e1..defb8c7d578af3ee617897e50aa514dc2e3ef7b5 100644
--- a/css/mediarack.css
+++ b/css/mediarack.css
@@ -81,9 +81,7 @@ img.rowLogo {
0 1px 5px 0 rgba(0, 0, 0, .12);
}
-.showInfo,
-.movieInfo,
-.comicInfo {
+.rowInfo {
padding: 0px;
margin-bottom: 20px !important;
}
diff --git a/js/mediarack.js b/js/mediarack.js
index e1b4b5bb243bacae3bcc5bb9b790fa58e01b74c0..c270328f11e000c37673cf1c234b3b100ee9ca64 100644
--- a/js/mediarack.js
+++ b/js/mediarack.js
@@ -69,6 +69,22 @@ $(document).ready(function() {
getLatest('Shows');
getLatest('Movies');
+ $('.content').on('mouseenter', '.rowContainer', function() {
+ var container = $(this);
+ container.siblings().stop().fadeTo(300, rowOpacity);
+ $('#bg').fadeTo(0, 0, function() {
+ $('#bg').css('background-image', 'url('+cdn(container.data('type')+'/'+cleanname(container.data('folder'))+'/fanart.jpg')+')');
+ }).fadeTo('slow', 1);
+ container.find('.rowInfo').stop().fadeTo(300, 1);
+ }).on('mouseleave', '.rowContainer', function() {
+ var container = $(this);
+ container.siblings().stop().fadeTo(300, 1);
+ container.find('.rowInfo').stop().fadeTo(300, infoOpacity);
+ $('#bg').stop(true).fadeTo('slow', 0, function() {
+ $('#bg').css('background-image', 'none');
+ }).fadeTo(0, 1);
+ });
+
});
function showPage(page) {
@@ -143,11 +159,11 @@ function getShows() {
countEpisodes = countEpisodes+season.count;
});
- var divContainer = $('<div class="row col-md-12 rowContainer lazy" data-original="'+cdn('show/'+cleanname(show.folder)+'/fanart.jpg')+'" data-showid="'+show.id+'" id="show_'+show.id+'"></div>');
+ var divContainer = $('<div class="row col-md-12 rowContainer lazy" data-type="show" data-folder="'+show.folder+'" data-original="'+cdn('show/'+cleanname(show.folder)+'/fanart.jpg')+'" data-showid="'+show.id+'" id="show_'+show.id+'"></div>');
var divPoster = $('<div class="col-md-4 rowPoster text-center"><img id="poster_'+show.id+'" class="lazy" data-original="'+cdn('show/'+cleanname(show.folder)+'/poster.jpg')+'" /></div>');
var divRight = $('<div class="col-md-8"></div>');
var divTitle = $('<div class="col-md-12 showName"><h2 class="text-center"><img class="rowLogo lazy" alt="'+show.name+'" data-original="'+cdn('show/'+cleanname(show.folder)+'/logo.png')+'" /></h2></div>');
- var divInfo = $('<div class="col-md-12 showInfo"></div>');
+ var divInfo = $('<div class="col-md-12 rowInfo"></div>');
var divSeasons = $('<div class="showSeasons"></div>');
var divFooter = $('<div class="showCount text-right"><strong>Seasons:</strong> '+countSeasons+', <strong>Episodes:</strong> '+countEpisodes+' </div>');
@@ -171,19 +187,6 @@ function getShows() {
ulSeasons.append(liSeason);
});
divInfo.fadeTo(0, infoOpacity);
- divContainer.hover(function() {
- $(this).siblings().stop().fadeTo(300, rowOpacity);
- $('#bg').fadeTo(0, 0, function() {
- $('#bg').css('background-image', 'url('+cdn('show/'+cleanname(show.folder)+'/fanart.jpg')+')');
- }).fadeTo('slow', 1);
- divInfo.stop().fadeTo(300, 1);
- }, function() {
- $(this).siblings().stop().fadeTo(300, 1);
- divInfo.stop().fadeTo(300, infoOpacity);
- $('#bg').stop(true).fadeTo('slow', 0, function() {
- $('#bg').css('background-image', 'none');
- }).fadeTo(0, 1);
- });
divSeasons.append(ulSeasons);
divInfo.append(divSeasons);
@@ -274,27 +277,14 @@ function getMovies() {
var i = 0;
$(".rowContainer.lazy, .rowPoster img.lazy, img.rowLogo.lazy").removeClass('lazy');
$.each(data, function (key, movie) {
- var divContainer = $('<div class="row col-md-12 rowContainer lazy" data-original="'+cdn('movie/'+cleanname(movie.folder)+'/fanart.jpg')+'" data-imdb="'+movie.imdb+'" id="movie_'+movie.imdb+'"></div>');
+ var divContainer = $('<div class="row col-md-12 rowContainer lazy" data-type="movie" data-folder="'+movie.folder+'" data-original="'+cdn('movie/'+cleanname(movie.folder)+'/fanart.jpg')+'" data-imdb="'+movie.imdb+'" id="movie_'+movie.imdb+'"></div>');
var divPoster = $('<div class="col-md-4 rowPoster text-center"><img id="poster_'+movie.imdb+'" class="lazy" data-original="'+cdn('movie/'+cleanname(movie.folder)+'/poster.jpg')+'" /></div>');
var divRight = $('<div class="col-md-8"></div>');
var divTitle = $('<div class="col-md-12 rowName"><h2 class="text-center"><img class="rowLogo lazy" alt="'+movie.title+'" data-original="'+cdn('movie/'+cleanname(movie.folder)+'/logo.png')+'" /></h2></div>');
- var divInfo = $('<div class="col-md-12 movieInfo"></div>');
+ var divInfo = $('<div class="col-md-12 rowInfo"></div>');
var divPlot = $('<div class="moviePlot">'+movie.tagline+' - '+movie.plot+'</div>');
var divRating =$('<div class="movieRating text-right">IMDB Rating: '+movie.rating+'</div>');
divInfo.fadeTo(0, infoOpacity);
- divContainer.hover(function() {
- $(this).siblings().stop().fadeTo(300, rowOpacity);
- $('#bg').fadeTo(0, 0, function() {
- $('#bg').css('background-image', 'url('+cdn('movie/'+cleanname(movie.folder)+'/fanart.jpg')+')');
- }).fadeTo('slow', 1);
- divInfo.stop().fadeTo(300, 1);
- }, function() {
- $(this).siblings().stop().fadeTo(300, 1);
- divInfo.stop().fadeTo(300, infoOpacity);
- $('#bg').stop(true).fadeTo('slow', 0, function() {
- $('#bg').css('background-image', 'none');
- }).fadeTo(0, 1);
- });
divInfo.append(divPlot);
divInfo.append(divRating);
@@ -337,11 +327,11 @@ function getComics() {
var i = 0;
$(".rowContainer.lazy, .rowPoster img.lazy, img.rowLogo.lazy").removeClass('lazy');
$.each(data, function (key, comic) {
- var divContainer = $('<div class="row col-md-12 rowContainer lazy" data-original="'+cdn('comic/'+cleanname(comic.folder)+'/fanart.jpg')+'" id="comic_'+comic.id+'"></div>');
+ var divContainer = $('<div class="row col-md-12 rowContainer lazy" data-type="comic" data-folder="'+comic.folder+'" data-original="'+cdn('comic/'+cleanname(comic.folder)+'/fanart.jpg')+'" id="comic_'+comic.id+'"></div>');
var divPoster = $('<div class="col-md-4 rowPoster text-center"><img id="poster_'+comic.id+'" class="lazy" data-original="'+cdn('comic/'+cleanname(comic.folder)+'/poster.jpg')+'" /></div>');
var divRight = $('<div class="col-md-8"></div>');
var divTitle = $('<div class="col-md-12 rowName"><h2 class="text-center"><img class="rowLogo lazy" alt="'+comic.title+' ('+comic.year+')" data-original="'+cdn('comic/'+cleanname(comic.folder)+'/logo.png')+'" /></h2></div>');
- var divInfo = $('<div class="col-md-12 comicInfo"></div>');
+ var divInfo = $('<div class="col-md-12 rowInfo"></div>');
var divIssues = $('<div class="col-md-12 comicIssues"></div>');
var divPublisher = $('<div class="col-md-12 comicPublisher">'+comic.publisher+'<span class="pull-right text-right">Issues: '+comic.have+' of '+comic.total+'</span></div>');
var ulIssues = $('<ul class="issues list-group" data-comicid="'+comic.id+'"></ul>');
@@ -358,19 +348,6 @@ function getComics() {
ulIssues.append(liIssue);
});
divInfo.fadeTo(0, infoOpacity);
- divContainer.hover(function() {
- $(this).siblings().stop().fadeTo(300, rowOpacity);
- $('#bg').fadeTo(0, 0, function() {
- $('#bg').css('background-image', 'url('+cdn('comic/'+cleanname(comic.folder)+'/fanart.jpg')+')');
- }).fadeTo('slow', 1);
- divInfo.stop().fadeTo(300, 1);
- }, function() {
- $(this).siblings().stop().fadeTo(300, 1);
- divInfo.stop().fadeTo(300, infoOpacity);
- $('#bg').stop(true).fadeTo('slow', 0, function() {
- $('#bg').css('background-image', 'none');
- }).fadeTo(0, 1);
- });
divIssues.append(ulIssues);
divInfo.append(divIssues);