2nd Brigade “Freedom”

document.addEventListener(“DOMContentLoaded”, function () {

/* —————————–
Config
—————————– */
var TABLE_ID = 6; // TablePress id
var STATES_GEOJSON_URL = “https://armyrotc.army.mil/wp-content/uploads/us-states.json”;

/* —————————–
Helpers
—————————– */
function $(id){ return document.getElementById(id); }

function setPanel(title, html){
var panelTitle = $(“mc-map-state-title”);
var panelContent = $(“mc-map-state-content”);
if (panelTitle) panelTitle.textContent = title || “”;
if (panelContent) panelContent.innerHTML = html || “”;
}

function safeText(cell){
return cell ? (cell.textContent || “”).trim() : “”;
}

function firstLink(cell){
if (!cell) return “”;
var a = cell.querySelector(“a[href]”);
return a ? a.getAttribute(“href”) : “”;
}

function firstEmail(cell){
if (!cell) return “”;
var a = cell.querySelector(“a[href^=’mailto:’]”);
if (a) return (a.getAttribute(“href”) || “”).replace(/^mailto:/i, “”).trim();
var txt = safeText(cell);
var m = txt.match(/[A-Z0-9._%+-]+@[A-Z0-9.-]+\.[A-Z]{2,}/i);
return m ? m[0] : “”;
}

function normalizeHeader(h){
return (h || “”).toString().trim().toLowerCase().replace(/\s+/g, “_”);
}

function slugId(name, state){
var base = (name || “school”).toLowerCase().replace(/[^a-z0-9]+/g, “-“).replace(/^-+|-+$/g, “”);
return (base + “-” + (state || “xx”).toLowerCase()).slice(0, 48);
}

function waitForElById(id, timeoutMs){
var start = Date.now();
return new Promise(function(resolve, reject){
(function check(){
var el = $(id);
if (el) return resolve(el);
if (Date.now() – start > timeoutMs) return reject(new Error(“Element not found: ” + id));
setTimeout(check, 150);
})();
});
}

/* —————————–
Leaflet loader (reliable in Avada)
—————————– */
function loadCssOnce(href){
return new Promise(function(resolve){
var links = Array.from(document.querySelectorAll(“link[rel=’stylesheet’]”));
if (links.some(function(l){ return (l.href || “”).indexOf(href) !== -1; })) return resolve();

var link = document.createElement(“link”);
link.rel = “stylesheet”;
link.href = href;
link.onload = function(){ resolve(); };
link.onerror = function(){ resolve(); };
document.head.appendChild(link);
});
}

function loadScriptOnce(src){
return new Promise(function(resolve, reject){
var scripts = Array.from(document.querySelectorAll(“script[src]”));
if (scripts.some(function(s){ return (s.src || “”).indexOf(src) !== -1; })) return resolve();

var s = document.createElement(“script”);
s.src = src;
s.async = true;
s.onload = function(){ resolve(); };
s.onerror = function(){ reject(new Error(“Failed to load script: ” + src)); };
document.head.appendChild(s);
});
}

async function ensureLeaflet(){
if (window.L && typeof window.L.map === “function”) return;

await loadCssOnce(“https://unpkg.com/leaflet@1.9.4/dist/leaflet.css”);
await loadScriptOnce(“https://unpkg.com/leaflet@1.9.4/dist/leaflet.js”);

var start = Date.now();
while (!(window.L && typeof window.L.map === “function”)){
if (Date.now() – start > 8000) throw new Error(“Leaflet not available after load”);
await new Promise(function(r){ setTimeout(r, 100); });
}
}

/* —————————–
TablePress loader (works with or without thead)
Your lat/lon are now clean numbers, so parseFloat is enough
—————————– */
async function loadSchoolsFromTable(){
var table = await waitForElById(“tablepress-” + TABLE_ID, 20000);

var thead = table.querySelector(“thead”);
var tbody = table.querySelector(“tbody”);
if (!tbody) throw new Error(“TablePress table missing tbody.”);

var headers = [];
if (thead){
headers = Array.from(thead.querySelectorAll(“th”)).map(function(th){
return normalizeHeader(th.textContent || “”);
});
} else {
var firstRow = tbody.querySelector(“tr”);
if (!firstRow) throw new Error(“TablePress table has no rows.”);
headers = Array.from(firstRow.querySelectorAll(“td,th”)).map(function(td){
return normalizeHeader(td.textContent || “”);
});
}

function idx(colName){ return headers.indexOf(colName); }

var idxSchoolId = idx(“school_id”);
var idxSchoolName = idx(“school_name”);
var idxProgram = idx(“program_name”);
var idxCity = idx(“city”);
var idxState = idx(“state”);
var idxLat = idx(“lat”);
var idxLon = idx(“lon”);
var idxPhoneMain = idx(“phone_main”);
var idxPhoneAlt = idx(“phone_alt”);
var idxFax = idx(“fax”);
var idxEmailMain = idx(“email_main”);
var idxEmailAlt = idx(“email_alt”);
var idxWebsite = idx(“website_url”);

if (idxSchoolName === -1 || idxState === -1){
throw new Error(“Missing required columns: school_name and state.”);
}

var rows = Array.from(tbody.querySelectorAll(“tr”));
var startIndex = thead ? 0 : 1;

var schools = [];

for (var r = startIndex; r -1 ? safeText(tds[idxState]) : “”).trim().toUpperCase();
if (!name || !state || state.length !== 2) continue;

var idSeed = (idxSchoolId > -1 ? safeText(tds[idxSchoolId]) : “”);
var id = idSeed ? slugId(idSeed, state) : slugId(name, state);

var city = idxCity > -1 ? safeText(tds[idxCity]) : “”;
var program = idxProgram > -1 ? safeText(tds[idxProgram]) : “”;

var phoneMain = idxPhoneMain > -1 ? safeText(tds[idxPhoneMain]) : “”;
var phoneAlt = idxPhoneAlt > -1 ? safeText(tds[idxPhoneAlt]) : “”;
var fax = idxFax > -1 ? safeText(tds[idxFax]) : “”;

var emailMain = idxEmailMain > -1 ? firstEmail(tds[idxEmailMain]) : “”;
var emailAlt = idxEmailAlt > -1 ? firstEmail(tds[idxEmailAlt]) : “”;

var url = idxWebsite > -1 ? (firstLink(tds[idxWebsite]) || safeText(tds[idxWebsite])) : “”;

var latRaw = idxLat > -1 ? safeText(tds[idxLat]) : “”;
var lonRaw = idxLon > -1 ? safeText(tds[idxLon]) : “”;

var lat = parseFloat(latRaw);
var lon = parseFloat(lonRaw);

schools.push({
id: id,
name: name,
program: program,
city: city,
state: state,
phone_main: phoneMain,
phone_alt: phoneAlt,
fax: fax,
email: emailMain || emailAlt || “”,
url: url,
lat: isFinite(lat) ? lat : null,
lon: isFinite(lon) ? lon : null
});
}

return schools;
}

/* —————————–
Main map init
—————————– */
async function init(){
var mapContainer = $(“mc-map”);
if (!mapContainer) return;

var stateSelect = $(“mc-state-select”);
var resetBtn = $(“mc-map-reset”);
var cardsEl = $(“mc-school-cards”);
var emptyEl = $(“mc-cards-empty”);
var panelContent = $(“mc-map-state-content”);

setPanel(“Loading…”, “Preparing the map.”);

await ensureLeaflet();

var schools = await loadSchoolsFromTable();

var statesResp = await fetch(STATES_GEOJSON_URL, { cache: “no-store” });
if (!statesResp.ok) throw new Error(“Failed to fetch states geojson: ” + statesResp.status);
var usStatesGeoJson = await statesResp.json();

// Group by state
var stateSchools = {};
schools.forEach(function(s){
if (!stateSchools[s.state]) stateSchools[s.state] = [];
stateSchools[s.state].push(s);
});
var targetStateCodes = Object.keys(stateSchools);

targetStateCodes.forEach(function(st){
stateSchools[st].sort(function(a,b){ return (a.name || “”).localeCompare(b.name || “”); });
});

// Dropdown
if (stateSelect){
var opts = ‘– Choose a State –‘;
targetStateCodes.slice().sort().forEach(function(code){
opts += ” + code + “”;
});
stateSelect.innerHTML = opts;
stateSelect.disabled = false;
}
if (resetBtn) resetBtn.disabled = false;

// Map setup
var usBoundsApprox = L.latLngBounds([24.5, -125], [49.5, -66]);

var map = L.map(“mc-map”, {
zoomControl: false,
scrollWheelZoom: false,
maxBounds: usBoundsApprox,
maxBoundsViscosity: 0.7
});

L.tileLayer(“https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png”, {
maxZoom: 18,
attribution: “© OpenStreetMap contributors”
}).addTo(map);

map.createPane(“mcPolygons”);
map.getPane(“mcPolygons”).style.zIndex = 250;

map.createPane(“mcMarkers”);
map.getPane(“mcMarkers”).style.zIndex = 650;

var polygonLayers = {};
var markerLayer = L.layerGroup().addTo(map);
var markersByState = {};
var markersById = {};
var brigadeBounds = null;

// Resolve state abbreviations
var nameToAbbr = {
Alabama:”AL”, Alaska:”AK”, Arizona:”AZ”, Arkansas:”AR”, California:”CA”,
Colorado:”CO”, Connecticut:”CT”, Delaware:”DE”, Florida:”FL”, Georgia:”GA”,
Hawaii:”HI”, Idaho:”ID”, Illinois:”IL”, Indiana:”IN”, Iowa:”IA”,
Kansas:”KS”, Kentucky:”KY”, Louisiana:”LA”, Maine:”ME”, Maryland:”MD”,
Massachusetts:”MA”, Michigan:”MI”, Minnesota:”MN”, Mississippi:”MS”, Missouri:”MO”,
Montana:”MT”, Nebraska:”NE”, Nevada:”NV”, “New Hampshire”:”NH”, “New Jersey”:”NJ”,
“New Mexico”:”NM”, “New York”:”NY”, “North Carolina”:”NC”, “North Dakota”:”ND”,
Ohio:”OH”, Oklahoma:”OK”, Oregon:”OR”, Pennsylvania:”PA”, “Rhode Island”:”RI”,
“South Carolina”:”SC”, “South Dakota”:”SD”, Tennessee:”TN”, Texas:”TX”, Utah:”UT”,
Vermont:”VT”, Virginia:”VA”, Washington:”WA”, “West Virginia”:”WV”,
Wisconsin:”WI”, Wyoming:”WY”
};
function resolveAbbr(feature){
var abbr = feature.id;
if (!abbr || !/^[A-Z]{2}$/.test(abbr)){
var name = feature.properties && (feature.properties.name || feature.properties.NAME);
if (name && nameToAbbr[name]) abbr = nameToAbbr[name];
}
return abbr;
}

function styleForAbbr(abbr){
return targetStateCodes.indexOf(abbr) > -1
? { fillColor:”#C5A300″, fillOpacity:1, color:”#000000″, weight:1.2 }
: { fillColor:”#000000″, fillOpacity:0.75, color:”#222222″, weight:1.1 };
}

function clearMarkers(){ markerLayer.clearLayers(); }

function showMarkersForState(stateCode){
clearMarkers();
(markersByState[stateCode] || []).forEach(function(m){
markerLayer.addLayer(m);
if (m.bringToFront) m.bringToFront();
});
}

function setStateHighlight(active){
Object.keys(polygonLayers).forEach(function(ab){
var layer = polygonLayers[ab];
if (!layer) return;
layer.setStyle(
ab === active
? { fillColor:”#C5A300″, fillOpacity:0.9, color:”#FFFFFF”, weight:1.7 }
: styleForAbbr(ab)
);
});
}

function clearHighlight(){
Object.keys(polygonLayers).forEach(function(ab){
var layer = polygonLayers[ab];
if (!layer) return;
layer.setStyle(styleForAbbr(ab));
});
}

function highlightMarker(id){
Object.keys(markersById).forEach(function(key){
var mk = markersById[key];
if (mk && mk.setStyle){
mk.setStyle({ radius:7, fillColor:”#C5A300″, color:”#FFFFFF”, weight:2, fillOpacity:1, opacity:1 });
}
});
if (id && markersById[id] && markersById[id].setStyle){
markersById[id].setStyle({ radius:9, fillColor:”#FFFFFF”, color:”#C5A300″, weight:3, fillOpacity:1, opacity:1 });
if (markersById[id].bringToFront) markersById[id].bringToFront();
}
}

function renderPanel(stateCode){
var list = stateSchools[stateCode] || [];
if (!stateCode || !list.length){
setPanel(“Select a state”, “Use the map or dropdown to load schools for a state.”);
return;
}

var html = “”;
list.forEach(function(s){
var phones = [s.phone_main, s.phone_alt].filter(Boolean).join(” | “);
var faxLine = s.fax ? (“Fax: ” + s.fax) : “”;
var phoneLine = [phones, faxLine].filter(Boolean).join(” | “);

html += ‘

“;
});

setPanel(stateCode + ” Brigade Universities”, html);
}

function renderCardsForState(stateCode){
if (!cardsEl) return;

var list = stateSchools[stateCode] || [];
if (!stateCode || !list.length){
cardsEl.innerHTML = “”;
cardsEl.classList.add(“is-hidden”);
if (emptyEl) emptyEl.style.display = “block”;
return;
}

cardsEl.classList.remove(“is-hidden”);
if (emptyEl) emptyEl.style.display = “none”;

var html = “”;
list.forEach(function(s){
var phones = [s.phone_main, s.phone_alt].filter(Boolean).join(” | “);
var faxLine = s.fax ? (“Fax: ” + s.fax) : “”;
var phoneLine = [phones, faxLine].filter(Boolean).join(” | “);

html += ‘

‘;
html += ‘

‘;
html += “

” + s.name + “

“;
html += ‘

‘ + (s.city ? (s.city + “, “) : “”) + s.state + “

“;
if (phoneLine) html += ‘

‘ + phoneLine + “

“;
html += ‘

‘;
if (s.email) html += ‘Email ‘;
if (s.url) html += ‘Visit Website‘;
html += “

“;
html += “

“;
html += “

“;
});

cardsEl.innerHTML = html;

Array.from(document.querySelectorAll(“.mc-school-card”)).forEach(function(card){
function go(){
var id = card.getAttribute(“data-school”);
var school = findSchoolById(id);
if (!school) return;
selectState(school.state, { focusSchoolId: id });
}
card.addEventListener(“click”, go);
card.addEventListener(“keydown”, function(e){
if (e.key === “Enter” || e.key === ” “){
e.preventDefault();
go();
}
});
});
}

function highlightPanelSchool(id){
if (!panelContent) return;
Array.from(panelContent.querySelectorAll(“.mc-map-school”)).forEach(function(el){
el.classList.toggle(“mc-map-school–active”, el.getAttribute(“data-school”) === id);
});
}

function findSchoolById(id){
for (var st in stateSchools){
var list = stateSchools[st] || [];
for (var i=0; i if (list[i].id === id) return list[i];
}
}
return null;
}

function zoomToState(code){
var layer = polygonLayers[code];
if (!layer) return;
map.fitBounds(layer.getBounds(), { padding:[60,60] });
if (window.innerWidth -1){
polygonLayers[abbr] = lyr;
lyr.on(“click”, function(){ selectState(abbr); });
}
}
}).addTo(map);

// Markers
targetStateCodes.forEach(function(stateCode){
markersByState[stateCode] = [];

(stateSchools[stateCode] || []).forEach(function(s){
if (!isFinite(s.lat) || !isFinite(s.lon)) return;

var phones = [s.phone_main, s.phone_alt].filter(Boolean).join(” | “);
var faxLine = s.fax ? (“Fax: ” + s.fax) : “”;
var phoneLine = [phones, faxLine].filter(Boolean).join(” | “);

var links = “”;
if (s.email) links += “Email“;
if (s.email && s.url) links += ” | “;
if (s.url) links += “Visit Site“;

var popup = “” + s.name + “
” +
((s.city ? (s.city + “, “) : “”) + s.state) +
(phoneLine ? (“
” + phoneLine) : “”) +
(links ? (“
” + links) : “”);

var m = L.circleMarker([s.lat, s.lon], {
pane: “mcMarkers”,
radius: 7,
fillColor: “#C5A300”,
color: “#FFFFFF”,
weight: 2,
fillOpacity: 1,
opacity: 1
}).bindPopup(popup);

markersById[s.id] = m;
markersByState[stateCode].push(m);

m.on(“click”, function(){
selectState(stateCode, { focusSchoolId: s.id });
});
});
});

// Brigade bounds (FIXED: no clone())
(function computeBrigadeBounds(){
var boundsList = [];
targetStateCodes.forEach(function(ab){
if (polygonLayers[ab]) boundsList.push(polygonLayers[ab].getBounds());
});

if (boundsList.length){
var first = boundsList[0];
var rb = L.latLngBounds(first.getSouthWest(), first.getNorthEast());
for (var i = 1; i < boundsList.length; i++){
rb.extend(boundsList[i]);
}
brigadeBounds = rb;
return;
}

// Fallback to marker bounds
var pts = [];
targetStateCodes.forEach(function(st){
(stateSchools[st] || []).forEach(function(s){
if (isFinite(s.lat) && isFinite(s.lon)) pts.push([s.lat, s.lon]);
});
});
if (pts.length){
brigadeBounds = L.latLngBounds(pts);
}
})();

// Bind controls
if (stateSelect){
stateSelect.addEventListener("change", function(){
var code = (this.value || "").trim().toUpperCase();
if (!code) { resetMap(); return; }
selectState(code);
});
}

if (resetBtn){
resetBtn.addEventListener("click", function(){
resetMap();
});
}

bindPanelClicks();

// Start view
setPanel("Select a state", "Use the map or dropdown to load schools for a state.");
renderCardsForState("");
resetMap();
}

init().catch(function(err){
console.error(err);
var msg = (err && err.message) ? err.message : String(err);
setPanel("Map failed to load", "Error: " + msg);
});

});