From 757b00a39ed6f2fa35335dbdecff191b395f73ca Mon Sep 17 00:00:00 2001
From: Andreas Kristiansen <6977712+AndreasK79@users.noreply.github.com>
Date: Sun, 23 Mar 2025 08:28:14 +0100
Subject: [PATCH] [Flightpath] Changed to fontawesome sat icon

---
 application/views/satellite/passtable.php |   2 +-
 assets/css/general.css                    |  28 ++++++++++++++++++++++
 assets/icons/saticon.png                  | Bin 1081 -> 0 bytes
 assets/js/sections/flightpath.js          |  18 +++++++++++---
 4 files changed, 44 insertions(+), 4 deletions(-)
 delete mode 100644 assets/icons/saticon.png

diff --git a/application/views/satellite/passtable.php b/application/views/satellite/passtable.php
index 2f871f4d8..6828b7e78 100644
--- a/application/views/satellite/passtable.php
+++ b/application/views/satellite/passtable.php
@@ -3,7 +3,7 @@ if (isset($filtered)) {
 	echo '<table style="width:100%" class="satpasstable table-sm table table-bordered table-hover table-striped table-condensed text-center">
 			<thead>
 				<tr id="toptable">
-					<th>' . __("Satellite") . '</th>
+					<th>' . __("Satellite") . ' <i class="fa-solid fa-satellite"></i></th>
 					<th>' . __("AOS Time") . '</th>
 					<th>' . __("LOS Time") . '</th>
 					<th>' . __("Duration") . '</th>
diff --git a/assets/css/general.css b/assets/css/general.css
index 7fb24a14d..b8ede0ea5 100644
--- a/assets/css/general.css
+++ b/assets/css/general.css
@@ -1054,6 +1054,34 @@ label {
 	border-style: solid;
 }
 
+.satellite-label {
+    background-color: rgb(52, 55, 56) !important;
+    color: rgb(255, 255, 255) !important;
+    border: 1px solid #fff; /* White border */
+    padding: 5px 8px;
+    border-radius: 5px;
+}
+
+/* Modify the tooltip's arrow (triangle) */
+.satellite-label::before {
+    border-top-color: rgb(52, 55, 56) !important; /* Triangle color (matches background) */
+    border-width: 6px; /* Keep same size */
+}
+
+/* Create a white border effect around the triangle */
+.satellite-label::after {
+    content: "";
+    position: absolute;
+    border-style: solid;
+    border-width: 8px; /* Slightly larger than ::before */
+    border-color: white transparent transparent transparent; /* White top border */
+    bottom: -16px; /* Match ::before position */
+    left: 50%;
+    transform: translateX(-50%);
+	z-index: -1;
+}
+
+
 .blank-row {
 	height: 20px !important;
 }
diff --git a/assets/icons/saticon.png b/assets/icons/saticon.png
deleted file mode 100644
index e32656299053ac60ce6e1d8b95cb450130f27c62..0000000000000000000000000000000000000000
GIT binary patch
literal 0
HcmV?d00001

literal 1081
zcmV-91jhS`P)<h;3K|Lk000e1NJLTq001BW001Be1ONa5u5^Ow0000WV@Og>004R=
z004l4008;_004mL004C`008P>0026e000+nl3&F}00002VoOIv0063uBQgL0010qN
zS#tmY3ljhU3ljkVnw%H_00Xf}L_t(Y$F-AtOqOLB#(xjr3vy6D6&P5Xb4)y7B!ZeX
zLkevs<yttzLuQkWMUk#-uEVm}$|)@yq-I-XGhI_QM}^H?I8ANi4}mpQn44zx$w82W
zPms^=z53%jB2YQk^KS2Rzt?lU_kG=m#|Ynw0MgbA*nDJHH>zku2qa99Q(r_9fH~+o
zetlxvxON0WzBfWt{^Z-)Qj^`grhion`l8E!R$ANemS+bNDO#xDFN<v79*jenCV(kH
zq$B@qk$6F$*ZZRs_Gb5<IF;LtwsfMUvew?{r6oP)Hn>Jrw4aJ+dsS(zKne0@=V(KV
zKP`l+t3o!{)&=wo(ZLA1{A;~?k=maKM@;o6{l)c`;S?uLrtJR4XmAzP%{@?j8wWpP
zou9PLx(>|ad3#>-#blzPva%~?@^vueI@$hht*1Z*dM&KD7Yg$H*6L98L}y9BbSi{~
z2vftjO4ol*^KR?#uY_I4n0^N%Jdcjt$F<I_L6`;gMJU=kV=o-qHW^~M4_BB-hu&s@
z3~#w(_ww-%PI(7F#wZ_gmBTAct~_qIrAKVX=<?a75u#}P=B2_~0A4?B4e)auz?1yy
zcN)c>6?6OM^g}#<%5v&pE5LWoF|k|(u$kq#tauMNxdPL)#xBsuo)lerCLmpu2%-5}
zS7(${y2Z%yezX{p)dskC#=e|=%Mk^QbR~sloDekIHV)IxBL~9kGYlbXPyv-bbRH05
zvA3;gFmmtnz`f4PJvpd3W@L2u#6Nn_h>vUQL&{ga=Igf|BeRUgZL0e;HH!#9v@yWx
zwaNR4dGpfNq)?bQu6>X~51f6kGS`koATyz-?5nZ+*igGt%fei4(h`Z9vRqrEpXv<Z
z=QoKo6|2&dr#$6pnT~oE=*2VEsQ#OJrFFG2zEJj!xGv|@>SM+^Qu-VL1!Jiw_m)3K
zyxZJd>c_5<G{NDuV(dP%-`N}#n{GLA5s4xOS1P)%D<+jM<Icr}&`f4~tbwR8d>`8p
z1QST|{E&Ej^Tt;%uWpYHpgpYJoALgt^Er{(eE|=VG&!$D8PCHr&p-yYAFkrS{*`O&
zSu-0hgejQHg$GR2@{an154{Zz5Ej$y=OXreZCSrGo1x9^d^GdQACr3hU$JEU-nw{V
zQ&l1f9Sbs}d}!id14oCSgVZ_0wmd_cJ`^6xv!3l9X=?J^8Z~r~?o>bCRd`#-fTMJ0
zHL!%wO0WgS!TpEmyqnt?bFxfk;k)$ykJtHc*obRDWc!Em00000NkvXXu0mjfr*Q&r

diff --git a/assets/js/sections/flightpath.js b/assets/js/sections/flightpath.js
index 97da8887b..743dc019a 100644
--- a/assets/js/sections/flightpath.js
+++ b/assets/js/sections/flightpath.js
@@ -1,9 +1,12 @@
 var satmarker;
 let maidenhead;
 let leafletMap;
-var icon_dot_url = base_url + "assets/icons/saticon.png";
-let saticon = L.icon({ iconUrl: icon_dot_url, iconSize: [30, 30] });
-
+let saticon = L.divIcon({
+    html: '<i class="fa-solid fa-satellite" style="font-size: 24px; color: black; -webkit-text-stroke: 1px white;"></i>',
+    className: '', // Prevents default Leaflet styles
+    iconSize: [30, 30],
+    iconAnchor: [15, 15] // Center the icon
+});
 let homeicon = L.icon({ iconUrl: icon_home_url, iconSize: [15, 15] });
 
 let observerGd = {
@@ -336,6 +339,15 @@ let sats = (function (L, d3, satelliteJs) {
 		}
 	).addTo(leafletMap).on('click', displayUpComingPasses);
 
+	// Add an always-visible label (tooltip)
+	satmarker.bindTooltip(satellite, {
+		permanent: true,  // Always visible
+		direction: "top", // Position label above the marker
+		offset: [0, -20], // Adjust position
+		className: "satellite-label" // Optional: Custom CSS
+		// className: "leaflet-popup-content-wrapper" // Optional: Custom CSS
+	});
+
 	L.marker(
 		[homelat, homelon], {
 			icon: homeicon,