https://commonwealth-connection.com/static/web_portal/js/legend.js

1// List of options in boundary section in sidebar
2var boundaryOptionList = document.getElementsByName("layer-boundary");
3
4var legendCustomContent = {
5    "FCC Location Fabric":"<div><b>FCC Location Fabric</b></div><div style='padding-left:5px;'><div style='display:flex;align-items:center;'><div style='width:10px;height:10px;background-color:#00e39f;border-radius:25px;margin-right:10px;'>&nbsp;</div>Served</div><div style='display:flex;align-items:center;'><div style='width:10px;height:10px;background-color:#ff0064;border-radius:25px;margin-right:10px;'>&nbsp;</div>Under-Served</div></div>"
6}
7
8boundaryOptionList.forEach((el) => {
9  // Set onClick listener for each option
10  el.onclick = () => {
11    // Set legend Boundary text to option clicked on
12    changeBoundaryLegend(el.labels[0].innerText)
13  }
14})
15
16function changeBoundaryLegend(option){
17
18    let legendContent = option;
19
20    if (option in legendCustomContent){ legendContent = legendCustomContent[option]; }
21
22    $("#legend-boundary-items").html(legendContent);
23}
24
25$(".lengend-title").click(function() {
26  
27  if($("#legend-section-container").css('display') != 'none'){
28	  
29    // Change arrow directions
30    $("#title-chevron").removeClass("fa-chevrons-down")
31    $("#title-chevron").addClass("fa-chevrons-up")
32    
33    $(".lengend-title").removeClass("lengend-title-open");
34    
35    $("#legend-section-container").hide()
36    
37  } else {
38	  
39    // Change arrow directions
40    $("#title-chevron").removeClass("fa-chevrons-up")
41    $("#title-chevron").addClass("fa-chevrons-down")
42    
43    $(".lengend-title").addClass("lengend-title-open");
44    
45    $("#legend-section-container").show()
46    
47  }
48})
49
50// "Export Map to Image" on click function
51$("#export-image").click(async function() {
52  
53  showLoading("export-image")
54
55
56  // Hide the button in legend for two reasons:
57  // 1. So user can't click multiple times and generate many images
58  // 2. Legend is exported to image as well from HTML, the button should 
59  //    not be visible in it  
60  await $("#export-image").css('display', 'none');
61  
62  // Dowload Map Function in export.js
63  mapDownload();
64})
65
66/**
67 * For code to add Boundary layers to legend see the 
68 * functions addLayerToLegend and removeLayerFromLegend in MAP.js
69 */