Skip to content
Snippets Groups Projects
Commit 33117b21 authored by Jan Grewe's avatar Jan Grewe
Browse files

fix: delegate container hover events 

todo: delegate list hover/click events
parent 1f809625
No related branches found
No related tags found
No related merge requests found
Pipeline #
Show whitespace changes
Inline Side-by-side
css/mediarack.css
+ 1
− 3
View file @ 33117b21
......@@ -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;
}
......
js/mediarack.js
+ 22
− 45
View file @ 33117b21
......@@ -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);
......
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Please register or to comment