From b359978d29603447ac05a7ae5389afaf28cac869 Mon Sep 17 00:00:00 2001
From: Jared Vititoe <jjvititoe1@gmail.com>
Date: Tue, 11 Mar 2025 20:23:36 -0400
Subject: [PATCH] Add edit buttons to hamburger model

---
 assets/js/dashboard.js | 260 ++++++++++++++++++++++++-----------------
 1 file changed, 156 insertions(+), 104 deletions(-)

diff --git a/assets/js/dashboard.js b/assets/js/dashboard.js
index 0372d52..f710f0f 100644
--- a/assets/js/dashboard.js
+++ b/assets/js/dashboard.js
@@ -411,113 +411,165 @@ function createHamburgerMenu() {
     // Create hamburger menu container
     const hamburgerMenu = document.createElement('div');
     hamburgerMenu.className = 'hamburger-menu';
-    hamburgerMenu.innerHTML = `
-        <div class="hamburger-icon">☰</div>
-        <div class="hamburger-content">
-            <div class="close-hamburger">☰</div>
-            <h3>Filters</h3>
-            <div class="filter-section">
-                <h4>Categories</h4>
-                <div id="category-filters"></div>
-            </div>
-            <div class="filter-section">
-                <h4>Types</h4>
-                <div id="type-filters"></div>
-            </div>
-            <div class="filter-actions">
-                <button id="apply-filters">Apply Filters</button>
-                <button id="clear-filters">Clear Filters</button>
-            </div>
-        </div>
-    `;
-
-    // Populate categories and types from data attributes
-    const categoriesContainer = hamburgerMenu.querySelector('#category-filters');
-    const typesContainer = hamburgerMenu.querySelector('#type-filters');
     
-    const categories = JSON.parse(document.body.dataset.categories || '[]');
-    const types = JSON.parse(document.body.dataset.types || '[]');
-
-    // Create checkboxes for categories
-    categories.forEach(category => {
-        const label = document.createElement('label');
-        const checkbox = document.createElement('input');
-        checkbox.type = 'checkbox';
-        checkbox.value = category;
-        checkbox.name = 'category';
-        label.appendChild(checkbox);
-        label.appendChild(document.createTextNode(category));
-        categoriesContainer.appendChild(label);
-    });
-
-    // Create checkboxes for types
-    types.forEach(type => {
-        const label = document.createElement('label');
-        const checkbox = document.createElement('input');
-        checkbox.type = 'checkbox';
-        checkbox.value = type;
-        checkbox.name = 'type';
-        label.appendChild(checkbox);
-        label.appendChild(document.createTextNode(type));
-        typesContainer.appendChild(label);
-    });
-
-    // Toggle hamburger menu
-    const hamburgerIcon = hamburgerMenu.querySelector('.hamburger-icon');
-    const hamburgerContent = hamburgerMenu.querySelector('.hamburger-content');
-    hamburgerIcon.addEventListener('click', () => {
-        hamburgerContent.classList.toggle('open');
-        document.body.classList.toggle('menu-open');
-    });
-
-    // Apply filters
-    const applyFiltersBtn = hamburgerMenu.querySelector('#apply-filters');
-    applyFiltersBtn.addEventListener('click', () => {
-        const selectedCategories = Array.from(
-            categoriesContainer.querySelectorAll('input:checked')
-        ).map(cb => cb.value);
-        
-        const selectedTypes = Array.from(
-            typesContainer.querySelectorAll('input:checked')
-        ).map(cb => cb.value);
-
-        // Construct URL with filters
-        const params = new URLSearchParams(window.location.search);
-        
-        if (selectedCategories.length > 0) {
-            params.set('category', selectedCategories.join(','));
+        // Check if we're on a ticket page
+        const isTicketPage = window.location.pathname.includes('ticket.php');
+    
+        if (isTicketPage) {
+            hamburgerMenu.innerHTML = `
+                <div class="hamburger-icon">☰</div>
+                <div class="hamburger-content">
+                    <div class="close-hamburger">☰</div>
+                    <h3>Ticket Controls</h3>
+                    <div class="menu-group">
+                        <label>Status</label>
+                        <select class="editable" data-field="status">
+                            <option value="Open">Open</option>
+                            <option value="Closed">Closed</option>
+                        </select>
+                    </div>
+                    <div class="menu-group">
+                        <label>Priority</label>
+                        <select class="editable" data-field="priority">
+                            <option value="1">P1 - Critical Impact</option>
+                            <option value="2">P2 - High Impact</option>
+                            <option value="3">P3 - Medium Impact</option>
+                            <option value="4">P4 - Low Impact</option>
+                        </select>
+                    </div>
+                    <div class="menu-group">
+                        <label>Category</label>
+                        <select class="editable" data-field="category">
+                            <option value="Hardware">Hardware</option>
+                            <option value="Software">Software</option>
+                            <option value="Network">Network</option>
+                            <option value="Security">Security</option>
+                            <option value="Other">Other</option>
+                        </select>
+                    </div>
+                    <div class="menu-group">
+                        <label>Type</label>
+                        <select class="editable" data-field="type">
+                            <option value="Maintenance">Maintenance</option>
+                            <option value="Install">Install</option>
+                            <option value="Task">Task</option>
+                            <option value="Upgrade">Upgrade</option>
+                        </select>
+                    </div>
+                    <div class="menu-actions">
+                        <button onclick="saveTicket()" class="btn primary">Save Changes</button>
+                    </div>
+                </div>
+            `;
         } else {
-            params.delete('category');
+            hamburgerMenu.innerHTML = `
+                <div class="hamburger-icon">☰</div>
+                <div class="hamburger-content">
+                    <div class="close-hamburger">☰</div>
+                    <h3>Filters</h3>
+                    <div class="filter-section">
+                        <h4>Categories</h4>
+                        <div id="category-filters"></div>
+                    </div>
+                    <div class="filter-section">
+                        <h4>Types</h4>
+                        <div id="type-filters"></div>
+                    </div>
+                    <div class="filter-actions">
+                        <button id="apply-filters">Apply Filters</button>
+                        <button id="clear-filters">Clear Filters</button>
+                    </div>
+                </div>
+            `;
+
+            // Populate categories and types from data attributes
+            const categoriesContainer = hamburgerMenu.querySelector('#category-filters');
+            const typesContainer = hamburgerMenu.querySelector('#type-filters');
+            
+            const categories = JSON.parse(document.body.dataset.categories || '[]');
+            const types = JSON.parse(document.body.dataset.types || '[]');
+
+            // Create checkboxes for categories
+            categories.forEach(category => {
+                const label = document.createElement('label');
+                const checkbox = document.createElement('input');
+                checkbox.type = 'checkbox';
+                checkbox.value = category;
+                checkbox.name = 'category';
+                label.appendChild(checkbox);
+                label.appendChild(document.createTextNode(category));
+                categoriesContainer.appendChild(label);
+            });
+
+            // Create checkboxes for types
+            types.forEach(type => {
+                const label = document.createElement('label');
+                const checkbox = document.createElement('input');
+                checkbox.type = 'checkbox';
+                checkbox.value = type;
+                checkbox.name = 'type';
+                label.appendChild(checkbox);
+                label.appendChild(document.createTextNode(type));
+                typesContainer.appendChild(label);
+            });
+
+            // Toggle hamburger menu
+            const hamburgerIcon = hamburgerMenu.querySelector('.hamburger-icon');
+            const hamburgerContent = hamburgerMenu.querySelector('.hamburger-content');
+            hamburgerIcon.addEventListener('click', () => {
+                hamburgerContent.classList.toggle('open');
+                document.body.classList.toggle('menu-open');
+            });
+
+            // Apply filters
+            const applyFiltersBtn = hamburgerMenu.querySelector('#apply-filters');
+            applyFiltersBtn.addEventListener('click', () => {
+                const selectedCategories = Array.from(
+                    categoriesContainer.querySelectorAll('input:checked')
+                ).map(cb => cb.value);
+                
+                const selectedTypes = Array.from(
+                    typesContainer.querySelectorAll('input:checked')
+                ).map(cb => cb.value);
+
+                // Construct URL with filters
+                const params = new URLSearchParams(window.location.search);
+                
+                if (selectedCategories.length > 0) {
+                    params.set('category', selectedCategories.join(','));
+                } else {
+                    params.delete('category');
+                }
+
+                if (selectedTypes.length > 0) {
+                    params.set('type', selectedTypes.join(','));
+                } else {
+                    params.delete('type');
+                }
+
+                // Reload with new filters
+                window.location.search = params.toString();
+            });
+
+            // Clear filters
+            const clearFiltersBtn = hamburgerMenu.querySelector('#clear-filters');
+            clearFiltersBtn.addEventListener('click', () => {
+                const params = new URLSearchParams(window.location.search);
+                params.delete('category');
+                params.delete('type');
+                window.location.search = params.toString();
+            });
+
+            // Add to body
+            document.body.appendChild(hamburgerMenu);
+
+            // Close hamburger menu
+            const closeButton = hamburgerMenu.querySelector('.close-hamburger');
+            closeButton.addEventListener('click', () => {
+                hamburgerContent.classList.remove('open');
+                document.body.classList.remove('menu-open');
+            });
         }
-
-        if (selectedTypes.length > 0) {
-            params.set('type', selectedTypes.join(','));
-        } else {
-            params.delete('type');
-        }
-
-        // Reload with new filters
-        window.location.search = params.toString();
-    });
-
-    // Clear filters
-    const clearFiltersBtn = hamburgerMenu.querySelector('#clear-filters');
-    clearFiltersBtn.addEventListener('click', () => {
-        const params = new URLSearchParams(window.location.search);
-        params.delete('category');
-        params.delete('type');
-        window.location.search = params.toString();
-    });
-
-    // Add to body
-    document.body.appendChild(hamburgerMenu);
-
-    // Close hamburger menu
-    const closeButton = hamburgerMenu.querySelector('.close-hamburger');
-    closeButton.addEventListener('click', () => {
-        hamburgerContent.classList.remove('open');
-        document.body.classList.remove('menu-open');
-    });
 }
 
 // Add to DOMContentLoaded