[ERROR] JS not loading

dd3d2b6a · goto01 · 59c94713 · dd3d2b6a · dd3d2b6a · dd3d2b6a
Commit dd3d2b6a authored Sep 29, 2022 by goto01
30 changed files
--- a/test/realtime_graph/db.sqlite3
+++ b/test/realtime_graph/db.sqlite3
--- a/test/realtime_graph/graph/__init__.py
+++ b/test/realtime_graph/graph/__init__.py
--- a/test/realtime_graph/graph/__pycache__/__init__.cpython-310.pyc
+++ b/test/realtime_graph/graph/__pycache__/__init__.cpython-310.pyc
--- a/test/realtime_graph/graph/__pycache__/admin.cpython-310.pyc
+++ b/test/realtime_graph/graph/__pycache__/admin.cpython-310.pyc
--- a/test/realtime_graph/graph/__pycache__/apps.cpython-310.pyc
+++ b/test/realtime_graph/graph/__pycache__/apps.cpython-310.pyc
--- a/test/realtime_graph/graph/__pycache__/consumers.cpython-310.pyc
+++ b/test/realtime_graph/graph/__pycache__/consumers.cpython-310.pyc
--- a/test/realtime_graph/graph/__pycache__/models.cpython-310.pyc
+++ b/test/realtime_graph/graph/__pycache__/models.cpython-310.pyc
--- a/test/realtime_graph/graph/__pycache__/routing.cpython-310.pyc
+++ b/test/realtime_graph/graph/__pycache__/routing.cpython-310.pyc
--- a/test/realtime_graph/graph/__pycache__/urls.cpython-310.pyc
+++ b/test/realtime_graph/graph/__pycache__/urls.cpython-310.pyc
--- a/test/realtime_graph/graph/__pycache__/views.cpython-310.pyc
+++ b/test/realtime_graph/graph/__pycache__/views.cpython-310.pyc
--- a/test/realtime_graph/graph/admin.py
+++ b/test/realtime_graph/graph/admin.py
+from django.contrib import admin
+
+# Register your models here.
--- a/test/realtime_graph/graph/apps.py
+++ b/test/realtime_graph/graph/apps.py
+from django.apps import AppConfig
+
+
+class GraphConfig(AppConfig):
+    default_auto_field = 'django.db.models.BigAutoField'
+    name = 'graph'
--- a/test/realtime_graph/graph/consumers.py
+++ b/test/realtime_graph/graph/consumers.py
+import json
+from random import randint
+from time import sleep
+from channels.generic.websocket import WebsocketConsumer
+
+
+class GraphConsumer(WebsocketConsumer):
+    def connect(self):
+        self.accept()
+        
+        for i in range(1000):
+            self.send(json.dumps({'value': randint(0,40)}))
+            sleep(1)
--- a/test/realtime_graph/graph/migrations/__init__.py
+++ b/test/realtime_graph/graph/migrations/__init__.py
--- a/test/realtime_graph/graph/migrations/__pycache__/__init__.cpython-310.pyc
+++ b/test/realtime_graph/graph/migrations/__pycache__/__init__.cpython-310.pyc
--- a/test/realtime_graph/graph/models.py
+++ b/test/realtime_graph/graph/models.py
+from django.db import models
+
+# Create your models here.
--- a/test/realtime_graph/graph/routing.py
+++ b/test/realtime_graph/graph/routing.py
+from django.urls import path
+
+from .consumers import GraphConsumer
+
+ws_urlpatterns = [
+    path('ws/graph/', GraphConsumer.as_asgi())
+]
\ No newline at end of file
--- a/test/realtime_graph/graph/tests.py
+++ b/test/realtime_graph/graph/tests.py
+from django.test import TestCase
+
+# Create your tests here.
--- a/test/realtime_graph/graph/urls.py
+++ b/test/realtime_graph/graph/urls.py
+from django.urls import URLPattern, path
+from .views import index
+
+
+urlpatterns = [
+    path('', index)
+]
\ No newline at end of file
--- a/test/realtime_graph/graph/views.py
+++ b/test/realtime_graph/graph/views.py
+from django.shortcuts import render
+
+# Create your views here.
+def index(request):
+    return render(request, 'base.html', context={'text': 'Hello world'})
\ No newline at end of file
--- a/test/realtime_graph/realtime_graph/__pycache__/__init__.cpython-310.pyc
+++ b/test/realtime_graph/realtime_graph/__pycache__/__init__.cpython-310.pyc
--- a/test/realtime_graph/realtime_graph/__pycache__/asgi.cpython-310.pyc
+++ b/test/realtime_graph/realtime_graph/__pycache__/asgi.cpython-310.pyc
--- a/test/realtime_graph/realtime_graph/__pycache__/settings.cpython-310.pyc
+++ b/test/realtime_graph/realtime_graph/__pycache__/settings.cpython-310.pyc
--- a/test/realtime_graph/realtime_graph/__pycache__/urls.cpython-310.pyc
+++ b/test/realtime_graph/realtime_graph/__pycache__/urls.cpython-310.pyc
--- a/test/realtime_graph/realtime_graph/__pycache__/wsgi.cpython-310.pyc
+++ b/test/realtime_graph/realtime_graph/__pycache__/wsgi.cpython-310.pyc
--- a/test/realtime_graph/realtime_graph/asgi.py
+++ b/test/realtime_graph/realtime_graph/asgi.py
@@ -10,7 +10,16 @@ https://docs.djangoproject.com/en/4.1/howto/deployment/asgi/
 import os

 from django.core.asgi import get_asgi_application
+from channels.routing import ProtocolTypeRouter, URLRouter
+from channels.auth import AuthMiddlewareStack
+
+from graph.routing import ws_urlpatterns
+

 os.environ.setdefault('DJANGO_SETTINGS_MODULE', 'realtime_graph.settings')

-application = get_asgi_application()
+application = ProtocolTypeRouter({
+    'http': get_asgi_application(),
+    'websocket': AuthMiddlewareStack(URLRouter(ws_urlpatterns)) 
+})
+
--- a/test/realtime_graph/realtime_graph/settings.py
+++ b/test/realtime_graph/realtime_graph/settings.py
@@ -10,6 +10,7 @@ For the full list of settings and their values, see
 https://docs.djangoproject.com/en/4.1/ref/settings/
 """

+import os
 from pathlib import Path

 # Build paths inside the project like this: BASE_DIR / 'subdir'.
@@ -37,6 +38,9 @@ INSTALLED_APPS = [
    'django.contrib.sessions',
    'django.contrib.messages',
    'django.contrib.staticfiles',
+    'channels',
+    'graph',
+    
 ]

 MIDDLEWARE = [
@@ -54,7 +58,9 @@ ROOT_URLCONF = 'realtime_graph.urls'
 TEMPLATES = [
    {
        'BACKEND': 'django.template.backends.django.DjangoTemplates',
-        'DIRS': [],
+        'DIRS': [
+            BASE_DIR.joinpath('templates')
+        ],
        'APP_DIRS': True,
        'OPTIONS': {
            'context_processors': [
@@ -68,6 +74,7 @@ TEMPLATES = [
 ]

 WSGI_APPLICATION = 'realtime_graph.wsgi.application'
+ASGI_APPLICATION = 'realtime_graph.asgi.application'


 # Database
@@ -116,6 +123,9 @@ USE_TZ = True
 # https://docs.djangoproject.com/en/4.1/howto/static-files/

 STATIC_URL = 'static/'
+STATICFILES_DIRS = [
+    BASE_DIR / "static",
+]

 # Default primary key field type
 # https://docs.djangoproject.com/en/4.1/ref/settings/#default-auto-field

--- a/test/realtime_graph/realtime_graph/urls.py
+++ b/test/realtime_graph/realtime_graph/urls.py
@@ -14,8 +14,9 @@ Including another URLconf
    2. Add a URL to urlpatterns:  path('blog/', include('blog.urls'))
 """
 from django.contrib import admin
-from django.urls import path
+from django.urls import path, include

 urlpatterns = [
    path('admin/', admin.site.urls),
+    path('', include('graph.urls'))
 ]
--- a/test/realtime_graph/static/main.js
+++ b/test/realtime_graph/static/main.js
+var socket = new WebSocket('ws://localhost:8000/ws/graph');
+
+socket.onmessage = function(e){
+    var djangoData = JSON.parse(e.data);
+    console.log(djangoData);
+
+    document.querySelector('#app').innerText = djangoData.value;
+}
\ No newline at end of file
--- a/test/realtime_graph/templates/base.html
+++ b/test/realtime_graph/templates/base.html
+{% load static %}
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+
+    <!--CSS Only-->
+    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-1BmE4kWBq78iYhFldvKuhfTAU6auU8tT94WrHftjDbrCEXSU1oBoqyl2QvZ6jIW3" crossorigin="anonymous">
+    <title>Real Time Graph App</title>
+</head>
+<body>
+    
+    <div class="container">
+        <div class="row">
+            <div class="col-10 mx-auto mt-5">
+                <h1 id="app">{{ text }}</h1>
+                
+            </div>
+
+        </div>
+    </div>
+    <script scr="{% static 'main.js' %}" ></script>
+</body>
+</html>
\ No newline at end of file