mirror of
https://git.ianrenton.com/ian/spothole.git
synced 2026-09-20 14:27:42 +00:00
In the JS UI, turn each category of Activity into a collapsible section to save space #147
This commit is contained in:
+20
-20
@@ -4,7 +4,7 @@ from data.activity import Activity
|
|||||||
from data.band import Band
|
from data.band import Band
|
||||||
|
|
||||||
# General software
|
# General software
|
||||||
SOFTWARE_VERSION = "2.1"
|
SOFTWARE_VERSION = "2.2-pre"
|
||||||
|
|
||||||
# HTTP headers used for spot providers that use HTTP
|
# HTTP headers used for spot providers that use HTTP
|
||||||
HTTP_HEADERS = {"User-Agent": f"Spothole v{SOFTWARE_VERSION} (operated by {SERVER_OWNER_CALLSIGN})"}
|
HTTP_HEADERS = {"User-Agent": f"Spothole v{SOFTWARE_VERSION} (operated by {SERVER_OWNER_CALLSIGN})"}
|
||||||
@@ -13,10 +13,10 @@ HAMQTH_PRG = f"Spothole v{SOFTWARE_VERSION} operated by {SERVER_OWNER_CALLSIGN}"
|
|||||||
# Activities
|
# Activities
|
||||||
ACTIVITIES = [
|
ACTIVITIES = [
|
||||||
Activity(
|
Activity(
|
||||||
name="AMSAT",
|
name="Satellite",
|
||||||
comment_names=[],
|
comment_names=[],
|
||||||
description="Amateur Radio Satellites",
|
description="Amateur Radio Satellite",
|
||||||
sig_type=ActivityType.WORLDWIDE,
|
sig_type=ActivityType.TRADITIONAL,
|
||||||
icon="fa-satellite",
|
icon="fa-satellite",
|
||||||
refs_globally_unique=False,
|
refs_globally_unique=False,
|
||||||
),
|
),
|
||||||
@@ -24,7 +24,7 @@ ACTIVITIES = [
|
|||||||
name="EME",
|
name="EME",
|
||||||
comment_names=[],
|
comment_names=[],
|
||||||
description="Moonbounce",
|
description="Moonbounce",
|
||||||
sig_type=ActivityType.WORLDWIDE,
|
sig_type=ActivityType.TRADITIONAL,
|
||||||
icon="fa-moon",
|
icon="fa-moon",
|
||||||
refs_globally_unique=False,
|
refs_globally_unique=False,
|
||||||
),
|
),
|
||||||
@@ -32,7 +32,7 @@ ACTIVITIES = [
|
|||||||
name="POTA",
|
name="POTA",
|
||||||
comment_names=["POTA"],
|
comment_names=["POTA"],
|
||||||
description="Parks on the Air",
|
description="Parks on the Air",
|
||||||
sig_type=ActivityType.WORLDWIDE,
|
sig_type=ActivityType.ADVENTURE,
|
||||||
ref_type=ActivityRefType.PARK,
|
ref_type=ActivityRefType.PARK,
|
||||||
ref_regex=r"[A-Z]{2}\-\d{4,5}|K\-TEST",
|
ref_regex=r"[A-Z]{2}\-\d{4,5}|K\-TEST",
|
||||||
icon="fa-tree",
|
icon="fa-tree",
|
||||||
@@ -42,7 +42,7 @@ ACTIVITIES = [
|
|||||||
name="SOTA",
|
name="SOTA",
|
||||||
comment_names=["SOTA"],
|
comment_names=["SOTA"],
|
||||||
description="Summits on the Air",
|
description="Summits on the Air",
|
||||||
sig_type=ActivityType.WORLDWIDE,
|
sig_type=ActivityType.ADVENTURE,
|
||||||
ref_type=ActivityRefType.SUMMIT,
|
ref_type=ActivityRefType.SUMMIT,
|
||||||
ref_regex=r"[A-Z0-9]{1,3}\/[A-Z]{2}\-\d{3}",
|
ref_regex=r"[A-Z0-9]{1,3}\/[A-Z]{2}\-\d{3}",
|
||||||
icon="fa-mountain-sun",
|
icon="fa-mountain-sun",
|
||||||
@@ -52,7 +52,7 @@ ACTIVITIES = [
|
|||||||
name="WWFF",
|
name="WWFF",
|
||||||
comment_names=["WWFF"],
|
comment_names=["WWFF"],
|
||||||
description="World Wide Flora & Fauna",
|
description="World Wide Flora & Fauna",
|
||||||
sig_type=ActivityType.WORLDWIDE,
|
sig_type=ActivityType.ADVENTURE,
|
||||||
ref_type=ActivityRefType.PARK,
|
ref_type=ActivityRefType.PARK,
|
||||||
ref_regex=r"[A-Z0-9]{1,3}FF\-\d{4}",
|
ref_regex=r"[A-Z0-9]{1,3}FF\-\d{4}",
|
||||||
icon="fa-seedling",
|
icon="fa-seedling",
|
||||||
@@ -62,7 +62,7 @@ ACTIVITIES = [
|
|||||||
name="GMA",
|
name="GMA",
|
||||||
comment_names=["GMA"],
|
comment_names=["GMA"],
|
||||||
description="Global Mountain Activity",
|
description="Global Mountain Activity",
|
||||||
sig_type=ActivityType.WORLDWIDE,
|
sig_type=ActivityType.ADVENTURE,
|
||||||
ref_type=ActivityRefType.SUMMIT,
|
ref_type=ActivityRefType.SUMMIT,
|
||||||
ref_regex=r"[A-Z0-9]{1,3}\/[A-Z]{2}\-\d{3}",
|
ref_regex=r"[A-Z0-9]{1,3}\/[A-Z]{2}\-\d{3}",
|
||||||
icon="fa-person-hiking",
|
icon="fa-person-hiking",
|
||||||
@@ -72,7 +72,7 @@ ACTIVITIES = [
|
|||||||
name="WWBOTA",
|
name="WWBOTA",
|
||||||
comment_names=["WWBOTA", "BOTA"],
|
comment_names=["WWBOTA", "BOTA"],
|
||||||
description="Worldwide Bunkers on the Air",
|
description="Worldwide Bunkers on the Air",
|
||||||
sig_type=ActivityType.WORLDWIDE,
|
sig_type=ActivityType.ADVENTURE,
|
||||||
ref_type=ActivityRefType.BUNKER,
|
ref_type=ActivityRefType.BUNKER,
|
||||||
ref_regex=r"B\/[A-Z0-9]{1,3}\-\d{3,4}",
|
ref_regex=r"B\/[A-Z0-9]{1,3}\-\d{3,4}",
|
||||||
icon="fa-radiation",
|
icon="fa-radiation",
|
||||||
@@ -82,7 +82,7 @@ ACTIVITIES = [
|
|||||||
name="HEMA",
|
name="HEMA",
|
||||||
comment_names=["HEMA"],
|
comment_names=["HEMA"],
|
||||||
description="HuMPs Excluding Marilyns Award",
|
description="HuMPs Excluding Marilyns Award",
|
||||||
sig_type=ActivityType.WORLDWIDE,
|
sig_type=ActivityType.ADVENTURE,
|
||||||
ref_type=ActivityRefType.SUMMIT,
|
ref_type=ActivityRefType.SUMMIT,
|
||||||
ref_regex=r"[A-Z0-9]{1,3}\/[A-Z]{3}\-\d{3}",
|
ref_regex=r"[A-Z0-9]{1,3}\/[A-Z]{3}\-\d{3}",
|
||||||
icon="fa-mound",
|
icon="fa-mound",
|
||||||
@@ -92,7 +92,7 @@ ACTIVITIES = [
|
|||||||
name="IOTA",
|
name="IOTA",
|
||||||
comment_names=["IOTA"],
|
comment_names=["IOTA"],
|
||||||
description="Islands on the Air",
|
description="Islands on the Air",
|
||||||
sig_type=ActivityType.WORLDWIDE,
|
sig_type=ActivityType.ADVENTURE,
|
||||||
ref_type=ActivityRefType.ISLAND,
|
ref_type=ActivityRefType.ISLAND,
|
||||||
ref_regex=r"[A-Z]{2}\-\d{3}",
|
ref_regex=r"[A-Z]{2}\-\d{3}",
|
||||||
icon="fa-book-atlas",
|
icon="fa-book-atlas",
|
||||||
@@ -102,7 +102,7 @@ ACTIVITIES = [
|
|||||||
name="GMA Islands",
|
name="GMA Islands",
|
||||||
comment_names=[],
|
comment_names=[],
|
||||||
description="Global Mountain Activity - Islands",
|
description="Global Mountain Activity - Islands",
|
||||||
sig_type=ActivityType.WORLDWIDE,
|
sig_type=ActivityType.ADVENTURE,
|
||||||
ref_type=ActivityRefType.ISLAND,
|
ref_type=ActivityRefType.ISLAND,
|
||||||
ref_regex=r"(([A-Z]{2}\-\d{3})|([A-Z0-9]{1,3}\/[A-Z]{2}\-\d{3}))",
|
ref_regex=r"(([A-Z]{2}\-\d{3})|([A-Z0-9]{1,3}\/[A-Z]{2}\-\d{3}))",
|
||||||
icon="fa-person-hiking",
|
icon="fa-person-hiking",
|
||||||
@@ -112,7 +112,7 @@ ACTIVITIES = [
|
|||||||
name="ARLHS",
|
name="ARLHS",
|
||||||
comment_names=["ARLHS"],
|
comment_names=["ARLHS"],
|
||||||
description="Amateur Radio Lighthouse Society",
|
description="Amateur Radio Lighthouse Society",
|
||||||
sig_type=ActivityType.WORLDWIDE,
|
sig_type=ActivityType.ADVENTURE,
|
||||||
ref_type=ActivityRefType.LIGHTHOUSE,
|
ref_type=ActivityRefType.LIGHTHOUSE,
|
||||||
ref_regex=r"[A-Z]{3}[\- ]\d{3,4}",
|
ref_regex=r"[A-Z]{3}[\- ]\d{3,4}",
|
||||||
icon="fa-house-flood-water",
|
icon="fa-house-flood-water",
|
||||||
@@ -142,7 +142,7 @@ ACTIVITIES = [
|
|||||||
name="SIOTA",
|
name="SIOTA",
|
||||||
comment_names=["SIOTA"],
|
comment_names=["SIOTA"],
|
||||||
description="Silos on the Air",
|
description="Silos on the Air",
|
||||||
sig_type=ActivityType.WORLDWIDE,
|
sig_type=ActivityType.ADVENTURE,
|
||||||
ref_type=ActivityRefType.SILO,
|
ref_type=ActivityRefType.SILO,
|
||||||
ref_regex=r"[A-Z]{2}\-[A-Z]{3}\d",
|
ref_regex=r"[A-Z]{2}\-[A-Z]{3}\d",
|
||||||
icon="fa-wheat-awn",
|
icon="fa-wheat-awn",
|
||||||
@@ -152,7 +152,7 @@ ACTIVITIES = [
|
|||||||
name="WCA",
|
name="WCA",
|
||||||
comment_names=["WCA"],
|
comment_names=["WCA"],
|
||||||
description="World Castles Award",
|
description="World Castles Award",
|
||||||
sig_type=ActivityType.WORLDWIDE,
|
sig_type=ActivityType.ADVENTURE,
|
||||||
ref_type=ActivityRefType.CASTLE,
|
ref_type=ActivityRefType.CASTLE,
|
||||||
ref_regex=r"[A-Z0-9]{1,3}\-\d{5}",
|
ref_regex=r"[A-Z0-9]{1,3}\-\d{5}",
|
||||||
icon="fa-chess-rook",
|
icon="fa-chess-rook",
|
||||||
@@ -184,7 +184,7 @@ ACTIVITIES = [
|
|||||||
name="BOTA",
|
name="BOTA",
|
||||||
comment_names=[],
|
comment_names=[],
|
||||||
description="Beaches on the Air",
|
description="Beaches on the Air",
|
||||||
sig_type=ActivityType.WORLDWIDE,
|
sig_type=ActivityType.ADVENTURE,
|
||||||
ref_type=ActivityRefType.BEACH,
|
ref_type=ActivityRefType.BEACH,
|
||||||
icon="fa-umbrella-beach",
|
icon="fa-umbrella-beach",
|
||||||
refs_globally_unique=False,
|
refs_globally_unique=False,
|
||||||
@@ -215,7 +215,7 @@ ACTIVITIES = [
|
|||||||
name="LLOTA",
|
name="LLOTA",
|
||||||
comment_names=["LLOTA"],
|
comment_names=["LLOTA"],
|
||||||
description="Lagos y Lagunas on the Air",
|
description="Lagos y Lagunas on the Air",
|
||||||
sig_type=ActivityType.WORLDWIDE,
|
sig_type=ActivityType.ADVENTURE,
|
||||||
ref_type=ActivityRefType.LAKE,
|
ref_type=ActivityRefType.LAKE,
|
||||||
ref_regex=r"LL[A-Z]{2}\-\d{4}",
|
ref_regex=r"LL[A-Z]{2}\-\d{4}",
|
||||||
icon="fa-water",
|
icon="fa-water",
|
||||||
@@ -225,7 +225,7 @@ ACTIVITIES = [
|
|||||||
name="Towers",
|
name="Towers",
|
||||||
comment_names=["TOTA"],
|
comment_names=["TOTA"],
|
||||||
description="Towers on the Air",
|
description="Towers on the Air",
|
||||||
sig_type=ActivityType.WORLDWIDE,
|
sig_type=ActivityType.ADVENTURE,
|
||||||
ref_type=ActivityRefType.TOWER,
|
ref_type=ActivityRefType.TOWER,
|
||||||
ref_regex=r"[A-Z]{2,3}R\-\d{4}",
|
ref_regex=r"[A-Z]{2,3}R\-\d{4}",
|
||||||
icon="fa-tower-observation",
|
icon="fa-tower-observation",
|
||||||
@@ -235,7 +235,7 @@ ACTIVITIES = [
|
|||||||
name="Tiles",
|
name="Tiles",
|
||||||
comment_names=[],
|
comment_names=[],
|
||||||
description="Tiles on the Air",
|
description="Tiles on the Air",
|
||||||
sig_type=ActivityType.WORLDWIDE,
|
sig_type=ActivityType.ADVENTURE,
|
||||||
ref_type=ActivityRefType.GRID,
|
ref_type=ActivityRefType.GRID,
|
||||||
ref_regex=r"[A-Za-z]{2}[0-9]{2}[A-Za-z]{2}",
|
ref_regex=r"[A-Za-z]{2}[0-9]{2}[A-Za-z]{2}",
|
||||||
icon="fa-square",
|
icon="fa-square",
|
||||||
|
|||||||
+2
-1
@@ -124,7 +124,8 @@ class AlertType(str, Enum):
|
|||||||
class ActivityType(str, Enum):
|
class ActivityType(str, Enum):
|
||||||
"""Type of an activity. Used to group them in the web UI."""
|
"""Type of an activity. Used to group them in the web UI."""
|
||||||
|
|
||||||
WORLDWIDE = "WORLDWIDE"
|
TRADITIONAL = "TRADITIONAL"
|
||||||
|
ADVENTURE = "ADVENTURE"
|
||||||
REGIONAL = "REGIONAL"
|
REGIONAL = "REGIONAL"
|
||||||
EVENT = "EVENT"
|
EVENT = "EVENT"
|
||||||
|
|
||||||
|
|||||||
+1
-1
@@ -1,6 +1,6 @@
|
|||||||
[project]
|
[project]
|
||||||
name = "spothole"
|
name = "spothole"
|
||||||
version = "2.1"
|
version = "2.2-pre"
|
||||||
authors = [
|
authors = [
|
||||||
{ name = "Ian Renton", email = "ian@ianrenton.com" },
|
{ name = "Ian Renton", email = "ian@ianrenton.com" },
|
||||||
]
|
]
|
||||||
|
|||||||
@@ -917,10 +917,11 @@ components:
|
|||||||
ActivityType:
|
ActivityType:
|
||||||
type: string
|
type: string
|
||||||
enum:
|
enum:
|
||||||
- WORLDWIDE
|
- TRADITIONAL
|
||||||
|
- ADVENTURE
|
||||||
- REGIONAL
|
- REGIONAL
|
||||||
- EVENT
|
- EVENT
|
||||||
example: WORLDWIDE
|
example: TRADITIONAL
|
||||||
|
|
||||||
ActivityNameIncludingNoSig:
|
ActivityNameIncludingNoSig:
|
||||||
oneOf:
|
oneOf:
|
||||||
@@ -1597,16 +1598,16 @@ components:
|
|||||||
sig_type:
|
sig_type:
|
||||||
type: boolean
|
type: boolean
|
||||||
description: >
|
description: >
|
||||||
Whether the activity is worldwide, regional, or for a specific event. Generally for Spothole's own
|
Whether the activity is traditional (e.g. EME), adventure (e.g. POTA), regional (e.g. WAB), or for a
|
||||||
internal use, clients probably won't need this. Used to group them in the web UI. Still named
|
specific event (e.g. MOTA). Generally for Spothole's own internal use, clients probably won't need this.
|
||||||
"sig_type" in the API for backwards compatibility.
|
Used to group them in the web UI. Still named "sig_type" in the API for backwards compatibility.
|
||||||
$ref: "#/components/schemas/ActivityType"
|
$ref: "#/components/schemas/ActivityType"
|
||||||
comment_names:
|
comment_names:
|
||||||
type: array
|
type: array
|
||||||
description: >
|
description: >
|
||||||
Names by which this activity may be referred to in cluster spot comments. Most activities have a
|
Names by which this activity may be referred to in cluster spot comments. Most activities have a
|
||||||
single entry matching their programme name (e.g. ["POTA"]), but some have none (where
|
single entry matching their programme name (e.g. ["POTA"]), but some have none (where
|
||||||
the name is ambiguous with other activities, such as Tiles and Toilets on the Air) or multiple
|
the name is ambiguous with other activities, such as "TOTA" for Tiles and Toilets on the Air) or multiple
|
||||||
entries (e.g. WWBOTA accepts both "WWBOTA" and "BOTA" since the latter is often used).
|
entries (e.g. WWBOTA accepts both "WWBOTA" and "BOTA" since the latter is often used).
|
||||||
items:
|
items:
|
||||||
type: string
|
type: string
|
||||||
|
|||||||
@@ -279,6 +279,51 @@ div#map {
|
|||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
/* COLLAPSIBLE FILTER SECTIONS (e.g. Activities panel) */
|
||||||
|
|
||||||
|
ul.filter-section-list {
|
||||||
|
margin-bottom: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
button.btn-toggle {
|
||||||
|
display: block;
|
||||||
|
width: 100%;
|
||||||
|
padding: .25rem 0;
|
||||||
|
font-weight: 600;
|
||||||
|
text-align: left;
|
||||||
|
color: var(--bs-emphasis-color);
|
||||||
|
background-color: transparent;
|
||||||
|
border: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
button.btn-toggle:hover,
|
||||||
|
button.btn-toggle:focus {
|
||||||
|
background-color: transparent;
|
||||||
|
box-shadow: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
button.btn-toggle::before {
|
||||||
|
display: inline-block;
|
||||||
|
width: 1.25em;
|
||||||
|
line-height: 0;
|
||||||
|
content: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='rgba%280,0,0,.5%29' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M5 14l6-6-6-6'/%3e%3c/svg%3e");
|
||||||
|
transition: transform .35s ease;
|
||||||
|
transform-origin: .5em 50%;
|
||||||
|
}
|
||||||
|
|
||||||
|
[data-bs-theme="dark"] button.btn-toggle::before {
|
||||||
|
content: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='rgba%28255,255,255,.5%29' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M5 14l6-6-6-6'/%3e%3c/svg%3e");
|
||||||
|
}
|
||||||
|
|
||||||
|
button.btn-toggle[aria-expanded="true"]::before {
|
||||||
|
transform: rotate(90deg);
|
||||||
|
}
|
||||||
|
|
||||||
|
div.filter-section-body {
|
||||||
|
padding-left: 1.25em;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
/* BANDS PANEL */
|
/* BANDS PANEL */
|
||||||
|
|
||||||
div#bands-container {
|
div#bands-container {
|
||||||
|
|||||||
@@ -38,33 +38,61 @@ function setHamHFBandToggles() {
|
|||||||
filtersUpdated();
|
filtersUpdated();
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// Generate a collapsable section for the activities filter card, and append it to the given list. The section is
|
||||||
|
// expanded by default if isExpanded is true.
|
||||||
|
function appendActivityFilterSection($list, sectionId, heading, isExapanded, buildBody) {
|
||||||
|
const collapseId = `activity-options-${sectionId}-collapse`;
|
||||||
|
const $li = $('<li class="mb-1">');
|
||||||
|
$li.append(`<button class="btn-toggle${isExapanded ? '' : ' collapsed'}" data-bs-toggle="collapse" data-bs-target="#${collapseId}" aria-expanded="${isExapanded ? 'true' : 'false'}" aria-controls="${collapseId}">${heading}</button>`);
|
||||||
|
const $body = $(`<div class="collapse filter-section-body${isExapanded ? ' show' : ''}" id="${collapseId}">`);
|
||||||
|
buildBody($body);
|
||||||
|
$li.append($body);
|
||||||
|
$list.append($li);
|
||||||
|
}
|
||||||
|
|
||||||
// Generate activities filter card. This one is also a special case.
|
// Generate activities filter card. This one is also a special case.
|
||||||
function generateActivitiesMultiToggleFilterCard(activity_options) {
|
function generateActivitiesMultiToggleFilterCard(activity_options) {
|
||||||
const $grid1 = $('<div class="row row-cols-2 g-1 mb-1">');
|
const $list = $('<ul class="list-unstyled filter-section-list ps-0">');
|
||||||
$("#sig-options").append('<strong>Worldwide</strong>');
|
|
||||||
activity_options.filter(o => o["sig_type"] === "WORLDWIDE").forEach(o => {
|
appendActivityFilterSection($list, 'traditional', 'Traditional', true, $body => {
|
||||||
|
const $grid = $('<div class="row row-cols-2 g-1 mb-1">');
|
||||||
|
activity_options.filter(o => o["sig_type"] === "TRADITIONAL").forEach(o => {
|
||||||
const domSafeName = o["name"].replace(/^[^A-Za-z0-9]+|[^\w]+/gi, "");
|
const domSafeName = o["name"].replace(/^[^A-Za-z0-9]+|[^\w]+/gi, "");
|
||||||
$grid1.append(`<div class="col"><div class="form-check"><input type="checkbox" class="form-check-input filter-button-sig storeable-checkbox" id="filter-button-sig-${domSafeName}" value="${o['name']}" autocomplete="off" onClick="filtersUpdated()" checked><label class="form-check-label" id="filter-button-label-sig-${domSafeName}" for="filter-button-sig-${domSafeName}" title="${o['description']}"><i class="fa-solid ${o['icon']}"></i> ${o['name']} ${(o["region_flag"] != null) ? o['region_flag'] : ''}</label></div></div>`);
|
$grid.append(`<div class="col"><div class="form-check"><input type="checkbox" class="form-check-input filter-button-sig storeable-checkbox" id="filter-button-sig-${domSafeName}" value="${o['name']}" autocomplete="off" onClick="filtersUpdated()" checked><label class="form-check-label" id="filter-button-label-sig-${domSafeName}" for="filter-button-sig-${domSafeName}" title="${o['description']}"><i class="fa-solid ${o['icon']}"></i> ${o['name']} ${(o["region_flag"] != null) ? o['region_flag'] : ''}</label></div></div>`);
|
||||||
});
|
});
|
||||||
$("#sig-options").append($grid1);
|
$body.append(`<div class="w-100"><div class="form-check"><input type="checkbox" class="form-check-input filter-button-sig storeable-checkbox" id="filter-button-sig-NO_SIG" value="NO_SIG" autocomplete="off" onClick="filtersUpdated()" checked><label class="form-check-label" id="filter-button-label-sig-NO_SIG" for="filter-button-sig-NO_SIG"><i class="fa-solid fa-tower-cell"></i> General DX</label></div></div>`);
|
||||||
const $grid2 = $('<div class="row row-cols-2 g-1 mb-1">');
|
$body.append($grid);
|
||||||
$("#sig-options").append('<strong>Regional</strong>');
|
});
|
||||||
|
|
||||||
|
appendActivityFilterSection($list, 'adventure', 'Adventure', true, $body => {
|
||||||
|
const $grid = $('<div class="row row-cols-2 g-1 mb-1">');
|
||||||
|
activity_options.filter(o => o["sig_type"] === "ADVENTURE").forEach(o => {
|
||||||
|
const domSafeName = o["name"].replace(/^[^A-Za-z0-9]+|[^\w]+/gi, "");
|
||||||
|
$grid.append(`<div class="col"><div class="form-check"><input type="checkbox" class="form-check-input filter-button-sig storeable-checkbox" id="filter-button-sig-${domSafeName}" value="${o['name']}" autocomplete="off" onClick="filtersUpdated()" checked><label class="form-check-label" id="filter-button-label-sig-${domSafeName}" for="filter-button-sig-${domSafeName}" title="${o['description']}"><i class="fa-solid ${o['icon']}"></i> ${o['name']} ${(o["region_flag"] != null) ? o['region_flag'] : ''}</label></div></div>`);
|
||||||
|
});
|
||||||
|
$body.append($grid);
|
||||||
|
});
|
||||||
|
|
||||||
|
appendActivityFilterSection($list, 'regional', 'Regional', false, $body => {
|
||||||
|
const $grid = $('<div class="row row-cols-2 g-1 mb-1">');
|
||||||
activity_options.filter(o => o["sig_type"] === "REGIONAL").forEach(o => {
|
activity_options.filter(o => o["sig_type"] === "REGIONAL").forEach(o => {
|
||||||
const domSafeName = o["name"].replace(/^[^A-Za-z0-9]+|[^\w]+/gi, "");
|
const domSafeName = o["name"].replace(/^[^A-Za-z0-9]+|[^\w]+/gi, "");
|
||||||
$grid2.append(`<div class="col"><div class="form-check"><input type="checkbox" class="form-check-input filter-button-sig storeable-checkbox" id="filter-button-sig-${domSafeName}" value="${o['name']}" autocomplete="off" onClick="filtersUpdated()" checked><label class="form-check-label" id="filter-button-label-sig-${domSafeName}" for="filter-button-sig-${domSafeName}" title="${o['description']}"><i class="fa-solid ${o['icon']}"></i> ${o['name']} ${(o["region_flag"] != null) ? o['region_flag'] : ''}</label></div></div>`);
|
$grid.append(`<div class="col"><div class="form-check"><input type="checkbox" class="form-check-input filter-button-sig storeable-checkbox" id="filter-button-sig-${domSafeName}" value="${o['name']}" autocomplete="off" onClick="filtersUpdated()" checked><label class="form-check-label" id="filter-button-label-sig-${domSafeName}" for="filter-button-sig-${domSafeName}" title="${o['description']}"><i class="fa-solid ${o['icon']}"></i> ${o['name']} ${(o["region_flag"] != null) ? o['region_flag'] : ''}</label></div></div>`);
|
||||||
});
|
});
|
||||||
$("#sig-options").append($grid2);
|
$body.append($grid);
|
||||||
const $grid3 = $('<div class="row row-cols-2 g-1 mb-1">');
|
});
|
||||||
$("#sig-options").append('<strong>Event</strong>');
|
|
||||||
|
appendActivityFilterSection($list, 'event', 'Event', false, $body => {
|
||||||
|
const $grid = $('<div class="row row-cols-2 g-1 mb-1">');
|
||||||
activity_options.filter(o => o["sig_type"] === "EVENT").forEach(o => {
|
activity_options.filter(o => o["sig_type"] === "EVENT").forEach(o => {
|
||||||
const domSafeName = o["name"].replace(/^[^A-Za-z0-9]+|[^\w]+/gi, "");
|
const domSafeName = o["name"].replace(/^[^A-Za-z0-9]+|[^\w]+/gi, "");
|
||||||
$grid3.append(`<div class="col"><div class="form-check"><input type="checkbox" class="form-check-input filter-button-sig storeable-checkbox" id="filter-button-sig-${domSafeName}" value="${o['name']}" autocomplete="off" onClick="filtersUpdated()" checked><label class="form-check-label" id="filter-button-label-sig-${domSafeName}" for="filter-button-sig-${domSafeName}" title="${o['description']}"><i class="fa-solid ${o['icon']}"></i> ${o['name']} ${(o["region_flag"] != null) ? o['region_flag'] : ''}</label></div></div>`);
|
$grid.append(`<div class="col"><div class="form-check"><input type="checkbox" class="form-check-input filter-button-sig storeable-checkbox" id="filter-button-sig-${domSafeName}" value="${o['name']}" autocomplete="off" onClick="filtersUpdated()" checked><label class="form-check-label" id="filter-button-label-sig-${domSafeName}" for="filter-button-sig-${domSafeName}" title="${o['description']}"><i class="fa-solid ${o['icon']}"></i> ${o['name']} ${(o["region_flag"] != null) ? o['region_flag'] : ''}</label></div></div>`);
|
||||||
});
|
});
|
||||||
$("#sig-options").append($grid3);
|
$body.append($grid);
|
||||||
$("#sig-options").append('<strong>Other</strong>');
|
});
|
||||||
// Bonus "NO_SIG" / "General DX" option
|
|
||||||
$("#sig-options").append(`<div class="w-100"><div class="form-check"><input type="checkbox" class="form-check-input filter-button-sig storeable-checkbox" id="filter-button-sig-NO_SIG" value="NO_SIG" autocomplete="off" onClick="filtersUpdated()" checked><label class="form-check-label" id="filter-button-label-sig-NO_SIG" for="filter-button-sig-NO_SIG"><i class="fa-solid fa-tower-cell"></i> General DX</label></div></div>`);
|
$("#activity-options").append($list);
|
||||||
$("#sig-options").append(`<div class="mt-1"><a href="#" onclick="toggleFilterButtons('sig', true); return false;">All</a> <a href="#" onclick="toggleFilterButtons('sig', false); return false;">None</a></div>`);
|
$("#activity-options").append(`<div class="mt-1"><a href="#" onclick="toggleFilterButtons('sig', true); return false;">All</a> <a href="#" onclick="toggleFilterButtons('sig', false); return false;">None</a></div>`);
|
||||||
}
|
}
|
||||||
|
|
||||||
// Generate modes filter card. This one is also a special case.
|
// Generate modes filter card. This one is also a special case.
|
||||||
|
|||||||
@@ -1,6 +1,6 @@
|
|||||||
<div class="card">
|
<div class="card">
|
||||||
<div class="card-body">
|
<div class="card-body">
|
||||||
<h5 class="card-title">Activities</h5>
|
<h5 class="card-title">Activities</h5>
|
||||||
<div id="sig-options" class="card-text spothole-card-text"></div>
|
<div id="activity-options" class="card-text spothole-card-text"></div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
Reference in New Issue
Block a user