From c5fa9d9b3e27891c78a1fb984d88e2befb0aabd9 Mon Sep 17 00:00:00 2001
From: Aaron Buckles <abuckles@uci.edu>
Date: Mon, 17 Jun 2024 09:35:03 -0700
Subject: [PATCH] Create/edit request modal

---
 NEMO/static/nemo.css                          |  6 +-
 .../open_staff_assistance_requests.html       |  2 +-
 .../staff_assistance_request.html             | 39 -------------
 .../staff_assistance_requests.html            | 57 ++++++++++++++++++-
 NEMO/views/staff_assistance_requests.py       | 45 ++++++---------
 5 files changed, 79 insertions(+), 70 deletions(-)
 delete mode 100644 NEMO/templates/requests/staff_assistance_requests/staff_assistance_request.html

diff --git a/NEMO/static/nemo.css b/NEMO/static/nemo.css
index dab7a6f64..352d404a2 100644
--- a/NEMO/static/nemo.css
+++ b/NEMO/static/nemo.css
@@ -1217,4 +1217,8 @@ li.area-tree-node a, li.area-tree-node a:hover, li.area-tree-node a:focus
 	padding: inherit;
 	text-align: inherit;
 	border-top: inherit;
-}
\ No newline at end of file
+}
+
+.modal-open[style] {
+padding-right: 0 !important;
+}
diff --git a/NEMO/templates/requests/staff_assistance_requests/open_staff_assistance_requests.html b/NEMO/templates/requests/staff_assistance_requests/open_staff_assistance_requests.html
index 37b78169b..a110c544a 100644
--- a/NEMO/templates/requests/staff_assistance_requests/open_staff_assistance_requests.html
+++ b/NEMO/templates/requests/staff_assistance_requests/open_staff_assistance_requests.html
@@ -23,7 +23,7 @@ <h3>{{ date.grouper }}</h3>
                                 <div class="staff-assistance-list-item-buttons">
                                     {% if staff_assistance_request.user == request.user and staff_assistance_request.replies.count == 0 %}
                                         {% url 'edit_staff_assistance_request' staff_assistance_request.id as edit_staff_assistance_request_url %}
-                                        {% button type="edit" size="small" url=edit_staff_assistance_request_url value="Edit" %}
+                                        {% button type="edit" size="small" value="Edit" data_toggle="modal" data_target="#requestModal" data_request_description=staff_assistance_request.description data_request_url=edit_staff_assistance_request_url data_request_action="Edit" %}
                                         <form style="display: inline-block"
                                               action="{% url 'delete_staff_assistance_request' staff_assistance_request.id %}"
                                               method="post">
diff --git a/NEMO/templates/requests/staff_assistance_requests/staff_assistance_request.html b/NEMO/templates/requests/staff_assistance_requests/staff_assistance_request.html
deleted file mode 100644
index 2acc2d4f1..000000000
--- a/NEMO/templates/requests/staff_assistance_requests/staff_assistance_request.html
+++ /dev/null
@@ -1,39 +0,0 @@
-{% extends 'base.html' %}
-{% load custom_tags_and_filters %}
-{% load static %}
-{% block title %}
-    {% if form.instance.id %}
-        Modify staff assistance request
-    {% else %}
-        New staff assistance request
-    {% endif %}
-{% endblock %}
-{% block content %}
-    <h1 class="form-group">
-        {% if form.instance.id %}
-            Modify staff assistance request
-        {% else %}
-            New staff assistance request
-        {% endif %}
-    </h1>
-    <form class="well"
-          action="{% if form.instance.id %}{% url 'edit_staff_assistance_request' form.instance.id %}{% else %}{% url 'create_staff_assistance_request' %}{% endif %}"
-          method="post">
-        {% if form.non_field_errors %}<div class="alert alert-danger">{{ form.non_field_errors }}</div>{% endif %}
-        {% csrf_token %}
-        <div class="form-group">
-            <label for="description">Description</label>
-            {% if form.description.errors %}- <span style="color:red">{{ form.description.errors|striptags }}</span>{% endif %}
-            <textarea class="form-control"
-                      rows="3"
-                      name="description"
-                      id="description"
-                      maxlength="{{ form.fields.description.max_length }}"
-                      placeholder="Describe your request"
-                      required>{{ form.description.value|default_if_none:"" }}</textarea>
-        </div>
-        <div class="text-right">
-            {% button type="save" value=form.instance.id|yesno:"Save changes,Create staff assistance request" %}
-        </div>
-    </form>
-{% endblock %}
diff --git a/NEMO/templates/requests/staff_assistance_requests/staff_assistance_requests.html b/NEMO/templates/requests/staff_assistance_requests/staff_assistance_requests.html
index aceb8f0da..0ab2083ca 100644
--- a/NEMO/templates/requests/staff_assistance_requests/staff_assistance_requests.html
+++ b/NEMO/templates/requests/staff_assistance_requests/staff_assistance_requests.html
@@ -10,10 +10,52 @@
     </div>
     <div class="text-right" style="display: table-cell; vertical-align: top">
         {% if not user.is_staff %}
-            {% button type="add" value="New request" url="create_staff_assistance_request" %}
+            {% url 'create_staff_assistance_request' as create_staff_assistance_request_url %}
+            {% button type="add" value="New request" data_toggle="modal" data_target="#requestModal" data_request_description="" data_request_url=create_staff_assistance_request_url data_request_action="Create" %}
         {% endif %}
     </div>
 </div>
+<!-- Modal -->
+<div class="modal fade"
+     id="requestModal"
+     tabindex="-1"
+     role="dialog"
+     aria-labelledby="requestModalLabel">
+    <div class="modal-dialog" role="document">
+        <div class="modal-content">
+            <div class="modal-header">
+                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
+                    <span aria-hidden="true">&times;</span>
+                </button>
+                <h4 class="modal-title" id="requestModalLabel">New Request</h4>
+            </div>
+            <div class="modal-body">
+                <form id="staffAssistanceRequestForm"
+                      action="{% if form.instance.id %}{% url 'edit_staff_assistance_request' form.instance.id %}{% else %}{% url 'create_staff_assistance_request' %}{% endif %}"
+                      method="post">
+                    {% if form.non_field_errors %}<div class="alert alert-danger">{{ form.non_field_errors }}</div>{% endif %}
+                    {% csrf_token %}
+                    <div class="form-group">
+                        <label for="description">Description</label>
+                        {% if form.description.errors %}- <span style="color:red">{{ form.description.errors|striptags }}</span>{% endif %}
+                        <textarea class="form-control"
+                                  rows="3"
+                                  name="description"
+                                  id="description"
+                                  style="resize: vertical"
+                                  maxlength="{{ form.fields.description.max_length }}"
+                                  placeholder="Describe your request"
+                                  required>{{ form.description.value|default_if_none:"" }}</textarea>
+                    </div>
+                </form>
+            </div>
+            <div class="modal-footer">
+                <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
+                {% button type="save" icon="glyphicon-send" value="Send" form="staffAssistanceRequestForm" id="staffAssistanceRequestFormSubmitButton" %}
+            </div>
+        </div>
+    </div>
+</div>
 {% if open_staff_assistance_requests %}
     {% include 'requests/staff_assistance_requests/open_staff_assistance_requests.html' with staff_assistance_request_list=open_staff_assistance_requests %}
 {% else %}
@@ -33,6 +75,19 @@ <h3>
     </div>
 {% endif %}
 <script>
+    $('#requestModal').on('show.bs.modal', function (event) {
+        let button = $(event.relatedTarget);
+
+        let description = button.data('request-description');
+        let url = button.data('request-url');
+        let action = button.data('request-action');
+
+        let modal = $(this);
+        modal.find('form').attr("action", url);
+        modal.find('.modal-title').text(action + " Request");
+        modal.find('#description').val(description);
+    })
+
     function show_or_send_reply(button_element, form_selector)
     {
         let form_element = $('#'+form_selector)
diff --git a/NEMO/views/staff_assistance_requests.py b/NEMO/views/staff_assistance_requests.py
index 9a82cc8e4..dcffdbb22 100644
--- a/NEMO/views/staff_assistance_requests.py
+++ b/NEMO/views/staff_assistance_requests.py
@@ -6,7 +6,7 @@
 from django.shortcuts import get_object_or_404, redirect, render
 from django.template.defaultfilters import linebreaksbr
 from django.urls import reverse
-from django.views.decorators.http import require_GET, require_POST, require_http_methods
+from django.views.decorators.http import require_GET, require_POST
 
 from NEMO.forms import StaffAssistanceRequestForm
 from NEMO.models import StaffAssistanceRequest, Notification, RequestMessage, User
@@ -49,7 +49,7 @@ def staff_assistance_requests(request):
 
 
 @login_required
-@require_http_methods(["GET", "POST"])
+@require_POST
 def create_staff_assistance_request(request, request_id=None):
     if not UserRequestsCustomization.get_bool("staff_assistance_requests_enabled"):
         return HttpResponseBadRequest("Staff assistance requests are not enabled")
@@ -59,38 +59,27 @@ def create_staff_assistance_request(request, request_id=None):
     except StaffAssistanceRequest.DoesNotExist:
         staff_assistance_request = None
 
-    dictionary = {}
-
     if staff_assistance_request:
         if staff_assistance_request.replies.count() > 0:
             return HttpResponseBadRequest("You are not allowed to edit a request that has replies.")
         if staff_assistance_request.user != request.user:
             return HttpResponseBadRequest("You are not allowed to edit a request you didn't create.")
 
-    if request.method == "POST":
-        form = StaffAssistanceRequestForm(request.POST, instance=staff_assistance_request)
-        form.fields["user"].required = False
-        form.fields["creation_time"].required = False
-        if form.is_valid():
-            form.instance.user = request.user
-            created_staff_assistance_request = form.save()
-            send_new_request_emails(
-                created_staff_assistance_request,
-                get_full_url(
-                    f"{reverse('user_requests', kwargs={'tab': 'staff_assistance'})}?#request_{created_staff_assistance_request.id}",
-                    request,
-                ),
-            )
-            create_staff_assistance_request_notification(created_staff_assistance_request)
-            return redirect("user_requests", "staff_assistance")
-        else:
-            dictionary["form"] = form
-            return render(request, "requests/staff_assistance_requests/staff_assistance_request.html", dictionary)
-    else:
-        form = StaffAssistanceRequestForm(instance=staff_assistance_request)
-        form.user = request.user
-        dictionary["form"] = form
-        return render(request, "requests/staff_assistance_requests/staff_assistance_request.html", dictionary)
+    form = StaffAssistanceRequestForm(request.POST, instance=staff_assistance_request)
+    form.fields["user"].required = False
+    form.fields["creation_time"].required = False
+    if form.is_valid():
+        form.instance.user = request.user
+        created_staff_assistance_request = form.save()
+        send_new_request_emails(
+            created_staff_assistance_request,
+            get_full_url(
+                f"{reverse('user_requests', kwargs={'tab': 'staff_assistance'})}?#request_{created_staff_assistance_request.id}",
+                request,
+            ),
+        )
+        create_staff_assistance_request_notification(created_staff_assistance_request)
+    return redirect("user_requests", "staff_assistance")
 
 
 @login_required