Compare commits
2 Commits
ade66a4a1b
...
2f80e3c7a2
| Author | SHA1 | Date | |
|---|---|---|---|
| 2f80e3c7a2 | |||
| f23b55e5bd |
18
musik.py
18
musik.py
|
|
@ -8,7 +8,7 @@ import random
|
|||
import subprocess
|
||||
from urllib import parse
|
||||
|
||||
from flask import Flask, Response, render_template
|
||||
from flask import Flask, Response, render_template, send_file
|
||||
from werkzeug.utils import secure_filename
|
||||
|
||||
MUSIC_DIR = "/mnt/music/Music"
|
||||
|
|
@ -32,6 +32,7 @@ def index():
|
|||
nav_items.sort()
|
||||
nav_items = [item + '/' for item in nav_items]
|
||||
initial_track = "/Accept/Accept - Balls to the Wall (1983) [FLAC] {74321 93214 2}/01 - Balls to the Wall.flac"
|
||||
initial_cover = "/Accept/Accept - Balls to the Wall (1983) [FLAC] {74321 93214 2}/folder.jpg"
|
||||
cd = "/"
|
||||
return render_template('index.html', **locals())
|
||||
|
||||
|
|
@ -84,7 +85,7 @@ def get_dir(directory):
|
|||
|
||||
@app.route('/get_shuffle')
|
||||
def shuffle():
|
||||
"""Returns a randomly selected song from the library."""
|
||||
"""Returns a randomly selected track from the library."""
|
||||
item = random.choice(os.listdir(MUSIC_DIR))
|
||||
path = os.path.join(MUSIC_DIR, item)
|
||||
n = 0
|
||||
|
|
@ -101,5 +102,18 @@ def shuffle():
|
|||
return path.replace(MUSIC_DIR, '')
|
||||
|
||||
|
||||
@app.route('/album_cover/<path:cover>')
|
||||
def album_cover(cover):
|
||||
"""View for the raw audio file."""
|
||||
path = os.path.join(MUSIC_DIR, cover)
|
||||
path = os.path.abspath(path)
|
||||
if not path.startswith(MUSIC_DIR):
|
||||
return "False"
|
||||
if not os.path.isfile(path):
|
||||
return "False"
|
||||
|
||||
return send_file(path)
|
||||
|
||||
|
||||
if __name__ == "__main__":
|
||||
app.run(host='0.0.0.0', port=5150)
|
||||
|
|
|
|||
|
|
@ -1,11 +1,20 @@
|
|||
#mainContainer {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
body {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
img {
|
||||
max-width:100%;
|
||||
max-height:100%;
|
||||
}
|
||||
|
||||
#globalContainer {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
height: 100vh;
|
||||
}
|
||||
|
||||
#titleContainer {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
#navigationContainer {
|
||||
|
|
@ -15,6 +24,28 @@
|
|||
border-bottom: 2px solid #ccc;
|
||||
}
|
||||
|
||||
#currentDirectory {
|
||||
padding-left: 0.5em;
|
||||
}
|
||||
|
||||
#navItems {
|
||||
list-style-type: none;
|
||||
}
|
||||
|
||||
#playerContainer {
|
||||
flex: 0 0 auto;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
#albumCover {
|
||||
padding-right: 1em;
|
||||
padding-left: 1em;
|
||||
}
|
||||
|
||||
#playerControls {
|
||||
text-align: center;
|
||||
padding-right: 0.5em;
|
||||
padding-bottom: 0.5em;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,17 +1,20 @@
|
|||
var httpRequest
|
||||
|
||||
function load() {
|
||||
// track has ended
|
||||
document.getElementById('player').addEventListener('ended', function() {
|
||||
if (!document.getElementById('shuffle').checked) { return; }
|
||||
httpRequest = new XMLHttpRequest();
|
||||
httpRequest.onreadystatechange = function() {
|
||||
if (httpRequest.readyState !== XMLHttpRequest.DONE) { return; }
|
||||
if (httpRequest.status !== 200) { return; }
|
||||
let track = httpRequest.responseText;
|
||||
change_track(track);
|
||||
// shuffle
|
||||
if (document.getElementById('shuffle').checked) {
|
||||
httpRequest = new XMLHttpRequest();
|
||||
httpRequest.onreadystatechange = function() {
|
||||
if (httpRequest.readyState !== XMLHttpRequest.DONE) { return; }
|
||||
if (httpRequest.status !== 200) { return; }
|
||||
let track = httpRequest.responseText;
|
||||
change_track(track);
|
||||
}
|
||||
httpRequest.open('GET', '/musik/get_shuffle', true);
|
||||
httpRequest.send();
|
||||
}
|
||||
httpRequest.open('GET', '/musik/get_shuffle', true);
|
||||
httpRequest.send();
|
||||
});
|
||||
}
|
||||
|
||||
|
|
@ -37,6 +40,10 @@ function change_track(track) {
|
|||
player.load();
|
||||
player.play();
|
||||
document.getElementById('nowPlaying').innerHTML = track;
|
||||
|
||||
let cd = document.getElementById('currentDirectory').innerText;
|
||||
let art = document.getElementById('albumCover');
|
||||
art.firstChild.src = '/musik/album_cover' + cd + 'folder.jpg';
|
||||
}
|
||||
|
||||
function get_dir(item) {
|
||||
|
|
|
|||
|
|
@ -7,8 +7,8 @@
|
|||
<script>window.onload = load;</script>
|
||||
</head>
|
||||
<body>
|
||||
<div id="mainContainer">
|
||||
<center><h1>Musik</h1></center>
|
||||
<div id="globalContainer">
|
||||
<div id="titleContainer"><h1>Musik</h1></div>
|
||||
<div id="navigationContainer">
|
||||
<div id="currentDirectory">{{ cd }}</div>
|
||||
<ul id="navItems">
|
||||
|
|
@ -18,13 +18,17 @@
|
|||
</ul>
|
||||
</div>
|
||||
<div id="playerContainer">
|
||||
<center>
|
||||
<div><h3 id="nowPlaying">{{ initial_track }}</h3></div>
|
||||
<div id="albumCover"><img src="/musik/album_cover{{ initial_cover }}"/></div>
|
||||
<div id="playerControls">
|
||||
<h3 id="nowPlaying">{{ initial_track }}</h3>
|
||||
<audio id="player" controls>
|
||||
<source id="stream" src="{{ url_for('stream', track=initial_track) }}" type="audio/ogg">
|
||||
</audio>
|
||||
<div><input type="checkbox" id="shuffle">Shuffle</input>
|
||||
</center>
|
||||
<div>
|
||||
<input type="checkbox" name="shuffle" id="shuffle" checked="true">
|
||||
<label for="shuffle">Shuffle</label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
|
|
|
|||
Loading…
Reference in New Issue
Block a user