From 10bcb52114a29320f345c52dbcbdbb443c2ec147 Mon Sep 17 00:00:00 2001
From: phl0 <github@florian-wolters.de>
Date: Wed, 12 Nov 2025 16:35:40 +0100
Subject: [PATCH] Add function to hide legend on gridmap

---
 assets/css/general.css        |  4 ++++
 assets/js/sections/gridmap.js | 10 +++++++++-
 2 files changed, 13 insertions(+), 1 deletion(-)

diff --git a/assets/css/general.css b/assets/css/general.css
index a4dfef717..0066ed66c 100644
--- a/assets/css/general.css
+++ b/assets/css/general.css
@@ -1398,3 +1398,7 @@ svg text.month { fill: #AAA; }
 		display: flex;
 		flex-direction: column;
 	}
+
+	.legendClose {
+		float: right;
+	}
diff --git a/assets/js/sections/gridmap.js b/assets/js/sections/gridmap.js
index 4ccde0863..f452f77ae 100644
--- a/assets/js/sections/gridmap.js
+++ b/assets/js/sections/gridmap.js
@@ -163,7 +163,9 @@ function plot(visitor, grid_two, grid_four, grid_six, grid_two_confirmed, grid_f
 			if (grids != '') {
 				legend.onAdd = function(map) {
 					let div = L.DomUtil.create("div", "legend");
-					html = "<table border=\"0\">";
+					div.setAttribute('id', 'gridmapLegend');
+					html = '<div align="right" class="legendClose"><small><a href="javascript: hideLegend();">X</a></small></div>';
+					html += "<table border=\"0\">";
 					html += '<i style="background: green"></i><span>' + gridsquares_gridsquares_confirmed + ' ('+grid_four_confirmed.length+')</span><br>';
 					html += '<i style="background: red"></i><span>' + gridsquares_gridsquares_not_confirmed + ' ('+(grid_four.length - grid_four_confirmed.length)+')</span><br>';
 					html += '<tr><td><i style="background: #ffd757"></i><span>' + gridsquares_gridsquares_total_worked + ' ('+(Math.round((grid_four.length / grid_max) * 10000) / 100)+'%):</span></td><td style=\"padding-left: 1em; text-align: right;\"><span>'+(grid_four.length)+' / '+grid_max+'</span></td></tr>';
@@ -174,6 +176,8 @@ function plot(visitor, grid_two, grid_four, grid_six, grid_two_confirmed, grid_f
 			} else {
 				legend.onAdd = function(map) {
 					let div = L.DomUtil.create("div", "legend");
+					div.setAttribute('id', 'gridmapLegend');
+					div.innerHTML += '<div align="right" class="legendClose"><small><a href="javascript: hideLegend();">X</a></small></div>';
 					div.innerHTML += "<h4>" + gridsquares_gridsquares + "</h4>";
 					div.innerHTML += '<i style="background: green"></i><span>' + gridsquares_gridsquares_confirmed + ' ('+grid_four_confirmed.length+')</span><br>';
 					div.innerHTML += '<i style="background: red"></i><span>' + gridsquares_gridsquares_not_confirmed + ' ('+(grid_four.length - grid_four_confirmed.length)+')</span><br>';
@@ -283,6 +287,10 @@ function clearMarkers() {
 	$(".ld-ext-right-clear").prop('disabled', false);
 }
 
+function hideLegend() {
+	$("#gridmapLegend").hide();
+}
+
 $(document).ready(function(){
 	gridPlot(this.form, visitor);
 	$(window).resize(function () {