diff --git a/pavilion/asgi.py b/pavilion/asgi.py
index 8105d75..2e7f64a 100644
--- a/pavilion/asgi.py
+++ b/pavilion/asgi.py
@@ -10,7 +10,23 @@
import os
from django.core.asgi import get_asgi_application
+from channels.routing import ProtocolTypeRouter, URLRouter
+from channels.auth import AuthMiddlewareStack
os.environ.setdefault('DJANGO_SETTINGS_MODULE', 'pavilion.settings')
-application = get_asgi_application()
+# Initialize Django ASGI application early to ensure the AppRegistry
+# is populated before importing code that may import ORM models.
+django_asgi_app = get_asgi_application()
+
+from pos_server.routing import websocket_urlpatterns
+
+application = ProtocolTypeRouter({
+ "http": django_asgi_app,
+ "websocket": AuthMiddlewareStack(
+ URLRouter(
+ websocket_urlpatterns
+ )
+ ),
+})
+
diff --git a/pavilion/settings.py b/pavilion/settings.py
index 0829b8e..4404b46 100644
--- a/pavilion/settings.py
+++ b/pavilion/settings.py
@@ -97,12 +97,14 @@
# Installed applications
INSTALLED_APPS = [
+ 'daphne', # ASGI server for Django Channels
'django.contrib.admin',
'django.contrib.auth',
'django.contrib.contenttypes',
'django.contrib.sessions',
'django.contrib.messages',
'django.contrib.staticfiles',
+ 'channels', # WebSocket support
'pos_server.apps.PosServerConfig', # POS system module
'webrtc', # WebRTC communication
'app_switcher', # App switcher page module
@@ -296,4 +298,14 @@
'BACKEND': 'django.core.cache.backends.locmem.LocMemCache',
'LOCATION': 'unique-snowflake', # Any unique identifier; it differentiates caches if you have multiple ones
}
+}
+
+# Django Channels configuration
+ASGI_APPLICATION = 'pavilion.asgi.application'
+
+# Channel layers for WebSocket communication
+CHANNEL_LAYERS = {
+ "default": {
+ "BACKEND": "channels.layers.InMemoryChannelLayer"
+ }
}
\ No newline at end of file
diff --git a/pos_server/consumers.py b/pos_server/consumers.py
new file mode 100644
index 0000000..528197e
--- /dev/null
+++ b/pos_server/consumers.py
@@ -0,0 +1,195 @@
+"""
+WebSocket consumers for real-time order updates.
+
+This module provides WebSocket consumers that enable real-time communication
+between the server and clients for order updates. It replaces the polling-based
+approach with a push-based WebSocket approach.
+"""
+
+import json
+from datetime import datetime
+from channels.generic.websocket import AsyncWebsocketConsumer
+from channels.db import database_sync_to_async
+from django.utils.timezone import now, localdate
+from django.db.models import Q
+
+
+class DateTimeEncoder(json.JSONEncoder):
+ """Custom JSON encoder that handles datetime objects."""
+ def default(self, obj):
+ if isinstance(obj, datetime):
+ return obj.isoformat()
+ return super().default(obj)
+
+
+def json_dumps(data):
+ """JSON dumps with datetime support."""
+ return json.dumps(data, cls=DateTimeEncoder)
+
+
+class OrderConsumer(AsyncWebsocketConsumer):
+ """
+ WebSocket consumer for real-time order updates.
+
+ Clients connect to this consumer to receive real-time notifications
+ when orders are created, updated, or deleted.
+ """
+
+ async def connect(self):
+ """Handle WebSocket connection."""
+ self.room_group_name = 'orders'
+
+ # Join the orders group
+ await self.channel_layer.group_add(
+ self.room_group_name,
+ self.channel_name
+ )
+
+ await self.accept()
+
+ # Send initial active orders on connection
+ orders = await self.get_active_orders()
+ await self.send(text_data=json_dumps({
+ 'type': 'initial_orders',
+ 'orders': orders
+ }))
+
+ async def disconnect(self, close_code):
+ """Handle WebSocket disconnection."""
+ # Leave the orders group
+ await self.channel_layer.group_discard(
+ self.room_group_name,
+ self.channel_name
+ )
+
+ async def receive(self, text_data):
+ """Handle incoming WebSocket messages."""
+ # Currently, clients don't send messages, but this can be extended
+ pass
+
+ async def order_update(self, event):
+ """
+ Handle order update events from the channel layer.
+
+ This is called when an order is created, updated, or deleted.
+ """
+ await self.send(text_data=json_dumps({
+ 'type': event['update_type'],
+ 'order': event['order']
+ }))
+
+ async def order_delete(self, event):
+ """
+ Handle order delete events from the channel layer.
+ """
+ await self.send(text_data=json_dumps({
+ 'type': 'order_deleted',
+ 'order_id': event['order_id']
+ }))
+
+ @database_sync_to_async
+ def get_active_orders(self):
+ """
+ Get all active orders for today.
+
+ Returns a list of serialized order data.
+ """
+ from .models import Order, OrderDish
+ from .views import collect_order
+
+ today = localdate()
+ active_orders = Order.objects.filter(
+ Q(start_time__lte=now()) &
+ (Q(kitchen_status=0) |
+ Q(kitchen_status=1) |
+ Q(bar_status=0) |
+ Q(bar_status=1) |
+ Q(gng_status=0) |
+ Q(gng_status=1) |
+ Q(picked_up=False))
+ ).filter(timestamp__date=today)
+
+ return [collect_order(order) for order in active_orders]
+
+
+class OrderProgressConsumer(AsyncWebsocketConsumer):
+ """
+ WebSocket consumer for customer-facing order progress screen.
+
+ This consumer provides real-time updates for the order status display
+ that customers see, showing which orders are in progress and ready.
+ """
+
+ async def connect(self):
+ """Handle WebSocket connection."""
+ self.room_group_name = 'order_progress'
+
+ # Join the order progress group
+ await self.channel_layer.group_add(
+ self.room_group_name,
+ self.channel_name
+ )
+
+ await self.accept()
+
+ # Send initial orders on connection
+ orders = await self.get_progress_orders()
+ await self.send(text_data=json_dumps({
+ 'type': 'initial_orders',
+ 'orders': orders
+ }))
+
+ async def disconnect(self, close_code):
+ """Handle WebSocket disconnection."""
+ await self.channel_layer.group_discard(
+ self.room_group_name,
+ self.channel_name
+ )
+
+ async def receive(self, text_data):
+ """Handle incoming WebSocket messages."""
+ pass
+
+ async def order_update(self, event):
+ """Handle order update events."""
+ await self.send(text_data=json_dumps({
+ 'type': event['update_type'],
+ 'order': event['order']
+ }))
+
+ async def order_delete(self, event):
+ """Handle order delete events."""
+ await self.send(text_data=json_dumps({
+ 'type': 'order_deleted',
+ 'order_id': event['order_id']
+ }))
+
+ @database_sync_to_async
+ def get_progress_orders(self):
+ """
+ Get orders for the progress display (in progress and ready).
+ """
+ from .models import Order
+ from .views import collect_order
+
+ today = localdate()
+
+ # Get in progress orders (kitchen_status = 1)
+ in_progress = Order.objects.filter(
+ kitchen_status=1,
+ timestamp__date=today
+ )
+
+ # Get ready orders (kitchen_status = 2 and not picked up)
+ ready = Order.objects.filter(
+ Q(kitchen_status=2) & Q(picked_up=False),
+ timestamp__date=today
+ )
+
+ in_progress_data = [collect_order(order) for order in in_progress]
+ ready_data = [collect_order(order) for order in ready]
+
+ return {
+ 'in_progress': in_progress_data,
+ 'ready': ready_data
+ }
diff --git a/pos_server/routing.py b/pos_server/routing.py
new file mode 100644
index 0000000..8abc445
--- /dev/null
+++ b/pos_server/routing.py
@@ -0,0 +1,11 @@
+"""
+WebSocket URL routing for pos_server app.
+"""
+
+from django.urls import re_path
+from . import consumers
+
+websocket_urlpatterns = [
+ re_path(r'ws/orders/$', consumers.OrderConsumer.as_asgi()),
+ re_path(r'ws/order-progress/$', consumers.OrderProgressConsumer.as_asgi()),
+]
diff --git a/pos_server/signals.py b/pos_server/signals.py
index bc96f5a..a7b629b 100644
--- a/pos_server/signals.py
+++ b/pos_server/signals.py
@@ -1,7 +1,102 @@
-from django.db.models.signals import post_save, pre_save
+from django.db.models.signals import post_save, post_delete, pre_save
from django.dispatch import receiver
from .models import *
from . import globals
+from channels.layers import get_channel_layer
+from asgiref.sync import async_to_sync
+
+
+def broadcast_order_update(order, update_type='order_updated'):
+ """
+ Broadcast order update to all connected WebSocket clients.
+
+ Args:
+ order: The Order instance that was updated
+ update_type: The type of update ('order_created', 'order_updated', 'order_deleted')
+ """
+ from .views import collect_order
+
+ channel_layer = get_channel_layer()
+ if channel_layer is None:
+ return
+
+ order_data = collect_order(order) if order else None
+
+ # Broadcast to order marking screen
+ async_to_sync(channel_layer.group_send)(
+ 'orders',
+ {
+ 'type': 'order_update',
+ 'update_type': update_type,
+ 'order': order_data
+ }
+ )
+
+ # Broadcast to order progress screen
+ async_to_sync(channel_layer.group_send)(
+ 'order_progress',
+ {
+ 'type': 'order_update',
+ 'update_type': update_type,
+ 'order': order_data
+ }
+ )
+
+
+def broadcast_order_delete(order_id):
+ """
+ Broadcast order deletion to all connected WebSocket clients.
+
+ Args:
+ order_id: The ID of the deleted order
+ """
+ channel_layer = get_channel_layer()
+ if channel_layer is None:
+ return
+
+ # Broadcast to order marking screen
+ async_to_sync(channel_layer.group_send)(
+ 'orders',
+ {
+ 'type': 'order_delete',
+ 'order_id': order_id
+ }
+ )
+
+ # Broadcast to order progress screen
+ async_to_sync(channel_layer.group_send)(
+ 'order_progress',
+ {
+ 'type': 'order_delete',
+ 'order_id': order_id
+ }
+ )
+
+
+@receiver(post_save, sender=Order)
+def order_saved(sender, instance, created, **kwargs):
+ """
+ Signal handler for when an Order is saved.
+ Broadcasts the update to all connected WebSocket clients.
+ """
+ update_type = 'order_created' if created else 'order_updated'
+ broadcast_order_update(instance, update_type)
+
+
+@receiver(pre_save, sender=Order)
+def store_order_id_before_delete(sender, instance, **kwargs):
+ """Store the order ID before deletion for broadcasting."""
+ pass # pre_save is not needed for deletion
+
+
+@receiver(post_delete, sender=Order)
+def order_deleted(sender, instance, **kwargs):
+ """
+ Signal handler for when an Order is deleted.
+ Broadcasts the deletion to all connected WebSocket clients.
+ """
+ broadcast_order_delete(instance.id)
+
# This is a corpse, maybe will be needed in the future.
diff --git a/pos_server/static/pos_server/kitchen-bar.js b/pos_server/static/pos_server/kitchen-bar.js
index d499521..c34d108 100644
--- a/pos_server/static/pos_server/kitchen-bar.js
+++ b/pos_server/static/pos_server/kitchen-bar.js
@@ -1,82 +1,592 @@
-const pollEverySecs = 11; // Put something that's not a factor of 10 to avoid race condition with auto actions. Needs to be fixed later.
-const pollEveryMilisecs = pollEverySecs * 1000;
+// WebSocket connection for real-time order updates
+let ordersSocket = null;
+let reconnectAttempts = 0;
+const maxReconnectAttempts = 10;
+const reconnectDelay = 3000;
const rejectOrderDialog = document.querySelector("#reject-reason")
const orderManagementDialog = document.querySelector("#order-management")
const preferencesDialog = document.querySelector("#filters-dialog")
-document.addEventListener("DOMContentLoaded", () => {
- let prevOrderId;
+// Module-level variables that will be initialized in DOMContentLoaded
+let mainDiv;
+let cards = [];
+let selectedIndex = 0;
+let ordersState = [];
+let csrftoken = '';
+let freezeDeletion = false;
+let availabilityDialog;
+let autoDoneTimeout;
+let autoCollectTimeout;
+
+function connectWebSocket() {
+ const protocol = window.location.protocol === 'https:' ? 'wss:' : 'ws:';
+ const wsUrl = `${protocol}//${window.location.host}/ws/orders/`;
+
+ ordersSocket = new WebSocket(wsUrl);
+
+ ordersSocket.onopen = function(e) {
+ console.log('WebSocket connected for orders');
+ reconnectAttempts = 0;
+ };
+
+ ordersSocket.onmessage = function(e) {
+ const data = JSON.parse(e.data);
+ handleWebSocketMessage(data);
+ };
+
+ ordersSocket.onclose = function(e) {
+ console.log('WebSocket closed. Attempting to reconnect...');
+ if (reconnectAttempts < maxReconnectAttempts) {
+ reconnectAttempts++;
+ setTimeout(connectWebSocket, reconnectDelay);
+ }
+ };
+
+ ordersSocket.onerror = function(e) {
+ console.error('WebSocket error:', e);
+ };
+}
+
+function handleWebSocketMessage(data) {
+ if (data.type === 'initial_orders') {
+ // Initial orders received on connection - filter and update state
+ const filteredOrders = data.orders.filter(order => shouldShowOrder(order));
+ ordersState = filteredOrders;
+ processInitialOrders(filteredOrders);
+ } else if (data.type === 'order_created') {
+ // New order created
+ if (data.order && shouldShowOrder(data.order)) {
+ if (!ordersState.some(o => o.order_id === data.order.order_id)) {
+ ordersState.push(data.order);
+ appendOrder(data.order);
+ }
+ }
+ } else if (data.type === 'order_updated') {
+ // Order updated
+ if (data.order) {
+ const existingIndex = ordersState.findIndex(o => o.order_id === data.order.order_id);
+ if (existingIndex !== -1) {
+ ordersState[existingIndex] = data.order;
+ updateExistingOrder(data.order);
+ } else if (shouldShowOrder(data.order)) {
+ ordersState.push(data.order);
+ appendOrder(data.order);
+ }
+ }
+ } else if (data.type === 'order_deleted') {
+ // Order deleted
+ const orderToRemove = ordersState.find(o => o.order_id === data.order_id);
+ if (orderToRemove) {
+ removeOrder(orderToRemove);
+ ordersState = ordersState.filter(o => o.order_id !== data.order_id);
+ }
+ }
+}
+
+function shouldShowOrder(order) {
+ // Check if order should be shown based on current filters
+ if (!order || order.picked_up) return false;
+
+ if (orderFilters.kitchen && order.kitchen_status <= 2 && order.kitchen_status !== 4) return true;
+ if (orderFilters.bar && order.bar_status <= 2 && order.bar_status !== 4) return true;
+ if (orderFilters.gng && order.gng_status <= 2 && order.gng_status !== 4) return true;
+
+ return false;
+}
+
+function processInitialOrders(orders) {
+ // Update existing cards and add new ones
+ orders.forEach(order => {
+ const existingCard = document.querySelector(`[data-order-id="${order.order_id}"]`);
+ if (existingCard) {
+ updateExistingOrder(order);
+ }
+ });
+}
+
+function updateExistingOrder(order) {
+ const card = cards.find(c => parseInt(c.dataset.orderId) === order.order_id);
+ if (card) {
+ card.dataset.kitchenStatus = order.kitchen_status;
+ card.dataset.barStatus = order.bar_status;
+ card.dataset.gngStatus = order.gng_status;
+ updateColors(card);
+
+ // Check if order should be removed (all stations done or picked up)
+ if (!shouldShowOrder(order)) {
+ removeOrder(order);
+ }
+ }
+}
+
+function appendOrder(data) {
+ const orderId = data.order_id;
+ const existingOrder = document.querySelector(`[data-order-id="${orderId}"]`)
+
+ if (existingOrder) {
+ return;
+ }
+
+ if (!cards.length) {
+ mainDiv.innerHTML = '';
+ selectedIndex = 0;
+ }
+ const newOrder = document.createElement("div");
+ newOrder.className = `order ${!cards.length ? "selected" : ""}`;
+ newOrder.dataset.orderId = orderId;
+ newOrder.dataset.channel = data.channel;
+ newOrder.dataset.paymentId = data.payment_id;
+ newOrder.dataset.kitchenStatus = data.kitchen_status;
+ newOrder.dataset.barStatus = data.bar_status;
+ newOrder.dataset.gngStatus = data.gng_status;
+ let channel;
+ if (data.channel == "store") {
+ channel = 'storefront ' + gettext('In-person')
+ } else if (data.channel == "web") {
+ channel = `shopping_cart_checkout ` + gettext("Online pick-up") +
+ `call ${data.phone}`
+ } else if (data.channel == "delivery") {
+ channel = `local_shipping ` + gettext("Delivery") +
+ `call ${data.phone}`
+ }
+ const progresses = document.createElement("div");
+ progresses.classList.add("progresses")
+ if (data.kitchen_status != 4) {
+ const statusStack = document.createElement("div");
+ statusStack.classList.add("kitchen-progress", "progress-stack")
+ statusStack.innerHTML = `restaurant
+
+ hourglass_bottom
+ hourglass_top
+
+ check
+ done_all`
+ progresses.appendChild(statusStack)
+ }
+ if (data.bar_status != 4) {
+ const statusStack = document.createElement("div");
+ statusStack.classList.add("bar-progress", "progress-stack")
+ statusStack.innerHTML = `local_cafe
+
+ hourglass_bottom
+ hourglass_top
+
+ check
+ done_all`
+ progresses.appendChild(statusStack)
+ }
+ if (data.gng_status != 4) {
+ const statusStack = document.createElement("div");
+ statusStack.classList.add("gng-progress", "progress-stack")
+ statusStack.innerHTML = `kitchen
+
+ hourglass_bottom
+ hourglass_top
+
+ check
+ done_all`
+ progresses.appendChild(statusStack)
+ }
+ newOrder.innerHTML = `
+
${data.name ? data.name : gettext("No name")}
+
+ Order #${orderId}
+
+ ${gettext("Prep time")}: ${data.start_time}
+
+
+
+
+ ${channel}
+
+ ${progresses.outerHTML}
+
+ ${data.to_go_order ? "takeout_dining " + gettext("Order to-go") : "restaurant " + gettext("Order for here")}
+
+
+ ${data.special_instructions ? '
' + gettext("Special instructions") + ':
' + data.special_instructions + '
' : ''}
+
- hourglass_bottom
- hourglass_top
-
- check
- done_all`
- progresses.appendChild(statusStack)
- }
- if (data.bar_status != 4) {
- const statusStack = document.createElement("div");
- statusStack.classList.add("bar-progress", "progress-stack")
- statusStack.innerHTML = `local_cafe
-
- hourglass_bottom
- hourglass_top
-
- check
- done_all`
- progresses.appendChild(statusStack)
- }
- if (data.gng_status != 4) {
- const statusStack = document.createElement("div");
- statusStack.classList.add("gng-progress", "progress-stack")
- statusStack.innerHTML = `kitchen
-
- hourglass_bottom
- hourglass_top
-
- check
- done_all`
- progresses.appendChild(statusStack)
- }
- newOrder.innerHTML = `
-
${data.name ? data.name : gettext("No name")}
-
- Order #${orderId}
-
- ${gettext("Prep time")}: ${data.start_time}
-
-
-
-
- ${channel}
-
- ${progresses.outerHTML}
-
- ${data.to_go_order ? "takeout_dining " + gettext("Order to-go") : "restaurant " + gettext("Order for here")}
-
-
- ${data.special_instructions ? '
' + gettext("Special instructions") + ':
' + data.special_instructions + '
' : ''}
-