48 lines
1.4 KiB
Plaintext
48 lines
1.4 KiB
Plaintext
|
{% extends "base" %} {% block content %}
|
||
|
|
<div class="ui cards">
|
||
|
|
<div class="ui centered raised card">
|
||
|
|
<div class="image">
|
||
|
|
<img src="/static/image/card.jpg">
|
||
|
|
</div>
|
||
|
|
<div class="center aligned content">
|
||
|
|
<a class="header">{{ music_title }}</a>
|
||
|
|
<div class="description">
|
||
|
|
<h2 id="time">{{ interval }}</h2>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
<div class="extra content">
|
||
|
|
<div class="ui two buttons">
|
||
|
|
<a href="/" class="ui red button">Stop</a>
|
||
|
|
<a href="/random" class="ui green button">Next</a>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<script type="text/javascript">
|
||
|
|
window.onload = function () {
|
||
|
|
let timeElement = document.querySelector('#time');
|
||
|
|
let sound = preload_audio('/static/sound/{{ music_file }}')
|
||
|
|
startTimer({{ interval }}, timeElement, sound);
|
||
|
|
}
|
||
|
|
|
||
|
|
function startTimer(seconds, element, sound) {
|
||
|
|
var timer = seconds - 1
|
||
|
|
let interval = setInterval(function () {
|
||
|
|
|
||
|
|
element.textContent = timer;
|
||
|
|
|
||
|
|
if (--timer < 0) {
|
||
|
|
play_audio(sound, 8000, function () {
|
||
|
|
location.reload()
|
||
|
|
})
|
||
|
|
|
||
|
|
clearInterval(interval)
|
||
|
|
element.textContent = '♬'
|
||
|
|
}
|
||
|
|
}, 1000);
|
||
|
|
}
|
||
|
|
|
||
|
|
</script>
|
||
|
|
{% endblock content %}
|