|
23 | 23 | <i class="fas fa-list"></i> |
24 | 24 | Legend |
25 | 25 | </button> |
| 26 | + |
26 | 27 | <button id="centerMap" class="nav-button"> |
27 | 28 | <i class="fas fa-crosshairs"></i> |
28 | 29 | Center |
|
35 | 36 | <i class="fas fa-location-arrow"></i> |
36 | 37 | Tracking |
37 | 38 | </button> |
| 39 | + |
38 | 40 | </div> |
39 | 41 | </div> |
40 | 42 | </nav> |
@@ -91,7 +93,12 @@ <h3>Map Legend</h3> |
91 | 93 | <div class="legend-item"> |
92 | 94 | <input type="checkbox" id="sports-toggle" checked> |
93 | 95 | <span class="legend-color sports"></span> |
94 | | - <span>Sports Facilities</span> |
| 96 | + <span>Sports</span> |
| 97 | + </div> |
| 98 | + <div class="legend-item"> |
| 99 | + <input type="checkbox" id="shops-toggle" checked> |
| 100 | + <span class="legend-color shops"></span> |
| 101 | + <span>Shops</span> |
95 | 102 | </div> |
96 | 103 | <div class="legend-item"> |
97 | 104 | <input type="checkbox" id="parking-toggle" checked> |
@@ -142,21 +149,19 @@ <h3>Map Legend</h3> |
142 | 149 | </div> |
143 | 150 |
|
144 | 151 | <!-- Location Info Sidebar --> |
145 | | - <div class="location-sidebar" id="locationPopup"> |
146 | | - <div class="sidebar-header"> |
147 | | - <h3 id="popupTitle">Location Name</h3> |
148 | | - <button class="close-button" id="closePopup"> |
149 | | - <i class="fas fa-times"></i> |
150 | | - </button> |
151 | | - </div> |
152 | | - <div class="sidebar-content"> |
153 | | - <p id="popupDescription">Location description goes here.</p> |
154 | | - </div> |
155 | | - <div class="sidebar-footer"> |
156 | | - <span class="sidebar-timestamp" id="popupTimestamp"></span> |
157 | | - </div> |
158 | | - </div> |
| 152 | + |
159 | 153 | </div> |
160 | 154 | <script src="script.js"></script> |
| 155 | + <script> |
| 156 | + searchPanel.style.display = 'none'; |
| 157 | + document.getElementById('toggleSearch').addEventListener('click', () => { |
| 158 | + const searchPanel = document.getElementById('searchPanel'); |
| 159 | + if (searchPanel.style.display === 'none' || searchPanel.style.display === '') { |
| 160 | + searchPanel.style.display = 'block'; // Show the search panel |
| 161 | + } else { |
| 162 | + searchPanel.style.display = 'none'; // Hide the search panel |
| 163 | + } |
| 164 | + }); |
| 165 | + </script> |
161 | 166 | </body> |
162 | 167 | </html> |
0 commit comments