ocf · UntrustedAccount · Oct 5, 2024 · Oct 5, 2024 · Oct 5, 2024 · Oct 10, 2024
diff --git a/.gitignore b/.gitignore
@@ -1,3 +1,5 @@
+music/
+
 # Byte-compiled / optimized / DLL files
 __pycache__/
 *.py[cod]

diff --git a/README.md b/README.md
@@ -28,10 +28,24 @@ Activate the Poetry environment:
 poetry shell
 ```
 
+## Running the project
+
+#### Starting the Server
+
+Enter the `backend` directory, then run `runner.py`:
+
+```
+cd backend/
+python3 runner.py
+```
+
+#### Starting the Website
+
 Enter the `jukebox` directory, and run the project:
 
 ```
 cd jukebox/
 python manage.py runserver
 ```
 
+Go to `http://127.0.0.1:8000/YTUSRN/` to access the website.
diff --git a/jukebox/YTUSRN/__init__.py b/jukebox/YTUSRN/__init__.py
diff --git a/jukebox/YTUSRN/admin.py b/jukebox/YTUSRN/admin.py
@@ -0,0 +1,3 @@
+from django.contrib import admin
+
+# Register your models here.
diff --git a/jukebox/YTUSRN/apps.py b/jukebox/YTUSRN/apps.py
@@ -0,0 +1,6 @@
+from django.apps import AppConfig
+
+
+class YtusrnConfig(AppConfig):
+    default_auto_field = 'django.db.models.BigAutoField'
+    name = 'YTUSRN'
diff --git a/jukebox/YTUSRN/migrations/0001_initial.py b/jukebox/YTUSRN/migrations/0001_initial.py
@@ -0,0 +1,22 @@
+# Generated by Django 5.1.1 on 2024-10-22 23:39
+
+from django.db import migrations, models
+
+
+class Migration(migrations.Migration):
+
+    initial = True
+
+    dependencies = [
+    ]
+
+    operations = [
+        migrations.CreateModel(
+            name='UserField',
+            fields=[
+                ('id', models.BigAutoField(auto_created=True, primary_key=True, serialize=False, verbose_name='ID')),
+                ('user_text', models.CharField(max_length=200)),
+                ('date', models.DateTimeField(verbose_name='date published')),
+            ],
+        ),
+    ]
diff --git a/jukebox/YTUSRN/migrations/__init__.py b/jukebox/YTUSRN/migrations/__init__.py
diff --git a/jukebox/YTUSRN/models.py b/jukebox/YTUSRN/models.py
@@ -0,0 +1,11 @@
+from django.db import models
+import datetime
+from django.utils import timezone
+
+
+class UserField(models.Model):
+    username = models.CharField(max_length=200)
+    date = models.DateTimeField("enter time")
+
+    def __str__(self):
+        return self.user_text
diff --git a/jukebox/YTUSRN/static/YTUSRN/style.css b/jukebox/YTUSRN/static/YTUSRN/style.css
@@ -0,0 +1,116 @@
+body {
+  font-family: "Helvetica Neue", Arial, sans-serif;
+  background-color: #121212;
+  color: #f0f0f0;
+  margin: 0px;
+  padding: 0px;
+  display: flex;
+  height: 100vh;
+}
+
+.main-container {
+  display: flex;
+  padding: 20vh;
+  gap: 10vh;
+}
+
+.centered-container {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  width: 100%;
+  height: 100%;
+}
+
+form {
+  margin: 0px;
+  display: flex;
+  flex-direction: column;
+  gap: 10px;
+}
+
+.outlined {
+  border: 1px solid #333;
+  border-radius: 6px;
+  background-color: #1e1e1e;
+  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.7);
+  text-align: center;
+}
+
+.col-container {
+  display: flex;
+  flex-direction: column;
+  justify-content: space-evenly;
+  gap: 20px;
+  padding: 20px;
+}
+
+.row-container {
+  display: flex;
+  flex-direction: row;
+  justify-content: space-evenly;
+  gap: 20px;
+  padding: 20px;
+}
+
+input[type="text"] {
+  width: 100%;
+  padding: 8px;
+  border: 1px solid #555;
+  border-radius: 4px;
+  background-color: #2e2e2e;
+  color: #f0f0f0;
+  font-size: 14px;
+  box-sizing: border-box;
+}
+
+h2 {
+  font-size: 22px;
+  color: #ffcc00;
+}
+
+h1 {
+  color: #f0f0f0;
+}
+
+input[type="url"] {
+  width: 100%;
+  padding: 10px;
+  border: none;
+  border-radius: 6px;
+  background-color: #333;
+  color: #e0e0e0;
+  font-size: 16px;
+  box-sizing: border-box;
+  outline: none;
+}
+
+input[type="url"]::placeholder {
+  color: #aaa;
+}
+
+button {
+  width: 100%;
+  padding: 12px;
+  border: none;
+  border-radius: 6px;
+  background-color: #ffcc00;
+  color: #1a1a1a;
+  font-size: 16px;
+  font-weight: bold;
+  cursor: pointer;
+  transition: background-color 0.3s;
+}
+
+button:hover {
+  background-color: #e6b800;
+}
+
+.control-icon {
+  cursor: pointer;
+  color: #ffcc00;
+}
+
+.control-icon:hover {
+  color: #e6b800;
+}
diff --git a/jukebox/YTUSRN/templates/jukebox/dashboard.html b/jukebox/YTUSRN/templates/jukebox/dashboard.html
@@ -0,0 +1,67 @@
+{% load static %}
+<link rel="stylesheet" href="{% static 'YTUSRN/style.css' %}" />
+
+{% load icons %}
+<link
+  rel="stylesheet"
+  href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.css"
+/>
+
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>Dashboard</title>
+  </head>
+  <body>
+    <div class="centered-container">
+      <div class="outlined col-container">
+        <h2>Submit URL</h2>
+        <form method="POST">
+          {% csrf_token %}
+          <input
+            type="url"
+            name="url"
+            placeholder="Enter URL"
+            id="url-input"
+            required
+          />
+          <button type="submit" id="url-button">Submit</button>
+        </form>
+        <div class="row-container outlined">
+          <div id="pause-button" class="control-icon">
+            {% icon 'pause' extra_classes='fa-xl'%}
+          </div>
+          <div id="next-button" class="control-icon">
+            {% icon 'next' extra_classes='fa-xl'%}
+          </div>
+        </div>
+      </div>
+    </div>
+    <script>
+      const socket = new WebSocket("ws://localhost:42069");
+
+      const url_input = document.querySelector("#url-input");
+      const url_button = document.querySelector("#url-button");
+
+      const pause_button = document.querySelector("#pause-button");
+      const next_button = document.querySelector("#next-button");
+
+      url_button.onclick = (e) => {
+        const message = url_input.value;
+        console.log(message);
+        socket.send("play " + message);
+        url_input.value = "";
+      };
+
+      pause_button.onclick = (e) => {
+        socket.send("pause");
+      };
+
+      next_button.onclick = (e) => {
+        socket.send("next");
+      };
+    </script>
+  </body>
+</html>
diff --git a/jukebox/YTUSRN/templates/jukebox/index.html b/jukebox/YTUSRN/templates/jukebox/index.html
@@ -0,0 +1,28 @@
+{% load static %}
+<link rel="stylesheet" href="{% static 'YTUSRN/style.css' %}" />
+
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>Username Input</title>
+  </head>
+  <body>
+    <div class="centered-container">
+      <div class="outlined col-container">
+        <h2>Sign In</h2>
+        <form class="user-form" action="/YTUSRN/" method="POST">
+          {% csrf_token %}
+          <input
+            type="text"
+            name="username"
+            placeholder="Enter username"
+            required
+          />
+          <button type="submit">Submit</button>
+        </form>
+      </div>
+    </div>
+  </body>
+</html>
diff --git a/jukebox/YTUSRN/tests.py b/jukebox/YTUSRN/tests.py
@@ -0,0 +1,3 @@
+from django.test import TestCase
+
+# Create your tests here.
diff --git a/jukebox/YTUSRN/urls.py b/jukebox/YTUSRN/urls.py
@@ -0,0 +1,10 @@
+from django.urls import path
+
+from . import views
+
+app_name = "YTUSRN"
+
+urlpatterns = [
+    path("", views.index, name="index"),
+    path("dashboard", views.dashboard, name="dashboard"),
+]
diff --git a/jukebox/YTUSRN/views.py b/jukebox/YTUSRN/views.py
@@ -0,0 +1,22 @@
+from django.shortcuts import render, get_object_or_404
+from django.http import HttpResponse, HttpResponseRedirect
+from django.urls import reverse
+from django.db.models import F
+from .models import UserField
+
+
+def index(request):
+    try:
+        username_input = request.POST["username"]
+        print(username_input)
+    except KeyError:
+        return render(
+            request,
+            "jukebox/index.html",
+        )
+    else:
+        return HttpResponseRedirect(reverse("YTUSRN:dashboard"))
+
+
+def dashboard(request):
+    return render(request, "jukebox/dashboard.html")
diff --git a/jukebox/api/__init__.py b/jukebox/api/__init__.py
diff --git a/jukebox/api/admin.py b/jukebox/api/admin.py
@@ -0,0 +1,3 @@
+from django.contrib import admin
+
+# Register your models here.
diff --git a/jukebox/api/apps.py b/jukebox/api/apps.py
@@ -0,0 +1,6 @@
+from django.apps import AppConfig
+
+
+class ApiConfig(AppConfig):
+    default_auto_field = 'django.db.models.BigAutoField'
+    name = 'api'
diff --git a/jukebox/api/migrations/__init__.py b/jukebox/api/migrations/__init__.py
diff --git a/jukebox/api/models.py b/jukebox/api/models.py
@@ -0,0 +1,3 @@
+from django.db import models
+
+# Create your models here.
diff --git a/jukebox/api/tests.py b/jukebox/api/tests.py
@@ -0,0 +1,3 @@
+from django.test import TestCase
+
+# Create your tests here.
diff --git a/jukebox/api/urls.py b/jukebox/api/urls.py
@@ -0,0 +1,9 @@
+from django.urls import path
+from .views import queue_status, play_song, pause_song, next_song
+
+urlpatterns = [
+    path('queue-status/', queue_status, name='queue_status'),
+    path('play/', play_song, name='play_song'),
+    path('pause/', pause_song, name='pause_song'),
+    path('next/', next_song, name='next_song'),
+]
diff --git a/jukebox/api/views.py b/jukebox/api/views.py
@@ -0,0 +1,27 @@
+from django.shortcuts import render
+from rest_framework.decorators import api_view
+from rest_framework.response import Response
+from jukebox.jukebox.backend.runner import Controller
+
+controller = Controller()  
+
+@api_view(['GET'])
+def queue_status(request):
+    current_song = controller.song_queue.queue[0].name if not controller.song_queue.empty() else None
+    return Response({"current_song": current_song})
+
+@api_view(['POST'])
+def play_song(request):
+    song_name = request.data.get('song_name')
+    controller.play(song_name)
+    return Response({"status": "playing", "song": song_name})
+
+@api_view(['POST'])
+def pause_song(request):
+    controller.pause()
+    return Response({"status": "paused"})
+
+@api_view(['POST'])
+def next_song(request):
+    controller.next()
+    return Response({"status": "next"})
diff --git a/jukebox/backend/config.py b/jukebox/backend/config.py
@@ -0,0 +1 @@
+PORT = 42069
Original file line number	Diff line number	Diff line change
		@@ -0,0 +1,3 @@
		from django.contrib import admin

		# Register your models here.
Original file line number	Diff line number	Diff line change
		@@ -0,0 +1,3 @@
		from django.test import TestCase

		# Create your tests here.
Original file line number	Diff line number	Diff line change
		@@ -0,0 +1,3 @@
		from django.db import models

		# Create your models here.