Add autocomplete functionality for parks: implement URLs, views, and templates for real-time suggestions

.clinerules

@@ -28,3 +28,16 @@ This applies to all management commands including but not limited to:
 - Starting shell: `uv run manage.py shell`
 
 NEVER use `python manage.py` or `uv run python manage.py`. Always use `uv run manage.py` directly.
+
+## Static Files Management
+IMPORTANT: All static files must be placed in the `static/` directory, not `staticfiles/`. The `staticfiles/` directory is reserved for Django's collectstatic command output and should not be used directly.
+
+This consolidation:
+1. Follows Django best practices of separating source static files from collected files
+2. Prevents confusion between development and production static file locations
+3. Makes it clear which static files are part of the source code (static/) versus compiled/collected (staticfiles/)
+
+When adding new static files:
+- Add them to `static/` directory
+- Use Django's `static` template tag to reference them
+- Run `uv run manage.py collectstatic` when deploying

.gitignore

@@ -355,7 +355,6 @@ cython_debug/
 # Icon must end with two \r
 Icon
 
-
 
 # Thumbnails
 ._*
@@ -374,8 +373,3 @@ Icon
 .AppleDesktop
 Network Trash Folder
 Temporary Items
-backend/.env
-.env
-frontend
-uv.lock
-.django_tailwind_cli/tailwindcss-macos-arm64-4.1.13

FRONTEND_IMPLEMENTATION_PLAN.md

@@ -1,123 +0,0 @@
-# Frontend Implementation Plan - Phase 1 Critical Components
-
-## Current State Analysis ✅
-
-### Completed Components
-- **Authentication System** - Modal-based auth with social integration ✅
-- **Toast Notification System** - Advanced toast system with animations ✅  
-- **Theme Management** - Working well ✅
-- **Header Navigation** - Enhanced with modal integration ✅
-- **Base Template Structure** - Solid foundation ✅
-- **Basic Alpine.js Components** - Core components implemented ✅
-
-### Missing Critical Components (Phase 1 - High Priority)
-
-## 1. Enhanced Search with Autocomplete 🎯
-**Current**: Basic search exists but lacks autocomplete and advanced features
-**Needed**: 
-- Debounced search with API integration
-- Search suggestions dropdown UI
-- Search result highlighting
-- Keyboard navigation for search suggestions
-- Recent searches and popular searches
-
-## 2. Enhanced Park/Ride Cards 🎯
-**Current**: Basic card components exist
-**Needed**:
-- Sophisticated hover effects and animations
-- Card interaction states (hover, focus, active)
-- Loading states for card images
-- Card action buttons (favorite, share, etc.)
-- Image lazy loading and error handling
-
-## 3. User Profile Management 🎯
-**Current**: Basic profile pages exist
-**Needed**:
-- Comprehensive profile editing interface
-- Avatar upload with preview functionality
-- Profile sections (basic info, preferences, privacy)
-- Form validation and error handling
-- Settings persistence
-
-## 4. Advanced Filtering System 🎯
-**Current**: Basic filtering exists
-**Needed**:
-- Multi-select filter components
-- Range slider filters
-- Date picker filters
-- URL state synchronization for filters
-- Filter presets and saved searches
-
-## 5. Loading States & Skeletons 🎯
-**Current**: Basic loading indicators
-**Needed**:
-- Skeleton loading components
-- Loading spinners and indicators
-- Optimistic updates
-- Loading states for forms and buttons
-
-## Implementation Priority Order
-
-### Week 1: Core Interactive Components
-1. **Enhanced Search Component** (2-3 days)
-2. **Advanced Card Components** (2-3 days)
-3. **Loading States System** (1-2 days)
-
-### Week 2: User Experience Features
-1. **User Profile Management** (3-4 days)
-2. **Advanced Filtering System** (3-4 days)
-
-## Technical Approach
-
-### 1. Enhanced Search Component
-```javascript
-Alpine.data('advancedSearch', () => ({
-  query: '',
-  suggestions: [],
-  recentSearches: [],
-  popularSearches: [],
-  loading: false,
-  showSuggestions: false,
-  selectedIndex: -1,
-  debounceTimer: null,
-  
-  // Implementation details...
-}))
-```
-
-### 2. Enhanced Card Component
-```javascript
-Alpine.data('enhancedCard', (cardData) => ({
-  data: cardData,
-  imageLoaded: false,
-  imageError: false,
-  favorited: false,
-  
-  // Hover effects, animations, interactions
-}))
-```
-
-### 3. Skeleton Loading System
-```html
-<!-- Skeleton templates for different content types -->
-<div class="skeleton-card">
-  <div class="skeleton-image"></div>
-  <div class="skeleton-text"></div>
-</div>
-```
-
-## Success Metrics
-- Search response time < 200ms
-- Card interactions feel smooth (60fps)
-- Loading states provide clear feedback
-- User profile updates work seamlessly
-- Filtering provides instant feedback
-
-## Next Steps
-1. Start with Enhanced Search Component implementation
-2. Create comprehensive card component system
-3. Implement skeleton loading system
-4. Build user profile management interface
-5. Create advanced filtering system
-
-This plan focuses on the most impactful user experience improvements that will bring the Django frontend to parity with the React implementation.

accounts/migrations/0003_remove_toplist_insert_insert_and_more.py

@@ -1,89 +0,0 @@
-# Generated by Django 5.2.6 on 2025-09-20 13:40
-
-import pgtrigger.compiler
-import pgtrigger.migrations
-from django.db import migrations
-
-
-class Migration(migrations.Migration):
-
-    dependencies = [
-        ("accounts", "0002_remove_toplistitem_insert_insert_and_more"),
-    ]
-
-    operations = [
-        pgtrigger.migrations.RemoveTrigger(
-            model_name="toplist",
-            name="insert_insert",
-        ),
-        pgtrigger.migrations.RemoveTrigger(
-            model_name="toplist",
-            name="update_update",
-        ),
-        pgtrigger.migrations.RemoveTrigger(
-            model_name="toplistitem",
-            name="insert_insert",
-        ),
-        pgtrigger.migrations.RemoveTrigger(
-            model_name="toplistitem",
-            name="update_update",
-        ),
-        pgtrigger.migrations.AddTrigger(
-            model_name="toplist",
-            trigger=pgtrigger.compiler.Trigger(
-                name="insert_insert",
-                sql=pgtrigger.compiler.UpsertTriggerSql(
-                    func='INSERT INTO "accounts_toplistevent" ("category", "created_at", "description", "id", "pgh_context_id", "pgh_created_at", "pgh_label", "pgh_obj_id", "title", "updated_at", "user_id") VALUES (NEW."category", NEW."created_at", NEW."description", NEW."id", _pgh_attach_context(), NOW(), \'insert\', NEW."id", NEW."title", NEW."updated_at", NEW."user_id"); RETURN NULL;',
-                    hash="0b9e68b3aa0d3fb8f50bd832b99b70201d44aa11",
-                    operation="INSERT",
-                    pgid="pgtrigger_insert_insert_26546",
-                    table="accounts_toplist",
-                    when="AFTER",
-                ),
-            ),
-        ),
-        pgtrigger.migrations.AddTrigger(
-            model_name="toplist",
-            trigger=pgtrigger.compiler.Trigger(
-                name="update_update",
-                sql=pgtrigger.compiler.UpsertTriggerSql(
-                    condition="WHEN (OLD.* IS DISTINCT FROM NEW.*)",
-                    func='INSERT INTO "accounts_toplistevent" ("category", "created_at", "description", "id", "pgh_context_id", "pgh_created_at", "pgh_label", "pgh_obj_id", "title", "updated_at", "user_id") VALUES (NEW."category", NEW."created_at", NEW."description", NEW."id", _pgh_attach_context(), NOW(), \'update\', NEW."id", NEW."title", NEW."updated_at", NEW."user_id"); RETURN NULL;',
-                    hash="3ae1293b8b1fe574bac9f388b60d19613347931e",
-                    operation="UPDATE",
-                    pgid="pgtrigger_update_update_84849",
-                    table="accounts_toplist",
-                    when="AFTER",
-                ),
-            ),
-        ),
-        pgtrigger.migrations.AddTrigger(
-            model_name="toplistitem",
-            trigger=pgtrigger.compiler.Trigger(
-                name="insert_insert",
-                sql=pgtrigger.compiler.UpsertTriggerSql(
-                    func='INSERT INTO "accounts_toplistitemevent" ("content_type_id", "created_at", "id", "notes", "object_id", "pgh_context_id", "pgh_created_at", "pgh_label", "pgh_obj_id", "rank", "top_list_id", "updated_at") VALUES (NEW."content_type_id", NEW."created_at", NEW."id", NEW."notes", NEW."object_id", _pgh_attach_context(), NOW(), \'insert\', NEW."id", NEW."rank", NEW."top_list_id", NEW."updated_at"); RETURN NULL;',
-                    hash="1091ef1cc7668e112916df0c12f222bd25cfe921",
-                    operation="INSERT",
-                    pgid="pgtrigger_insert_insert_56dfc",
-                    table="accounts_toplistitem",
-                    when="AFTER",
-                ),
-            ),
-        ),
-        pgtrigger.migrations.AddTrigger(
-            model_name="toplistitem",
-            trigger=pgtrigger.compiler.Trigger(
-                name="update_update",
-                sql=pgtrigger.compiler.UpsertTriggerSql(
-                    condition="WHEN (OLD.* IS DISTINCT FROM NEW.*)",
-                    func='INSERT INTO "accounts_toplistitemevent" ("content_type_id", "created_at", "id", "notes", "object_id", "pgh_context_id", "pgh_created_at", "pgh_label", "pgh_obj_id", "rank", "top_list_id", "updated_at") VALUES (NEW."content_type_id", NEW."created_at", NEW."id", NEW."notes", NEW."object_id", _pgh_attach_context(), NOW(), \'update\', NEW."id", NEW."rank", NEW."top_list_id", NEW."updated_at"); RETURN NULL;',
-                    hash="81227a3b4af9432d2b868cd8680bee7896da8acc",
-                    operation="UPDATE",
-                    pgid="pgtrigger_update_update_2b6e3",
-                    table="accounts_toplistitem",
-                    when="AFTER",
-                ),
-            ),
-        ),
-    ]

autocomplete/__init__.py

@@ -0,0 +1,49 @@
+default_app_config = 'autocomplete.apps.AutocompleteConfig'
+
+from django.db import models
+from django.core.exceptions import ImproperlyConfigured
+from django.forms.widgets import Widget
+from django.template.loader import render_to_string
+
+
+class ModelAutocomplete:
+    """Base class for model-based autocomplete."""
+    model = None  # Model class to use for autocomplete
+    search_attrs = []  # List of model attributes to search
+    minimum_search_length = 2  # Minimum length of search string
+    max_results = 10  # Maximum number of results to return
+
+    def __init__(self):
+        if not self.model:
+            raise ImproperlyConfigured("ModelAutocomplete requires a model class")
+        if not self.search_attrs:
+            raise ImproperlyConfigured("ModelAutocomplete requires search_attrs")
+
+    def get_search_results(self, search):
+        """Return search results for a given search string."""
+        raise NotImplementedError("Subclasses must implement get_search_results()")
+
+    def format_result(self, obj):
+        """Format a single result object."""
+        raise NotImplementedError("Subclasses must implement format_result()")
+
+
+class AutocompleteWidget(Widget):
+    """Widget for autocomplete fields."""
+    template_name = 'autocomplete/widget.html'
+
+    def __init__(self, ac_class, attrs=None):
+        super().__init__(attrs)
+        if not issubclass(ac_class, ModelAutocomplete):
+            raise ImproperlyConfigured("ac_class must be a subclass of ModelAutocomplete")
+        self.ac_class = ac_class
+
+    def get_context(self, name, value, attrs):
+        context = super().get_context(name, value, attrs)
+        # Add ac_name for URL resolution
+        context['ac_name'] = self.ac_class.__name__.lower()
+        return context
+
+    def render(self, name, value, attrs=None, renderer=None):
+        context = self.get_context(name, value, attrs)
+        return render_to_string(self.template_name, context)

autocomplete/apps.py

@@ -0,0 +1,25 @@
+from django.apps import AppConfig
+
+
+class AutocompleteConfig(AppConfig):
+    default_auto_field = 'django.db.models.BigAutoField'
+    name = 'autocomplete'
+    
+    def __init__(self, *args, **kwargs):
+        super().__init__(*args, **kwargs)
+        self._registry = {}
+    
+    def ready(self):
+        """Register all autocomplete classes."""
+        from parks.forms import ParkAutocomplete
+        
+        # Register autocomplete classes
+        self.register_autocomplete('park', ParkAutocomplete)
+    
+    def register_autocomplete(self, name, ac_class):
+        """Register an autocomplete class."""
+        self._registry[name] = ac_class
+    
+    def get_autocomplete_class(self, name):
+        """Get an autocomplete class by name."""
+        return self._registry.get(name)

autocomplete/templates/autocomplete/suggestions.html

@@ -0,0 +1,20 @@
+{% if results %}
+<ul class="py-1 overflow-auto max-h-60" role="listbox">
+    {% for result in results %}
+    <li class="px-4 py-2 hover:bg-gray-100 dark:hover:bg-gray-700 cursor-pointer"
+        role="option"
+        @click="selectedId = '{{ result.key }}'; query = '{{ result.label }}'; $refs.filterForm.requestSubmit()">
+        <div class="flex flex-col">
+            <span class="font-medium">{{ result.label }}</span>
+            {% if result.extra %}
+            <span class="text-sm text-gray-500 dark:text-gray-400">{{ result.extra }}</span>
+            {% endif %}
+        </div>
+    </li>
+    {% endfor %}
+</ul>
+{% else %}
+<div class="px-4 py-2 text-gray-500 dark:text-gray-400">
+    No results found
+</div>
+{% endif %}

autocomplete/templates/autocomplete/widget.html

@@ -0,0 +1,38 @@
+{% load static %}
+
+<div class="relative" x-data="{ query: '', selectedId: null }">
+    <input type="text"
+           name="{{ widget.name }}_search"
+           placeholder="{{ widget.attrs.placeholder|default:'Search...' }}"
+           class="{{ widget.attrs.class }}"
+           x-model="query"
+           @keydown.escape="query = ''"
+           hx-get="{% url 'autocomplete:items' ac_name %}"
+           hx-trigger="input changed delay:300ms"
+           hx-target="#{{ widget.name }}-suggestions"
+           hx-indicator="#{{ widget.name }}-indicator">
+
+    <input type="hidden"
+           name="{{ widget.name }}"
+           x-model="selectedId">
+
+    <!-- Loading indicator -->
+    <div id="{{ widget.name }}-indicator"
+         class="htmx-indicator absolute right-3 top-1/2 -translate-y-1/2"
+         role="status"
+         aria-label="Loading search results">
+        <svg class="w-5 h-5 text-gray-400 animate-spin" viewBox="0 0 24 24">
+            <circle class="opacity-25" cx="12" cy="12" r="10" stroke="currentColor" stroke-width="4" fill="none"/>
+            <path class="opacity-75" fill="currentColor" d="M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4z"/>
+        </svg>
+        <span class="sr-only">Searching...</span>
+    </div>
+
+    <!-- Suggestions dropdown -->
+    <div id="{{ widget.name }}-suggestions"
+         class="absolute z-50 mt-1 w-full bg-white dark:bg-gray-800 rounded-md shadow-lg"
+         role="listbox"
+         style="display: none;"
+         x-show="query.length > 0">
+    </div>
+</div>

autocomplete/urls.py

@@ -0,0 +1,9 @@
+from django.urls import path
+from . import views
+
+app_name = 'autocomplete'
+
+urlpatterns = [
+    path('<str:ac_name>/items/', views.items, name='items'),
+    path('<str:ac_name>/toggle/', views.toggle, name='toggle'),
+]

autocomplete/views.py

@@ -0,0 +1,52 @@
+from django.http import JsonResponse, HttpResponse
+from django.shortcuts import get_object_or_404, render
+from django.apps import apps
+from django.core.exceptions import ImproperlyConfigured
+
+def items(request, ac_name):
+    """Return autocomplete items for a given autocomplete class."""
+    try:
+        # Get the autocomplete class from the registry
+        ac_class = apps.get_app_config('autocomplete').get_autocomplete_class(ac_name)
+        if not ac_class:
+            raise ImproperlyConfigured(f"No autocomplete class found for {ac_name}")
+        
+        # Create instance and get results
+        ac = ac_class()
+        search = request.GET.get('search', '')
+        
+        # Check minimum search length
+        if len(search) < ac.minimum_search_length:
+            return HttpResponse('')
+        
+        # Get and format results
+        results = ac.get_search_results(search)[:ac.max_results]
+        formatted_results = [ac.format_result(obj) for obj in results]
+        
+        # Render suggestions template
+        return render(request, 'autocomplete/suggestions.html', {
+            'results': formatted_results
+        })
+    except Exception as e:
+        return HttpResponse(str(e), status=400)
+
+def toggle(request, ac_name):
+    """Toggle selection state for an autocomplete item."""
+    try:
+        # Get the autocomplete class from the registry
+        ac_class = apps.get_app_config('autocomplete').get_autocomplete_class(ac_name)
+        if not ac_class:
+            raise ImproperlyConfigured(f"No autocomplete class found for {ac_name}")
+        
+        # Create instance and handle toggle
+        ac = ac_class()
+        item_id = request.POST.get('id')
+        if not item_id:
+            raise ValueError("No item ID provided")
+        
+        # Get the object and format it
+        obj = get_object_or_404(ac.model, pk=item_id)
+        result = ac.format_result(obj)
+        return JsonResponse(result)
+    except Exception as e:
+        return JsonResponse({'error': str(e)}, status=400)

backend/.django_tailwind_cli/source.css

@@ -1 +0,0 @@
-@import "tailwindcss";

cline_docs/activeContext.md

@@ -1,21 +1,16 @@
 # Active Context
 
 ## Current Focus
-- Database schema synchronization and fixes
-- Parks model and pghistory integration
-- Ensuring model-database consistency
+- Moderation system development and enhancement
+- Dashboard interface improvements
+- Submission review workflow
 
 ## Recent Changes
-Fixed critical database schema mismatch in parks app:
-- Updated Park model to include operator and property_owner fields
-- Added missing owner_id column to parks_parkevent table
-- Fixed pghistory triggers that were failing due to missing columns
-- Resolved park detail page errors (parks/magic-kingdom/ now working)
-
-### Schema Updates Made
-- parks/models.py: Added operator and property_owner ForeignKey fields
-- parks/migrations/0006_auto_20250920_0944.py: Added owner_id column to parks_parkevent table
-- Database now properly supports all three ownership relationships: owner, operator, property_owner
+Working on moderation system components:
+- Dashboard interface
+- Submission list views
+- Moderation navigation
+- Content review workflow
 
 ## Active Files
 

companies/migrations/0003_remove_company_insert_insert_and_more.py

@@ -1,89 +0,0 @@
-# Generated by Django 5.2.6 on 2025-09-20 13:40
-
-import pgtrigger.compiler
-import pgtrigger.migrations
-from django.db import migrations
-
-
-class Migration(migrations.Migration):
-
-    dependencies = [
-        ("companies", "0002_alter_company_id_alter_manufacturer_id"),
-    ]
-
-    operations = [
-        pgtrigger.migrations.RemoveTrigger(
-            model_name="company",
-            name="insert_insert",
-        ),
-        pgtrigger.migrations.RemoveTrigger(
-            model_name="company",
-            name="update_update",
-        ),
-        pgtrigger.migrations.RemoveTrigger(
-            model_name="manufacturer",
-            name="insert_insert",
-        ),
-        pgtrigger.migrations.RemoveTrigger(
-            model_name="manufacturer",
-            name="update_update",
-        ),
-        pgtrigger.migrations.AddTrigger(
-            model_name="company",
-            trigger=pgtrigger.compiler.Trigger(
-                name="insert_insert",
-                sql=pgtrigger.compiler.UpsertTriggerSql(
-                    func='INSERT INTO "companies_companyevent" ("created_at", "description", "headquarters", "id", "name", "pgh_context_id", "pgh_created_at", "pgh_label", "pgh_obj_id", "slug", "total_parks", "total_rides", "updated_at", "website") VALUES (NEW."created_at", NEW."description", NEW."headquarters", NEW."id", NEW."name", _pgh_attach_context(), NOW(), \'insert\', NEW."id", NEW."slug", NEW."total_parks", NEW."total_rides", NEW."updated_at", NEW."website"); RETURN NULL;',
-                    hash="413671b13a748fb5f1acd57e8ec4af12ad7ae215",
-                    operation="INSERT",
-                    pgid="pgtrigger_insert_insert_a4101",
-                    table="companies_company",
-                    when="AFTER",
-                ),
-            ),
-        ),
-        pgtrigger.migrations.AddTrigger(
-            model_name="company",
-            trigger=pgtrigger.compiler.Trigger(
-                name="update_update",
-                sql=pgtrigger.compiler.UpsertTriggerSql(
-                    condition="WHEN (OLD.* IS DISTINCT FROM NEW.*)",
-                    func='INSERT INTO "companies_companyevent" ("created_at", "description", "headquarters", "id", "name", "pgh_context_id", "pgh_created_at", "pgh_label", "pgh_obj_id", "slug", "total_parks", "total_rides", "updated_at", "website") VALUES (NEW."created_at", NEW."description", NEW."headquarters", NEW."id", NEW."name", _pgh_attach_context(), NOW(), \'update\', NEW."id", NEW."slug", NEW."total_parks", NEW."total_rides", NEW."updated_at", NEW."website"); RETURN NULL;',
-                    hash="ee3eff1c96e46769347b8463d527668b7ece63c4",
-                    operation="UPDATE",
-                    pgid="pgtrigger_update_update_3d5ae",
-                    table="companies_company",
-                    when="AFTER",
-                ),
-            ),
-        ),
-        pgtrigger.migrations.AddTrigger(
-            model_name="manufacturer",
-            trigger=pgtrigger.compiler.Trigger(
-                name="insert_insert",
-                sql=pgtrigger.compiler.UpsertTriggerSql(
-                    func='INSERT INTO "companies_manufacturerevent" ("created_at", "description", "headquarters", "id", "name", "pgh_context_id", "pgh_created_at", "pgh_label", "pgh_obj_id", "slug", "total_rides", "total_roller_coasters", "updated_at", "website") VALUES (NEW."created_at", NEW."description", NEW."headquarters", NEW."id", NEW."name", _pgh_attach_context(), NOW(), \'insert\', NEW."id", NEW."slug", NEW."total_rides", NEW."total_roller_coasters", NEW."updated_at", NEW."website"); RETURN NULL;',
-                    hash="ac3c4c31aa8dffe569154454a6c4479d189c0f64",
-                    operation="INSERT",
-                    pgid="pgtrigger_insert_insert_5c0b6",
-                    table="companies_manufacturer",
-                    when="AFTER",
-                ),
-            ),
-        ),
-        pgtrigger.migrations.AddTrigger(
-            model_name="manufacturer",
-            trigger=pgtrigger.compiler.Trigger(
-                name="update_update",
-                sql=pgtrigger.compiler.UpsertTriggerSql(
-                    condition="WHEN (OLD.* IS DISTINCT FROM NEW.*)",
-                    func='INSERT INTO "companies_manufacturerevent" ("created_at", "description", "headquarters", "id", "name", "pgh_context_id", "pgh_created_at", "pgh_label", "pgh_obj_id", "slug", "total_rides", "total_roller_coasters", "updated_at", "website") VALUES (NEW."created_at", NEW."description", NEW."headquarters", NEW."id", NEW."name", _pgh_attach_context(), NOW(), \'update\', NEW."id", NEW."slug", NEW."total_rides", NEW."total_roller_coasters", NEW."updated_at", NEW."website"); RETURN NULL;',
-                    hash="c46f36f5811cd843ff61eab3ae77624ae2e69f60",
-                    operation="UPDATE",
-                    pgid="pgtrigger_update_update_81971",
-                    table="companies_manufacturer",
-                    when="AFTER",
-                ),
-            ),
-        ),
-    ]

designers/migrations/0003_remove_designer_insert_insert_and_more.py

@@ -1,52 +0,0 @@
-# Generated by Django 5.2.6 on 2025-09-20 13:40
-
-import pgtrigger.compiler
-import pgtrigger.migrations
-from django.db import migrations
-
-
-class Migration(migrations.Migration):
-
-    dependencies = [
-        ("designers", "0002_alter_designer_id"),
-    ]
-
-    operations = [
-        pgtrigger.migrations.RemoveTrigger(
-            model_name="designer",
-            name="insert_insert",
-        ),
-        pgtrigger.migrations.RemoveTrigger(
-            model_name="designer",
-            name="update_update",
-        ),
-        pgtrigger.migrations.AddTrigger(
-            model_name="designer",
-            trigger=pgtrigger.compiler.Trigger(
-                name="insert_insert",
-                sql=pgtrigger.compiler.UpsertTriggerSql(
-                    func='INSERT INTO "designers_designerevent" ("created_at", "description", "founded_date", "headquarters", "id", "name", "pgh_context_id", "pgh_created_at", "pgh_label", "pgh_obj_id", "slug", "updated_at", "website") VALUES (NEW."created_at", NEW."description", NEW."founded_date", NEW."headquarters", NEW."id", NEW."name", _pgh_attach_context(), NOW(), \'insert\', NEW."id", NEW."slug", NEW."updated_at", NEW."website"); RETURN NULL;',
-                    hash="876eaa3e1c7cf234f03cc706fa4e5e508ed780db",
-                    operation="INSERT",
-                    pgid="pgtrigger_insert_insert_9be65",
-                    table="designers_designer",
-                    when="AFTER",
-                ),
-            ),
-        ),
-        pgtrigger.migrations.AddTrigger(
-            model_name="designer",
-            trigger=pgtrigger.compiler.Trigger(
-                name="update_update",
-                sql=pgtrigger.compiler.UpsertTriggerSql(
-                    condition="WHEN (OLD.* IS DISTINCT FROM NEW.*)",
-                    func='INSERT INTO "designers_designerevent" ("created_at", "description", "founded_date", "headquarters", "id", "name", "pgh_context_id", "pgh_created_at", "pgh_label", "pgh_obj_id", "slug", "updated_at", "website") VALUES (NEW."created_at", NEW."description", NEW."founded_date", NEW."headquarters", NEW."id", NEW."name", _pgh_attach_context(), NOW(), \'update\', NEW."id", NEW."slug", NEW."updated_at", NEW."website"); RETURN NULL;',
-                    hash="edb092b6a122ca5827740a9afcdc6a885fe69c1c",
-                    operation="UPDATE",
-                    pgid="pgtrigger_update_update_b5f91",
-                    table="designers_designer",
-                    when="AFTER",
-                ),
-            ),
-        ),
-    ]

email_service/migrations/0003_remove_emailconfiguration_insert_insert_and_more.py

@@ -1,52 +0,0 @@
-# Generated by Django 5.2.6 on 2025-09-20 13:40
-
-import pgtrigger.compiler
-import pgtrigger.migrations
-from django.db import migrations
-
-
-class Migration(migrations.Migration):
-
-    dependencies = [
-        ("email_service", "0002_alter_emailconfiguration_id"),
-    ]
-
-    operations = [
-        pgtrigger.migrations.RemoveTrigger(
-            model_name="emailconfiguration",
-            name="insert_insert",
-        ),
-        pgtrigger.migrations.RemoveTrigger(
-            model_name="emailconfiguration",
-            name="update_update",
-        ),
-        pgtrigger.migrations.AddTrigger(
-            model_name="emailconfiguration",
-            trigger=pgtrigger.compiler.Trigger(
-                name="insert_insert",
-                sql=pgtrigger.compiler.UpsertTriggerSql(
-                    func='INSERT INTO "email_service_emailconfigurationevent" ("api_key", "created_at", "from_email", "from_name", "id", "pgh_context_id", "pgh_created_at", "pgh_label", "pgh_obj_id", "reply_to", "site_id", "updated_at") VALUES (NEW."api_key", NEW."created_at", NEW."from_email", NEW."from_name", NEW."id", _pgh_attach_context(), NOW(), \'insert\', NEW."id", NEW."reply_to", NEW."site_id", NEW."updated_at"); RETURN NULL;',
-                    hash="f19f3c7f7d904d5f850a2ff1e0bf1312e855c8c0",
-                    operation="INSERT",
-                    pgid="pgtrigger_insert_insert_08c59",
-                    table="email_service_emailconfiguration",
-                    when="AFTER",
-                ),
-            ),
-        ),
-        pgtrigger.migrations.AddTrigger(
-            model_name="emailconfiguration",
-            trigger=pgtrigger.compiler.Trigger(
-                name="update_update",
-                sql=pgtrigger.compiler.UpsertTriggerSql(
-                    condition="WHEN (OLD.* IS DISTINCT FROM NEW.*)",
-                    func='INSERT INTO "email_service_emailconfigurationevent" ("api_key", "created_at", "from_email", "from_name", "id", "pgh_context_id", "pgh_created_at", "pgh_label", "pgh_obj_id", "reply_to", "site_id", "updated_at") VALUES (NEW."api_key", NEW."created_at", NEW."from_email", NEW."from_name", NEW."id", _pgh_attach_context(), NOW(), \'update\', NEW."id", NEW."reply_to", NEW."site_id", NEW."updated_at"); RETURN NULL;',
-                    hash="e445521baf2cfb51379b2a6be550b4a638d60202",
-                    operation="UPDATE",
-                    pgid="pgtrigger_update_update_992a4",
-                    table="email_service_emailconfiguration",
-                    when="AFTER",
-                ),
-            ),
-        ),
-    ]

location/migrations/0003_remove_location_insert_insert_and_more.py

@@ -1,52 +0,0 @@
-# Generated by Django 5.2.6 on 2025-09-20 13:40
-
-import pgtrigger.compiler
-import pgtrigger.migrations
-from django.db import migrations
-
-
-class Migration(migrations.Migration):
-
-    dependencies = [
-        ("location", "0002_alter_location_id"),
-    ]
-
-    operations = [
-        pgtrigger.migrations.RemoveTrigger(
-            model_name="location",
-            name="insert_insert",
-        ),
-        pgtrigger.migrations.RemoveTrigger(
-            model_name="location",
-            name="update_update",
-        ),
-        pgtrigger.migrations.AddTrigger(
-            model_name="location",
-            trigger=pgtrigger.compiler.Trigger(
-                name="insert_insert",
-                sql=pgtrigger.compiler.UpsertTriggerSql(
-                    func='INSERT INTO "location_locationevent" ("city", "content_type_id", "country", "created_at", "id", "latitude", "location_type", "longitude", "name", "object_id", "pgh_context_id", "pgh_created_at", "pgh_label", "pgh_obj_id", "point", "postal_code", "state", "street_address", "updated_at") VALUES (NEW."city", NEW."content_type_id", NEW."country", NEW."created_at", NEW."id", NEW."latitude", NEW."location_type", NEW."longitude", NEW."name", NEW."object_id", _pgh_attach_context(), NOW(), \'insert\', NEW."id", NEW."point", NEW."postal_code", NEW."state", NEW."street_address", NEW."updated_at"); RETURN NULL;',
-                    hash="8a8f00869cfcaa1a23ab29b3d855e83602172c67",
-                    operation="INSERT",
-                    pgid="pgtrigger_insert_insert_98cd4",
-                    table="location_location",
-                    when="AFTER",
-                ),
-            ),
-        ),
-        pgtrigger.migrations.AddTrigger(
-            model_name="location",
-            trigger=pgtrigger.compiler.Trigger(
-                name="update_update",
-                sql=pgtrigger.compiler.UpsertTriggerSql(
-                    condition="WHEN (OLD.* IS DISTINCT FROM NEW.*)",
-                    func='INSERT INTO "location_locationevent" ("city", "content_type_id", "country", "created_at", "id", "latitude", "location_type", "longitude", "name", "object_id", "pgh_context_id", "pgh_created_at", "pgh_label", "pgh_obj_id", "point", "postal_code", "state", "street_address", "updated_at") VALUES (NEW."city", NEW."content_type_id", NEW."country", NEW."created_at", NEW."id", NEW."latitude", NEW."location_type", NEW."longitude", NEW."name", NEW."object_id", _pgh_attach_context(), NOW(), \'update\', NEW."id", NEW."point", NEW."postal_code", NEW."state", NEW."street_address", NEW."updated_at"); RETURN NULL;',
-                    hash="f3378cb26a5d88aa82c8fae016d46037b530de90",
-                    operation="UPDATE",
-                    pgid="pgtrigger_update_update_471d2",
-                    table="location_location",
-                    when="AFTER",
-                ),
-            ),
-        ),
-    ]

manage.py

@@ -6,7 +6,7 @@ import sys
 
 def main():
     """Run administrative tasks."""
-    os.environ.setdefault("DJANGO_SETTINGS_MODULE", "thrillwiki.settings")
+    os***REMOVED***iron.setdefault("DJANGO_SETTINGS_MODULE", "thrillwiki.settings")
     try:
         from django.core.management import execute_from_command_line
     except ImportError as exc:

media/migrations/0003_remove_photo_insert_insert_and_more.py

@@ -1,52 +0,0 @@
-# Generated by Django 5.2.6 on 2025-09-20 13:40
-
-import pgtrigger.compiler
-import pgtrigger.migrations
-from django.db import migrations
-
-
-class Migration(migrations.Migration):
-
-    dependencies = [
-        ("media", "0002_alter_photo_id"),
-    ]
-
-    operations = [
-        pgtrigger.migrations.RemoveTrigger(
-            model_name="photo",
-            name="insert_insert",
-        ),
-        pgtrigger.migrations.RemoveTrigger(
-            model_name="photo",
-            name="update_update",
-        ),
-        pgtrigger.migrations.AddTrigger(
-            model_name="photo",
-            trigger=pgtrigger.compiler.Trigger(
-                name="insert_insert",
-                sql=pgtrigger.compiler.UpsertTriggerSql(
-                    func='INSERT INTO "media_photoevent" ("alt_text", "caption", "content_type_id", "created_at", "date_taken", "id", "image", "is_approved", "is_primary", "object_id", "pgh_context_id", "pgh_created_at", "pgh_label", "pgh_obj_id", "updated_at", "uploaded_by_id") VALUES (NEW."alt_text", NEW."caption", NEW."content_type_id", NEW."created_at", NEW."date_taken", NEW."id", NEW."image", NEW."is_approved", NEW."is_primary", NEW."object_id", _pgh_attach_context(), NOW(), \'insert\', NEW."id", NEW."updated_at", NEW."uploaded_by_id"); RETURN NULL;',
-                    hash="c75cf37b6fac8d5593598ba2af194f1f9a692838",
-                    operation="INSERT",
-                    pgid="pgtrigger_insert_insert_e1ca0",
-                    table="media_photo",
-                    when="AFTER",
-                ),
-            ),
-        ),
-        pgtrigger.migrations.AddTrigger(
-            model_name="photo",
-            trigger=pgtrigger.compiler.Trigger(
-                name="update_update",
-                sql=pgtrigger.compiler.UpsertTriggerSql(
-                    condition="WHEN (OLD.* IS DISTINCT FROM NEW.*)",
-                    func='INSERT INTO "media_photoevent" ("alt_text", "caption", "content_type_id", "created_at", "date_taken", "id", "image", "is_approved", "is_primary", "object_id", "pgh_context_id", "pgh_created_at", "pgh_label", "pgh_obj_id", "updated_at", "uploaded_by_id") VALUES (NEW."alt_text", NEW."caption", NEW."content_type_id", NEW."created_at", NEW."date_taken", NEW."id", NEW."image", NEW."is_approved", NEW."is_primary", NEW."object_id", _pgh_attach_context(), NOW(), \'update\', NEW."id", NEW."updated_at", NEW."uploaded_by_id"); RETURN NULL;',
-                    hash="09d9b3bda4d950d7a7104c8f013a93d05025da72",
-                    operation="UPDATE",
-                    pgid="pgtrigger_update_update_6ff7d",
-                    table="media_photo",
-                    when="AFTER",
-                ),
-            ),
-        ),
-    ]

memory-bank/decisions/search_duplication_fix.md

@@ -0,0 +1,61 @@
+# Search Duplication Fix
+
+## Issue
+The park search was showing duplicate results because:
+1. There were two separate forms with the same ID ("filter-form")
+2. Both forms were targeting the same element ("#park-results")
+3. The search form and filter form were operating independently
+
+## Solution
+1. Created a custom autocomplete package to handle search functionality:
+   - ModelAutocomplete base class for model-based autocomplete
+   - AutocompleteWidget for rendering the search input
+   - Templates for widget and suggestions
+   - Views for handling search and selection
+
+2. Updated ParkAutocomplete to use ModelAutocomplete:
+```python
+class ParkAutocomplete(ModelAutocomplete):
+    model = Park
+    search_attrs = ['name']
+    minimum_search_length = 2
+    max_results = 8
+```
+
+3. Combined search and filter functionality into a single form:
+```html
+<form id="filter-form"
+      x-ref="filterForm"
+      hx-get="{% url 'parks:park_list' %}"
+      hx-target="#park-results"
+      hx-push-url="true"
+      hx-trigger="submit"
+      class="mt-4">
+    <div class="mb-6">
+        {{ search_form }}  <!-- AutocompleteWidget -->
+    </div>
+    {% include "search/components/filter_form.html" with filter=filter %}
+</form>
+```
+
+4. Added proper URL routing for autocomplete:
+```python
+path("ac/", include((autocomplete_patterns, "autocomplete"), namespace="autocomplete"))
+```
+
+## Benefits
+1. No more duplicate search requests
+2. Cleaner template structure
+3. Better user experience with a single search interface
+4. Proper integration with django-htmx-autocomplete
+5. Simplified view logic
+6. Reusable autocomplete functionality for other models
+
+## Technical Details
+- Using django-htmx-autocomplete's AutocompleteWidget for search
+- Single form submission handles both search and filtering
+- HTMX handles the dynamic updates
+- View mode selection preserved during search/filter operations
+- Minimum search length of 2 characters
+- Maximum of 8 search results
+- Search results include park status and location

memory-bank/systemPatterns.md

@@ -21,6 +21,23 @@
    - Implement component-based structure
    - Follow progressive enhancement
 
+### Static Files Organization
+1. Directory Structure
+   - `static/` - Source static files (CSS, JS, images, etc.)
+   - `staticfiles/` - Collected files (generated by collectstatic)
+
+2. File Management Rules
+   - Place all source static files in `static/` directory
+   - Never directly modify `staticfiles/` directory
+   - Use Django's `static` template tag for references
+   - Run collectstatic before deployment
+
+3. Benefits of Separation
+   - Clear distinction between source and compiled files
+   - Prevents confusion in development vs production
+   - Follows Django best practices
+   - Simplifies deployment process
+
 ## Design Patterns
 
 ### Data Access

moderation/migrations/0003_remove_editsubmission_insert_insert_and_more.py

@@ -1,89 +0,0 @@
-# Generated by Django 5.2.6 on 2025-09-20 13:40
-
-import pgtrigger.compiler
-import pgtrigger.migrations
-from django.db import migrations
-
-
-class Migration(migrations.Migration):
-
-    dependencies = [
-        ("moderation", "0002_remove_editsubmission_insert_insert_and_more"),
-    ]
-
-    operations = [
-        pgtrigger.migrations.RemoveTrigger(
-            model_name="editsubmission",
-            name="insert_insert",
-        ),
-        pgtrigger.migrations.RemoveTrigger(
-            model_name="editsubmission",
-            name="update_update",
-        ),
-        pgtrigger.migrations.RemoveTrigger(
-            model_name="photosubmission",
-            name="insert_insert",
-        ),
-        pgtrigger.migrations.RemoveTrigger(
-            model_name="photosubmission",
-            name="update_update",
-        ),
-        pgtrigger.migrations.AddTrigger(
-            model_name="editsubmission",
-            trigger=pgtrigger.compiler.Trigger(
-                name="insert_insert",
-                sql=pgtrigger.compiler.UpsertTriggerSql(
-                    func='INSERT INTO "moderation_editsubmissionevent" ("changes", "content_type_id", "created_at", "handled_at", "handled_by_id", "id", "moderator_changes", "notes", "object_id", "pgh_context_id", "pgh_created_at", "pgh_label", "pgh_obj_id", "reason", "source", "status", "submission_type", "updated_at", "user_id") VALUES (NEW."changes", NEW."content_type_id", NEW."created_at", NEW."handled_at", NEW."handled_by_id", NEW."id", NEW."moderator_changes", NEW."notes", NEW."object_id", _pgh_attach_context(), NOW(), \'insert\', NEW."id", NEW."reason", NEW."source", NEW."status", NEW."submission_type", NEW."updated_at", NEW."user_id"); RETURN NULL;',
-                    hash="0e394e419ba234dd23cb0f4f6567611ad71f2a38",
-                    operation="INSERT",
-                    pgid="pgtrigger_insert_insert_2c796",
-                    table="moderation_editsubmission",
-                    when="AFTER",
-                ),
-            ),
-        ),
-        pgtrigger.migrations.AddTrigger(
-            model_name="editsubmission",
-            trigger=pgtrigger.compiler.Trigger(
-                name="update_update",
-                sql=pgtrigger.compiler.UpsertTriggerSql(
-                    condition="WHEN (OLD.* IS DISTINCT FROM NEW.*)",
-                    func='INSERT INTO "moderation_editsubmissionevent" ("changes", "content_type_id", "created_at", "handled_at", "handled_by_id", "id", "moderator_changes", "notes", "object_id", "pgh_context_id", "pgh_created_at", "pgh_label", "pgh_obj_id", "reason", "source", "status", "submission_type", "updated_at", "user_id") VALUES (NEW."changes", NEW."content_type_id", NEW."created_at", NEW."handled_at", NEW."handled_by_id", NEW."id", NEW."moderator_changes", NEW."notes", NEW."object_id", _pgh_attach_context(), NOW(), \'update\', NEW."id", NEW."reason", NEW."source", NEW."status", NEW."submission_type", NEW."updated_at", NEW."user_id"); RETURN NULL;',
-                    hash="315b76df75a52d610d3d0857fd5821101e551410",
-                    operation="UPDATE",
-                    pgid="pgtrigger_update_update_ab38f",
-                    table="moderation_editsubmission",
-                    when="AFTER",
-                ),
-            ),
-        ),
-        pgtrigger.migrations.AddTrigger(
-            model_name="photosubmission",
-            trigger=pgtrigger.compiler.Trigger(
-                name="insert_insert",
-                sql=pgtrigger.compiler.UpsertTriggerSql(
-                    func='INSERT INTO "moderation_photosubmissionevent" ("caption", "content_type_id", "created_at", "date_taken", "handled_at", "handled_by_id", "id", "notes", "object_id", "pgh_context_id", "pgh_created_at", "pgh_label", "pgh_obj_id", "photo", "status", "updated_at", "user_id") VALUES (NEW."caption", NEW."content_type_id", NEW."created_at", NEW."date_taken", NEW."handled_at", NEW."handled_by_id", NEW."id", NEW."notes", NEW."object_id", _pgh_attach_context(), NOW(), \'insert\', NEW."id", NEW."photo", NEW."status", NEW."updated_at", NEW."user_id"); RETURN NULL;',
-                    hash="e967ea629575f6b26892db225b40add9a1558cfb",
-                    operation="INSERT",
-                    pgid="pgtrigger_insert_insert_62865",
-                    table="moderation_photosubmission",
-                    when="AFTER",
-                ),
-            ),
-        ),
-        pgtrigger.migrations.AddTrigger(
-            model_name="photosubmission",
-            trigger=pgtrigger.compiler.Trigger(
-                name="update_update",
-                sql=pgtrigger.compiler.UpsertTriggerSql(
-                    condition="WHEN (OLD.* IS DISTINCT FROM NEW.*)",
-                    func='INSERT INTO "moderation_photosubmissionevent" ("caption", "content_type_id", "created_at", "date_taken", "handled_at", "handled_by_id", "id", "notes", "object_id", "pgh_context_id", "pgh_created_at", "pgh_label", "pgh_obj_id", "photo", "status", "updated_at", "user_id") VALUES (NEW."caption", NEW."content_type_id", NEW."created_at", NEW."date_taken", NEW."handled_at", NEW."handled_by_id", NEW."id", NEW."notes", NEW."object_id", _pgh_attach_context(), NOW(), \'update\', NEW."id", NEW."photo", NEW."status", NEW."updated_at", NEW."user_id"); RETURN NULL;',
-                    hash="b7a97f4e8f90569a90fc4c35cc85e601ff25f0d9",
-                    operation="UPDATE",
-                    pgid="pgtrigger_update_update_9c311",
-                    table="moderation_photosubmission",
-                    when="AFTER",
-                ),
-            ),
-        ),
-    ]

parks/autocomplete.py

@@ -0,0 +1,15 @@
+from autocomplete import ModelAutocomplete
+from .models import Park
+
+
+class ParkAutocomplete(ModelAutocomplete):
+    """Autocomplete class for Park model."""
+    model = Park
+    search_attrs = ['name', 'city', 'state', 'country']  # Fields to search
+    minimum_search_length = 2  # Start searching after 2 characters
+    max_results = 8  # Limit to 8 suggestions
+    
+    # Customize display text
+    no_result_text = "No parks found matching your search."
+    narrow_search_text = "Showing %(page_size)s of %(total)s parks. Try narrowing your search."
+    type_at_least_n_characters = "Type at least %(n)s characters to search parks"

parks/forms.py

@@ -1,14 +1,13 @@
 from django import forms
 from decimal import Decimal, InvalidOperation, ROUND_DOWN
-from autocomplete import AutocompleteWidget
+from autocomplete import ModelAutocomplete, AutocompleteWidget
 
-from core.forms import BaseAutocomplete
 from .models import Park
 from location.models import Location
 from .querysets import get_base_park_queryset
 
 
-class ParkAutocomplete(BaseAutocomplete):
+class ParkAutocomplete(ModelAutocomplete):
     """Autocomplete for searching parks.
     
     Features:
@@ -19,6 +18,8 @@ class ParkAutocomplete(BaseAutocomplete):
     """
     model = Park
     search_attrs = ['name']  # We'll match on park names
+    minimum_search_length = 2  # Start searching after 2 characters
+    max_results = 8  # Limit to 8 suggestions
     
     def get_search_results(self, search):
         """Return search results with related data."""

parks/migrations/0004_remove_park_insert_insert_remove_park_update_update_and_more.py

@@ -1,89 +0,0 @@
-# Generated by Django 5.2.6 on 2025-09-20 13:40
-
-import pgtrigger.compiler
-import pgtrigger.migrations
-from django.db import migrations
-
-
-class Migration(migrations.Migration):
-
-    dependencies = [
-        ("parks", "0003_alter_park_id_alter_parkarea_id_and_more"),
-    ]
-
-    operations = [
-        pgtrigger.migrations.RemoveTrigger(
-            model_name="park",
-            name="insert_insert",
-        ),
-        pgtrigger.migrations.RemoveTrigger(
-            model_name="park",
-            name="update_update",
-        ),
-        pgtrigger.migrations.RemoveTrigger(
-            model_name="parkarea",
-            name="insert_insert",
-        ),
-        pgtrigger.migrations.RemoveTrigger(
-            model_name="parkarea",
-            name="update_update",
-        ),
-        pgtrigger.migrations.AddTrigger(
-            model_name="park",
-            trigger=pgtrigger.compiler.Trigger(
-                name="insert_insert",
-                sql=pgtrigger.compiler.UpsertTriggerSql(
-                    func='INSERT INTO "parks_parkevent" ("average_rating", "closing_date", "coaster_count", "created_at", "description", "id", "name", "opening_date", "operating_season", "owner_id", "pgh_context_id", "pgh_created_at", "pgh_label", "pgh_obj_id", "ride_count", "size_acres", "slug", "status", "updated_at", "website") VALUES (NEW."average_rating", NEW."closing_date", NEW."coaster_count", NEW."created_at", NEW."description", NEW."id", NEW."name", NEW."opening_date", NEW."operating_season", NEW."owner_id", _pgh_attach_context(), NOW(), \'insert\', NEW."id", NEW."ride_count", NEW."size_acres", NEW."slug", NEW."status", NEW."updated_at", NEW."website"); RETURN NULL;',
-                    hash="83eb12a74769e2601a23691085a345c29c9b6f68",
-                    operation="INSERT",
-                    pgid="pgtrigger_insert_insert_66883",
-                    table="parks_park",
-                    when="AFTER",
-                ),
-            ),
-        ),
-        pgtrigger.migrations.AddTrigger(
-            model_name="park",
-            trigger=pgtrigger.compiler.Trigger(
-                name="update_update",
-                sql=pgtrigger.compiler.UpsertTriggerSql(
-                    condition="WHEN (OLD.* IS DISTINCT FROM NEW.*)",
-                    func='INSERT INTO "parks_parkevent" ("average_rating", "closing_date", "coaster_count", "created_at", "description", "id", "name", "opening_date", "operating_season", "owner_id", "pgh_context_id", "pgh_created_at", "pgh_label", "pgh_obj_id", "ride_count", "size_acres", "slug", "status", "updated_at", "website") VALUES (NEW."average_rating", NEW."closing_date", NEW."coaster_count", NEW."created_at", NEW."description", NEW."id", NEW."name", NEW."opening_date", NEW."operating_season", NEW."owner_id", _pgh_attach_context(), NOW(), \'update\', NEW."id", NEW."ride_count", NEW."size_acres", NEW."slug", NEW."status", NEW."updated_at", NEW."website"); RETURN NULL;',
-                    hash="f42a468ec35a2d51abd5c1ae1afa41b300ae0a1b",
-                    operation="UPDATE",
-                    pgid="pgtrigger_update_update_19f56",
-                    table="parks_park",
-                    when="AFTER",
-                ),
-            ),
-        ),
-        pgtrigger.migrations.AddTrigger(
-            model_name="parkarea",
-            trigger=pgtrigger.compiler.Trigger(
-                name="insert_insert",
-                sql=pgtrigger.compiler.UpsertTriggerSql(
-                    func='INSERT INTO "parks_parkareaevent" ("closing_date", "created_at", "description", "id", "name", "opening_date", "park_id", "pgh_context_id", "pgh_created_at", "pgh_label", "pgh_obj_id", "slug", "updated_at") VALUES (NEW."closing_date", NEW."created_at", NEW."description", NEW."id", NEW."name", NEW."opening_date", NEW."park_id", _pgh_attach_context(), NOW(), \'insert\', NEW."id", NEW."slug", NEW."updated_at"); RETURN NULL;',
-                    hash="fa64ee07f872bf2214b2c1b638b028429752bac4",
-                    operation="INSERT",
-                    pgid="pgtrigger_insert_insert_13457",
-                    table="parks_parkarea",
-                    when="AFTER",
-                ),
-            ),
-        ),
-        pgtrigger.migrations.AddTrigger(
-            model_name="parkarea",
-            trigger=pgtrigger.compiler.Trigger(
-                name="update_update",
-                sql=pgtrigger.compiler.UpsertTriggerSql(
-                    condition="WHEN (OLD.* IS DISTINCT FROM NEW.*)",
-                    func='INSERT INTO "parks_parkareaevent" ("closing_date", "created_at", "description", "id", "name", "opening_date", "park_id", "pgh_context_id", "pgh_created_at", "pgh_label", "pgh_obj_id", "slug", "updated_at") VALUES (NEW."closing_date", NEW."created_at", NEW."description", NEW."id", NEW."name", NEW."opening_date", NEW."park_id", _pgh_attach_context(), NOW(), \'update\', NEW."id", NEW."slug", NEW."updated_at"); RETURN NULL;',
-                    hash="59fa84527a4fd0fa51685058b6037fa22163a095",
-                    operation="UPDATE",
-                    pgid="pgtrigger_update_update_6e5aa",
-                    table="parks_parkarea",
-                    when="AFTER",
-                ),
-            ),
-        ),
-    ]

parks/migrations/0005_auto_20250920_0943.py

@@ -1,12 +0,0 @@
-# Generated by Django 5.2.6 on 2025-09-20 13:43
-
-from django.db import migrations
-
-
-class Migration(migrations.Migration):
-
-    dependencies = [
-        ("parks", "0004_remove_park_insert_insert_remove_park_update_update_and_more"),
-    ]
-
-    operations = []

parks/migrations/0006_auto_20250920_0944.py

@@ -1,17 +0,0 @@
-# Generated by Django 5.2.6 on 2025-09-20 13:44
-
-from django.db import migrations
-
-
-class Migration(migrations.Migration):
-
-    dependencies = [
-        ("parks", "0005_auto_20250920_0943"),
-    ]
-
-    operations = [
-        migrations.RunSQL(
-            "ALTER TABLE parks_parkevent ADD COLUMN IF NOT EXISTS owner_id INTEGER;",
-            reverse_sql="ALTER TABLE parks_parkevent DROP COLUMN IF EXISTS owner_id;"
-        ),
-    ]

parks/models.py

@@ -57,12 +57,6 @@ class Park(TrackedModel):
     owner = models.ForeignKey(
         Company, on_delete=models.SET_NULL, null=True, blank=True, related_name="parks"
     )
-    operator = models.ForeignKey(
-        Company, on_delete=models.SET_NULL, null=True, blank=True, related_name="operated_parks"
-    )
-    property_owner = models.ForeignKey(
-        Company, on_delete=models.SET_NULL, null=True, blank=True, related_name="owned_properties"
-    )
     photos = GenericRelation(Photo, related_query_name="park")
     areas: models.Manager['ParkArea']  # Type hint for reverse relation
     rides: models.Manager['Ride']  # Type hint for reverse relation from rides app

parks/templates/parks/park_list.html

@@ -47,68 +47,23 @@
 {% block filter_section %}
 <div class="mb-6">
     <div class="max-w-3xl mx-auto relative mb-8">
-        <div class="w-full relative"
-             x-data="{ query: '', selectedId: null }"
-             @search-selected.window="
-                 query = $event.detail;
-                 selectedId = $event.target.value;
-                 $refs.filterForm.querySelector('input[name=search]').value = query;
-                 $refs.filterForm.submit();
-                 query = '';
-             ">
-            <form hx-get="{% url 'parks:suggest_parks' %}"
-                  hx-target="#search-results"
-                  hx-trigger="input changed delay:300ms"
-                  hx-indicator="#search-indicator"
-                  x-ref="searchForm">
-                <div class="relative">
-                    <input type="search"
-                           name="search"
-                           placeholder="Search parks..."
-                           class="w-full border-gray-300 rounded-lg form-input dark:border-gray-600 dark:bg-gray-700 dark:text-white"
-                           aria-label="Search parks"
-                           aria-controls="search-results"
-                           :aria-expanded="query !== ''"
-                           x-model="query"
-                           @keydown.escape="query = ''">
-
-                    <!-- Loading indicator -->
-                    <div id="search-indicator" 
-                         class="htmx-indicator absolute right-3 top-1/2 -translate-y-1/2" 
-                         role="status" 
-                         aria-label="Loading search results">
-                        <svg class="w-5 h-5 text-gray-400 animate-spin" viewBox="0 0 24 24">
-                            <circle class="opacity-25" cx="12" cy="12" r="10" stroke="currentColor" stroke-width="4" fill="none"/>
-                            <path class="opacity-75" fill="currentColor" d="M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4z"/>
-                        </svg>
-                        <span class="sr-only">Searching...</span>
+        <div class="bg-white shadow sm:rounded-lg">
+            <div class="px-4 py-5 sm:p-6">
+                <form id="filter-form"
+                      x-ref="filterForm"
+                      hx-get="{% url 'parks:park_list' %}"
+                      hx-target="#park-results"
+                      hx-push-url="true"
+                      hx-trigger="submit"
+                      class="mt-4">
+                    <div class="mb-6">
+                        {{ search_form }}
                     </div>
-                </div>
-            </form>
-
-            <div id="search-results"
-                 class="absolute z-50 mt-1 w-full bg-white dark:bg-gray-800 rounded-md shadow-lg"
-                 role="listbox">
-                <!-- Search suggestions will be loaded here -->
+                    {% include "search/components/filter_form.html" with filter=filter %}
+                </form>
             </div>
         </div>
     </div>
-
-    <div class="bg-white shadow sm:rounded-lg">
-        <div class="px-4 py-5 sm:p-6">
-            <h3 class="text-lg font-medium leading-6 text-gray-900">Filters</h3>
-            <form id="filter-form"
-                  x-ref="filterForm"
-                  hx-get="{% url 'parks:park_list' %}"
-                  hx-target="#park-results"
-                  hx-push-url="true"
-                  hx-trigger="change, submit"
-                  class="mt-4">
-                <input type="hidden" name="search" value="{{ request.GET.search }}">
-                {% include "search/components/filter_form.html" with filter=filter %}
-            </form>
-        </div>
-    </div>
 </div>
 {% endblock %}
 

parks/templates/parks/partials/search_suggestions.html

@@ -1,37 +1,21 @@
-{% load filter_utils %}
-{% if suggestions %}
-<div id="search-suggestions-results"
-     class="w-full bg-white rounded-md shadow-lg border border-gray-200 max-h-96 overflow-y-auto"
-     x-show="open"
-     x-cloak
-     @keydown.escape.window="open = false"
-     x-transition:enter="transition ease-out duration-100"
-     x-transition:enter-start="transform opacity-0 scale-95"
-     x-transition:enter-end="transform opacity-100 scale-100"
-     x-transition:leave="transition ease-in duration-75"
-     x-transition:leave-start="transform opacity-100 scale-100"
-     x-transition:leave-end="transform opacity-0 scale-95">
-     {% for park in suggestions %}
-     {% with location=park.location.first %}
-     <button type="button"
-             class="w-full text-left px-4 py-2 text-sm hover:bg-gray-100 cursor-pointer flex items-center justify-between gap-2 transition duration-150"
-             :class="{ 'bg-blue-50': focusedIndex === {{ forloop.counter0 }} }"
-             @mousedown.prevent="query = '{{ park.name }}'; $refs.search.value = '{{ park.name }}'"
-             @mousedown.prevent="query = '{{ park.name }}'; $dispatch('search-selected', '{{ park.name }}'); open = false;"
-             role="option"
-             :aria-selected="focusedIndex === {{ forloop.counter0 }}"
-             tabindex="-1"
-             x-effect="if(focusedIndex === {{ forloop.counter0 }}) $el.scrollIntoView({block: 'nearest'})"
-             aria-label="{{ park.name }}{% if location.city %} in {{ location.city }}{% endif %}{% if location.state %}, {{ location.state }}{% endif %}">
-         <div class="flex items-center gap-2">
-             <span class="font-medium" x-text="focusedIndex === {{ forloop.counter0 }} ? '▶ {{ park.name }}' : '{{ park.name }}'"></span>
-             <span class="text-gray-500">
-                 {% if location.city %}{{ location.city }}, {% endif %}
-                 {% if location.state %}{{ location.state }}{% endif %}
-             </span>
-         </div>
-     </button>
-     {% endwith %}
-     {% endfor %}
- </div>
+{% if results %}
+<div class="py-1">
+    {% for result in results %}
+    <button class="w-full text-left px-4 py-2 hover:bg-gray-100 dark:hover:bg-gray-700"
+            @click="$dispatch('search-selected', '{{ result.name }}')"
+            value="{{ result.id }}"
+            role="option">
+        <div class="flex flex-col">
+            <span class="font-medium text-gray-900 dark:text-white">{{ result.name }}</span>
+            <span class="text-sm text-gray-500 dark:text-gray-400">
+                {{ result.status }}{% if result.location %} • {{ result.location }}{% endif %}
+            </span>
+        </div>
+    </button>
+    {% endfor %}
+</div>
+{% else %}
+<div class="px-4 py-2 text-sm text-gray-500 dark:text-gray-400">
+    {% if query %}No parks found matching "{{ query }}"{% else %}Start typing to search parks{% endif %}
+</div>
 {% endif %}

parks/urls.py

@@ -18,8 +18,6 @@ urlpatterns = [
     
     # Areas and search endpoints for HTMX
     path("areas/", views.get_park_areas, name="get_park_areas"),
-    path("suggest_parks/", views_search.suggest_parks, name="suggest_parks"),
-
     path("search/", views.search_parks, name="search_parks"),
     
     # Park detail and related views

parks/views_search.py

@@ -1,5 +1,4 @@
-from django.http import HttpRequest, HttpResponse, JsonResponse
-from django.shortcuts import render
+from django.http import HttpRequest, HttpResponse
 from django.views.generic import TemplateView
 from django.urls import reverse
 
@@ -13,6 +12,8 @@ class ParkSearchView(TemplateView):
 
     def get_context_data(self, **kwargs):
         context = super().get_context_data(**kwargs)
+        
+        # Initialize search form
         context['search_form'] = ParkSearchForm(self.request.GET)
         
         # Initialize filter with current querystring
@@ -20,35 +21,11 @@ class ParkSearchView(TemplateView):
         filter_instance = ParkFilter(self.request.GET, queryset=queryset)
         context['filter'] = filter_instance
         
-        # Apply search if park ID selected via autocomplete
-        park_id = self.request.GET.get('park')
-        if park_id:
-            queryset = filter_instance.qs.filter(id=park_id)
-        else:
-            queryset = filter_instance.qs
+        # Get filtered queryset
+        queryset = filter_instance.qs
             
         # Handle view mode
         context['view_mode'] = self.request.GET.get('view_mode', 'grid')
         context['parks'] = queryset
         
         return context
-
-def suggest_parks(request: HttpRequest) -> JsonResponse:
-    """Return park search suggestions as JSON."""
-    query = request.GET.get('search', '').strip()
-    if not query:
-        return JsonResponse({'results': []})
-    
-    queryset = get_base_park_queryset()
-    filter_instance = ParkFilter({'search': query}, queryset=queryset)
-    parks = filter_instance.qs[:8]  # Limit to 8 suggestions
-    
-    results = [{
-        'id': str(park.pk),
-        'name': park.name,
-        'status': park.get_status_display(),
-        'location': park.formatted_location or '',
-        'url': reverse('parks:park_detail', kwargs={'slug': park.slug})
-    } for park in parks]
-    
-    return JsonResponse({'results': results})

pyproject.toml

@@ -26,7 +26,6 @@ django_settings = "thrillwiki.settings"
 [project]
 name = "thrillwiki"
 version = "0.1.0"
-requires-python = ">=3.11"
 dependencies = [
     "Django>=5.0",
     "djangorestframework>=3.14.0",
@@ -59,5 +58,4 @@ dependencies = [
     "pytest-playwright>=0.4.3",
     "django-pghistory>=3.5.2",
     "django-htmx-autocomplete>=1.0.5",
-    "python-decouple>=3.8",
 ]

reviews/migrations/0003_remove_review_insert_insert_and_more.py

@@ -1,52 +0,0 @@
-# Generated by Django 5.2.6 on 2025-09-20 13:40
-
-import pgtrigger.compiler
-import pgtrigger.migrations
-from django.db import migrations
-
-
-class Migration(migrations.Migration):
-
-    dependencies = [
-        ("reviews", "0002_alter_review_id"),
-    ]
-
-    operations = [
-        pgtrigger.migrations.RemoveTrigger(
-            model_name="review",
-            name="insert_insert",
-        ),
-        pgtrigger.migrations.RemoveTrigger(
-            model_name="review",
-            name="update_update",
-        ),
-        pgtrigger.migrations.AddTrigger(
-            model_name="review",
-            trigger=pgtrigger.compiler.Trigger(
-                name="insert_insert",
-                sql=pgtrigger.compiler.UpsertTriggerSql(
-                    func='INSERT INTO "reviews_reviewevent" ("content", "content_type_id", "created_at", "id", "is_published", "moderated_at", "moderated_by_id", "moderation_notes", "object_id", "pgh_context_id", "pgh_created_at", "pgh_label", "pgh_obj_id", "rating", "title", "updated_at", "user_id", "visit_date") VALUES (NEW."content", NEW."content_type_id", NEW."created_at", NEW."id", NEW."is_published", NEW."moderated_at", NEW."moderated_by_id", NEW."moderation_notes", NEW."object_id", _pgh_attach_context(), NOW(), \'insert\', NEW."id", NEW."rating", NEW."title", NEW."updated_at", NEW."user_id", NEW."visit_date"); RETURN NULL;',
-                    hash="1126891ad95c3c8dc8580ca8b669b6c195960cff",
-                    operation="INSERT",
-                    pgid="pgtrigger_insert_insert_7a7c1",
-                    table="reviews_review",
-                    when="AFTER",
-                ),
-            ),
-        ),
-        pgtrigger.migrations.AddTrigger(
-            model_name="review",
-            trigger=pgtrigger.compiler.Trigger(
-                name="update_update",
-                sql=pgtrigger.compiler.UpsertTriggerSql(
-                    condition="WHEN (OLD.* IS DISTINCT FROM NEW.*)",
-                    func='INSERT INTO "reviews_reviewevent" ("content", "content_type_id", "created_at", "id", "is_published", "moderated_at", "moderated_by_id", "moderation_notes", "object_id", "pgh_context_id", "pgh_created_at", "pgh_label", "pgh_obj_id", "rating", "title", "updated_at", "user_id", "visit_date") VALUES (NEW."content", NEW."content_type_id", NEW."created_at", NEW."id", NEW."is_published", NEW."moderated_at", NEW."moderated_by_id", NEW."moderation_notes", NEW."object_id", _pgh_attach_context(), NOW(), \'update\', NEW."id", NEW."rating", NEW."title", NEW."updated_at", NEW."user_id", NEW."visit_date"); RETURN NULL;',
-                    hash="091fc5e3597eddb31fed505798d29859fe8efbe0",
-                    operation="UPDATE",
-                    pgid="pgtrigger_update_update_b34c8",
-                    table="reviews_review",
-                    when="AFTER",
-                ),
-            ),
-        ),
-    ]

rides/migrations/0007_alter_rideevent_table_alter_ridemodelevent_table.py

@@ -1,21 +0,0 @@
-# Generated by Django 5.2.6 on 2025-09-20 13:40
-
-from django.db import migrations
-
-
-class Migration(migrations.Migration):
-
-    dependencies = [
-        ("rides", "0006_alter_rideevent_options_alter_ridemodelevent_options_and_more"),
-    ]
-
-    operations = [
-        migrations.AlterModelTable(
-            name="rideevent",
-            table="rides_rideevent",
-        ),
-        migrations.AlterModelTable(
-            name="ridemodelevent",
-            table="rides_ridemodelevent",
-        ),
-    ]

static/css/alerts.css

@@ -1,44 +1,37 @@
-/* Alert Styles */
 .alert {
-    @apply fixed z-50 px-4 py-3 transition-all duration-500 transform rounded-lg shadow-lg right-4 top-4;
-    animation: slideIn 0.5s ease-out forwards;
+    padding: 1rem;
+    margin-bottom: 1rem;
+    border-radius: 0.375rem;
+    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
+    opacity: 1;
+    transition: opacity 0.3s ease-in-out;
+    cursor: pointer;
 }
 
 .alert-success {
-    @apply text-white bg-green-500;
+    background-color: #E8F5E9;
+    border: 1px solid #A5D6A7;
+    color: #2E7D32;
 }
 
 .alert-error {
-    @apply text-white bg-red-500;
-}
-
-.alert-info {
-    @apply text-white bg-blue-500;
+    background-color: #FFEBEE;
+    border: 1px solid #FFCDD2;
+    color: #C62828;
 }
 
 .alert-warning {
-    @apply text-white bg-yellow-500;
+    background-color: #FFF3E0;
+    border: 1px solid #FFCC80;
+    color: #EF6C00;
 }
 
-/* Animation keyframes */
-@keyframes slideIn {
-    0% {
-        transform: translateX(100%);
-        opacity: 0;
-    }
-    100% {
-        transform: translateX(0);
-        opacity: 1;
-    }
+.alert-info {
+    background-color: #E3F2FD;
+    border: 1px solid #90CAF9;
+    color: #1565C0;
 }
 
-@keyframes slideOut {
-    0% {
-        transform: translateX(0);
-        opacity: 1;
-    }
-    100% {
-        transform: translateX(100%);
-        opacity: 0;
-    }
+.alert.fade-out {
+    opacity: 0;
 }

static/js/alerts.js

@@ -1,18 +1,21 @@
-document.addEventListener('DOMContentLoaded', function() {
-    // Get all alert elements
+document.addEventListener('DOMContentLoaded', () => {
     const alerts = document.querySelectorAll('.alert');
 
-    // For each alert
     alerts.forEach(alert => {
-        // After 5 seconds
+        // Auto-hide alerts after 5 seconds
         setTimeout(() => {
-            // Add slideOut animation
-            alert.style.animation = 'slideOut 0.5s ease-out forwards';
-            
-            // Remove the alert after animation completes
+            alert.classList.add('fade-out');
             setTimeout(() => {
                 alert.remove();
-            }, 500);
+            }, 300); // Match CSS transition duration
         }, 5000);
+
+        // Add click-to-dismiss functionality
+        alert.addEventListener('click', () => {
+            alert.classList.add('fade-out');
+            setTimeout(() => {
+                alert.remove();
+            }, 300);
+        });
     });
 });

static/js/location-autocomplete.js

@@ -1,81 +1,50 @@
-function locationAutocomplete(field, filterParks = false) {
-    return {
-        query: '',
-        suggestions: [],
-        fetchSuggestions() {
-            let url;
-            const params = new URLSearchParams({
-                q: this.query,
-                filter_parks: filterParks
-            });
+document.addEventListener('DOMContentLoaded', () => {
+    const countryInput = document.querySelector('[name="country"]');
+    const regionInput = document.querySelector('[name="region"]');
+    const cityInput = document.querySelector('[name="city"]');
 
-            switch (field) {
-                case 'country':
-                    url = '/parks/ajax/countries/';
-                    break;
-                case 'region':
-                    url = '/parks/ajax/regions/';
-                    // Add country parameter if we're fetching regions
-                    const countryInput = document.getElementById(filterParks ? 'country' : 'id_country_name');
-                    if (countryInput && countryInput.value) {
-                        params.append('country', countryInput.value);
-                    }
-                    break;
-                case 'city':
-                    url = '/parks/ajax/cities/';
-                    // Add country and region parameters if we're fetching cities
-                    const regionInput = document.getElementById(filterParks ? 'region' : 'id_region_name');
-                    const cityCountryInput = document.getElementById(filterParks ? 'country' : 'id_country_name');
-                    if (regionInput && regionInput.value && cityCountryInput && cityCountryInput.value) {
-                        params.append('country', cityCountryInput.value);
-                        params.append('region', regionInput.value);
-                    }
-                    break;
-            }
+    if (!countryInput || !regionInput || !cityInput) return;
 
-            if (url) {
-                fetch(`${url}?${params}`)
-                    .then(response => response.json())
-                    .then(data => {
-                        this.suggestions = data;
-                    });
-            }
-        },
-        selectSuggestion(suggestion) {
-            this.query = suggestion.name;
-            this.suggestions = [];
-
-            // If this is a form field (not filter), update hidden fields
-            if (!filterParks) {
-                const hiddenField = document.getElementById(`id_${field}`);
-                if (hiddenField) {
-                    hiddenField.value = suggestion.id;
-                }
-
-                // Clear dependent fields when parent field changes
-                if (field === 'country') {
-                    const regionInput = document.getElementById('id_region_name');
-                    const cityInput = document.getElementById('id_city_name');
-                    const regionHidden = document.getElementById('id_region');
-                    const cityHidden = document.getElementById('id_city');
-                    
-                    if (regionInput) regionInput.value = '';
-                    if (cityInput) cityInput.value = '';
-                    if (regionHidden) regionHidden.value = '';
-                    if (cityHidden) cityHidden.value = '';
-                } else if (field === 'region') {
-                    const cityInput = document.getElementById('id_city_name');
-                    const cityHidden = document.getElementById('id_city');
-                    
-                    if (cityInput) cityInput.value = '';
-                    if (cityHidden) cityHidden.value = '';
-                }
-            }
-
-            // Trigger form submission for filters
-            if (filterParks) {
-                htmx.trigger('#park-filters', 'change');
-            }
+    // Update regions when country changes
+    countryInput.addEventListener('change', () => {
+        const country = countryInput.value;
+        if (country) {
+            updateRegions(country);
+            // Clear city when country changes
+            cityInput.innerHTML = '<option value="">Select a city</option>';
         }
-    };
-}
+    });
+
+    // Update cities when region changes
+    regionInput.addEventListener('change', () => {
+        const country = countryInput.value;
+        const region = regionInput.value;
+        if (country && region) {
+            updateCities(country, region);
+        }
+    });
+
+    function updateRegions(country) {
+        fetch(`/location/regions/?country=${encodeURIComponent(country)}`)
+            .then(response => response.json())
+            .then(data => {
+                regionInput.innerHTML = '<option value="">Select a region</option>';
+                data.regions.forEach(region => {
+                    const option = new Option(region, region);
+                    regionInput.add(option);
+                });
+            });
+    }
+
+    function updateCities(country, region) {
+        fetch(`/location/cities/?country=${encodeURIComponent(country)}&region=${encodeURIComponent(region)}`)
+            .then(response => response.json())
+            .then(data => {
+                cityInput.innerHTML = '<option value="">Select a city</option>';
+                data.cities.forEach(city => {
+                    const option = new Option(city, city);
+                    cityInput.add(option);
+                });
+            });
+    }
+});

static/js/main.js

@@ -1,141 +1,40 @@
-// Theme handling
+// Theme Toggle
 document.addEventListener('DOMContentLoaded', () => {
     const themeToggle = document.getElementById('theme-toggle');
-    const html = document.documentElement;
+    const themeIcon = themeToggle.nextElementSibling.querySelector('i');
 
-    // Initialize toggle state based on current theme
-    if (themeToggle) {
-        themeToggle.checked = html.classList.contains('dark');
+    // Set initial icon
+    updateThemeIcon();
 
-        // Handle toggle changes
-        themeToggle.addEventListener('change', function() {
-            const isDark = this.checked;
-            html.classList.toggle('dark', isDark);
-            localStorage.setItem('theme', isDark ? 'dark' : 'light');
-        });
-        
-        // Listen for system theme changes
-        const mediaQuery = window.matchMedia('(prefers-color-scheme: dark)');
-        mediaQuery.addEventListener('change', (e) => {
-            if (!localStorage.getItem('theme')) {
-                const isDark = e.matches;
-                html.classList.toggle('dark', isDark);
-                themeToggle.checked = isDark;
-            }
-        });
-    }
-});
-
-// Handle search form submission
-document.addEventListener('submit', (e) => {
-    if (e.target.matches('form[action*="search"]')) {
-        const searchInput = e.target.querySelector('input[name="q"]');
-        if (!searchInput.value.trim()) {
-            e.preventDefault();
+    themeToggle.addEventListener('change', () => {
+        if (document.documentElement.classList.contains('dark')) {
+            document.documentElement.classList.remove('dark');
+            localStorage.setItem('theme', 'light');
+        } else {
+            document.documentElement.classList.add('dark');
+            localStorage.setItem('theme', 'dark');
         }
-    }
-});
+        updateThemeIcon();
+    });
 
-// Mobile menu toggle with transitions
-document.addEventListener('DOMContentLoaded', () => {
+    function updateThemeIcon() {
+        const isDark = document.documentElement.classList.contains('dark');
+        themeIcon.classList.remove('fa-sun', 'fa-moon');
+        themeIcon.classList.add(isDark ? 'fa-sun' : 'fa-moon');
+    }
+
+    // Mobile Menu Toggle
     const mobileMenuBtn = document.getElementById('mobileMenuBtn');
     const mobileMenu = document.getElementById('mobileMenu');
+    const menuIcon = mobileMenuBtn.querySelector('i');
 
-    if (mobileMenuBtn && mobileMenu) {
-        let isMenuOpen = false;
+    mobileMenu.style.display = 'none';
+    let isMenuOpen = false;
 
-        const toggleMenu = () => {
-            isMenuOpen = !isMenuOpen;
-            mobileMenu.classList.toggle('show', isMenuOpen);
-            mobileMenuBtn.setAttribute('aria-expanded', isMenuOpen.toString());
-            
-            // Update icon
-            const icon = mobileMenuBtn.querySelector('i');
-            icon.classList.remove(isMenuOpen ? 'fa-bars' : 'fa-times');
-            icon.classList.add(isMenuOpen ? 'fa-times' : 'fa-bars');
-        };
-
-        mobileMenuBtn.addEventListener('click', toggleMenu);
-
-        // Close menu when clicking outside
-        document.addEventListener('click', (e) => {
-            if (isMenuOpen && !mobileMenu.contains(e.target) && !mobileMenuBtn.contains(e.target)) {
-                toggleMenu();
-            }
-        });
-
-        // Close menu when pressing escape
-        document.addEventListener('keydown', (e) => {
-            if (isMenuOpen && e.key === 'Escape') {
-                toggleMenu();
-            }
-        });
-
-        // Handle viewport changes
-        const mediaQuery = window.matchMedia('(min-width: 1024px)');
-        mediaQuery.addEventListener('change', (e) => {
-            if (e.matches && isMenuOpen) {
-                toggleMenu();
-            }
-        });
-    }
-});
-
-// User dropdown toggle
-const userMenuBtn = document.getElementById('userMenuBtn');
-const userDropdown = document.getElementById('userDropdown');
-
-if (userMenuBtn && userDropdown) {
-    userMenuBtn.addEventListener('click', (e) => {
-        e.stopPropagation();
-        userDropdown.classList.toggle('active');
-    });
-
-    // Close dropdown when clicking outside
-    document.addEventListener('click', (e) => {
-        if (!userMenuBtn.contains(e.target) && !userDropdown.contains(e.target)) {
-            userDropdown.classList.remove('active');
-        }
-    });
-
-    // Close dropdown when pressing escape
-    document.addEventListener('keydown', (e) => {
-        if (e.key === 'Escape') {
-            userDropdown.classList.remove('active');
-        }
-    });
-}
-
-// Handle flash messages
-document.addEventListener('DOMContentLoaded', () => {
-    const alerts = document.querySelectorAll('.alert');
-    alerts.forEach(alert => {
-        setTimeout(() => {
-            alert.style.opacity = '0';
-            setTimeout(() => alert.remove(), 300);
-        }, 5000);
-    });
-});
-
-// Initialize tooltips
-document.addEventListener('DOMContentLoaded', () => {
-    const tooltips = document.querySelectorAll('[data-tooltip]');
-    tooltips.forEach(tooltip => {
-        tooltip.addEventListener('mouseenter', (e) => {
-            const text = e.target.getAttribute('data-tooltip');
-            const tooltipEl = document.createElement('div');
-            tooltipEl.className = 'absolute z-50 px-2 py-1 text-sm text-white bg-gray-900 rounded tooltip';
-            tooltipEl.textContent = text;
-            document.body.appendChild(tooltipEl);
-            
-            const rect = e.target.getBoundingClientRect();
-            tooltipEl.style.top = rect.bottom + 5 + 'px';
-            tooltipEl.style.left = rect.left + (rect.width - tooltipEl.offsetWidth) / 2 + 'px';
-        });
-        
-        tooltip.addEventListener('mouseleave', () => {
-            const tooltips = document.querySelectorAll('.tooltip');
-            tooltips.forEach(t => t.remove());
-        });
+    mobileMenuBtn.addEventListener('click', () => {
+        isMenuOpen = !isMenuOpen;
+        mobileMenu.style.display = isMenuOpen ? 'block' : 'none';
+        menuIcon.classList.remove('fa-bars', 'fa-times');
+        menuIcon.classList.add(isMenuOpen ? 'fa-times' : 'fa-bars');
     });
 });

static/js/park-map.js

@@ -1,29 +0,0 @@
-// Only declare parkMap if it doesn't exist
-window.parkMap = window.parkMap || null;
-
-function initParkMap(latitude, longitude, name) {
-    const mapContainer = document.getElementById('park-map');
-    
-    // Only initialize if container exists and map hasn't been initialized
-    if (mapContainer && !window.parkMap) {
-        const width = mapContainer.offsetWidth;
-        mapContainer.style.height = width + 'px';
-
-        window.parkMap = L.map('park-map').setView([latitude, longitude], 13);
-        
-        L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
-            attribution: '© OpenStreetMap contributors'
-        }).addTo(window.parkMap);
-
-        L.marker([latitude, longitude])
-         .addTo(window.parkMap)
-         .bindPopup(name);
-
-        // Update map size when window is resized
-        window.addEventListener('resize', function() {
-            const width = mapContainer.offsetWidth;
-            mapContainer.style.height = width + 'px';
-            window.parkMap.invalidateSize();
-        });
-    }
-}

static/js/photo-gallery.js

@@ -1,91 +0,0 @@
-document.addEventListener('alpine:init', () => {
-    Alpine.data('photoDisplay', ({ photos, contentType, objectId, csrfToken, uploadUrl }) => ({
-        photos,
-        fullscreenPhoto: null,
-        uploading: false,
-        uploadProgress: 0,
-        error: null,
-        showSuccess: false,
-
-        showFullscreen(photo) {
-            this.fullscreenPhoto = photo;
-        },
-
-        async handleFileSelect(event) {
-            const files = Array.from(event.target.files);
-            if (!files.length) {
-                return;
-            }
-
-            this.uploading = true;
-            this.uploadProgress = 0;
-            this.error = null;
-            this.showSuccess = false;
-
-            const totalFiles = files.length;
-            let completedFiles = 0;
-
-            for (const file of files) {
-                const formData = new FormData();
-                formData.append('image', file);
-                formData.append('app_label', contentType.split('.')[0]);
-                formData.append('model', contentType.split('.')[1]);
-                formData.append('object_id', objectId);
-
-                try {
-                    const response = await fetch(uploadUrl, {
-                        method: 'POST',
-                        headers: {
-                            'X-CSRFToken': csrfToken,
-                        },
-                        body: formData
-                    });
-
-                    if (!response.ok) {
-                        const data = await response.json();
-                        throw new Error(data.error || 'Upload failed');
-                    }
-
-                    const photo = await response.json();
-                    this.photos.push(photo);
-                    completedFiles++;
-                    this.uploadProgress = (completedFiles / totalFiles) * 100;
-                } catch (err) {
-                    this.error = err.message || 'Failed to upload photo. Please try again.';
-                    console.error('Upload error:', err);
-                    break;
-                }
-            }
-
-            this.uploading = false;
-            event.target.value = ''; // Reset file input
-
-            if (!this.error) {
-                this.showSuccess = true;
-                setTimeout(() => {
-                    this.showSuccess = false;
-                }, 3000);
-            }
-        },
-
-        async sharePhoto(photo) {
-            if (navigator.share) {
-                try {
-                    await navigator.share({
-                        title: photo.caption || 'Shared photo',
-                        url: photo.url
-                    });
-                } catch (err) {
-                    if (err.name !== 'AbortError') {
-                        console.error('Error sharing:', err);
-                    }
-                }
-            } else {
-                // Fallback: copy URL to clipboard
-                navigator.clipboard.writeText(photo.url)
-                    .then(() => alert('Photo URL copied to clipboard!'))
-                    .catch(err => console.error('Error copying to clipboard:', err));
-            }
-        }
-    }));
-});

static/js/search.js

@@ -1,42 +0,0 @@
-function parkSearch() {
-    return {
-        query: '',
-        results: [],
-        loading: false,
-        selectedId: null,
-        
-        async search() {
-            if (!this.query.trim()) {
-                this.results = [];
-                return;
-            }
-
-            this.loading = true;
-            try {
-                const response = await fetch(`/parks/suggest_parks/?search=${encodeURIComponent(this.query)}`);
-                const data = await response.json();
-                this.results = data.results;
-            } catch (error) {
-                console.error('Search failed:', error);
-                this.results = [];
-            } finally {
-                this.loading = false;
-            }
-        },
-
-        clear() {
-            this.query = '';
-            this.results = [];
-            this.selectedId = null;
-        },
-
-        selectPark(park) {
-            this.query = park.name;
-            this.selectedId = park.id;
-            this.results = [];
-            
-            // Trigger filter update
-            document.getElementById('park-filters').dispatchEvent(new Event('change'));
-        }
-    };
-}

staticfiles/css/alerts.css

@@ -1,44 +1,37 @@
-/* Alert Styles */
 .alert {
-    @apply fixed z-50 px-4 py-3 transition-all duration-500 transform rounded-lg shadow-lg right-4 top-4;
-    animation: slideIn 0.5s ease-out forwards;
+    padding: 1rem;
+    margin-bottom: 1rem;
+    border-radius: 0.375rem;
+    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
+    opacity: 1;
+    transition: opacity 0.3s ease-in-out;
+    cursor: pointer;
 }
 
 .alert-success {
-    @apply text-white bg-green-500;
+    background-color: #E8F5E9;
+    border: 1px solid #A5D6A7;
+    color: #2E7D32;
 }
 
 .alert-error {
-    @apply text-white bg-red-500;
-}
-
-.alert-info {
-    @apply text-white bg-blue-500;
+    background-color: #FFEBEE;
+    border: 1px solid #FFCDD2;
+    color: #C62828;
 }
 
 .alert-warning {
-    @apply text-white bg-yellow-500;
+    background-color: #FFF3E0;
+    border: 1px solid #FFCC80;
+    color: #EF6C00;
 }
 
-/* Animation keyframes */
-@keyframes slideIn {
-    0% {
-        transform: translateX(100%);
-        opacity: 0;
-    }
-    100% {
-        transform: translateX(0);
-        opacity: 1;
-    }
+.alert-info {
+    background-color: #E3F2FD;
+    border: 1px solid #90CAF9;
+    color: #1565C0;
 }
 
-@keyframes slideOut {
-    0% {
-        transform: translateX(0);
-        opacity: 1;
-    }
-    100% {
-        transform: translateX(100%);
-        opacity: 0;
-    }
+.alert.fade-out {
+    opacity: 0;
 }

staticfiles/css/tailwind.css

@@ -2181,6 +2181,18 @@ select {
   justify-content: center;
 }
 
+.sr-only {
+  position: absolute;
+  width: 1px;
+  height: 1px;
+  padding: 0;
+  margin: -1px;
+  overflow: hidden;
+  clip: rect(0, 0, 0, 0);
+  white-space: nowrap;
+  border-width: 0;
+}
+
 .visible {
   visibility: visible;
 }
@@ -2457,6 +2469,10 @@ select {
   display: none;
 }
 
+.h-10 {
+  height: 2.5rem;
+}
+
 .h-16 {
   height: 4rem;
 }
@@ -2485,6 +2501,10 @@ select {
   height: 1.25rem;
 }
 
+.h-6 {
+  height: 1.5rem;
+}
+
 .h-8 {
   height: 2rem;
 }
@@ -2533,6 +2553,10 @@ select {
   width: 1.25rem;
 }
 
+.w-6 {
+  width: 1.5rem;
+}
+
 .w-64 {
   width: 16rem;
 }
@@ -2646,6 +2670,16 @@ select {
   transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
 }
 
+@keyframes pulse {
+  50% {
+    opacity: .5;
+  }
+}
+
+.animate-pulse {
+  animation: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
+}
+
 @keyframes spin {
   to {
     transform: rotate(360deg);
@@ -3000,10 +3034,6 @@ select {
   background-color: rgb(17 24 39 / var(--tw-bg-opacity));
 }
 
-.bg-gray-900\/80 {
-  background-color: rgb(17 24 39 / 0.8);
-}
-
 .bg-green-100 {
   --tw-bg-opacity: 1;
   background-color: rgb(220 252 231 / var(--tw-bg-opacity));
@@ -3244,6 +3274,10 @@ select {
   padding-bottom: 1rem;
 }
 
+.pt-2 {
+  padding-top: 0.5rem;
+}
+
 .text-left {
   text-align: left;
 }
@@ -3335,6 +3369,11 @@ select {
   color: rgb(37 99 235 / var(--tw-text-opacity));
 }
 
+.text-blue-700 {
+  --tw-text-opacity: 1;
+  color: rgb(29 78 216 / var(--tw-text-opacity));
+}
+
 .text-blue-800 {
   --tw-text-opacity: 1;
   color: rgb(30 64 175 / var(--tw-text-opacity));
@@ -3405,6 +3444,11 @@ select {
   color: rgb(79 70 229 / var(--tw-text-opacity));
 }
 
+.text-red-100 {
+  --tw-text-opacity: 1;
+  color: rgb(254 226 226 / var(--tw-text-opacity));
+}
+
 .text-red-400 {
   --tw-text-opacity: 1;
   color: rgb(248 113 113 / var(--tw-text-opacity));
@@ -3507,6 +3551,11 @@ select {
   box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
 }
 
+.outline-none {
+  outline: 2px solid transparent;
+  outline-offset: 2px;
+}
+
 .ring-2 {
   --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
   --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);
@@ -3522,6 +3571,19 @@ select {
   --tw-ring-color: rgb(79 70 229 / 0.2);
 }
 
+.ring-offset-2 {
+  --tw-ring-offset-width: 2px;
+}
+
+.ring-offset-white {
+  --tw-ring-offset-color: #fff;
+}
+
+.blur {
+  --tw-blur: blur(8px);
+  filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
+}
+
 .filter {
   filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
 }
@@ -3796,6 +3858,11 @@ select {
   border-color: rgb(59 130 246 / var(--tw-border-opacity));
 }
 
+.focus\:bg-gray-100:focus {
+  --tw-bg-opacity: 1;
+  background-color: rgb(243 244 246 / var(--tw-bg-opacity));
+}
+
 .focus\:underline:focus {
   text-decoration-line: underline;
 }
@@ -3824,6 +3891,10 @@ select {
   --tw-ring-offset-width: 2px;
 }
 
+.active\:transform:active {
+  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
+}
+
 .disabled\:opacity-50:disabled {
   opacity: 0.5;
 }
@@ -3930,6 +4001,10 @@ select {
   background-color: rgb(185 28 28 / var(--tw-bg-opacity));
 }
 
+.dark\:bg-red-900\/40:is(.dark *) {
+  background-color: rgb(127 29 29 / 0.4);
+}
+
 .dark\:bg-yellow-200:is(.dark *) {
   --tw-bg-opacity: 1;
   background-color: rgb(254 240 138 / var(--tw-bg-opacity));
@@ -3968,6 +4043,11 @@ select {
   --tw-gradient-to: #3b0764 var(--tw-gradient-to-position);
 }
 
+.dark\:text-blue-100:is(.dark *) {
+  --tw-text-opacity: 1;
+  color: rgb(219 234 254 / var(--tw-text-opacity));
+}
+
 .dark\:text-blue-200:is(.dark *) {
   --tw-text-opacity: 1;
   color: rgb(191 219 254 / var(--tw-text-opacity));
@@ -4190,6 +4270,11 @@ select {
   color: rgb(255 255 255 / var(--tw-text-opacity));
 }
 
+.dark\:focus\:bg-gray-700:focus:is(.dark *) {
+  --tw-bg-opacity: 1;
+  background-color: rgb(55 65 81 / var(--tw-bg-opacity));
+}
+
 @media (min-width: 640px) {
   .sm\:col-span-3 {
     grid-column: span 3 / span 3;
@@ -4297,10 +4382,26 @@ select {
     grid-column: span 2 / span 2;
   }
 
+  .md\:col-span-3 {
+    grid-column: span 3 / span 3;
+  }
+
   .md\:mb-8 {
     margin-bottom: 2rem;
   }
 
+  .md\:block {
+    display: block;
+  }
+
+  .md\:grid {
+    display: grid;
+  }
+
+  .md\:hidden {
+    display: none;
+  }
+
   .md\:h-\[140px\] {
     height: 140px;
   }

staticfiles/js/alerts.js

@@ -1,18 +1,21 @@
-document.addEventListener('DOMContentLoaded', function() {
-    // Get all alert elements
+document.addEventListener('DOMContentLoaded', () => {
     const alerts = document.querySelectorAll('.alert');
 
-    // For each alert
     alerts.forEach(alert => {
-        // After 5 seconds
+        // Auto-hide alerts after 5 seconds
         setTimeout(() => {
-            // Add slideOut animation
-            alert.style.animation = 'slideOut 0.5s ease-out forwards';
-            
-            // Remove the alert after animation completes
+            alert.classList.add('fade-out');
             setTimeout(() => {
                 alert.remove();
-            }, 500);
+            }, 300); // Match CSS transition duration
         }, 5000);
+
+        // Add click-to-dismiss functionality
+        alert.addEventListener('click', () => {
+            alert.classList.add('fade-out');
+            setTimeout(() => {
+                alert.remove();
+            }, 300);
+        });
     });
 });

staticfiles/js/inline-edit.js

@@ -1,262 +0,0 @@
-document.addEventListener('DOMContentLoaded', function() {
-    // Handle edit button clicks
-    document.querySelectorAll('[data-edit-button]').forEach(button => {
-        button.addEventListener('click', function() {
-            const contentId = this.dataset.contentId;
-            const contentType = this.dataset.contentType;
-            const editableFields = document.querySelectorAll(`[data-editable][data-content-id="${contentId}"]`);
-            
-            // Toggle edit mode
-            editableFields.forEach(field => {
-                const currentValue = field.textContent.trim();
-                const fieldName = field.dataset.fieldName;
-                const fieldType = field.dataset.fieldType || 'text';
-                
-                // Create input field
-                let input;
-                if (fieldType === 'textarea') {
-                    input = document.createElement('textarea');
-                    input.value = currentValue;
-                    input.rows = 4;
-                } else if (fieldType === 'select') {
-                    input = document.createElement('select');
-                    // Get options from data attribute
-                    const options = JSON.parse(field.dataset.options || '[]');
-                    options.forEach(option => {
-                        const optionEl = document.createElement('option');
-                        optionEl.value = option.value;
-                        optionEl.textContent = option.label;
-                        optionEl.selected = option.value === currentValue;
-                        input.appendChild(optionEl);
-                    });
-                } else if (fieldType === 'date') {
-                    input = document.createElement('input');
-                    input.type = 'date';
-                    input.value = currentValue;
-                } else if (fieldType === 'number') {
-                    input = document.createElement('input');
-                    input.type = 'number';
-                    input.value = currentValue;
-                    if (field.dataset.min) input.min = field.dataset.min;
-                    if (field.dataset.max) input.max = field.dataset.max;
-                    if (field.dataset.step) input.step = field.dataset.step;
-                } else {
-                    input = document.createElement('input');
-                    input.type = fieldType;
-                    input.value = currentValue;
-                }
-                
-                input.className = 'w-full border-gray-300 rounded-lg form-input dark:border-gray-600 dark:bg-gray-700 dark:text-white';
-                input.dataset.originalValue = currentValue;
-                input.dataset.fieldName = fieldName;
-                
-                // Replace content with input
-                field.textContent = '';
-                field.appendChild(input);
-            });
-            
-            // Show save/cancel buttons
-            const actionButtons = document.createElement('div');
-            actionButtons.className = 'flex gap-2 mt-2';
-            actionButtons.innerHTML = `
-                <button class="px-4 py-2 text-white bg-blue-600 rounded-lg hover:bg-blue-700 dark:bg-blue-500 dark:hover:bg-blue-600" data-save-button>
-                    <i class="mr-2 fas fa-save"></i>Save Changes
-                </button>
-                <button class="px-4 py-2 text-gray-700 bg-gray-200 rounded-lg hover:bg-gray-300 dark:bg-gray-600 dark:text-gray-200 dark:hover:bg-gray-500" data-cancel-button>
-                    <i class="mr-2 fas fa-times"></i>Cancel
-                </button>
-                ${this.dataset.requireReason ? `
-                    <div class="flex-grow">
-                        <input type="text" class="w-full border-gray-300 rounded-lg form-input dark:border-gray-600 dark:bg-gray-700 dark:text-white" 
-                               placeholder="Reason for changes (required)" 
-                               data-reason-input>
-                        <input type="text" class="w-full mt-1 border-gray-300 rounded-lg form-input dark:border-gray-600 dark:bg-gray-700 dark:text-white" 
-                               placeholder="Source (optional)" 
-                               data-source-input>
-                    </div>
-                ` : ''}
-            `;
-            
-            const container = editableFields[0].closest('.editable-container');
-            container.appendChild(actionButtons);
-            
-            // Hide edit button while editing
-            this.style.display = 'none';
-        });
-    });
-    
-    // Handle form submissions
-    document.querySelectorAll('form[data-submit-type]').forEach(form => {
-        form.addEventListener('submit', function(e) {
-            e.preventDefault();
-            
-            const submitType = this.dataset.submitType;
-            const formData = new FormData(this);
-            const data = {};
-            
-            formData.forEach((value, key) => {
-                data[key] = value;
-            });
-            
-            // Get CSRF token from meta tag
-            const csrfToken = document.querySelector('meta[name="csrf-token"]').getAttribute('content');
-            
-            // Submit form
-            fetch(this.action, {
-                method: 'POST',
-                headers: {
-                    'Content-Type': 'application/json',
-                    'X-CSRFToken': csrfToken
-                },
-                body: JSON.stringify({
-                    submission_type: submitType,
-                    ...data
-                })
-            })
-            .then(response => response.json())
-            .then(data => {
-                if (data.status === 'success') {
-                    showNotification(data.message, 'success');
-                    if (data.redirect_url) {
-                        window.location.href = data.redirect_url;
-                    }
-                } else {
-                    showNotification(data.message, 'error');
-                }
-            })
-            .catch(error => {
-                showNotification('An error occurred while submitting the form.', 'error');
-                console.error('Error:', error);
-            });
-        });
-    });
-    
-    // Handle save button clicks using event delegation
-    document.addEventListener('click', function(e) {
-        if (e.target.matches('[data-save-button]')) {
-            const container = e.target.closest('.editable-container');
-            const contentId = container.querySelector('[data-editable]').dataset.contentId;
-            const contentType = container.querySelector('[data-edit-button]').dataset.contentType;
-            const editableFields = container.querySelectorAll('[data-editable]');
-            
-            // Collect changes
-            const changes = {};
-            editableFields.forEach(field => {
-                const input = field.querySelector('input, textarea, select');
-                if (input && input.value !== input.dataset.originalValue) {
-                    changes[input.dataset.fieldName] = input.value;
-                }
-            });
-            
-            // If no changes, just cancel
-            if (Object.keys(changes).length === 0) {
-                cancelEdit(container);
-                return;
-            }
-            
-            // Get reason and source if required
-            const reasonInput = container.querySelector('[data-reason-input]');
-            const sourceInput = container.querySelector('[data-source-input]');
-            const reason = reasonInput ? reasonInput.value : '';
-            const source = sourceInput ? sourceInput.value : '';
-            
-            // Validate reason if required
-            if (reasonInput && !reason) {
-                alert('Please provide a reason for your changes.');
-                return;
-            }
-            
-            // Get CSRF token from meta tag
-            const csrfToken = document.querySelector('meta[name="csrf-token"]').getAttribute('content');
-            
-            // Submit changes
-            fetch(window.location.pathname, {
-                method: 'POST',
-                headers: {
-                    'Content-Type': 'application/json',
-                    'X-CSRFToken': csrfToken
-                },
-                body: JSON.stringify({
-                    content_type: contentType,
-                    content_id: contentId,
-                    changes,
-                    reason,
-                    source
-                })
-            })
-            .then(response => response.json())
-            .then(data => {
-                if (data.status === 'success') {
-                    if (data.auto_approved) {
-                        // Update the display immediately
-                        Object.entries(changes).forEach(([field, value]) => {
-                            const element = container.querySelector(`[data-editable][data-field-name="${field}"]`);
-                            if (element) {
-                                element.textContent = value;
-                            }
-                        });
-                    }
-                    showNotification(data.message, 'success');
-                    if (data.redirect_url) {
-                        window.location.href = data.redirect_url;
-                    }
-                } else {
-                    showNotification(data.message, 'error');
-                }
-                cancelEdit(container);
-            })
-            .catch(error => {
-                showNotification('An error occurred while saving changes.', 'error');
-                console.error('Error:', error);
-                cancelEdit(container);
-            });
-        }
-    });
-    
-    // Handle cancel button clicks using event delegation
-    document.addEventListener('click', function(e) {
-        if (e.target.matches('[data-cancel-button]')) {
-            const container = e.target.closest('.editable-container');
-            cancelEdit(container);
-        }
-    });
-});
-
-function cancelEdit(container) {
-    // Restore original content
-    container.querySelectorAll('[data-editable]').forEach(field => {
-        const input = field.querySelector('input, textarea, select');
-        if (input) {
-            field.textContent = input.dataset.originalValue;
-        }
-    });
-    
-    // Remove action buttons
-    const actionButtons = container.querySelector('.flex.gap-2');
-    if (actionButtons) {
-        actionButtons.remove();
-    }
-    
-    // Show edit button
-    const editButton = container.querySelector('[data-edit-button]');
-    if (editButton) {
-        editButton.style.display = '';
-    }
-}
-
-function showNotification(message, type = 'info') {
-    const notification = document.createElement('div');
-    notification.className = `fixed bottom-4 right-4 p-4 rounded-lg shadow-lg text-white ${
-        type === 'success' ? 'bg-green-600 dark:bg-green-500' :
-        type === 'error' ? 'bg-red-600 dark:bg-red-500' :
-        'bg-blue-600 dark:bg-blue-500'
-    }`;
-    notification.textContent = message;
-    
-    document.body.appendChild(notification);
-    
-    // Remove after 5 seconds
-    setTimeout(() => {
-        notification.remove();
-    }, 5000);
-}

staticfiles/js/location-autocomplete.js

@@ -1,81 +0,0 @@
-function locationAutocomplete(field, filterParks = false) {
-    return {
-        query: '',
-        suggestions: [],
-        fetchSuggestions() {
-            let url;
-            const params = new URLSearchParams({
-                q: this.query,
-                filter_parks: filterParks
-            });
-
-            switch (field) {
-                case 'country':
-                    url = '/parks/ajax/countries/';
-                    break;
-                case 'region':
-                    url = '/parks/ajax/regions/';
-                    // Add country parameter if we're fetching regions
-                    const countryInput = document.getElementById(filterParks ? 'country' : 'id_country_name');
-                    if (countryInput && countryInput.value) {
-                        params.append('country', countryInput.value);
-                    }
-                    break;
-                case 'city':
-                    url = '/parks/ajax/cities/';
-                    // Add country and region parameters if we're fetching cities
-                    const regionInput = document.getElementById(filterParks ? 'region' : 'id_region_name');
-                    const cityCountryInput = document.getElementById(filterParks ? 'country' : 'id_country_name');
-                    if (regionInput && regionInput.value && cityCountryInput && cityCountryInput.value) {
-                        params.append('country', cityCountryInput.value);
-                        params.append('region', regionInput.value);
-                    }
-                    break;
-            }
-
-            if (url) {
-                fetch(`${url}?${params}`)
-                    .then(response => response.json())
-                    .then(data => {
-                        this.suggestions = data;
-                    });
-            }
-        },
-        selectSuggestion(suggestion) {
-            this.query = suggestion.name;
-            this.suggestions = [];
-
-            // If this is a form field (not filter), update hidden fields
-            if (!filterParks) {
-                const hiddenField = document.getElementById(`id_${field}`);
-                if (hiddenField) {
-                    hiddenField.value = suggestion.id;
-                }
-
-                // Clear dependent fields when parent field changes
-                if (field === 'country') {
-                    const regionInput = document.getElementById('id_region_name');
-                    const cityInput = document.getElementById('id_city_name');
-                    const regionHidden = document.getElementById('id_region');
-                    const cityHidden = document.getElementById('id_city');
-                    
-                    if (regionInput) regionInput.value = '';
-                    if (cityInput) cityInput.value = '';
-                    if (regionHidden) regionHidden.value = '';
-                    if (cityHidden) cityHidden.value = '';
-                } else if (field === 'region') {
-                    const cityInput = document.getElementById('id_city_name');
-                    const cityHidden = document.getElementById('id_city');
-                    
-                    if (cityInput) cityInput.value = '';
-                    if (cityHidden) cityHidden.value = '';
-                }
-            }
-
-            // Trigger form submission for filters
-            if (filterParks) {
-                htmx.trigger('#park-filters', 'change');
-            }
-        }
-    };
-}

staticfiles/js/main.js

@@ -1,79 +1,40 @@
-// Initialize dark mode from localStorage
+// Theme Toggle
 document.addEventListener('DOMContentLoaded', () => {
-    // Check if dark mode was previously enabled
-    const darkMode = localStorage.getItem('darkMode') === 'true';
-    if (darkMode) {
-        document.documentElement.classList.add('dark');
-    }
-});
+    const themeToggle = document.getElementById('theme-toggle');
+    const themeIcon = themeToggle.nextElementSibling.querySelector('i');
 
-// Handle search form submission
-document.addEventListener('submit', (e) => {
-    if (e.target.matches('form[action*="search"]')) {
-        const searchInput = e.target.querySelector('input[name="q"]');
-        if (!searchInput.value.trim()) {
-            e.preventDefault();
+    // Set initial icon
+    updateThemeIcon();
+
+    themeToggle.addEventListener('change', () => {
+        if (document.documentElement.classList.contains('dark')) {
+            document.documentElement.classList.remove('dark');
+            localStorage.setItem('theme', 'light');
+        } else {
+            document.documentElement.classList.add('dark');
+            localStorage.setItem('theme', 'dark');
         }
+        updateThemeIcon();
+    });
+
+    function updateThemeIcon() {
+        const isDark = document.documentElement.classList.contains('dark');
+        themeIcon.classList.remove('fa-sun', 'fa-moon');
+        themeIcon.classList.add(isDark ? 'fa-sun' : 'fa-moon');
     }
-});
 
-// Close mobile menu when clicking outside
-document.addEventListener('click', (e) => {
-    const mobileMenu = document.querySelector('[x-show="mobileMenuOpen"]');
-    const menuButton = document.querySelector('[x-on\\:click="mobileMenuOpen = !mobileMenuOpen"]');
+    // Mobile Menu Toggle
+    const mobileMenuBtn = document.getElementById('mobileMenuBtn');
+    const mobileMenu = document.getElementById('mobileMenu');
+    const menuIcon = mobileMenuBtn.querySelector('i');
 
-    if (mobileMenu && menuButton && !mobileMenu.contains(e.target) && !menuButton.contains(e.target)) {
-        const alpineData = mobileMenu._x_dataStack && mobileMenu._x_dataStack[0];
-        if (alpineData && alpineData.mobileMenuOpen) {
-            alpineData.mobileMenuOpen = false;
-        }
-    }
-});
+    mobileMenu.style.display = 'none';
+    let isMenuOpen = false;
 
-// Handle flash messages
-document.addEventListener('DOMContentLoaded', () => {
-    const alerts = document.querySelectorAll('.alert');
-    alerts.forEach(alert => {
-        setTimeout(() => {
-            alert.style.opacity = '0';
-            setTimeout(() => alert.remove(), 300);
-        }, 5000);
-    });
-});
-
-// Initialize tooltips
-document.addEventListener('DOMContentLoaded', () => {
-    const tooltips = document.querySelectorAll('[data-tooltip]');
-    tooltips.forEach(tooltip => {
-        tooltip.addEventListener('mouseenter', (e) => {
-            const text = e.target.getAttribute('data-tooltip');
-            const tooltipEl = document.createElement('div');
-            tooltipEl.className = 'tooltip bg-gray-900 text-white px-2 py-1 rounded text-sm absolute z-50';
-            tooltipEl.textContent = text;
-            document.body.appendChild(tooltipEl);
-            
-            const rect = e.target.getBoundingClientRect();
-            tooltipEl.style.top = rect.bottom + 5 + 'px';
-            tooltipEl.style.left = rect.left + (rect.width - tooltipEl.offsetWidth) / 2 + 'px';
-        });
-        
-        tooltip.addEventListener('mouseleave', () => {
-            const tooltips = document.querySelectorAll('.tooltip');
-            tooltips.forEach(t => t.remove());
-        });
-    });
-});
-
-// Handle dropdown menus
-document.addEventListener('click', (e) => {
-    const dropdowns = document.querySelectorAll('[x-show]');
-    dropdowns.forEach(dropdown => {
-        if (!dropdown.contains(e.target) && 
-            !e.target.matches('[x-on\\:click*="open = !open"]')) {
-            const alpineData = dropdown._x_dataStack && dropdown._x_dataStack[0];
-            if (alpineData && alpineData.open) {
-                alpineData.open = false;
-            }
-        }
+    mobileMenuBtn.addEventListener('click', () => {
+        isMenuOpen = !isMenuOpen;
+        mobileMenu.style.display = isMenuOpen ? 'block' : 'none';
+        menuIcon.classList.remove('fa-bars', 'fa-times');
+        menuIcon.classList.add(isMenuOpen ? 'fa-times' : 'fa-bars');
     });
 });

staticfiles/js/park-map.js

@@ -1,28 +0,0 @@
-let parkMap = null;
-
-function initParkMap(latitude, longitude, name) {
-    const mapContainer = document.getElementById('park-map');
-    
-    // Only initialize if container exists and map hasn't been initialized
-    if (mapContainer && !parkMap) {
-        const width = mapContainer.offsetWidth;
-        mapContainer.style.height = width + 'px';
-
-        parkMap = L.map('park-map').setView([latitude, longitude], 13);
-        
-        L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {
-            attribution: '© OpenStreetMap contributors'
-        }).addTo(parkMap);
-
-        L.marker([latitude, longitude])
-         .addTo(parkMap)
-         .bindPopup(name);
-
-        // Update map size when window is resized
-        window.addEventListener('resize', function() {
-            const width = mapContainer.offsetWidth;
-            mapContainer.style.height = width + 'px';
-            parkMap.invalidateSize();
-        });
-    }
-}

staticfiles/js/photo-gallery.js

@@ -1,91 +0,0 @@
-document.addEventListener('alpine:init', () => {
-    Alpine.data('photoDisplay', ({ photos, contentType, objectId, csrfToken, uploadUrl }) => ({
-        photos,
-        fullscreenPhoto: null,
-        uploading: false,
-        uploadProgress: 0,
-        error: null,
-        showSuccess: false,
-
-        showFullscreen(photo) {
-            this.fullscreenPhoto = photo;
-        },
-
-        async handleFileSelect(event) {
-            const files = Array.from(event.target.files);
-            if (!files.length) {
-                return;
-            }
-
-            this.uploading = true;
-            this.uploadProgress = 0;
-            this.error = null;
-            this.showSuccess = false;
-
-            const totalFiles = files.length;
-            let completedFiles = 0;
-
-            for (const file of files) {
-                const formData = new FormData();
-                formData.append('image', file);
-                formData.append('app_label', contentType.split('.')[0]);
-                formData.append('model', contentType.split('.')[1]);
-                formData.append('object_id', objectId);
-
-                try {
-                    const response = await fetch(uploadUrl, {
-                        method: 'POST',
-                        headers: {
-                            'X-CSRFToken': csrfToken,
-                        },
-                        body: formData
-                    });
-
-                    if (!response.ok) {
-                        const data = await response.json();
-                        throw new Error(data.error || 'Upload failed');
-                    }
-
-                    const photo = await response.json();
-                    this.photos.push(photo);
-                    completedFiles++;
-                    this.uploadProgress = (completedFiles / totalFiles) * 100;
-                } catch (err) {
-                    this.error = err.message || 'Failed to upload photo. Please try again.';
-                    console.error('Upload error:', err);
-                    break;
-                }
-            }
-
-            this.uploading = false;
-            event.target.value = ''; // Reset file input
-
-            if (!this.error) {
-                this.showSuccess = true;
-                setTimeout(() => {
-                    this.showSuccess = false;
-                }, 3000);
-            }
-        },
-
-        async sharePhoto(photo) {
-            if (navigator.share) {
-                try {
-                    await navigator.share({
-                        title: photo.caption || 'Shared photo',
-                        url: photo.url
-                    });
-                } catch (err) {
-                    if (err.name !== 'AbortError') {
-                        console.error('Error sharing:', err);
-                    }
-                }
-            } else {
-                // Fallback: copy URL to clipboard
-                navigator.clipboard.writeText(photo.url)
-                    .then(() => alert('Photo URL copied to clipboard!'))
-                    .catch(err => console.error('Error copying to clipboard:', err));
-            }
-        }
-    }));
-});

staticfiles/parks/css/search.css

@@ -0,0 +1,134 @@
+/* Loading states */
+.htmx-request .htmx-indicator {
+    opacity: 1;
+}
+.htmx-request.htmx-indicator {
+    opacity: 1;
+}
+.htmx-indicator {
+    opacity: 0;
+    transition: opacity 200ms ease-in-out;
+}
+
+/* Results container transitions */
+#park-results {
+    transition: opacity 200ms ease-in-out;
+}
+.htmx-request #park-results {
+    opacity: 0.7;
+}
+.htmx-settling #park-results {
+    opacity: 1;
+}
+
+/* Grid/List transitions */
+.park-card {
+    transition: all 200ms cubic-bezier(0.4, 0, 0.2, 1);
+    position: relative;
+    background-color: white;
+    border-radius: 0.5rem;
+    border: 1px solid #e5e7eb;
+}
+
+/* Grid view styles */
+.park-card[data-view-mode="grid"] {
+    display: flex;
+    flex-direction: column;
+}
+.park-card[data-view-mode="grid"]:hover {
+    transform: translateY(-2px);
+    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
+}
+
+/* List view styles */
+.park-card[data-view-mode="list"] {
+    display: flex;
+    gap: 1rem;
+    padding: 1rem;
+}
+.park-card[data-view-mode="list"]:hover {
+    background-color: #f9fafb;
+}
+
+/* Image containers */
+.park-card .image-container {
+    position: relative;
+    overflow: hidden;
+}
+.park-card[data-view-mode="grid"] .image-container {
+    aspect-ratio: 16 / 9;
+    width: 100%;
+}
+.park-card[data-view-mode="list"] .image-container {
+    width: 6rem;
+    height: 6rem;
+    flex-shrink: 0;
+}
+
+/* Content */
+.park-card .content {
+    display: flex;
+    flex-direction: column;
+    flex: 1;
+    min-width: 0; /* Enables text truncation in flex child */
+}
+
+/* Status badges */
+.park-card .status-badge {
+    transition: all 150ms ease-in-out;
+}
+.park-card:hover .status-badge {
+    transform: scale(1.05);
+}
+
+/* Images */
+.park-card img {
+    transition: transform 200ms ease-in-out;
+    object-fit: cover;
+    width: 100%;
+    height: 100%;
+}
+.park-card:hover img {
+    transform: scale(1.05);
+}
+
+/* Placeholders for missing images */
+.park-card .placeholder {
+    background: linear-gradient(110deg, #ececec 8%, #f5f5f5 18%, #ececec 33%);
+    background-size: 200% 100%;
+    animation: shimmer 1.5s linear infinite;
+}
+
+@keyframes shimmer {
+    to {
+        background-position: 200% center;
+    }
+}
+
+/* Dark mode */
+@media (prefers-color-scheme: dark) {
+    .park-card {
+        background-color: #1f2937;
+        border-color: #374151;
+    }
+    
+    .park-card[data-view-mode="list"]:hover {
+        background-color: #374151;
+    }
+    
+    .park-card .text-gray-900 {
+        color: #f3f4f6;
+    }
+    
+    .park-card .text-gray-500 {
+        color: #9ca3af;
+    }
+    
+    .park-card .placeholder {
+        background: linear-gradient(110deg, #2d3748 8%, #374151 18%, #2d3748 33%);
+    }
+    
+    .park-card[data-view-mode="list"]:hover {
+        background-color: #374151;
+    }
+}

staticfiles/parks/js/search.js

@@ -0,0 +1,69 @@
+// Handle view mode persistence across HTMX requests
+document.addEventListener('htmx:configRequest', function(evt) {
+    // Preserve view mode
+    const parkResults = document.getElementById('park-results');
+    if (parkResults) {
+        const viewMode = parkResults.getAttribute('data-view-mode');
+        if (viewMode) {
+            evt.detail.parameters['view_mode'] = viewMode;
+        }
+    }
+
+    // Preserve search terms
+    const searchInput = document.getElementById('search');
+    if (searchInput && searchInput.value) {
+        evt.detail.parameters['search'] = searchInput.value;
+    }
+});
+
+// Handle loading states
+document.addEventListener('htmx:beforeRequest', function(evt) {
+    const target = evt.detail.target;
+    if (target) {
+        target.classList.add('htmx-requesting');
+    }
+});
+
+document.addEventListener('htmx:afterRequest', function(evt) {
+    const target = evt.detail.target;
+    if (target) {
+        target.classList.remove('htmx-requesting');
+    }
+});
+
+// Handle history navigation
+document.addEventListener('htmx:historyRestore', function(evt) {
+    const parkResults = document.getElementById('park-results');
+    if (parkResults && evt.detail.path) {
+        const url = new URL(evt.detail.path, window.location.origin);
+        const viewMode = url.searchParams.get('view_mode');
+        if (viewMode) {
+            parkResults.setAttribute('data-view-mode', viewMode);
+        }
+    }
+});
+
+// Initialize lazy loading for images
+function initializeLazyLoading(container) {
+    if (!('IntersectionObserver' in window)) return;
+
+    const imageObserver = new IntersectionObserver((entries) => {
+        entries.forEach(entry => {
+            if (entry.isIntersecting) {
+                const img = entry.target;
+                img.src = img.dataset.src;
+                img.removeAttribute('data-src');
+                imageObserver.unobserve(img);
+            }
+        });
+    });
+
+    container.querySelectorAll('img[data-src]').forEach(img => {
+        imageObserver.observe(img);
+    });
+}
+
+// Initialize lazy loading after HTMX content swaps
+document.addEventListener('htmx:afterSwap', function(evt) {
+    initializeLazyLoading(evt.detail.target);
+});

templates/base/base.html

@@ -31,7 +31,7 @@
     <script src="https://unpkg.com/htmx.org@1.9.6"></script>
 
     <!-- Alpine.js -->
-    <script defer src="{% static 'js/alpine.min.js' %}"></script>
+    <script defer src="https://unpkg.com/alpinejs@3.x.x/dist/cdn.min.js"></script>
 
     <!-- Location Autocomplete -->
     <script src="{% static 'js/location-autocomplete.js' %}"></script>

thrillwiki-nextjs-development-prompt.md

@@ -1,310 +0,0 @@
-# ThrillWiki Next.js Development Prompt
-
-## Project Overview
-Build a comprehensive theme park and ride database platform using Next.js. ThrillWiki is a community-driven platform where enthusiasts can discover parks, explore rides, share reviews, and contribute to a moderated knowledge base about theme parks worldwide.
-
-## Core Application Domain
-
-### Primary Entities
-- **Parks**: Theme parks, amusement parks, water parks with detailed information, locations, operating details
-- **Rides**: Individual ride installations with technical specifications, manufacturer details, operational status
-- **Companies**: Manufacturers, operators, designers, property owners with different roles
-- **Users**: Community members with profiles, preferences, reviews, and top lists
-- **Reviews**: User-generated content with ratings, media, and moderation workflow
-- **Locations**: Geographic data for parks and rides with PostGIS-style coordinate handling
-
-### Key Relationships
-- Parks contain multiple rides and are operated by companies
-- Rides belong to parks, have manufacturers/designers, and reference ride models
-- Ride models are templates created by manufacturers with technical specifications
-- Users create reviews for parks and rides, maintain top lists, have notification preferences
-- Companies have multiple roles (manufacturer, operator, designer, property owner)
-- All content goes through moderation workflows before publication
-
-## User Personas & Workflows
-
-### Theme Park Enthusiasts
-- Browse and discover parks by location, type, and features
-- Search for specific rides and view detailed technical specifications
-- Plan park visits with operating information and ride availability
-- Track personal ride credits and maintain top lists
-- Read authentic reviews from other enthusiasts
-
-### Content Contributors
-- Submit new park and ride information for moderation
-- Upload photos with proper attribution and categorization
-- Write detailed reviews with ratings and media attachments
-- Maintain personal profiles with ride statistics and achievements
-- Participate in community discussions and rankings
-
-### Park Industry Professionals
-- Maintain verified company profiles with official information
-- Update park operating details, ride status, and announcements
-- Access analytics and engagement metrics for their properties
-- Manage official media and promotional content
-
-## Core Features to Implement
-
-### 1. Park Discovery & Information System
-- **Park Listings**: Filterable grid/list views with search, location-based filtering, park type categories
-- **Park Detail Pages**: Comprehensive information including rides list, operating hours, location maps, photo galleries
-- **Interactive Maps**: Geographic visualization of parks with clustering, zoom controls, and location-based search
-- **Advanced Search**: Multi-criteria search across parks, rides, locations, and companies
-
-### 2. Ride Database & Technical Specifications
-- **Ride Catalog**: Comprehensive database with manufacturer information, technical specs, operational history
-- **Ride Detail Pages**: In-depth information including statistics, photos, reviews, and related rides
-- **Manufacturer Profiles**: Company information with ride model catalogs and installation history
-- **Technical Comparisons**: Side-by-side ride comparisons with filterable specifications
-
-### 3. User-Generated Content System
-- **Review Platform**: Structured review forms with ratings, text, photo uploads, and helpful voting
-- **Photo Management**: Upload system with automatic optimization, categorization, and attribution tracking
-- **Top Lists**: Personal ranking systems for rides, parks, and experiences with drag-and-drop reordering
-- **User Profiles**: Personal statistics, ride credits, achievement tracking, and social features
-
-### 4. Content Moderation Workflow
-- **Submission Queue**: Administrative interface for reviewing user-submitted content
-- **Approval Process**: Multi-stage review with rejection reasons, feedback, and resubmission options
-- **Quality Control**: Automated checks for duplicate content, inappropriate material, and data validation
-- **User Management**: Moderation tools for user accounts, banning, and content removal
-
-### 5. Location & Geographic Services
-- **Location Search**: Address-based search with autocomplete and geographic boundaries
-- **Proximity Features**: Find nearby parks, distance calculations, and regional groupings
-- **Map Integration**: Interactive maps with custom markers, clustering, and detailed overlays
-- **Geographic Filtering**: Location-based content filtering and discovery
-
-## Technical Architecture Requirements
-
-### Frontend Stack
-- **Next.js 14+** with App Router for modern React development
-- **TypeScript** for type safety and better developer experience
-- **Tailwind CSS** for utility-first styling and responsive design
-- **Shadcn/ui** for consistent, accessible component library
-- **React Hook Form** with Zod validation for form handling
-- **TanStack Query** for server state management and caching
-- **Zustand** for client-side state management
-- **Next-Auth** for authentication and session management
-
-### Data Management
-- **API Integration**: RESTful API consumption with comprehensive error handling
-- **Image Optimization**: Cloudflare Images integration with multiple variants
-- **Caching Strategy**: Multi-level caching with SWR patterns and cache invalidation
-- **Search Implementation**: Client-side and server-side search with debouncing
-- **Infinite Scrolling**: Performance-optimized pagination for large datasets
-
-### UI/UX Patterns
-- **Responsive Design**: Mobile-first approach with tablet and desktop optimizations
-- **Dark/Light Themes**: User preference-based theming with system detection
-- **Loading States**: Skeleton screens, progressive loading, and optimistic updates
-- **Error Boundaries**: Graceful error handling with user-friendly messages
-- **Accessibility**: WCAG compliance with keyboard navigation and screen reader support
-
-## Key Components to Build
-
-### Layout & Navigation
-- **Header Component**: Logo, navigation menu, user authentication, search bar, theme toggle
-- **Sidebar Navigation**: Collapsible menu with user context and quick actions
-- **Footer Component**: Links, social media, legal information, and site statistics
-- **Breadcrumb Navigation**: Contextual navigation with proper hierarchy
-
-### Park Components
-- **ParkCard**: Compact park information with image, basic details, and quick actions
-- **ParkGrid**: Responsive grid layout with filtering and sorting options
-- **ParkDetail**: Comprehensive park information with tabbed sections
-- **ParkMap**: Interactive map showing park location and nearby attractions
-- **OperatingHours**: Dynamic display of park hours with seasonal variations
-
-### Ride Components
-- **RideCard**: Ride preview with key specifications and ratings
-- **RideList**: Filterable list with sorting and search capabilities
-- **RideDetail**: Complete ride information with technical specifications
-- **RideStats**: Visual representation of ride statistics and comparisons
-- **RidePhotos**: Photo gallery with lightbox and attribution information
-
-### User Interface Components
-- **UserProfile**: Personal information, statistics, and preference management
-- **ReviewForm**: Structured review creation with rating inputs and media upload
-- **TopListManager**: Drag-and-drop interface for creating and managing rankings
-- **NotificationCenter**: Real-time notifications with read/unread states
-- **SearchInterface**: Advanced search with filters, suggestions, and recent searches
-
-### Content Management
-- **SubmissionForm**: Content submission interface with validation and preview
-- **ModerationQueue**: Administrative interface for content review and approval
-- **PhotoUpload**: Drag-and-drop photo upload with progress tracking and optimization
-- **ContentEditor**: Rich text editor for descriptions and review content
-
-## Data Models & API Integration
-
-### API Endpoints Structure
-```typescript
-// Parks API
-GET /api/parks/ - List parks with filtering and pagination
-GET /api/parks/{slug}/ - Park details with rides and reviews
-GET /api/parks/{slug}/rides/ - Rides at specific park
-GET /api/parks/search/ - Advanced park search
-
-// Rides API  
-GET /api/rides/ - List rides with filtering
-GET /api/rides/{park_slug}/{ride_slug}/ - Ride details
-GET /api/rides/manufacturers/{slug}/ - Manufacturer information
-GET /api/rides/search/ - Advanced ride search
-
-// User API
-GET /api/users/profile/ - Current user profile
-PUT /api/users/profile/ - Update user profile
-GET /api/users/{username}/ - Public user profile
-POST /api/users/reviews/ - Create review
-
-// Content API
-POST /api/submissions/ - Submit new content
-GET /api/submissions/status/ - Check submission status
-POST /api/photos/upload/ - Upload photos
-GET /api/moderation/queue/ - Moderation queue (admin)
-```
-
-### TypeScript Interfaces
-```typescript
-interface Park {
-  id: number;
-  name: string;
-  slug: string;
-  description: string;
-  status: string;
-  park_type: string;
-  location: ParkLocation;
-  operator: Company;
-  opening_date: string;
-  ride_count: number;
-  coaster_count: number;
-  average_rating: number;
-  banner_image: Photo;
-  card_image: Photo;
-  url: string;
-}
-
-interface Ride {
-  id: number;
-  name: string;
-  slug: string;
-  description: string;
-  park: Park;
-  category: string;
-  manufacturer: Company;
-  ride_model: RideModel;
-  status: string;
-  opening_date: string;
-  height_requirement: number;
-  average_rating: number;
-  coaster_stats?: RollerCoasterStats;
-}
-
-interface User {
-  id: number;
-  username: string;
-  display_name: string;
-  profile: UserProfile;
-  role: string;
-  theme_preference: string;
-  privacy_level: string;
-}
-```
-
-## Authentication & User Management
-
-### Authentication Flow
-- **Registration**: Email-based signup with verification workflow
-- **Login**: Username/email login with remember me option
-- **Social Auth**: Integration with Google, Facebook, Discord for quick signup
-- **Password Reset**: Secure password reset with email verification
-- **Two-Factor Auth**: Optional 2FA with authenticator app support
-
-### User Roles & Permissions
-- **Regular Users**: Create reviews, manage profiles, submit content
-- **Verified Contributors**: Trusted users with expedited content approval
-- **Moderators**: Content review, user management, community oversight
-- **Administrators**: Full system access, user role management, system configuration
-
-### Privacy & Security
-- **Privacy Controls**: Granular privacy settings for profile visibility and data sharing
-- **Content Moderation**: Automated and manual content review processes
-- **Data Protection**: GDPR compliance with data export and deletion options
-- **Security Features**: Login notifications, session management, suspicious activity detection
-
-## Performance & Optimization
-
-### Loading & Caching
-- **Image Optimization**: Cloudflare Images with responsive variants and lazy loading
-- **API Caching**: Intelligent caching with stale-while-revalidate patterns
-- **Static Generation**: Pre-generated pages for popular content with ISR
-- **Code Splitting**: Route-based and component-based code splitting for optimal loading
-
-### Search & Filtering
-- **Client-Side Search**: Fast text search with debouncing and result highlighting
-- **Server-Side Filtering**: Complex filtering with URL state management
-- **Infinite Scrolling**: Performance-optimized pagination for large datasets
-- **Search Analytics**: Track popular searches and optimize content discovery
-
-### Mobile Optimization
-- **Responsive Design**: Mobile-first approach with touch-friendly interfaces
-- **Progressive Web App**: PWA features with offline capability and push notifications
-- **Performance Budgets**: Strict performance monitoring with Core Web Vitals tracking
-- **Accessibility**: Full keyboard navigation and screen reader compatibility
-
-## Content Management & Moderation
-
-### Submission Workflow
-- **Content Forms**: Structured forms for parks, rides, and reviews with validation
-- **Draft System**: Save and resume content creation with auto-save functionality
-- **Preview Mode**: Real-time preview of content before submission
-- **Submission Tracking**: Status updates and feedback throughout review process
-
-### Moderation Interface
-- **Review Queue**: Prioritized queue with filtering and batch operations
-- **Approval Workflow**: Multi-stage review with detailed feedback options
-- **Quality Metrics**: Track approval rates, review times, and content quality
-- **User Reputation**: Contributor scoring system based on submission quality
-
-### Media Management
-- **Photo Upload**: Drag-and-drop interface with progress tracking and error handling
-- **Image Processing**: Automatic optimization, resizing, and format conversion
-- **Attribution Tracking**: Photographer credits and copyright information
-- **Bulk Operations**: Batch photo management and organization tools
-
-## Analytics & Insights
-
-### User Analytics
-- **Engagement Tracking**: Page views, time on site, and user journey analysis
-- **Content Performance**: Popular parks, rides, and reviews with engagement metrics
-- **Search Analytics**: Popular search terms and content discovery patterns
-- **User Behavior**: Registration funnels, retention rates, and feature adoption
-
-### Content Insights
-- **Submission Metrics**: Content creation rates, approval times, and quality scores
-- **Review Analytics**: Rating distributions, helpful votes, and review engagement
-- **Geographic Data**: Popular regions, park visit patterns, and location-based insights
-- **Trending Content**: Real-time trending parks, rides, and discussions
-
-## Development Guidelines
-
-### Code Organization
-- **Feature-Based Structure**: Organize code by features rather than file types
-- **Component Library**: Reusable components with Storybook documentation
-- **Custom Hooks**: Shared logic extraction with proper TypeScript typing
-- **Utility Functions**: Common operations with comprehensive testing
-
-### Testing Strategy
-- **Unit Testing**: Component and utility function testing with Jest and React Testing Library
-- **Integration Testing**: API integration and user workflow testing
-- **E2E Testing**: Critical user journeys with Playwright or Cypress
-- **Performance Testing**: Core Web Vitals monitoring and performance regression testing
-
-### Deployment & DevOps
-- **Environment Management**: Development, staging, and production environments
-- **CI/CD Pipeline**: Automated testing, building, and deployment
-- **Monitoring**: Error tracking, performance monitoring, and user analytics
-- **Security**: Regular security audits, dependency updates, and vulnerability scanning
-
-This comprehensive platform should provide theme park enthusiasts with a rich, engaging experience while maintaining high content quality through effective moderation and community management systems.

thrillwiki/asgi.py

@@ -11,6 +11,6 @@ import os
 
 from django.core.asgi import get_asgi_application
 
-os.environ.setdefault("DJANGO_SETTINGS_MODULE", "thrillwiki.settings")
+os***REMOVED***iron.setdefault("DJANGO_SETTINGS_MODULE", "thrillwiki.settings")
 
 application = get_asgi_application()

thrillwiki/settings.py

@@ -180,7 +180,7 @@ SOCIALACCOUNT_PROVIDERS = {
     "google": {
         "APP": {
             "client_id": "135166769591-nopcgmo0fkqfqfs9qe783a137mtmcrt2.apps.googleusercontent.com",
-            "secret": "[SECRET-REMOVED]",
+            "[SECRET-REMOVED]",
             "key": "",
         },
         "SCOPE": [
@@ -192,7 +192,7 @@ SOCIALACCOUNT_PROVIDERS = {
     "discord": {
         "APP": {
             "client_id": "1299112802274902047",
-            "secret": "[SECRET-REMOVED]",
+            "[SECRET-REMOVED]",
             "key": "",
         },
         "SCOPE": ["identify", "email"],

thrillwiki/urls.py

@@ -7,6 +7,7 @@ from accounts import views as accounts_views
 from django.views.generic import TemplateView
 from .views import HomeView, SearchView
 from . import views
+from autocomplete.urls import urlpatterns as autocomplete_patterns
 import os
 
 urlpatterns = [
@@ -55,9 +56,11 @@ urlpatterns = [
     path("history/", include("history.urls", namespace="history")),
     path(
         "env-settings/",
-        views.environment_and_settings_view,
+        views***REMOVED***ironment_and_settings_view,
         name="environment_and_settings",
     ),
+    # Autocomplete URLs
+    path("ac/", include((autocomplete_patterns, "autocomplete"), namespace="autocomplete")),
 ]
 
 # Serve static files in development

thrillwiki/views.py

@@ -127,7 +127,7 @@ class SearchView(TemplateView):
 
 def environment_and_settings_view(request):
     # Get all environment variables
-    env_vars = dict(os.environ)
+    env_vars = dict(os***REMOVED***iron)
     
     # Get all Django settings as a dictionary
     settings_vars = {setting: getattr(settings, setting) for setting in dir(settings) if setting.isupper()}

thrillwiki/wsgi.py

@@ -11,6 +11,6 @@ import os
 
 from django.core.wsgi import get_wsgi_application
 
-os.environ.setdefault("DJANGO_SETTINGS_MODULE", "thrillwiki.settings")
+os***REMOVED***iron.setdefault("DJANGO_SETTINGS_MODULE", "thrillwiki.settings")
 
 application = get_wsgi_application()