From 50185af6826ebdd34038f9eff99fea4bff67169e Mon Sep 17 00:00:00 2001
From: humanauction <t.a.harris@gmail.com>
Date: Tue, 21 Oct 2025 19:39:46 +0100
Subject: [PATCH 1/2] Add: event detail template: HTML structure; Add:
 consistent like button style; Add: share functionality, better fallback; Add:
 urls.py: fix: URL fetch for event like function.

---
 home/templates/home/event_detail.html | 132 +++++++++++++-------------
 1 file changed, 67 insertions(+), 65 deletions(-)

diff --git a/home/templates/home/event_detail.html b/home/templates/home/event_detail.html
index f1fb930..9a9e963 100644
--- a/home/templates/home/event_detail.html
+++ b/home/templates/home/event_detail.html
@@ -1,11 +1,11 @@
-{% extends "base.html" %} {% load static %} {% block content %}
+{% extends "base.html" %}
+{% load static %}
+
+{% block content %}
 <div class="container mx-auto py-8">
     <div class="bg-base-100 shadow-lg rounded-lg overflow-hidden">
         {% if event.image %}
-        <div
-            class="h-64 bg-cover bg-center"
-            style="background-image: url('{{ event.image.url }}')"
-        ></div>
+        <div class="h-64 bg-cover bg-center" style="background-image: url('{{ event.image.url }}')"></div>
         {% endif %}
 
         <div class="p-6">
@@ -50,7 +50,7 @@ <h1 class="text-2xl font-bold mb-2">{{ event.title }}</h1>
             <div class="flex flex-wrap gap-3 mt-6">
                 {% if user.is_authenticated %}
                 <button
-                    class="btn btn-outline like-button {% if user in event.likes.all %}liked{% endif %}"
+                    class="btn btn-outline like-button {% if user in event.likes.all %}btn-error{% endif %}"
                     data-event-id="{{ event.pk }}"
                     data-likes="{{ event.like_count }}"
                 >
@@ -69,26 +69,22 @@ <h1 class="text-2xl font-bold mb-2">{{ event.title }}</h1>
 
                 {% if event.church %}
                 <a href="{% url 'churches' %}" class="btn btn-outline">
-                    <i class="fa-solid fa-church mr-1"></i> Visit Church
+                    <i class="fa-solid fa-church mr-1"></i> View All Churches
                 </a>
-                {% endif %} {% if user.is_staff or user.is_superuser %}
-                <div class="divider"></div>
-                <div class="flex gap-2 mt-2">
-                    <a
-                        href="{% url 'event_edit' event.pk %}"
-                        class="btn btn-warning"
-                    >
-                        <i class="fa-solid fa-edit mr-1"></i> Edit
-                    </a>
-                    <a
-                        href="{% url 'event_delete' event.pk %}"
-                        class="btn btn-error"
-                    >
-                        <i class="fa-solid fa-trash mr-1"></i> Delete
-                    </a>
-                </div>
                 {% endif %}
             </div>
+
+            {% if user.is_staff or user.is_superuser %}
+            <div class="divider"></div>
+            <div class="flex gap-2 mt-2">
+                <a href="{% url 'event_edit' event.pk %}" class="btn btn-warning">
+                    <i class="fa-solid fa-edit mr-1"></i> Edit
+                </a>
+                <a href="{% url 'event_delete' event.pk %}" class="btn btn-error">
+                    <i class="fa-solid fa-trash mr-1"></i> Delete
+                </a>
+            </div>
+            {% endif %}
         </div>
     </div>
 
@@ -101,69 +97,75 @@ <h1 class="text-2xl font-bold mb-2">{{ event.title }}</h1>
 
 <script>
     function shareEvent(title, url) {
+        const fullUrl = window.location.origin + url;
+        
         if (navigator.share) {
-            navigator
-                .share({
-                    title: title,
-                    url: window.location.origin + url,
-                })
-                .catch(console.error);
+            navigator.share({
+                title: title,
+                url: fullUrl
+            }).catch(err => console.error('Share failed:', err));
         } else {
-            const tempInput = document.createElement("input");
-            document.body.appendChild(tempInput);
-            tempInput.value = window.location.origin + url;
-            tempInput.select();
-            document.execCommand("copy");
-            document.body.removeChild(tempInput);
-            alert("Link copied to clipboard!");
+            navigator.clipboard.writeText(fullUrl).then(() => {
+                alert('Link copied to clipboard!');
+            }).catch(err => {
+                // Fallback for older browsers
+                const tempInput = document.createElement('input');
+                document.body.appendChild(tempInput);
+                tempInput.value = fullUrl;
+                tempInput.select();
+                document.execCommand('copy');
+                document.body.removeChild(tempInput);
+                alert('Link copied to clipboard!');
+            });
         }
     }
 
     // Event like functionality
-    document.addEventListener("DOMContentLoaded", function () {
-        const likeButtons = document.querySelectorAll(".like-button");
+    document.addEventListener('DOMContentLoaded', function() {
+        const likeButtons = document.querySelectorAll('.like-button');
 
-        likeButtons.forEach((button) => {
-            button.addEventListener("click", function () {
+        likeButtons.forEach(button => {
+            button.addEventListener('click', function() {
                 const eventId = this.dataset.eventId;
 
-                fetch(`/events/${eventId}/like/`, {
-                    method: "POST",
+                fetch(`/home/events/${eventId}/like/`, {  // ← FIXED: Added /home/ prefix
+                    method: 'POST',
                     headers: {
-                        "X-CSRFToken": getCookie("csrftoken"),
-                        "Content-Type": "application/json",
-                    },
+                        'X-CSRFToken': getCookie('csrftoken'),
+                        'Content-Type': 'application/json'
+                    }
                 })
-                    .then((response) => response.json())
-                    .then((data) => {
-                        if (data.status === "success") {
-                            const likeCount = this.querySelector(".like-count");
-                            likeCount.textContent = data.likes;
-
-                            if (data.liked) {
-                                this.classList.add("liked");
-                            } else {
-                                this.classList.remove("liked");
-                            }
+                .then(response => response.json())
+                .then(data => {
+                    if (data.status === 'success') {
+                        const likeCount = this.querySelector('.like-count');
+                        likeCount.textContent = data.likes;
+
+                        if (data.liked) {
+                            this.classList.add('btn-error');
                         } else {
-                            alert("Please log in to like events");
+                            this.classList.remove('btn-error');
                         }
-                    })
-                    .catch((error) => console.error("Error:", error));
+                    } else {
+                        alert('Please log in to like events');
+                    }
+                })
+                .catch(error => {
+                    console.error('Error:', error);
+                    alert('An error occurred. Please try again.');
+                });
             });
         });
     });
 
     function getCookie(name) {
         let cookieValue = null;
-        if (document.cookie && document.cookie !== "") {
-            const cookies = document.cookie.split(";");
+        if (document.cookie && document.cookie !== '') {
+            const cookies = document.cookie.split(';');
             for (let i = 0; i < cookies.length; i++) {
                 const cookie = cookies[i].trim();
-                if (cookie.substring(0, name.length + 1) === name + "=") {
-                    cookieValue = decodeURIComponent(
-                        cookie.substring(name.length + 1)
-                    );
+                if (cookie.substring(0, name.length + 1) === (name + '=')) {
+                    cookieValue = decodeURIComponent(cookie.substring(name.length + 1));
                     break;
                 }
             }

From b34bbbeaca8f6728b78f3201c6eb56d906e9a9ed Mon Sep 17 00:00:00 2001
From: humanauction <t.a.harris@gmail.com>
Date: Wed, 22 Oct 2025 10:37:29 +0100
Subject: [PATCH 2/2] Add: event form layout, styling, fix if/endif clashes;
 Add: like button fetch URL; Add: base.html: fix devtools error: Comment out
 manifest link in base template.

---
 home/templates/home/event_form.html | 19 ++++++++++---------
 home/templates/home/events.html     |  2 +-
 theme/templates/base.html           |  2 +-
 3 files changed, 12 insertions(+), 11 deletions(-)

diff --git a/home/templates/home/event_form.html b/home/templates/home/event_form.html
index b6aaeea..44c3e1c 100644
--- a/home/templates/home/event_form.html
+++ b/home/templates/home/event_form.html
@@ -29,7 +29,7 @@ <h1 class="text-2xl font-bold mb-6">
                     required>{{ form.description.value|default:'' }}</textarea>
             </div>
 
-            <div class="grid grid-cols-1 md:grid-cols-2 gap-4">
+            <div class="grid grid-cols-1 md:grid-cols-2 gap-4 mb-4">
                 <div class="form-control">
                     <label class="label">
                         <span class="label-text">Start Date & Time</span>
@@ -86,26 +86,27 @@ <h1 class="text-2xl font-bold mb-6">
                 {{ form.image.errors }}
                 {% if form.instance.image %}
                 <div class="mb-2">
-                    <img src="{{ form.instance.image.url }}" alt="Current event image" class="h-32 object-cover">
-                    <p class="text-sm">Current image. Upload a new one to replace.</p>
+                    <img src="{{ form.instance.image.url }}" alt="Current event image" class="h-32 object-cover rounded">
+                    <p class="text-sm text-base-content/70 mt-1">Current image. Upload a new one to replace.</p>
                 </div>
                 {% endif %}
-                <input type="file" name="{{ form.image.name }}" class="file-input file-input-bordered w-full">
+                <input type="file" name="{{ form.image.name }}" accept="image/*" class="file-input file-input-bordered w-full">
             </div>
 
             <div class="form-control mb-6">
-                <label class="label cursor-pointer">
+                <label class="label cursor-pointer justify-start gap-4">
+                    <input type="checkbox" name="{{ form.is_featured.name }}" 
+                        {% if form.is_featured.value %}checked{% endif %} 
+                        class="checkbox checkbox-primary">
                     <span class="label-text">Feature this event</span>
-                    <input type="checkbox" name="{{ form.is_featured.name }}" {% if form.is_featured.value %}checked{%
-                        endif %} class="checkbox">
                 </label>
-                <p class="text-xs text-neutral-content">Featured events will be highlighted on the homepage</p>
+                <p class="text-xs text-base-content/70 ml-12">Featured events will be highlighted on the homepage</p>
             </div>
 
             <div class="flex gap-4 justify-end">
                 <a href="{% url 'events' %}" class="btn btn-outline">Cancel</a>
                 <button type="submit" class="btn btn-primary">
-                    {% if form.instance.pk %}Update{% else %}Create{% endif %} Event
+                    {% if form.instance.pk %}Update Event{% else %}Create Event{% endif %}
                 </button>
             </div>
         </form>
diff --git a/home/templates/home/events.html b/home/templates/home/events.html
index b2fcf07..02adc88 100644
--- a/home/templates/home/events.html
+++ b/home/templates/home/events.html
@@ -161,7 +161,7 @@ <h2 class="text-2xl font-bold mb-4">Past Events</h2>
             button.addEventListener("click", function () {
                 const eventId = this.dataset.eventId;
 
-                fetch(`/events/${eventId}/like/`, {
+                fetch(`/home/events/${eventId}/like/`, {
                     method: "POST",
                     headers: {
                         "X-CSRFToken": getCookie("csrftoken"),
diff --git a/theme/templates/base.html b/theme/templates/base.html
index e55b8c6..d0fb9d4 100644
--- a/theme/templates/base.html
+++ b/theme/templates/base.html
@@ -7,7 +7,7 @@
         'apple-touch-icon.png' %} /> <link rel="icon" type="image/png"
         sizes="32x32" href={% static 'favicon-32x32.png' %} /> <link rel="icon"
         type="image/png" sizes="16x16" href={% static 'favicon-16x16.png' %} />
-        <link rel="manifest" href="{% static 'site.webmanifest' %}" />
+        {% comment %} <link rel="manifest" href="{% static 'site.webmanifest' %}" /> {% endcomment %}
         <meta charset="UTF-8" />
         <meta name="viewport" content="width=device-width, initial-scale=1.0" />
         <meta http-equiv="X-UA-Compatible" content="ie=edge" />