Add timed bidding support with countdown displays and debug view

- Added `bidding_duration` field to `DraftSessionSettings` model and migration.
- Updated `DraftStateManager` to manage bidding start/end times using session settings.
- Extended WebSocket payloads to include bidding timer data.
- Added `DraftCountdownClock` React component and integrated into admin and participant UIs.
- Created new `DraftDebug` view, template, and front-end component for real-time state debugging.
- Updated utility functions to handle new timer fields in draft state.
- Changed script tags in templates to load with `defer` for non-blocking execution.
This commit is contained in:
2025-08-10 18:19:54 -05:00
parent b08a345563
commit cd4d974fce
16 changed files with 245 additions and 85 deletions

View File

@@ -40,7 +40,7 @@ class DraftConsumerBase(AsyncJsonWebsocketConsumer):
self.group_names = DraftGroupChannelNames(draft_hashid)
self.cache_keys = DraftCacheKeys(draft_hashid)
self.draft_state = DraftStateManager(draft_hashid)
self.draft_state = DraftStateManager(draft_hashid, self.draft_session.settings)
self.user = self.scope["user"]
if not self.should_accept_user():
@@ -133,7 +133,7 @@ class DraftConsumerBase(AsyncJsonWebsocketConsumer):
draft_session_id = DraftSession.decode_id(draft_session_id_hashed)
if draft_session_id:
draft_session = DraftSession.objects.select_related(
"season", "season__league"
"season", "season__league", "settings"
).get(pk=draft_session_id)
else:
raise Exception()
@@ -198,14 +198,17 @@ class DraftAdminConsumer(DraftConsumerBase):
}
)
if event_type == DraftMessage.BID_START_REQUEST:
self.draft_state
self.draft_state.start_timer()
await self.channel_layer.group_send(
self.group_names.session,
{
"type": "broadcast.session",
"subtype": DraftMessage.BID_START_INFORM,
"payload": {
"current_movie": self.draft_state.get_summary()['current_movie']
"current_movie": self.draft_state.get_summary()['current_movie'],
"bidding_duration": self.draft_state.settings.bidding_duration,
"bidding_timer_end": self.draft_state.get_timer_end(),
"bidding_timer_start": self.draft_state.get_timer_start()
}
}
)

View File

@@ -0,0 +1,35 @@
# Generated by Django 5.2.4 on 2025-08-10 22:10
import django.db.models.deletion
from django.db import migrations, models
class Migration(migrations.Migration):
dependencies = [
('boxofficefantasy', '0009_alter_moviemetric_value_alter_pick_bid_amount_and_more'),
('draft', '0006_remove_draftparticipant_draft_and_more'),
]
operations = [
migrations.AddField(
model_name='draftsessionsettings',
name='bidding_duration',
field=models.IntegerField(default=90),
),
migrations.AlterField(
model_name='draftpick',
name='draft',
field=models.ForeignKey(on_delete=django.db.models.deletion.CASCADE, related_name='draft_picks', to='draft.draftsession'),
),
migrations.AlterField(
model_name='draftsession',
name='movies',
field=models.ManyToManyField(blank=True, related_name='draft_sessions', to='boxofficefantasy.movie'),
),
migrations.AlterField(
model_name='draftsessionparticipant',
name='draft_session',
field=models.ForeignKey(blank=True, on_delete=django.db.models.deletion.CASCADE, to='draft.draftsession'),
),
]

View File

@@ -62,6 +62,7 @@ class DraftSessionSettings(Model):
draft_session = OneToOneField(
DraftSession, on_delete=CASCADE, related_name="settings"
)
bidding_duration = IntegerField(default=90)
def __str__(self):
return f"Settings for {self.draft_session}"

View File

@@ -4,6 +4,8 @@ from datetime import datetime, timedelta
from boxofficefantasy.models import Movie
from django.contrib.auth.models import User
from draft.constants import DraftPhase
from draft.models import DraftSessionSettings
import time
class DraftCacheKeys:
def __init__(self, id):
@@ -57,9 +59,12 @@ class DraftCacheKeys:
# def participants(self):
# return f"{self.prefix}:participants"
# @property
# def bid_timer_end(self):
# return f"{self.prefix}:bid_timer_end"
@property
def bid_timer_end(self):
return f"{self.prefix}:bid_timer_end"
@property
def bid_timer_start(self):
return f"{self.prefix}:bid_timer_start"
# def user_status(self, user_id):
# return f"{self.prefix}:user:{user_id}:status"
@@ -68,12 +73,12 @@ class DraftCacheKeys:
# return f"{self.prefix}:user:{user_id}:channel"
class DraftStateManager:
def __init__(self, session_id: int):
def __init__(self, session_id: int, settings: DraftSessionSettings):
self.session_id = session_id
self.cache = cache
self.keys = DraftCacheKeys(session_id)
self._initial_phase = self.cache.get(self.keys.phase, DraftPhase.WAITING.value)
self.settings = settings
# === Phase Management ===
@property
@@ -135,13 +140,18 @@ class DraftStateManager:
movie_id = self.cache.get(self.keys.current_movie)
return Movie.objects.filter(pk=movie_id).first() if movie_id else None
def start_timer(self, seconds: int):
end_time = (datetime.now() + timedelta(seconds=seconds)).isoformat()
self.cache.set(self.keys.timer_end, end_time)
self.cache.set(self.keys.timer_end, end_time)
def start_timer(self):
seconds = self.settings.bidding_duration
start_time = time.time()
end_time = start_time + seconds
self.cache.set(self.keys.bid_timer_end, end_time)
self.cache.set(self.keys.bid_timer_start, start_time)
def get_timer_end(self) -> str | None:
return self.cache.get(self.keys.timer_end).decode("utf-8") if self.cache.get(self.keys.timer_end) else None
return self.cache.get(self.keys.bid_timer_end)
def get_timer_start(self) -> str | None:
return self.cache.get(self.keys.bid_timer_start)
# === Sync Snapshot ===
def get_summary(self) -> dict:
@@ -152,5 +162,6 @@ class DraftStateManager:
"connected_participants": self.connected_participants,
"current_movie": self.cache.get(self.keys.current_movie),
# "bids": self.get_bids(),
# "timer_end": self.get_timer_end(),
"bidding_timer_end": self.get_timer_end(),
"bidding_timer_start": self.get_timer_start(),
}

View File

@@ -6,9 +6,5 @@
window.draftSessionId = "{{ draft_id_hashed }}"
</script>
<div id="draft-admin-root" data-draft-hid="{{ draft_id_hashed }}"></div>
{% if DEBUG %}
<script src="http://localhost:3000/dist/bundle.js"></script>
{% else %}
<script src="{% static 'bundle.js' %}"></script>
{% endif %}
{% endblock %}

View File

@@ -0,0 +1,14 @@
{% load static %}
<head>
{% if DEBUG %}
<script defer src="http://localhost:3000/dist/bundle.js"></script>
{% else %}
<script src="{% static 'bundle.js' %}"></script>
{% endif %}
</head>
<body>
<script>
window.draftSessionId = "{{ draft_id_hashed }}"
</script>
<div id="draft-debug-root" data-draft-hid="{{ draft_id_hashed }}"></div>
</body>

View File

@@ -6,6 +6,6 @@ app_name = "draft"
urlpatterns = [
# path("", views.draft_room, name="room"),
path("session/<str:draft_session_id_hashed>/", views.draft_room, name="session"),
path("session/<str:draft_session_id_hashed>/<str:is_admin>", views.draft_room, name="admin_session"),
path("session/<str:draft_session_id_hashed>/<str:subpage>", views.draft_room, name="admin_session"),
# path("<slug:league_slug>/<slug:season_slug>/", views.draft_room_list, name="room"),
]

View File

@@ -6,7 +6,7 @@ from django.contrib.auth.decorators import login_required
from boxofficefantasy_project.utils import decode_id
@login_required(login_url='/login/')
def draft_room(request, league_slug=None, season_slug=None, draft_session_id_hashed=None, is_admin=""):
def draft_room(request, league_slug=None, season_slug=None, draft_session_id_hashed=None, subpage=""):
if draft_session_id_hashed:
draft_session_id = decode_id(draft_session_id_hashed)
draft_session = get_object_or_404(DraftSession, id=draft_session_id)
@@ -25,8 +25,9 @@ def draft_room(request, league_slug=None, season_slug=None, draft_session_id_has
"season": season,
}
if is_admin == "admin":
if subpage == "admin":
return render(request, "draft/room_admin.dj.html", context)
elif subpage == "debug":
return render(request, "draft/room_debug.dj.html", context)
else:
return render(request, "draft/room.dj.html", context)