3 files changed, 46 insertions, 2 deletions
diff --git a/src/templates/booking/booking_calendar.html b/src/templates/booking/booking_calendar.html
index 52193d5..2e3f970 100644
--- a/src/templates/booking/booking_calendar.html
+++ b/src/templates/booking/booking_calendar.html
@@ -113,6 +113,7 @@
     <script type="text/javascript">
         var bookings_url = "{% url 'booking:bookings_json' resource_id=resource.id %}";
         var booking_detail_prefix = "{% url 'booking:detail_prefix' %}";
+        var booking_delete_prefix = "{% url 'booking:delete_prefix' %}";
         var user_timezone = "{{ request.user.userprofile.timezone }}"
     </script>
 
@@ -123,4 +124,4 @@
     <script src={% static "js/fullcalendar-options.js" %}></script>
     <script src={% static "js/datetimepicker-options.js" %}></script>
     <script src={% static "js/booking-calendar.js" %}></script>
-{% endblock extrajs %}
+{% endblock extrajs %}
+\ No newline at end of file
diff --git a/src/templates/booking/booking_delete.html b/src/templates/booking/booking_delete.html
new file mode 100644
index 0000000..76a5634
--- /dev/null
+++ b/src/templates/booking/booking_delete.html
@@ -0,0 +1,11 @@
+{% load jira_filters %}
+{% load bootstrap3 %}
+
+<p>
+    Really delete Booking from {{ booking.start}} to {{ booking.end }}?
+</p>
+<p>
+    <div id="booking_delete_form_div">
+        <a href="{% url 'booking:delete_booking' booking_id=booking.id %}" class="btn btn btn-danger">Delete Booking</a>
+    </div>
+</p>
+\ No newline at end of file
diff --git a/src/templates/booking/booking_detail.html b/src/templates/booking/booking_detail.html
index dd0bf03..c88cd84 100644
--- a/src/templates/booking/booking_detail.html
+++ b/src/templates/booking/booking_detail.html
@@ -1,5 +1,22 @@
 {% load jira_filters %}
 
+<script type="text/javascript">
+    function deleteClick(id) {
+        var booking_delete_url = booking_delete_prefix + id
+        $.ajax({
+            url: booking_delete_url,
+            type: 'get',
+            success: function (data) {
+                $('#booking_delete_content').html(data);
+            },
+            failure: function (data) {
+                alert('Error finding that booking');
+            }
+        });
+        $('#booking_delete_modal').modal('show');
+    }
+</script>
+
 <p>
     <b>Resource: </b>
     <a href="{{ booking.resource.url }}">
@@ -33,6 +50,21 @@
     <a href="{% url 'booking:edit' booking_id=booking.id resource_id=booking.resource.id  %}" class="btn btn btn-success">
         Edit Booking
     </a>
+    <a href="javascript:deleteClick({{ booking.id }})" class="btn btn btn-danger">
+        Delete Booking
+    </a>
+    <div id="booking_delete_modal" class="modal fade" role="dialog">
+        <div class="modal-dialog">
+            <div class="modal-content">
+                <div class="modal-header">
+                    <button type="button" class="close" data-dismiss="modal">&times;</button>
+                    <h4 class="modal-title">Delete Booking</h4>
+                </div>
+                <div class="modal-body" id="booking_delete_content">
+                </div>
+            </div>
+        </div>
+    </div>
 </p>
 {% endif %}
-{% endif %}
+{% endif %}
+\ No newline at end of file