This commit is contained in:
Xamora 2023-11-23 17:40:10 +01:00
parent 267eeab896
commit b33209f6c0
18 changed files with 109 additions and 35 deletions

0
chat/__init__.py Normal file
View File

3
chat/admin.py Normal file
View File

@ -0,0 +1,3 @@
from django.contrib import admin
# Register your models here.

6
chat/apps.py Normal file
View File

@ -0,0 +1,6 @@
from django.apps import AppConfig
class ChatConfig(AppConfig):
default_auto_field = 'django.db.models.BigAutoField'
name = 'chat'

3
chat/models.py Normal file
View File

@ -0,0 +1,3 @@
from django.db import models
# Create your models here.

3
chat/tests.py Normal file
View File

@ -0,0 +1,3 @@
from django.test import TestCase
# Create your tests here.

3
chat/views.py Normal file
View File

@ -0,0 +1,3 @@
from django.shortcuts import render
# Create your views here.

10
frontend/consumers.py Normal file
View File

@ -0,0 +1,10 @@
import json
from channels.generic.websocket import WebsocketConsumer
class ChatConsumer(WebsocketConsumer):
def connect(self):
self.accept()
self.send(text_data=json.dumps({
'type':'connection_established',
'message':'You are now connected!'
}))

6
frontend/routing.py Normal file
View File

@ -0,0 +1,6 @@
from django.urls import re_path
from . import consumers
websocket_urlpatterns = [
re_path(r'ws/socket_server/', consumers.ChatConsumer.as_asgi())
]

View File

@ -1,37 +1,9 @@
body { body {
--nav-width: 200px; margin: 10;
margin: 0 0 0 var(--nav-width);
font-family: 'Quicksand', sans-serif; font-family: 'Quicksand', sans-serif;
font-size: 18px; font-size: 18px;
} }
.nav {
position: fixed;
top: 0;
left: 0;
width: var(--nav-width);
height: 100vh;
background: #222222;
}
.nav__link {
display: block;
padding: 12px 18px;
text-decoration: none;
color: #eeeeee;
font-weight: 500;
}
.nav__link:hover {
background: rgba(255, 255, 255, 0.05);
}
#app {
margin: 2em;
line-height: 1.5;
font-weight: 500;
}
a { a {
color: #009579; color: #009579;
} }

View File

@ -2,6 +2,7 @@ import Dashboard from "./views/Dashboard.js";
import Posts from "./views/Posts.js"; import Posts from "./views/Posts.js";
import PostView from "./views/PostView.js"; import PostView from "./views/PostView.js";
import Settings from "./views/Settings.js"; import Settings from "./views/Settings.js";
import Chat from "./views/Chat.js";
const pathToRegex = path => new RegExp("^" + path.replace(/\//g, "\\/").replace(/:\w+/g, "(.+)") + "$"); const pathToRegex = path => new RegExp("^" + path.replace(/\//g, "\\/").replace(/:\w+/g, "(.+)") + "$");
@ -24,7 +25,8 @@ const router = async () => {
{ path: "/", view: Dashboard }, { path: "/", view: Dashboard },
{ path: "/posts", view: Posts }, { path: "/posts", view: Posts },
{ path: "/posts/:id", view: PostView }, { path: "/posts/:id", view: PostView },
{ path: "/settings", view: Settings } { path: "/settings", view: Settings },
{ path: "/chat", view: Chat },
]; ];
// Test each route for potential match // Test each route for potential match

View File

@ -0,0 +1,21 @@
import AbstractView from "./AbstractView.js";
export default class extends AbstractView {
constructor(params) {
super(params);
this.setTitle("Chat");
let url = `ws://${window.location.host}/ws/socket-server/`
const chatSocket = new WebSocket(url)
chatSocket.onmessage = function(e) {
let data = JSON.parse(e.data)
console.log('Data:', data)
}
}
async getHtml() {
return `
<h1>Chat</h1>
`;
}
}

View File

@ -0,0 +1,20 @@
<!DOCTYPE html>
<html>
<head>
<meta charset='utf-8'>
<title>Chat</title>
</head>
<body>
<h1>Chat</h1>
<script type="text/javascript">
let url = `ws://${window.location.host}/ws/socket-server/`
const chatSocket = new WebSocket(url)
chatSocket.onmessage = function(e) {
let data = JSON.parse(e.data)
console.log('Data:', data)
}
</script>
</body>
</html>

View File

@ -12,6 +12,7 @@
<a href="/" class="nav__link" data-link>Dashboard</a> <a href="/" class="nav__link" data-link>Dashboard</a>
<a href="/posts" class="nav__link" data-link>Posts</a> <a href="/posts" class="nav__link" data-link>Posts</a>
<a href="/settings" class="nav__link" data-link>Settings</a> <a href="/settings" class="nav__link" data-link>Settings</a>
<a href="/chat" class="nav__link" data-link>Chat</a>
</nav> </nav>
<div id="app"></div> <div id="app"></div>
<script type="module" src="{% static 'js/index.js' %}"></script> <script type="module" src="{% static 'js/index.js' %}"></script>

View File

@ -1,7 +1,9 @@
from django.urls import path, re_path from django.urls import path, re_path
from .views import index_view from .views import index_view
from . import views
urlpatterns = [ urlpatterns = [
re_path(r'^', index_view ,name="index"), path('', views.chat)
#re_path(r'^', index_view ,name="index"),
] ]

View File

@ -4,3 +4,6 @@ from django.shortcuts import render
def index_view(req): def index_view(req):
return render(req, 'index.html'); return render(req, 'index.html');
def chat(req):
return render(req, 'chat.html');

View File

@ -6,3 +6,5 @@ djangorestframework==3.14.0
install==1.3.5 install==1.3.5
pytz==2023.3.post1 pytz==2023.3.post1
sqlparse==0.4.4 sqlparse==0.4.4
channels==3.0.5
daphne

View File

@ -10,7 +10,17 @@ https://docs.djangoproject.com/en/4.2/howto/deployment/asgi/
import os import os
from django.core.asgi import get_asgi_application from django.core.asgi import get_asgi_application
from channels.routing import ProtocolTypeRouter, URLRouter
from channels.auth import AuthMiddlewareStack
import frontend.routing
os.environ.setdefault('DJANGO_SETTINGS_MODULE', 'trancendence.settings') os.environ.setdefault('DJANGO_SETTINGS_MODULE', 'trancendence.settings')
application = get_asgi_application() application = ProtocolTypeRouter({
'http':get_asgi_application(),
'websocket':AuthMiddlewareStack(
URLRouter(
frontend.routing.websocket_urlpatterns
)
)
})

View File

@ -38,9 +38,12 @@ CORS_ORIGIN_WHITELIST = (
# Application definition # Application definition
INSTALLED_APPS = [ INSTALLED_APPS = [
'channels',
'daphne',
'accounts.apps.AccountsConfig', 'accounts.apps.AccountsConfig',
'profiles.apps.ProfilesConfig', 'profiles.apps.ProfilesConfig',
'frontend.apps.FrontendConfig', #'frontend.apps.FrontendConfig',
'corsheaders', 'corsheaders',
'rest_framework', 'rest_framework',
@ -50,8 +53,12 @@ INSTALLED_APPS = [
'django.contrib.sessions', 'django.contrib.sessions',
'django.contrib.messages', 'django.contrib.messages',
'django.contrib.staticfiles', 'django.contrib.staticfiles',
'frontend',
] ]
ASGI_APPLICATION = 'trancendence.asgi.application'
MIDDLEWARE = [ MIDDLEWARE = [
'corsheaders.middleware.CorsMiddleware', 'corsheaders.middleware.CorsMiddleware',
'django.middleware.common.CommonMiddleware', 'django.middleware.common.CommonMiddleware',