Skip to content

Commit

Permalink
Merge pull request #819 from NASA-IMPACT/117-all-delete-buttons-shoul…
Browse files Browse the repository at this point in the history 
…d-have-modal-popup

117 all delete buttons should have modal popup
  • Loading branch information
@emshahh
emshahh authored Jun 10, 2024
2 parents 6d86ce9 + 8462e10 commit cbc4b9b
Show file tree
Hide file tree
Showing 4 changed files with 204 additions and 11 deletions.
92 changes: 83 additions & 9 deletions sde_indexing_helper/static/js/candidate_url_list.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -13,6 +13,8 @@ var matchPatternTypeMap = {
"Individual URL Pattern": 1,
"Multi-URL Pattern": 2,
};
var currentURLtoDelete;

var uniqueId; //used for logic related to contents on column customization modal
const dict = {
1: "Images",
Expand Down Expand Up @@ -849,39 +851,43 @@ function handleExcludeIndividualUrlClick() {

function handleDeleteExcludePatternButtonClick() {
$("body").on("click", ".delete-exclude-pattern-button", function () {
row_id = $(this).data("row-id");
var patternRowId = $(this).data("row-id");
currentURLtoDelete = `/api/exclude-patterns/${patternRowId}/`;
deletePattern(
`/api/exclude-patterns/${row_id}/`,
`/api/exclude-patterns/${patternRowId}/`,
(data_type = "Exclude Pattern")
);
});
}

function handleDeleteIncludePatternButtonClick() {
$("body").on("click", ".delete-include-pattern-button", function () {
row_id = $(this).data("row-id");
var patternRowId = $(this).data("row-id");
currentURLtoDelete = `/api/include-patterns/${patternRowId}/`;
deletePattern(
`/api/include-patterns/${row_id}/`,
`/api/include-patterns/${patternRowId}/`,
(data_type = "Include Pattern")
);
});
}

function handleDeleteTitlePatternButtonClick() {
$("body").on("click", ".delete-title-pattern-button", function () {
row_id = $(this).data("row-id");
var patternRowId = $(this).data("row-id");
currentURLtoDelete = `/api/title-patterns/${patternRowId}/`;
deletePattern(
`/api/title-patterns/${row_id}/`,
`/api/title-patterns/${patternRowId}/`,
(data_type = "Title Pattern")
);
});
}

function handleDeleteDocumentTypeButtonClick() {
$("body").on("click", ".delete-document-type-pattern-button", function () {
row_id = $(this).data("row-id");
patternRowId = $(this).data("row-id");
currentURLtoDelete = `/api/document-type-patterns/${patternRowId}/`;
deletePattern(
`/api/document-type-patterns/${row_id}/`,
`/api/document-type-patterns/${patternRowId}/`,
(data_type = "Document Type Pattern")
);
});
Expand All @@ -902,6 +908,7 @@ function handleNewTitleChange() {
var match_pattern_type = $(this).data("match-pattern-type");
var candidate_urls_count = $(this).data("candidate-urls-count");
if (!title_pattern) {
currentURLtoDelete = `/api/title-patterns/${generated_title_id}/`;
deletePattern(
`/api/title-patterns/${generated_title_id}/`,
(data_type = "Title Pattern"),
Expand Down Expand Up @@ -1146,10 +1153,77 @@ function deletePattern(
`YOU ARE ATTEMPTING TO DELETE A MULTI-URL PATTERN. THIS WILL AFFECT ${candidate_urls_count} URLs. \n\nAre you sure you want to do this? Currently there is no way to delete a single URL from a Multi-URL pattern`
);
} else {
var confirmDelete = confirm(
$modal = $("#deletePatternModal").modal({
backdrop: "static",
keyboard: true,
});

$(".delete-pattern-caption").text(
`Are you sure you want to delete this ${data_type}?`
);
}

$("#deletePatternModal").on("keydown", function (event) {
if (event.keyCode === 13) {
// Check if the focused element is the button
if (
document.activeElement.id === "deletePatternModal" &&
url === currentURLtoDelete
) {
// Simulate a click event on the button
$.ajax({
url: url,
type: "DELETE",
data: {
csrfmiddlewaretoken: csrftoken,
},
headers: {
"X-CSRFToken": csrftoken,
},
success: function (data) {
$modal = $("#deletePatternModal").modal("hide");
$("#candidate_urls_table").DataTable().ajax.reload(null, false);
$("#exclude_patterns_table").DataTable().ajax.reload(null, false);
$("#include_patterns_table").DataTable().ajax.reload(null, false);
$("#title_patterns_table").DataTable().ajax.reload(null, false);
$("#document_type_patterns_table")
.DataTable()
.ajax.reload(null, false);
},
});
}
}
});

$("#deletePatternModalForm").on("click", "button", function (event) {
event.preventDefault();
var buttonId = $(this).attr("id");
if (buttonId === "dontDeletePattern") {
$modal = $("#deletePatternModal").modal("hide");
return;
} else if (buttonId === "deletePattern" && url === currentURLtoDelete) {
$.ajax({
url: url,
type: "DELETE",
data: {
csrfmiddlewaretoken: csrftoken,
},
headers: {
"X-CSRFToken": csrftoken,
},
success: function (data) {
$("#candidate_urls_table").DataTable().ajax.reload(null, false);
$("#exclude_patterns_table").DataTable().ajax.reload(null, false);
$("#include_patterns_table").DataTable().ajax.reload(null, false);
$("#title_patterns_table").DataTable().ajax.reload(null, false);
$("#document_type_patterns_table")
.DataTable()
.ajax.reload(null, false);
},
});
}
});

if (!confirmDelete) {
return;
}
Expand Down
66 changes: 66 additions & 0 deletions sde_indexing_helper/static/js/collection_detail.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,6 +2,7 @@ var collection_id;
var newDivisionVal;
var currentDivisionVal;
var currentDivisonText;
var currentUrlToDelete;

let originalValue = document.getElementById("github-link-display").textContent;
document.getElementById("github-link-form").style.display = "none";
Expand Down Expand Up @@ -63,6 +64,71 @@ $(document).ready(function() {
}
})

//////////////////////////////
///// DELETE URL CHANGE //////
//////////////////////////////

function handleDeleteURLButtonClick(dataId, dataURL) {
$modal = $("#deleteURLModal").modal();
$(".delete-URL-caption").text(`Are you sure you want to delete ${dataURL}?`);
$("#deleteURLModal").on("keydown", function (event) {
if (event.keyCode === 13) {
// Check if the focused element is the button
if (document.activeElement.id === "deleteURLModal") {
// Simulate a click event on the button
$.ajax({
url: "/delete-required-url/" + dataId,
type: "POST",
headers: {
"X-CSRFToken": csrftoken,
},
success: function (data) {
window.location.reload();
},
error: function (xhr, textStatus, errorThrown) {
console.log("Error:", errorThrown);
toastr.error("Error deleting URL.");
},
});
}
}
});

$("#deleteURLModalForm").on("click", "button", function (event) {
event.preventDefault();
var buttonId = $(this).attr("id");

if (buttonId === "cancelURLDeletion") {
$modal = $("#deleteURLModal").modal("hide");
return;
} else if (buttonId === "deleteURL" && dataId === currentUrlToDelete) {
$.ajax({
url: "/delete-required-url/" + dataId,
type: "POST",
headers: {
"X-CSRFToken": csrftoken,
},
success: function (data) {
window.location.reload();
},
error: function (xhr, textStatus, errorThrown) {
console.log("Error:", errorThrown);
toastr.error("Error deleting URL.");
},
});
}
});
}

$(document).ready(function () {
$("body").on("click", ".urlDeleteButton", function (e) {
e.preventDefault();
var dataId = $(this).data("id");
currentUrlToDelete = dataId.id;
handleDeleteURLButtonClick(dataId.id, dataId.url);
});
});

//////////////////////////////
///// DIVISION CHANGE ////////
//////////////////////////////
Expand Down
27 changes: 27 additions & 0 deletions sde_indexing_helper/templates/sde_collections/candidate_urls_list.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -418,5 +418,32 @@ <h5 class="modalTitle whiteText" id="hideShowColumnsModalTitle">Customize Column
</div>


<div class="modal" id="deletePatternModal" tabindex="-1"
aria-labelledby="deletePatternModal" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modalHeader">
<button type="button" class="close modal-close" data-dismiss="modal" aria-label="Close" id="closeDivisionModal">
<span aria-hidden="true">&times;</span>
</button>
</div>
<div class="modal-body" id="modal-body">
<h5 class="modal-title">Are you sure?</h5>
<p class="delete-pattern-caption" id="caption"></p>
</div>
<div class="modal-footer">
<form id="deletePatternModalForm">
<div class="button-wrapper">
<button type="submit" class="btn btn-secondary modal-button-1" id="dontDeletePattern">No</button>
<button type="submit" class="btn btn-primary modal-button-2" data-dismiss="modal" id="deletePattern">Yes</button>
</div>
</form>
</div>
</div>
</div>
</div>




{% endblock content %}
30 changes: 28 additions & 2 deletions sde_indexing_helper/templates/sde_collections/collection_detail.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -209,10 +209,10 @@ <h1 class="nameWrapper"><div class="collectionName" id="collectionName">{{ colle
<td>
{% for required_url in required_urls %}
<div>
<form class="reqUrlForm" action="{% url 'sde_collections:delete_required_url' required_url.pk %}">
<form class="reqUrlForm">
{% csrf_token %}
<button type="submit" class="btn btn-sm btn-danger urlDeleteButton delete_required_url pull-left"
data-id={{ required_url.pk }}>
data-id='{"id": "{{ required_url.pk }}", "url": "{{ required_url.url }}"}'>
<i class="material-icons">delete</i>
</button>
</form>
Expand Down Expand Up @@ -345,6 +345,32 @@ <h5 class="modal-title">Rename Collection</h5>
</div>
</div>


<div class="modal" id="deleteURLModal" tabindex="-1"
aria-labelledby="deleteURLModal" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close modal-close" data-dismiss="modal" aria-label="Close" id="closeDeleteURLModal">
<span aria-hidden="true">&times;</span>
</button>
</div>
<div class="modal-body" id="modal-body">
<h5 class="modal-title">Are you sure?</h5>
<p class="delete-URL-caption" id="caption"></p>
</div>
<div class="modal-footer">
<form id="deleteURLModalForm">
<div class="button-wrapper">
<button type="submit" class="btn btn-secondary modal-button-1" id="cancelURLDeletion">No</button>
<button type="submit" class="btn btn-primary modal-button-2" data-dismiss="modal" id="deleteURL">Yes</button>
</div>
</form>
</div>
</div>
</div>
</div>

{% endblock content %}
{% block javascripts %}
<script src="{% static 'js/collection_detail.js' %}"></script>
Expand Down

0 comments on commit cbc4b9b

Please sign in to comment.