github/plexpy
1
0
Fork 0
mirror of https://github.com/Tautulli/Tautulli.git synced 2025-07-14 17:22:56 -07:00
Code Issues Projects Releases Packages Wiki Activity Actions

Added chevrons and more reliable animations

Browse source
This commit is contained in:
Jonathan Wong 2015-08-24 19:33:41 -07:00
parent 58efd299cc
commit 53fb8b999f
3 changed files with 76 additions and 13 deletions
Download patch file Download diff file Expand all files Collapse all files

43
data/interfaces/default/home_stats.html
View file

@ -94,6 +94,7 @@ DOCUMENTATION :: END
% endif
</a>
%if len(top_stat['rows']) > 1:
<div class="home-platforms-instance-list-chevron"><i class="fa fa-chevron-down"></i></div>
<ul class="list-unstyled">
<div class="slider">
<div class="home-platforms-instance-list">
@ -169,6 +170,7 @@ DOCUMENTATION :: END
% endif
</a>
%if len(top_stat['rows']) > 1:
<div class="home-platforms-instance-list-chevron"><i class="fa fa-chevron-down"></i></div>
<ul class="list-unstyled">
<div class="slider">
<div class="home-platforms-instance-list">
@ -244,6 +246,7 @@ DOCUMENTATION :: END
% endif
</a>
%if len(top_stat['rows']) > 1:
<div class="home-platforms-instance-list-chevron"><i class="fa fa-chevron-down"></i></div>
<ul class="list-unstyled">
<div class="slider">
<div class="home-platforms-instance-list">
@ -319,6 +322,7 @@ DOCUMENTATION :: END
% endif
</a>
%if len(top_stat['rows']) > 1:
<div class="home-platforms-instance-list-chevron"><i class="fa fa-chevron-down"></i></div>
<ul class="list-unstyled">
<div class="slider">
<div class="home-platforms-instance-list">
@ -402,6 +406,7 @@ DOCUMENTATION :: END
% endif
</a>
%if len(top_stat['rows']) > 1:
<div class="home-platforms-instance-list-chevron"><i class="fa fa-chevron-down"></i></div>
<ul class="list-unstyled">
<div class="slider">
<div class="home-platforms-instance-list">
@ -477,6 +482,7 @@ DOCUMENTATION :: END
<div class="home-platforms-instance-box" style="background-image: url(interfaces/default/images/platforms/default.png);"></div>
</div>
%if len(top_stat['rows']) > 1:
<div class="home-platforms-instance-list-chevron"><i class="fa fa-chevron-down"></i></div>
<ul class="list-unstyled">
<div class="slider">
<div class="home-platforms-instance-list">
@ -522,14 +528,37 @@ DOCUMENTATION :: END
% endfor
</ul>
<script>
$('.home-platforms-instance').hover(function() {
$(this).css('z-index', 1);
$(this).find('.slider').stop().slideDown(500);
}, function() {
$(this).find('.slider').stop().slideUp(500, function() {
$(this).parents('.home-platforms-instance').css('z-index', 0);
var inProgress;
$('.home-platforms-instance-list-chevron i.fa').on('click',
function() {
inProgress = true;
console.log($(this));
instanceBoxChevron = $(this);
instanceBox = $(this).parents('.home-platforms-instance');
instanceBoxSlider = instanceBox.find('.slider');
instanceBoxSlider.stop().slideToggle(500, function() { inProgress = false; });
});
$('.home-platforms-instance').on({
mouseenter: function() {
if (inProgress) {
return;
} else {
instanceBox = $(this);
instanceBoxChevron = instanceBox.find('.home-platforms-instance-list-chevron i.fa');
instanceBoxSlider = instanceBox.find('.slider');
instanceBoxSlider.css('z-index', 2);
instanceBoxSlider.stop().slideDown(500);
}
},
mouseleave: function() {
if (inProgress) {
return;
} else {
instanceBoxSlider.css('z-index', 1);
instanceBoxSlider.stop().slideUp(500);
}
}
});
});
</script>
% else:
<div class="text-muted">No stats for selected period.</div><br>