parks: アイコン・フィルタ・編集画面を更新し、公開を一時停止

- 遊具アイコンをSVGRepo素材に差し替え、施設種別をアイコン表示
- フィルタに種類・遊具・ピクニックを追加し、適用時の地図移動を停止
- 現在地ボタンを追跡トグルに変更し、初回以外は地図を動かさない
- 編集画面を市内公園・周辺公園・公共施設の4タブに拡張
- 公園ページをドラフト化し、サイドバーとPWAの公開を停止

1 files changed, 59 insertions, 11 deletions

diff --git a/src/components/FacilitiesTable.astro b/src/components/FacilitiesTable.astro
index 2974581..797bb1a 100644
--- a/src/components/FacilitiesTable.astro
+++ b/src/components/FacilitiesTable.astro
@@ -1,7 +1,9 @@
 ---
-// 地域センター・公民館・図書館・市役所支所・文化施設の一覧。
+// 地域センター・公民館・児童館・図書館・市役所支所・文化施設の一覧。
+// 小平市の施設に加えて、市境500m以内の市外施設（図書館・公民館・児童館）も表示する。
 // トイレは市の公共施設として基本的に利用できる。給水は公式ページに明記が少ないため「未確認」が多い。
 import facilitiesData from "@/data/kodaira-facilities.json";
+import nearbyFacilitiesData from "@/data/kodaira-nearby-facilities.json";
 
 type Facility = {
   name: string;
@@ -13,12 +15,32 @@ type Facility = {
   water: string;
   note: string;
   source: string;
+  nearby?: boolean;
+  city?: string;
+  distance_m?: number;
 };
 
-const facilities = facilitiesData as Facility[];
-const types = ["地域センター", "公民館", "図書館", "市役所支所", "文化施設"];
-const mapsUrl = (name: string) =>
-  `https://www.google.com/maps/search/?api=1&query=${encodeURIComponent(`小平市${name}`)}`;
+const facilities = [
+  ...(facilitiesData as Facility[]),
+  ...(nearbyFacilitiesData as Facility[]),
+];
+const types = [
+  "地域センター",
+  "公民館",
+  "児童館",
+  "図書館",
+  "市役所支所",
+  "文化施設",
+];
+const mapsUrl = (f: Facility) => {
+  // 市外の施設は「小平市」を付けない。名前が市名を含む場合は二重にしない。
+  const query = f.nearby
+    ? f.city && !f.name.includes(f.city)
+      ? `${f.city}${f.name}`
+      : f.name
+    : `小平市${f.name}`;
+  return `https://www.google.com/maps/search/?api=1&query=${encodeURIComponent(query)}`;
+};
 ---
 
 <div class="facilities" data-fac-root>
@@ -60,7 +82,7 @@ const mapsUrl = (name: string) =>
             data-type={f.type}
             data-toilet={f.toilet || ""}
             data-water={f.water || ""}
-            data-search={`${f.name} ${f.type} ${f.address} ${f.note}`.toLowerCase()}
+            data-search={`${f.name} ${f.type} ${f.address} ${f.city || ""} ${f.note}`.toLowerCase()}
           >
             <td>
               {f.source ? (
@@ -68,10 +90,13 @@ const mapsUrl = (name: string) =>
               ) : (
                 f.name
               )}
+              {f.nearby ? (
+                <span class="fac-nearby" title="小平市外の施設">市外</span>
+              ) : null}
             </td>
             <td>{f.type}</td>
             <td>
-              <a href={mapsUrl(f.name)} target="_blank" rel="noopener">
+              <a href={mapsUrl(f)} target="_blank" rel="noopener">
                 {f.address || "—"}
               </a>
             </td>
@@ -96,9 +121,12 @@ const mapsUrl = (name: string) =>
     </table>
   </div>
 
-  <p class="fac-note">
-    トイレは市の公共施設として基本的に利用できます（○）。給水は公式ページに明記が少ないため「未確認」が多いです。最新の情報は各施設の公式ページで確認してください。地図の位置は住所・名称からの概略です。
-  </p>
+  <details class="fac-help">
+    <summary>設備情報について</summary>
+    <p class="fac-note">
+      小平市の施設は、公共施設のためトイレを利用できます（○）。市外の近隣施設は情報がないため「未確認」としています。給水は公式ページに明記が少ないため「未確認」が多いです。最新の情報は各施設の公式ページで確認してください。市外施設の情報はOpenStreetMapによるもので、地図の位置は住所・名称からの概略です。
+    </p>
+  </details>
 </div>
 
 <script>
@@ -178,9 +206,29 @@ const mapsUrl = (name: string) =>
   .fac-status.is-no {
     color: #b71c1c;
   }
-  .fac-note {
+  .fac-nearby {
+    display: inline-block;
+    margin-left: 0.35rem;
+    padding: 0.02rem 0.35rem;
+    border: 1px solid currentColor;
+    border-radius: 999px;
+    color: #6d4c41;
+    font-size: 0.7rem;
+    font-weight: 600;
+    line-height: 1.5;
+    vertical-align: 0.08em;
+    white-space: nowrap;
+  }
+  .fac-help {
     margin-top: 0.5rem;
     color: var(--sl-color-gray-2);
     font-size: 0.82em;
   }
+  .fac-help summary {
+    cursor: pointer;
+    color: var(--sl-color-text-accent);
+  }
+  .fac-note {
+    margin: 0.35rem 0 0;
+  }
 </style>