2025-07-25

.gitignore

@@ -1,5 +1,416 @@
-__pycache__
 *.sqlite3
 media/
 *.csv
 .env
+frontend/src/scss/fonts/*.ttf
+
+# gitignore compiled by script
+
+Global/macOS, Global/VisualStudioCode, Node, Python
+
+## Add your own excludes here #################################################
+###############################################################################
+
+###############################################################################
+## Global/macOS ###############################################################
+## https://github.com/github/gitignore/Global/macOS.gitignore #################
+###############################################################################
+
+# General
+.DS_Store
+.AppleDouble
+.LSOverride
+Icon[
+]
+
+# Thumbnails
+._*
+
+# Files that might appear in the root of a volume
+.DocumentRevisions-V100
+.fseventsd
+.Spotlight-V100
+.TemporaryItems
+.Trashes
+.VolumeIcon.icns
+.com.apple.timemachine.donotpresent
+
+# Directories potentially created on remote AFP share
+.AppleDB
+.AppleDesktop
+Network Trash Folder
+Temporary Items
+.apdisk
+
+###############################################################################
+## Global/VisualStudioCode ####################################################
+## https://github.com/github/gitignore/Global/VisualStudioCode.gitignore ######
+###############################################################################
+
+.vscode/*
+!.vscode/settings.json
+!.vscode/tasks.json
+!.vscode/launch.json
+!.vscode/extensions.json
+!.vscode/*.code-snippets
+!*.code-workspace
+
+# Built Visual Studio Code Extensions
+*.vsix
+
+###############################################################################
+## Node #######################################################################
+## https://github.com/github/gitignore/Node.gitignore #########################
+###############################################################################
+
+# Logs
+logs
+*.log
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+lerna-debug.log*
+
+# Diagnostic reports (https://nodejs.org/api/report.html)
+report.[0-9]*.[0-9]*.[0-9]*.[0-9]*.json
+
+# Runtime data
+pids
+*.pid
+*.seed
+*.pid.lock
+
+# Directory for instrumented libs generated by jscoverage/JSCover
+lib-cov
+
+# Coverage directory used by tools like istanbul
+coverage
+*.lcov
+
+# nyc test coverage
+.nyc_output
+
+# Grunt intermediate storage (https://gruntjs.com/creating-plugins#storing-task-files)
+.grunt
+
+# Bower dependency directory (https://bower.io/)
+bower_components
+
+# node-waf configuration
+.lock-wscript
+
+# Compiled binary addons (https://nodejs.org/api/addons.html)
+build/Release
+
+# Dependency directories
+node_modules/
+jspm_packages/
+
+# Snowpack dependency directory (https://snowpack.dev/)
+web_modules/
+
+# TypeScript cache
+*.tsbuildinfo
+
+# Optional npm cache directory
+.npm
+
+# Optional eslint cache
+.eslintcache
+
+# Optional stylelint cache
+.stylelintcache
+
+# Optional REPL history
+.node_repl_history
+
+# Output of 'npm pack'
+*.tgz
+
+# Yarn Integrity file
+.yarn-integrity
+
+# dotenv environment variable files
+.env
+.env.*
+!.env.example
+
+# parcel-bundler cache (https://parceljs.org/)
+.cache
+.parcel-cache
+
+# Next.js build output
+.next
+out
+
+# Nuxt.js build / generate output
+.nuxt
+dist
+
+# Gatsby files
+.cache/
+# Comment in the public line in if your project uses Gatsby and not Next.js
+# https://nextjs.org/blog/next-9-1#public-directory-support
+# public
+
+# vuepress build output
+.vuepress/dist
+
+# vuepress v2.x temp and cache directory
+.temp
+.cache
+
+# Sveltekit cache directory
+.svelte-kit/
+
+# vitepress build output
+**/.vitepress/dist
+
+# vitepress cache directory
+**/.vitepress/cache
+
+# Docusaurus cache and generated files
+.docusaurus
+
+# Serverless directories
+.serverless/
+
+# FuseBox cache
+.fusebox/
+
+# DynamoDB Local files
+.dynamodb/
+
+# Firebase cache directory
+.firebase/
+
+# TernJS port file
+.tern-port
+
+# Stores VSCode versions used for testing VSCode extensions
+.vscode-test
+
+# yarn v3
+.pnp.*
+.yarn/*
+!.yarn/patches
+!.yarn/plugins
+!.yarn/releases
+!.yarn/sdks
+!.yarn/versions
+
+# Vite logs files
+vite.config.js.timestamp-*
+vite.config.ts.timestamp-*
+
+###############################################################################
+## Python #####################################################################
+## https://github.com/github/gitignore/Python.gitignore #######################
+###############################################################################
+
+# Byte-compiled / optimized / DLL files
+__pycache__/
+*.py[codz]
+*$py.class
+
+# C extensions
+*.so
+
+# Distribution / packaging
+.Python
+build/
+develop-eggs/
+dist/
+downloads/
+eggs/
+.eggs/
+lib/
+lib64/
+parts/
+sdist/
+var/
+wheels/
+share/python-wheels/
+*.egg-info/
+.installed.cfg
+*.egg
+MANIFEST
+
+# PyInstaller
+#  Usually these files are written by a python script from a template
+#  before PyInstaller builds the exe, so as to inject date/other infos into it.
+*.manifest
+*.spec
+
+# Installer logs
+pip-log.txt
+pip-delete-this-directory.txt
+
+# Unit test / coverage reports
+htmlcov/
+.tox/
+.nox/
+.coverage
+.coverage.*
+.cache
+nosetests.xml
+coverage.xml
+*.cover
+*.py.cover
+.hypothesis/
+.pytest_cache/
+cover/
+
+# Translations
+*.mo
+*.pot
+
+# Django stuff:
+*.log
+local_settings.py
+db.sqlite3
+db.sqlite3-journal
+
+# Flask stuff:
+instance/
+.webassets-cache
+
+# Scrapy stuff:
+.scrapy
+
+# Sphinx documentation
+docs/_build/
+
+# PyBuilder
+.pybuilder/
+target/
+
+# Jupyter Notebook
+.ipynb_checkpoints
+
+# IPython
+profile_default/
+ipython_config.py
+
+# pyenv
+#   For a library or package, you might want to ignore these files since the code is
+#   intended to run in multiple environments; otherwise, check them in:
+# .python-version
+
+# pipenv
+#   According to pypa/pipenv#598, it is recommended to include Pipfile.lock in version control.
+#   However, in case of collaboration, if having platform-specific dependencies or dependencies
+#   having no cross-platform support, pipenv may install dependencies that don't work, or not
+#   install all needed dependencies.
+#Pipfile.lock
+
+# UV
+#   Similar to Pipfile.lock, it is generally recommended to include uv.lock in version control.
+#   This is especially recommended for binary packages to ensure reproducibility, and is more
+#   commonly ignored for libraries.
+#uv.lock
+
+# poetry
+#   Similar to Pipfile.lock, it is generally recommended to include poetry.lock in version control.
+#   This is especially recommended for binary packages to ensure reproducibility, and is more
+#   commonly ignored for libraries.
+#   https://python-poetry.org/docs/basic-usage/#commit-your-poetrylock-file-to-version-control
+#poetry.lock
+#poetry.toml
+
+# pdm
+#   Similar to Pipfile.lock, it is generally recommended to include pdm.lock in version control.
+#   pdm recommends including project-wide configuration in pdm.toml, but excluding .pdm-python.
+#   https://pdm-project.org/en/latest/usage/project/#working-with-version-control
+#pdm.lock
+#pdm.toml
+.pdm-python
+.pdm-build/
+
+# pixi
+#   Similar to Pipfile.lock, it is generally recommended to include pixi.lock in version control.
+#pixi.lock
+#   Pixi creates a virtual environment in the .pixi directory, just like venv module creates one
+#   in the .venv directory. It is recommended not to include this directory in version control.
+.pixi
+
+# PEP 582; used by e.g. github.com/David-OConnor/pyflow and github.com/pdm-project/pdm
+__pypackages__/
+
+# Celery stuff
+celerybeat-schedule
+celerybeat.pid
+
+# SageMath parsed files
+*.sage.py
+
+# Environments
+.env
+.envrc
+.venv
+env/
+venv/
+ENV/
+env.bak/
+venv.bak/
+
+# Spyder project settings
+.spyderproject
+.spyproject
+
+# Rope project settings
+.ropeproject
+
+# mkdocs documentation
+/site
+
+# mypy
+.mypy_cache/
+.dmypy.json
+dmypy.json
+
+# Pyre type checker
+.pyre/
+
+# pytype static type analyzer
+.pytype/
+
+# Cython debug symbols
+cython_debug/
+
+# PyCharm
+#  JetBrains specific template is maintained in a separate JetBrains.gitignore that can
+#  be found at https://github.com/github/gitignore/blob/main/Global/JetBrains.gitignore
+#  and can be added to the global gitignore or merged into this file.  For a more nuclear
+#  option (not recommended) you can uncomment the following to ignore the entire idea folder.
+#.idea/
+
+# Abstra
+# Abstra is an AI-powered process automation framework.
+# Ignore directories containing user credentials, local state, and settings.
+# Learn more at https://abstra.io/docs
+.abstra/
+
+# Visual Studio Code
+#  Visual Studio Code specific template is maintained in a separate VisualStudioCode.gitignore 
+#  that can be found at https://github.com/github/gitignore/blob/main/Global/VisualStudioCode.gitignore
+#  and can be added to the global gitignore or merged into this file. However, if you prefer, 
+#  you could uncomment the following to ignore the entire vscode folder
+# .vscode/
+
+# Ruff stuff:
+.ruff_cache/
+
+# PyPI configuration file
+.pypirc
+
+# Marimo
+marimo/_static/
+marimo/_lsp/
+__marimo__/
+
+# Streamlit
+.streamlit/secrets.toml
+
+###############################################################################
+

boxofficefantasy.code-workspace

@@ -17,6 +17,16 @@
         "console": "integratedTerminal",
         "envFile": "${workspaceFolder}/.env"
       },
+      {
+        "name": "Start Webpack Dev Server",
+        "type": "node",
+        "request": "launch",
+        "program": "npm",
+        "args": ["run", "dev", "--config", "${workspaceFolder}/frontend/webpack.config.js"],
+        "cwd": "${workspaceFolder}/frontend",
+        "console": "integratedTerminal",
+        "internalConsoleOptions": "neverOpen"
+      },
       {
         "name": "Launch Chrome",
         "type": "chrome",
@@ -36,11 +46,13 @@
         "console": "integratedTerminal"
       }
     ],
-    "compounds":[{
+    "compounds": [
+      {
         "name": "Django + Chrome",
         "configurations": ["Run Django Server", "Launch Chrome"],
         "type": "compound"
-      }]
+      }
+    ]
   },
   "tasks": {
     "version": "2.0.0",
@@ -112,11 +124,12 @@
         "other": true,
         "comments": true,
         "strings": true
-      }
+      },
     },
     "files.associations": {
       "*.dj.html": "django-html"
     },
+    "html.autoClosingTags": true,
     "emmet.includeLanguages": {
       "django-html": "html"
     }

boxofficefantasy/context_processors.py

@@ -0,0 +1,4 @@
+from django.conf import settings
+
+def debug_flag(request):
+    return {'DEBUG': settings.DEBUG}

boxofficefantasy/templates/base.dj.html

@@ -1,34 +1,55 @@
+{% load static %}
 <!DOCTYPE html>
 <html>
   <head>
     <title>{% block title %}My Site{% endblock %}</title>
-    <link
-      rel="stylesheet"
-      href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css"
-    />
     <link
       rel="stylesheet"
       href="https://cdn.datatables.net/2.3.2/css/dataTables.bootstrap5.css"
     />
-
+    {% if DEBUG %}
+    <script src="http://localhost:3000/dist/bundle.js"></script>
+    {% else %}
+    <script src="{% static 'bundle.js' %}"></script>
+    {% endif %}
     <script src="https://code.jquery.com/jquery-3.7.1.min.js"></script>
     <script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/5.3.3/js/bootstrap.bundle.min.js"></script>
     <script src="https://cdn.datatables.net/2.3.2/js/dataTables.js"></script>
     <script src="https://cdn.datatables.net/2.3.2/js/dataTables.bootstrap5.js"></script>
   </head>
   <body>
-    <header class="p-3 bg-dark text-white">
-      <div class="container">My Site Header</div>
-    </header>
+    <nav class="navbar justify-content-start">
+      <div>
+        <a class="navbar-brand" href="/">
+          <img src="{% static 'boxofficefantasy/logo.svg' %}" width="30" height="30">
+          Box Office Fantasy
+        </a>
+      </div>
+      <div>
+        {%block navbar%}
+        {%endblock%}
+      </div>
+    </nav>
+
 
     <main class="container mt-4">
-      {% block content %}
+      {% block breadcrumbs%}
+      <nav aria-label="breadcrumb">
+        {%if breadcrumbs%}
+        <ol class="breadcrumb">
+        {% for crumb in breadcrumbs %}
+          <li class="breadcrumb-item {% if forloop.last %}active{% endif %}" aria-current="page">{% if not forloop.last %}<a href="{{crumb.url}}">{{crumb.label}}</a>{%else%}{{crumb.label}}{%endif%}</li>
+          {%endfor%}
+        </ol>
+        {%endif%}
+      </nav>
+      {% endblock%} {% block content %}
       <!-- Default content -->
       {% endblock %}
     </main>
 
     <footer class="text-muted text-center mt-5">
-      <small>&copy; 2025 MySite</small>
+      <small>&copy; Sack Lunch</small>
     </footer>
   </body>
 </html>

boxofficefantasy/templates/league.dj.html

@@ -0,0 +1,66 @@
+{% extends "base.dj.html" %}{% load humanize %} {% block content%}
+<h3>{{season.league.name}}</h3>
+<div>
+  <ul class="nav nav-underline">
+    <li class="nav-item">
+      <button
+        class="nav-link active"
+        data-bs-toggle="tab"
+        data-bs-target="#seasons-tab-pane"
+        type="button"
+      >
+        Seasons
+      </button>
+    </li>
+    <li class="nav-item">
+      <button
+        class="nav-link"
+        data-bs-toggle="tab"
+        data-bs-target="#winners-tab-pane"
+        type="button"
+      >
+        Winners
+      </button>
+    </li>
+    <li class="nav-item">
+      <button
+        class="nav-link"
+        data-bs-toggle="tab"
+        data-bs-target="#players-tab-pane"
+        type="button"
+      >
+        Players
+      </button>
+    </li>
+    <li class="nav-item">
+      <button
+        class="nav-link"
+        data-bs-toggle="tab"
+        data-bs-target="#movies-tab-pane"
+        type="button"
+      >
+        Movies
+      </button>
+    </li>
+  </ul>
+
+  <div class="tab-content">
+    <div class="tab-pane fade show active" id="seasons-tab-pane">
+      <ol>
+        {% for season in seasons %}
+        <li>
+          <a href="{% url 'season:season' season.league.slug season.slug %}">
+            {{ season.league.name }} – {{ season.label }} {{ season.year }}
+          </a>
+          <br>Winner: {{ season.winner_team }} ${{season.winner_score | floatformat:0 | intcomma}}
+          <br>Top Movie: {{season.top_movie}} {{season.top_gross| floatformat:0 | intcomma}}
+        </li>
+        {% endfor %}
+      </ol>
+    </div>
+    <div class="tab-pane fade" id="winners-tab-pane">Winners</div>
+    <div class="tab-pane fade" id="players-tab-pane">players</div>
+    <div class="tab-pane fade" id="movies-tab-pane">movies</div>
+  </div>
+</div>
+{% endblock%}

boxofficefantasy/templates/leagues.dj.html

@@ -0,0 +1,10 @@
+{% extends "base.dj.html" %}{% load humanize %} {% block content%}
+<h3>Leagues</h3>
+<div>
+  <ul class="">
+    {% for league in leagues%}
+    <li><a href="{{url "league" league.slug}}">{{league.name}}</a></li>
+    {%endfor%}
+  </ul>
+</div>
+{% endblock%}

boxofficefantasy/templates/season.dj.html

@@ -0,0 +1,89 @@
+{% extends "base.dj.html" %}{% load humanize %}
+{%block content %}
+<h3><a href="{% url "league:league" league.slug %}" class="text-reset text-decoration-none">{{season.league.name}}</a> - {{season.label}} {{season.year}}</h3>
+<div>
+  <ul class="nav nav-underline">
+    <li class="nav-item">
+      <button class="nav-link active" data-bs-toggle="tab" data-bs-target="#scoreboard-tab-pane" type="button">Scoreboard</button>
+    </li>
+    <li class="nav-item">
+      <button class="nav-link" data-bs-toggle="tab" data-bs-target="#teams-tab-pane" type="button">Teams</button>
+    </li>
+    <li class="nav-item ">
+      <button class="nav-link" data-bs-toggle="tab" data-bs-target="#movies-tab-pane" type="button">Movies</button>
+    </li>
+    <li class="nav-item">
+      <button class="nav-link" data-bs-toggle="tab" data-bs-target="#draft-tab-pane" type="button">Draft</button>
+    </li>
+  </ul>
+  
+  <div class="tab-content">
+    <div class="tab-pane fade show active" id="scoreboard-tab-pane">
+      <table class="table dataTable">
+        <thead>
+          <th>Team</th>
+          <th>Owner</th>
+          <th>Total</th>
+        <tbody>
+          {% for entry in scoreboard%}
+          <tr>
+            <td>{{entry.team}}</td>
+            <td>{{entry.user}}</td>
+            <td>${{entry.total|floatformat:0|intcomma }}</td>
+          </tr>
+          {%endfor%}
+      </table>
+    </div>
+    <div class="tab-pane fade" id="teams-tab-pane">
+    {% for entry in scoreboard %}
+<h3>{{ entry.team }} ({{ entry.user }})</h3>
+<ul>
+  {% for pick in entry.picks %}
+  <li>
+    <a href="{% url 'season:movie' league.slug season.slug pick.imdb_id %}">{{ pick.movie.title }}</a> – ${{ pick.score|floatformat:0|intcomma }} (Bid:
+    ${{pick.bid | floatformat:0}}M)
+    
+  </li>
+  {% endfor %}
+</ul>
+{% endfor %}
+    </div>
+    <div class="tab-pane fade" id="movies-tab-pane">
+      <table class="dataTable">
+        <thead>
+          <th>Title</th>
+          <th>Team</th>
+          <th>User</th>
+          <th>Gross</th>
+          <th>Bid</th>
+        </thead>
+        <tbody>
+    {% for pick in picks %}
+      <tr>
+        <td>{{pick.movie.title}}</td>
+        <td>{{pick.season_entry.team_name}}</td>
+        <td>{{pick.season_entry.user.username}}</td>
+        <td>${{pick.domestic_gross | floatformat:0 |intcomma}}</td>
+        <td>${{pick.bid_amount | floatformat:0}}M</td>
+      </tr>
+    {%endfor%}
+        </tbody>
+      </ul>
+    </table>
+    </div>
+    <div class="tab-pane fade" id="draft-tab-pane">
+    Draft
+    </div>
+  </div>
+</div>
+
+<script>
+  window.addEventListener("load", () => {
+  document.querySelectorAll(".dataTable").forEach((table) => {
+    new DataTable(table, {
+      pageLength: 10,
+    });
+  });
+});
+</script>
+{%endblock%}

boxofficefantasy/templates/seasons.dj.html

@@ -5,7 +5,7 @@
 <ul>
   {% for season in seasons %}
   <li>
-    <a href="{% url 'season:scoreboard' season.league.slug season.slug %}">
+    <a href="{% url 'season:season' season.league.slug season.slug %}">
       {{ season.league.name }} – {{ season.label }} {{ season.year }}
     </a>
   </li>

boxofficefantasy/urls.py

@@ -2,14 +2,14 @@ from django.urls import path, include
 from . import views
 
 league_patterns = [
-    # path("", views.league_view, name="league" ),
+    path("/", views.league_view, name="league" ),
     path("season/", views.season_view, name="seasons"),
     path("movie/", views.movie_view, name="movies"),
     path("team/", views.team_view, name="teams"),
 ]
 
 season_patterns = [
-    path("", views.season_view, name="season"),
+    path("/", views.season_view, name="season"),
     path("scoreboard/", views.scoreboard_view, name="scoreboard"),
     path("team/<str:username>/", views.team_view, name="team"),
     path("team/", views.team_view, name="teams"),
@@ -26,4 +26,7 @@ urlpatterns = [
         "league/<slug:league_slug>/",
         include((league_patterns, "boxofficefantasy"), namespace="league")
     ),
+    path(
+      "/", views.league_view, name="leagues"
+    )
 ]

boxofficefantasy/views.py

@@ -1,6 +1,8 @@
 from django.shortcuts import render, get_object_or_404
 from django.contrib.auth import get_user_model
 from django.http.response import Http404, HttpResponse
+from django.urls import reverse
+from django.db.models import OuterRef, Subquery, Sum, Q
 from boxofficefantasy.models import League, Season, UserSeasonEntry, Movie, Pick
 from .integrations.tmdb import get_tmdb_movie_by_imdb, cache_tmdb_poster
 
@@ -14,21 +16,10 @@ def parse_season_slug(season_slug: str) -> tuple[str, str]:
     except ValueError:
         raise Http404("Invalid season format.")
 
-
-# Create your views here.
-def scoreboard_view(request, league_slug, season_slug):
-    # season_slug is something like "summer-2025"
-
-    season_label, season_year = parse_season_slug(season_slug)
-
-    league = get_object_or_404(League, slug=league_slug)
-    season = get_object_or_404(
-        Season, league=league, year=season_year, label__iexact=season_label
-    )
-    entries = UserSeasonEntry.objects.filter(season=season).select_related("user")
+def get_scoreboard(user_season_entries=list[UserSeasonEntry]):
     scoreboard = []
 
-    for season_entry in entries:
+    for season_entry in user_season_entries:
         picks = Pick.objects.filter(season_entry=season_entry).select_related("movie")
         total_score = 0
         pick_data = []
@@ -57,6 +48,20 @@ def scoreboard_view(request, league_slug, season_slug):
         )
 
     scoreboard.sort(key=lambda e: e["total"], reverse=True)
+    return scoreboard
+
+# Create your views here.
+def scoreboard_view(request, league_slug, season_slug):
+    # season_slug is something like "summer-2025"
+
+    season_label, season_year = parse_season_slug(season_slug)
+
+    league = get_object_or_404(League, slug=league_slug)
+    season = get_object_or_404(
+        Season, league=league, year=season_year, label__iexact=season_label
+    )
+    entries = UserSeasonEntry.objects.filter(season=season).select_related("user")
+    scoreboard = get_scoreboard(entries)
 
     return render(
         request,
@@ -65,6 +70,11 @@ def scoreboard_view(request, league_slug, season_slug):
             "league": league,
             "season": season,
             "scoreboard": scoreboard,
+            "breadcrumbs":[
+                {"label":league.name, "url":"#"},
+                {"label":"seasons", "url":reverse('league:seasons', args=[league.slug])},
+                {"label":f"{season.label} {season.year}", "url":"#"},
+            ]
         },
     )
 
@@ -214,8 +224,75 @@ def season_view(request, league_slug, season_slug=None):
     season = get_object_or_404(
         Season, league=league, year=season_year, label__iexact=season_label
     )
+    entries = UserSeasonEntry.objects.filter(season=season).select_related("user")
 
-    return render(request, "scoreboard.dj.html", {
+
+    picks = season.pick_set.select_related("season_entry", "season_entry__user").annotate(
+        domestic_gross=Sum(
+            'movie__moviemetric__value',
+            filter=Q(movie__moviemetric__key='domestic_gross')
+        )
+        )
+
+    return render(request, "season.dj.html", {
         "season": season,
         "league": league,
+        "scoreboard": get_scoreboard(entries),
+        "picks":picks
     })
+
+
+def league_view(request, league_slug=None):
+    # 1️⃣ League only – list all seasons in the league
+    if not league_slug:
+        return render(
+            request,
+            {
+                "leagues": League.objects.all()
+            }
+        )
+    league = get_object_or_404(League, slug=league_slug)
+    
+    # Subquery: top entry per season by total score
+    top_entry = (
+        UserSeasonEntry.objects
+        .filter(season=OuterRef('pk'))
+        .annotate(total_score=Sum(
+            'pick__movie__moviemetric__value',
+            filter=Q(pick__movie__moviemetric__key='domestic_gross')
+        ))
+        .order_by('-total_score')
+    )
+
+    winner_team = top_entry.values('team_name')[:1]
+    winner_score = top_entry.values('total_score')[:1]
+    
+    # Subquery: pick with top-grossing movie for the season
+    top_pick = (
+        Pick.objects
+        .filter(season=OuterRef('pk'))
+        .annotate(gross=Sum(
+            'movie__moviemetric__value',
+            filter=Q(movie__moviemetric__key='domestic_gross')
+        ))
+        .order_by('-gross')
+    )
+
+    top_movie = top_pick.values('movie__title')[:1]
+    top_gross = top_pick.values('gross')[:1]
+
+    seasons = (
+    Season.objects
+    .annotate(
+        winner_team=Subquery(winner_team),
+        winner_score=Subquery(winner_score),
+        top_movie=Subquery(top_movie),
+        top_movie_score=Subquery(top_gross),
+    )
+    .order_by('-year')
+)
+
+    return render(request, "league.dj.html", {
+        "league": league,
+        "seasons": seasons,
+    })

boxofficefantasy_project/settings.py

@@ -26,7 +26,7 @@ SECRET_KEY = 'django-insecure-_rrxhe5i6uqap!52u(1zi8x$820duvf5s_!9!bc4ghbyyktol0
 # SECURITY WARNING: don't run with debug turned on in production!
 DEBUG = True
 
-ALLOWED_HOSTS = []
+ALLOWED_HOSTS = ["localhost"]
 
 # TMDB API KEY
 TMDB_API_KEY = os.environ.get("TMDB_API_KEY")
@@ -67,6 +67,7 @@ TEMPLATES = [
                 'django.template.context_processors.request',
                 'django.contrib.auth.context_processors.auth',
                 'django.contrib.messages.context_processors.messages',
+                'boxofficefantasy.context_processors.debug_flag'
             ],
         },
     },
@@ -129,3 +130,8 @@ MEDIA_ROOT = BASE_DIR / "media"
 # https://docs.djangoproject.com/en/5.1/ref/settings/#default-auto-field
 
 DEFAULT_AUTO_FIELD = 'django.db.models.BigAutoField'
+
+CSRF_TRUSTED_ORIGINS = [
+    "http://localhost:3000",
+    "http://127.0.0.1:3000",
+]

frontend/package.json

@@ -0,0 +1,16 @@
+{
+  "scripts": {
+    "dev": "SASS_LOG_LEVEL=error webpack serve --config webpack.config.js"
+  },
+  "devDependencies": {
+    "css-loader": "^7.1.2",
+    "sass": "^1.89.2",
+    "sass-loader": "^16.0.5",
+    "style-loader": "^4.0.0",
+    "webpack-cli": "^6.0.1",
+    "webpack-dev-server": "^5.2.2"
+  },
+  "dependencies": {
+    "bootstrap": "^5.3.7"
+  }
+}

frontend/src/index.js

@@ -0,0 +1,2 @@
+import './scss/styles.scss'
+console.log("Webpack HMR loaded!");

frontend/src/scss/fonts/graphique.css

@@ -0,0 +1,4 @@
+@font-face {
+  font-family: 'Graphique';
+  src: url('./fonts/graphique.ttf') format('truetype');
+}

frontend/src/scss/styles.scss

@@ -0,0 +1,18 @@
+@use '../../node_modules/bootstrap/scss/bootstrap.scss';
+@use './fonts/graphique.css';
+@import url('https://fonts.googleapis.com/css2?family=Bebas+Neue&family=Oswald:wght@200..700&display=swap');
+
+
+
+.navbar{
+  // background-color: #582f0e;
+  @extend .border-bottom;
+  // font-family: "Bebas Neue";
+  text-transform: uppercase;
+  font-stretch: condensed;
+  .navbar-brand {
+    @extend .ms-3;
+    font-family: "Graphique";
+    font-size: x-large;
+  }
+}

frontend/webpack.config.js

@@ -0,0 +1,65 @@
+const path = require("path");
+
+module.exports = {
+  entry: ["./src/index.js"],
+  output: {
+    filename: "bundle.js",
+    path: path.resolve(__dirname, "dist"),
+    publicPath: "http://localhost:3000/dist/", // webpack-dev-server URL
+  },
+  mode: "development",
+  module: {
+    rules: [
+      {
+        test: /\.scss$/,
+        use: [
+          "style-loader", // Injects styles into DOM
+          "css-loader", // Turns CSS into CommonJS
+          "sass-loader", // Compiles SCSS to CSS
+        ],
+      },
+      {
+        test: /\.(woff2?|ttf|otf|eot)$/,
+        type: "asset/resource",
+        generator: {
+          filename: "fonts/[name][ext]",
+        },
+      },
+    ],
+  },
+  devServer: {
+    static: false,
+    hot: true,
+    port: 3000,
+    headers: {
+      "Access-Control-Allow-Origin": "*",
+    },
+    proxy: [
+      {
+        context: () => true,
+        target: "http://localhost:8000",
+        changeOrigin: true,
+        secure: false,
+      },
+    ],
+  },
+  ignoreWarnings: [
+    // Ignore all warnings from a specific file (e.g., Bootstrap's Sass)
+    { message: /Deprecation Warning/ },
+    { message: /repetitive deprecation warnings/ },
+  ],
+};
+// module.exports = {
+//   // ... other webpack configurations
+//   ignoreWarnings: [
+//     // Ignore all warnings from a specific file (e.g., Bootstrap's Sass)
+//     { file: /_bootstrap\.scss$/, message: /^DEPRECATION WARNING/ },
+
+//     // Alternatively, ignore all warnings containing a specific string
+//     { message: /DEPRECATION WARNING: Sass\'s behavior for declarations/ },
+
+//     // Or, ignore warnings based on a general pattern
+//     // This example ignores all warnings from node_modules that are deprecation warnings
+//     { file: /node_modules/, message: /DEPRECATION WARNING/ },
+//   ],
+// };