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

Make the shutdown/restart/update screens pretty :)

Browse source
This commit is contained in:
Tim 2015-07-17 23:07:42 +02:00
commit 5b2d03f496
3 changed files with 101 additions and 8 deletions
Download patch file Download diff file Expand all files Collapse all files

24
data/interfaces/default/js/script.js
View file

@ -276,3 +276,27 @@ function millisecondsToMinutes(ms, roundToMinute) {
}
}
}
// Our countdown plugin takes a callback, a duration, and an optional message
$.fn.countdown = function (callback, duration, message) {
// If no message is provided, we use an empty string
message = message || "";
// Get reference to container, and set initial content
var container = $(this[0]).html(duration + message);
// Get reference to the interval doing the countdown
var countdown = setInterval(function () {
// If seconds remain
if (--duration) {
// Update our container's message
container.html(duration + message);
// Otherwise
} else {
// Clear the countdown interval
clearInterval(countdown);
// And fire the callback passing our container as `this`
callback.call(container);
}
// Run interval every 1000ms (1 second)
}, 1000);
};

52
data/interfaces/default/shutdown.html
View file

@ -1,20 +1,60 @@
<%inherit file="base.html"/>
<%def name="headIncludes()">
<meta http-equiv="refresh" content="${timer};url=index">
</%def>
<%def name="body()">
<div class="container-fluid">
<div class="row-fluid">
<div class="span12">
<div class="wellbg">
<div class="wellheader">
<div class="dashboard-wellheader">
<h2><i class="fa fa-refresh fa-spin"></i> PlexPy is ${message}</h2>
<div id="state-change-modal" class="modal hide fade">
<div class="modal-header">
<h3>${message}</h3>
</div>
<div class="modal-body" id="modal-text">
<div align="center">
% if message == "Shutting Down":
<h2><i class="fa fa-refresh fa-spin"></i> PlexPy is ${message}.</h2>
<br/>
% else:
<h2><i class="fa fa-refresh fa-spin"></i> PlexPy is ${message}.</h2>
<br/>
<h3>Restart in <span class="countdown"></span></h3>
% endif
</div>
</div>
<div class="modal-footer">
<div style="float: right;"><span class="muted" id="rquote"></span></div>
</div>
</div>
</div>
</div>
</%def>
</%def>
<%def name="javascriptIncludes()">
<script>
// Use p.countdown as container, pass redirect, duration, and optional message
$(".countdown").countdown(reloadPage, ${timer}, "");
$('#state-change-modal').modal({
keyboard: false
})
// Make modal visible
$('#state-change-modal').modal('show')
// Redirect to home page after countdown.
function reloadPage() {
window.location.href = "index";
}
$(document).ready(function () {
$.ajax({
url: 'random_arnold_quotes',
cache: false,
async: true,
success: function (data) {
$("#rquote").html(data);
}
});
});
</script>
</%def>