From 4da54a80b33bbd27e54b418b192533910cbf6821 Mon Sep 17 00:00:00 2001
From: Dipannita Dey <ddey2@illinois.edu>
Date: Mon, 3 Oct 2022 12:00:18 -0500
Subject: [PATCH] New enhancement to delete a section

---
 CHANGELOG.md                |  4 ++++
 app/views/file.scala.html   | 25 +++++++++++++++++++++++++
 public/stylesheets/main.css |  8 ++++++--
 3 files changed, 35 insertions(+), 2 deletions(-)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index 85bd19a86..18e374600 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -5,6 +5,10 @@ All notable changes to this project will be documented in this file.
 The format is based on [Keep a Changelog](http://keepachangelog.com/)
 and this project adheres to [Semantic Versioning](http://semver.org/).
 
+### Unreleased
+
+### Added
+- Added Trash button to delete section [#347](https://github.com/clowder-framework/clowder/issues/347)
 
 ## 1.21.0 - 2022-08-23
 
diff --git a/app/views/file.scala.html b/app/views/file.scala.html
index d6788f083..ed6b3d72b 100644
--- a/app/views/file.scala.html
+++ b/app/views/file.scala.html
@@ -483,6 +483,7 @@ <h4>Sections</h4>
 										<th class="galleriaPosition">Position</th>
 										<th class="galleriaDescr">Description</th>
 										<th class="galleriaFindSimilar">Find</th>
+										<th class="galleriaDelete">Delete</th>
 									</tr>
 								</thead>
 								<tbody>
@@ -541,6 +542,9 @@ <h4>Sections</h4>
 											}
 										</td>
 										<td class="galleriaFindSimilar"><a href="@routes.Search.callSearchMultimediaIndexView(s.id)">Similar</a></td>
+										<td class="galleriaDelete">
+											<button class="btn btn-link" title="Delete the section" onclick="removeSection('@s.id')"><span class="glyphicon glyphicon-trash"></span></button>
+										</td>
 									</tr>
 								}
 								</tbody>
@@ -1167,6 +1171,27 @@ <h4>Tags</h4>
 
 							return false;
 						}
+
+						function removeSection(sectionId) {
+							var request = window.jsRoutes.api.Sections.delete(sectionId).ajax({
+								type: 'DELETE'
+							});
+
+							request.done(function (response, textStatus, jqXHR) {
+								console.log("Response " + textStatus);
+								location.reload();
+							});
+
+							request.fail(function (jqXHR, textStatus, errorThrown){
+								console.error("The following error occurred: " + textStatus, errorThrown);
+								var errMsg = "You must be logged in to remove a section from a file.";
+								if (!checkErrorAndRedirect(jqXHR, errMsg)) {
+									notify("The section was not removed from the file due to : " + errorThrown, "error");
+								}
+							});
+
+							return false;
+						}
 						//The removeTag code is almost identical to the code in tags.scala.html. Should be unified.
 						function removeTag() {
 							var tagId = $(this).attr("id");
diff --git a/public/stylesheets/main.css b/public/stylesheets/main.css
index 774cd1737..906bc9a46 100644
--- a/public/stylesheets/main.css
+++ b/public/stylesheets/main.css
@@ -760,11 +760,15 @@ table#sensorsListTable>thead>tr>th.headerSortDown {
 }
 
 #scrollTableGalleria .galleriaDescr {
-	width: 35%;
+	width: 30%;
 }
 
 #scrollTableGalleria .galleriaFindSimilar {
-	width: 20%;
+	width: 15%;
+}
+
+#scrollTableGalleria .galleriaDelete {
+	width: 10%;
 }
 
 #scrollTableGalleria thead {