asd
This commit is contained in:
commit
ac2893b991
4 changed files with 243 additions and 0 deletions
1
.cache
Normal file
1
.cache
Normal file
|
|
@ -0,0 +1 @@
|
|||
{"access_token": "BQChu2C4bda7mJQi_xq_9-DRf3Vtq6hVwk88K3h1QXacIN8ppdFME-RZfy1wxJekQ__UVET_o9ZlWmD3nfqh1Otlbaenr0OwYGQlJDHSZYPBINUT0RbjkkCy5-2rNuqXEimVZpPf3ud9dYuHq4-hxJxrd1OdHi7fGhncF53qs4pulx1iPDVr5hDeJOO6vJh4A6X1NagW3nW8W1wxvesvlxaXeGE", "token_type": "Bearer", "expires_in": 3600, "scope": "user-modify-playback-state user-read-playback-state", "expires_at": 1736693329, "refresh_token": "AQDjS3e8vYiwJmfaksX3Bb-aS01v9UN0houDiFWvMMeJiCSv2fzNO4Gy81LAktHOgychbjD0e_ZC7m_HLJufAMQx3EeXn9HOz8Wo08MHfUaXHNaajKK5e7SIgev9H_2mU7g"}
|
||||
66
app.py
Normal file
66
app.py
Normal file
|
|
@ -0,0 +1,66 @@
|
|||
from flask import Flask, render_template, request, redirect, url_for, jsonify
|
||||
from spotipy import Spotify
|
||||
from spotipy.oauth2 import SpotifyOAuth
|
||||
|
||||
# Flask app
|
||||
app = Flask(__name__)
|
||||
|
||||
# Spotify API credentials
|
||||
CLIENT_ID = "d599e0f7a26d419eb6ae618361e1538c"
|
||||
CLIENT_SECRET = "af42c3dcdc90448087f8bc597ad551c6"
|
||||
REDIRECT_URI = "https://localhost:8888/callback"
|
||||
SCOPE = "user-modify-playback-state user-read-playback-state"
|
||||
|
||||
# Spotipy client
|
||||
sp = Spotify(auth_manager=SpotifyOAuth(
|
||||
client_id=CLIENT_ID,
|
||||
client_secret=CLIENT_SECRET,
|
||||
redirect_uri=REDIRECT_URI,
|
||||
scope=SCOPE
|
||||
))
|
||||
|
||||
# Home route
|
||||
@app.route("/")
|
||||
def home():
|
||||
return render_template("index.html")
|
||||
|
||||
@app.route("/add", methods=["GET"])
|
||||
def add_song():
|
||||
# Get the song name from the query parameters
|
||||
song_name = request.args.get("song_name")
|
||||
if not song_name:
|
||||
return jsonify({"error": "No song name provided."}), 400
|
||||
|
||||
try:
|
||||
# Search and add the song to the Spotify queue
|
||||
search_results = sp.search(q=song_name, type="track", limit=1)
|
||||
if search_results["tracks"]["items"]:
|
||||
track_uri = search_results["tracks"]["items"][0]["uri"]
|
||||
print(search_results["tracks"]["items"][0])
|
||||
sp.add_to_queue(track_uri)
|
||||
name = search_results["tracks"]["items"][0]["name"]
|
||||
return jsonify({"message": f"'{name}' has been added to the queue."}), 200
|
||||
else:
|
||||
return jsonify({"error": "No matching track found."}), 404
|
||||
except Exception as e:
|
||||
return jsonify({"error": str(e)}), 500
|
||||
|
||||
# Route to serve the queue table for iframe
|
||||
@app.route("/queue_table")
|
||||
def queue_table():
|
||||
queue_data = sp.queue()
|
||||
print(queue_data)
|
||||
queue = []
|
||||
if "queue" in queue_data and queue_data["queue"]:
|
||||
for track in queue_data["queue"]:
|
||||
track_name = track["name"]
|
||||
artist_name = track["artists"][0]["name"]
|
||||
queue.append({"track": track_name, "artist": artist_name})
|
||||
current = None
|
||||
if queue_data["currently_playing"]:
|
||||
current = {"track":queue_data["currently_playing"]["name"], "artist":queue_data["currently_playing"]["artists"][0]["name"]}
|
||||
return render_template("queue_table.html", queue=queue, length=len(queue), now_playing=current)
|
||||
|
||||
# Run the Flask app
|
||||
if __name__ == "__main__":
|
||||
app.run(port=80, host="0.0.0.0", debug=True)
|
||||
113
templates/index.html
Normal file
113
templates/index.html
Normal file
|
|
@ -0,0 +1,113 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Spotify Queue Manager</title>
|
||||
<style>
|
||||
body {
|
||||
font-family: Arial, sans-serif;
|
||||
text-align: center;
|
||||
margin: 0;
|
||||
padding: 20px;
|
||||
background-color: #f0f0f0;
|
||||
}
|
||||
h1 {
|
||||
color: #000000;
|
||||
}
|
||||
form {
|
||||
margin: 20px auto;
|
||||
}
|
||||
input[type="text"] {
|
||||
width: 80%;
|
||||
padding: 10px;
|
||||
margin: 10px 0;
|
||||
border: 1px solid #ccc;
|
||||
border-radius: 5px;
|
||||
}
|
||||
button {
|
||||
background-color: #000000;
|
||||
color: white;
|
||||
border: none;
|
||||
padding: 10px 20px;
|
||||
border-radius: 5px;
|
||||
cursor: pointer;
|
||||
}
|
||||
button:hover {
|
||||
background-color: #000000;
|
||||
}
|
||||
iframe {
|
||||
width: 100%;
|
||||
border: none;
|
||||
margin-top: 20px;
|
||||
overflow: hidden;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<h1>Queue</h1>
|
||||
<form id="addSongForm" onsubmit="addSong(event)">
|
||||
<input type="text" id="songInput" name="song_name" placeholder="Adauga melodie sau artist " required>
|
||||
<button type="submit">Adauga</button>
|
||||
</form>
|
||||
<div class="message" id="message"></div>
|
||||
<!-- Queue Table Embedded in an iframe -->
|
||||
<iframe src="/queue_table" id="queueIframe"></iframe>
|
||||
<script>
|
||||
// Function to handle song addition via GET request
|
||||
async function addSong(event) {
|
||||
event.preventDefault(); // Prevent the form from submitting normally
|
||||
const songInput = document.getElementById("songInput");
|
||||
const messageDiv = document.getElementById("message");
|
||||
const songName = encodeURIComponent(songInput.value);
|
||||
|
||||
// Clear message and disable input/button during request
|
||||
messageDiv.textContent = "Adding song...";
|
||||
songInput.disabled = true;
|
||||
|
||||
try {
|
||||
// Send GET request to add song
|
||||
const response = await fetch(`/add?song_name=${songName}`);
|
||||
const data = await response.json();
|
||||
|
||||
// Update message based on the response
|
||||
if (response.ok) {
|
||||
messageDiv.textContent = data.message || "Song added successfully!";
|
||||
messageDiv.className = "message success";
|
||||
} else {
|
||||
throw new Error(data.error || "Failed to add the song.");
|
||||
}
|
||||
} catch (error) {
|
||||
messageDiv.textContent = error.message;
|
||||
messageDiv.className = "message error";
|
||||
} finally {
|
||||
// Re-enable input and clear it
|
||||
songInput.disabled = false;
|
||||
songInput.value = "";
|
||||
}
|
||||
|
||||
// Reload the iframe to reflect the updated queue
|
||||
document.getElementById("queueIframe").contentWindow.location.reload();
|
||||
|
||||
setTimeout(() => {
|
||||
messageDiv.textContent = "";
|
||||
}, 3000)
|
||||
}
|
||||
// Adjust the iframe height dynamically to avoid scrollbars
|
||||
function resizeIframe() {
|
||||
const iframe = document.getElementById('queueIframe');
|
||||
iframe.style.height = iframe.contentWindow.document.body.scrollHeight+20 + 'px';
|
||||
}
|
||||
|
||||
// Resize iframe after it loads and periodically refresh the iframe
|
||||
const iframe = document.getElementById('queueIframe');
|
||||
iframe.onload = resizeIframe;
|
||||
setInterval(() => {
|
||||
iframe.contentWindow.location.reload();
|
||||
}, 15000);
|
||||
|
||||
// Add event listener for resize events
|
||||
window.addEventListener('resize', resizeIframe);
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
63
templates/queue_table.html
Normal file
63
templates/queue_table.html
Normal file
|
|
@ -0,0 +1,63 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<style>
|
||||
body {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
font-family: Arial, sans-serif;
|
||||
}
|
||||
h2 {
|
||||
color: #000000;
|
||||
margin: 10px 0;
|
||||
}
|
||||
.now-playing {
|
||||
text-align: center;
|
||||
margin: 20px 0;
|
||||
font-size: 1.2em;
|
||||
}
|
||||
table {
|
||||
border-collapse: collapse;
|
||||
margin: 0;
|
||||
font-size: 1em;
|
||||
font-family: Arial, sans-serif;
|
||||
}
|
||||
th, td {
|
||||
padding: 12px;
|
||||
border: 1px solid #ddd;
|
||||
text-align: left;
|
||||
}
|
||||
th {
|
||||
background-color: #000000;
|
||||
color: white;
|
||||
}
|
||||
body {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<center>
|
||||
<table>
|
||||
<thead>
|
||||
<tr>
|
||||
<th>#</th>
|
||||
<th>Track</th>
|
||||
<th>Artist</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
{% for i in range(length) %}
|
||||
<tr>
|
||||
<td>{{ i+1 }}</td>
|
||||
<td>{{ queue[i].track }}</td>
|
||||
<td>{{ queue[i].artist }}</td>
|
||||
</tr>
|
||||
{% endfor %}
|
||||
</tbody>
|
||||
</table></center>
|
||||
</body>
|
||||
</html>
|
||||
Loading…
Add table
Add a link
Reference in a new issue