1 {% extends "base.html" %}
4 <div class="card_container">
5 {% for image in images %}
7 <div class="card-header">
8 <h3>Image {{image.id}}</h3>
10 <div class="card-body">
11 <ul class="list-group">
12 <li class="list-group-item">id: {{image.id}}</li>
13 <li class="list-group-item">lab: {{image.from_lab.name}}</li>
14 <li class="list-group-item">name: {{image.name}}</li>
15 <li class="list-group-item">description: {{image.description}}</li>
16 <li class="list-group-item">host profile: {{image.host_type.name}}</li>
19 <div class="card-footer">
21 class="btn btn-danger w-100"
22 onclick='delete_image({{image.id}});'
24 data-target="#imageModal"
30 <h2>Public Images</h2>
31 <div class="card_container">
32 {% for image in public_images %}
34 <div class="card-header">
35 <h3>Image {{image.id}}</h3>
37 <div class="card-body">
38 <ul class="list-group">
39 <li class="list-group-item">id: {{image.id}}</li>
40 <li class="list-group-item">lab: {{image.from_lab.name}}</li>
41 <li class="list-group-item">name: {{image.name}}</li>
42 <li class="list-group-item">description: {{image.description}}</li>
43 <li class="list-group-item">host profile: {{image.host_type.name}}</li>
51 var current_image_id = -1;
52 var used_images = {{used_images|safe|default:"{}"}};
53 function delete_image(image_id) {
54 current_image_id = image_id;
55 document.getElementById('modal_warning').style['max-height'] = '0px';
56 var warning_header = document.getElementById("warning_header");
57 var warning_text = document.getElementById("warning_text");
58 var delete_image_button = document.getElementById("final_delete_b");
59 clear(warning_header);
61 if(used_images[image_id]) {
62 warning_header.appendChild(
63 document.createTextNode("Cannot Delete")
65 warning_text.appendChild(
66 document.createTextNode("This snapshot is being used in a booking.")
68 delete_image_button.disabled = true;
70 warning_header.appendChild(
71 document.createTextNode("Are You Sure?")
73 warning_text.appendChild(
74 document.createTextNode("This cannot be undone")
76 delete_image_button.removeAttribute("disabled");
80 function submit_delete_form() {
81 var ajaxForm = $("#image_delete_form");
82 var formData = ajaxForm.serialize();
83 req = new XMLHttpRequest();
84 var url = "delete/" + current_image_id;
85 req.open("POST", url, true);
86 req.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
87 req.onerror = function() { alert("problem submitting form"); }
91 function clear(node) {
92 while(node.lastChild) {
93 node.removeChild(node.lastChild);
97 <div class="modal fade" id="imageModal" tabindex="-1" role="dialog" aria-labelledby="my_modal" aria-hidden="true">
98 <div class="modal-dialog" style="width: 450px;" role="document">
99 <div class="modal-content">
100 <div class="modal-header">
101 <h4 class="modal-title" id="my_modal" style="display: inline; float: left;">Delete Configuration?</h4>
102 <button type="button" class="close" data-dismiss="modal" aria-label="Close">
103 <span aria-hidden="true">×</span>
106 <form id="image_delete_form">
109 <div class="modal-footer">
110 <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
111 <button type="button" class="btn btn-primary" onclick="document.getElementById('modal_warning').style['max-height'] = '500px';">Delete</button>
113 <div id="modal_warning" class="modal-footer" style="max-height:0px;" >
114 <div style="text-align:center; margin: 5px">
115 <h3 id="warning_header">Are You Sure?</h3>
116 <p id="warning_text">This cannot be undone</p>
117 <button class="btn" onclick="document.getElementById('modal_warning').style['max-height'] = '0px';">Nevermind</button>
118 <button id="final_delete_b" class="btn btn-danger" data-dismiss="modal" onclick="submit_delete_form();">I'm Sure</button>