(function () {
"use strict";
/* =========================
Helper
========================= */
function isOfficePage() {
const path = (location.pathname || "").toLowerCase();
return (
document.body &&
document.body.classList.contains("com_osproperty") &&
path.includes("find-an-office")
);
}
function getUrl() {
return new URL(window.location.href);
}
function getChipParams(url) {
return {
country: (url.searchParams.get("country") || "").trim(),
state: (url.searchParams.get("state") || "").trim(),
city: (url.searchParams.get("city") || "").trim(),
keyword: (url.searchParams.get("keyword") || "").trim(),
};
}
function setParamsAndReload(patch) {
const url = getUrl();
// Apply patch (null/"" means delete)
Object.keys(patch).forEach((k) => {
const v = patch[k];
if (v === null || v === undefined || String(v).trim() === "") {
url.searchParams.delete(k);
} else {
url.searchParams.set(k, String(v));
}
});
// Force reset to avoid hidden sticky filters
url.searchParams.set("nbreset", "1");
window.location.href = url.toString();
}
/* =========================
A) Auto reset when "clean" (no visible filters)
========================= */
function ensureAllWhenClean() {
if (!isOfficePage()) return;
const url = getUrl();
const hasVisible =
url.searchParams.has("keyword") ||
url.searchParams.has("country") ||
url.searchParams.has("state") ||
url.searchParams.has("city");
const hasReset = url.searchParams.get("nbreset") === "1";
// If totally clean and not resetting, do one-time reset in this tab
if (!hasVisible && !hasReset) {
try {
const key = "noo_office_autoreset_done";
if (sessionStorage.getItem(key) === "1") return;
sessionStorage.setItem(key, "1");
url.searchParams.set("nbreset", "1");
window.location.replace(url.toString());
} catch (e) {}
}
}
/* =========================
B) Chips UI
========================= */
function renderChipsUI() {
if (!isOfficePage()) return;
const form = document.getElementById("ns-form");
const input = document.getElementById("ns-keyword");
const clearBtn = document.getElementById("ns-clear");
// If your custom bar is not present, skip (page still works)
if (!form || !input) return;
// Create container above input (once)
let wrap = document.getElementById("ns-chipbar");
if (!wrap) {
wrap = document.createElement("div");
wrap.id = "ns-chipbar";
wrap.style.display = "flex";
wrap.style.flexWrap = "wrap";
wrap.style.gap = "8px";
wrap.style.margin = "0 0 10px 0";
// insert into your white box container (closest div)
const host = form.querySelector("div") || form;
host.insertBefore(wrap, host.firstChild);
}
const url = getUrl();
const p = getChipParams(url);
// Sync keyword field from URL so it is visible
if (p.keyword && !input.value) input.value = p.keyword;
// Render chips
wrap.innerHTML = "";
function makeChip(label, key) {
const chip = document.createElement("span");
chip.style.display = "inline-flex";
chip.style.alignItems = "center";
chip.style.gap = "6px";
chip.style.padding = "6px 10px";
chip.style.border = "1px solid #d0d7de";
chip.style.borderRadius = "999px";
chip.style.background = "#f8f9fa";
chip.style.fontSize = "13px";
const txt = document.createElement("span");
txt.textContent = label;
const x = document.createElement("button");
x.type = "button";
x.textContent = "×";
x.setAttribute("aria-label", "Remove");
x.style.border = "none";
x.style.background = "#e9ecef";
x.style.width = "22px";
x.style.height = "22px";
x.style.borderRadius = "50%";
x.style.cursor = "pointer";
x.style.lineHeight = "22px";
x.style.padding = "0";
x.addEventListener("click", function () {
const patch = {};
patch[key] = "";
// When removing country, also remove state/city (upper reset)
if (key === "country") {
patch.state = "";
patch.city = "";
}
// When removing state, also remove city
if (key === "state") {
patch.city = "";
}
setParamsAndReload(patch);
});
chip.appendChild(txt);
chip.appendChild(x);
return chip;
}
if (p.country) wrap.appendChild(makeChip(`Country: ${p.country}`, "country"));
if (p.state) wrap.appendChild(makeChip(`State: ${p.state}`, "state"));
if (p.city) wrap.appendChild(makeChip(`City: ${p.city}`, "city"));
// Clear All button
if (p.country || p.state || p.city || p.keyword) {
const clearAll = document.createElement("button");
clearAll.type = "button";
clearAll.textContent = "Clear All";
clearAll.style.marginLeft = "6px";
clearAll.style.padding = "6px 10px";
clearAll.style.border = "1px solid #d0d7de";
clearAll.style.borderRadius = "10px";
clearAll.style.background = "#fff";
clearAll.style.cursor = "pointer";
clearAll.style.fontSize = "13px";
clearAll.addEventListener("click", function () {
setParamsAndReload({
country: "",
state: "",
city: "",
keyword: "",
});
});
wrap.appendChild(clearAll);
}
// Keep your original X button behavior for keyword
if (clearBtn) {
function syncClear() {
clearBtn.style.display = input.value.trim() ? "flex" : "none";
}
syncClear();
input.addEventListener("input", syncClear);
clearBtn.addEventListener("click", function (e) {
e.preventDefault();
setParamsAndReload({
keyword: "",
// do NOT force remove chips here; user might want keep location chips
});
});
}
}
/* =========================
C) Apply chips to OSProperty search (keyword)
=========================
We will set OSProperty "keyword" to a combined text:
- If city exists: "City, State, Country"
- Else if state exists: "State, Country"
- Else if country exists: "Country"
- Else use keyword only
This makes results align AND keyword is visible in OSProperty top module too.
========================= */
function syncChipsToKeyword() {
if (!isOfficePage()) return;
const url = getUrl();
const p = getChipParams(url);
// Build combined keyword
const parts = [];
if (p.city) parts.push(p.city);
if (p.state) parts.push(p.state);
if (p.country) parts.push(p.country);
// If user also typed keyword, append it (more specific)
if (p.keyword) parts.unshift(p.keyword);
const combined = parts.join(", ").trim();
// If there are chips but no keyword param, we still want visible keyword for OSProperty module
// We write it into URL keyword so both bars show it.
if ((p.country || p.state || p.city) && combined) {
// Avoid infinite loop: only set if different
const current = (url.searchParams.get("keyword") || "").trim();
if (current !== combined) {
url.searchParams.set("keyword", combined);
// IMPORTANT: keep country/state/city params as the "true chips",
// keyword is just visible helper
window.history.replaceState({}, "", url.toString());
}
}
}
function boot() {
ensureAllWhenClean();
syncChipsToKeyword();
renderChipsUI();
setTimeout(renderChipsUI, 600);
}
if (document.readyState === "loading") {
document.addEventListener("DOMContentLoaded", boot);
} else {
boot();
}
})();
Home
