shimane-u-fest-map

Unnamed repository; edit this file 'description' to name the repository.
Log | Files | Refs | README

commit a4f85fda4a2e586a14d4b1fb41f421f2619638fb
parent 9a45a8c54c359828942082dc8f95524287cddbef
Author: Minerva_juppiter <94231606+minerva-jupiter@users.noreply.github.com>
Date:   Fri, 10 Oct 2025 19:27:18 +0900

add search feature (#28)

* add search

* 1010 sunny (#29)

* delete not-using testdata

* adjust style of searchbar

---------

Co-authored-by: Sunny <122193933+Sunny-JP@users.noreply.github.com>
Diffstat:
Mapp/data.tsx | 508++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++-----------------
Mapp/globals.css | 25+++++++++++++++++++------
Mapp/page.tsx | 58+++++++++++++++++++++++++++++++++++++++++++++-------------
Dapp/testdata.tsx | 83-------------------------------------------------------------------------------
4 files changed, 467 insertions(+), 207 deletions(-)

diff --git a/app/data.tsx b/app/data.tsx @@ -127,8 +127,14 @@ const places: Place[] = [ <> <h3 className="op">軽音楽部 & Pop’n Light Party</h3> <h3 className="area">大学会館 3階 大集会室</h3> - <h3 className="time">10/12: 9:30~18:00<br />10/13: 9:30~16:00</h3> - <p>軽音楽部と軽音サークルのPop’n Light Partyが合同でライブを行います! </p> + <h3 className="time"> + 10/12: 9:30~18:00 + <br /> + 10/13: 9:30~16:00 + </h3> + <p> + 軽音楽部と軽音サークルのPop’n Light Partyが合同でライブを行います!{" "} + </p> </> ), }, @@ -141,7 +147,10 @@ const places: Place[] = [ <h3 className="op">裏千家茶道部</h3> <h3 className="area">FLAT</h3> <h3 className="time"> - 10/12: 9:30~18:00<br />10/13: 9:30~16:00</h3> + 10/12: 9:30~18:00 + <br /> + 10/13: 9:30~16:00 + </h3> <p>裏千家茶道部によるお菓子とお茶の提供 (場所: FLAT) </p> </> ), @@ -163,33 +172,58 @@ const places: Place[] = [ <tbody> <tr> <td>101</td> - <td>10/12: <br />10/13: </td> + <td> + 10/12: <br /> + 10/13:{" "} + </td> <td>怨霊の金縛り屋敷</td> </tr> <tr> <td>102</td> - <td>10/12: 9:30~18:00<br />10/13: 9:30~16:00</td> - <td>島大いきもの博物館/ザリガニ・カニ釣り (総合環境サークル エコロジー・ネットワーク) </td> + <td> + 10/12: 9:30~18:00 + <br /> + 10/13: 9:30~16:00 + </td> + <td> + 島大いきもの博物館/ザリガニ・カニ釣り (総合環境サークル + エコロジー・ネットワーク){" "} + </td> </tr> <tr> <td>201</td> - <td>10/12: 9:30~16:00<br />10/13: 9:30~15:00</td> + <td> + 10/12: 9:30~16:00 + <br /> + 10/13: 9:30~15:00 + </td> <td>ダンボール迷路</td> </tr> <tr> <td>202</td> <td>10/12: 14:00~15:00</td> - <td>あちゃらかネタライブ!! feat. ブーゲンビリア (島根大学お笑いサークル「あちゃらか」) </td> + <td> + あちゃらかネタライブ!! feat. ブーゲンビリア + (島根大学お笑いサークル「あちゃらか」){" "} + </td> </tr> <tr> <td>202</td> <td>10/13: 14:00~15:00</td> - <td>あちゃらか大喜利決定戦!! (島根大学お笑いサークル「あちゃらか」) </td> + <td> + あちゃらか大喜利決定戦!! (島根大学お笑いサークル「あちゃらか」){" "} + </td> </tr> <tr> <td>301</td> - <td>10/12: 9:30~18:00<br />10/13: 9:30~16:00</td> - <td>美術科教育専攻・作品展示会 -まじわるところ- (美術科教育専攻) </td> + <td> + 10/12: 9:30~18:00 + <br /> + 10/13: 9:30~16:00 + </td> + <td> + 美術科教育専攻・作品展示会 -まじわるところ- (美術科教育専攻){" "} + </td> </tr> </tbody> </table> @@ -213,21 +247,32 @@ const places: Place[] = [ <tbody> <tr> <td>エントランス</td> - <td>10/12: 9:30~18:00<br />10/13: 9:30~16:00</td> + <td> + 10/12: 9:30~18:00 + <br /> + 10/13: 9:30~16:00 + </td> <td>いけばな展示 (草月流華道部) </td> </tr> <tr> <td>401</td> - <td>10/12: 9:30~18:00<br />10/13: 9:30~16:00</td> <td> - ジャグリング体験会 (島根大学ジャグリングサークル Kaleido) + 10/12: 9:30~18:00 + <br /> + 10/13: 9:30~16:00 </td> + <td>ジャグリング体験会 (島根大学ジャグリングサークル Kaleido)</td> </tr> <tr> <td>402</td> - <td>10/12: 9:30~18:00<br />10/13: 9:30~16:00</td> + <td> + 10/12: 9:30~18:00 + <br /> + 10/13: 9:30~16:00 + </td> <td>美術部展示・グッズ販売/イラスト風船を作ろう (美術部) </td> - </tr>{/* + </tr> + {/* <tr> <td>404</td> <td>10/12: 10:00~18:00<br />10/13: 10:00~16:00</td> @@ -240,22 +285,38 @@ const places: Place[] = [ </tr> <tr> <td>502</td> - <td>10/12: 10:00~17:30<br />10/13: 10:00~15:30</td> + <td> + 10/12: 10:00~17:30 + <br /> + 10/13: 10:00~15:30 + </td> <td>不昧流茶道部お茶席 (不昧流茶道部) </td> </tr> <tr> <td>503</td> - <td>10/12: 9:30~材料なくなり次第終了<br />10/13: 9:30~材料なくなり次第終了</td> + <td> + 10/12: 9:30~材料なくなり次第終了 + <br /> + 10/13: 9:30~材料なくなり次第終了 + </td> <td>飛行機製作!! (自由研究サークルてらこや) </td> </tr> <tr> <td>601</td> - <td>10/12: 9:30~18:00<br />10/13: 9:30~16:00</td> - <td>囲碁で遊ぼう! (囲碁部) </td> + <td> + 10/12: 9:30~18:00 + <br /> + 10/13: 9:30~16:00 + </td> + <td>囲碁で遊ぼう! (囲碁部) </td> </tr> <tr> <td>602</td> - <td>10/12: 9:30~18:00<br />10/13: 9:30~16:00</td> + <td> + 10/12: 9:30~18:00 + <br /> + 10/13: 9:30~16:00 + </td> <td>部員作品展示 (島根大学プラモデル部) </td> </tr> </tbody> @@ -280,7 +341,11 @@ const places: Place[] = [ <tbody> <tr> <td>エントランス</td> - <td>10/12: 9:30~18:00<br />10/13: 9:30~16:00</td> + <td> + 10/12: 9:30~18:00 + <br /> + 10/13: 9:30~16:00 + </td> <td>臨書・詩文書 作品展示 (書道部) </td> </tr> <tr> @@ -290,27 +355,47 @@ const places: Place[] = [ </tr> <tr> <td>135</td> - <td>10/12: 9:30~18:00<br />10/13: 9:30~16:00</td> + <td> + 10/12: 9:30~18:00 + <br /> + 10/13: 9:30~16:00 + </td> <td>活動展示 + くまカフェ (行政学ゼミ) </td> </tr> <tr> <td>138 地域交流スペース2</td> - <td>10/12: 9:30~18:00<br />10/13: 9:30~16:00</td> + <td> + 10/12: 9:30~18:00 + <br /> + 10/13: 9:30~16:00 + </td> <td>知ってほしい! しまねの献血のこと (ぷらす&ぐっぱ) </td> </tr> <tr> <td>147 セミナー室</td> - <td>10/12: 10:00~16:00<br />10/13: 10:00~16:00</td> + <td> + 10/12: 10:00~16:00 + <br /> + 10/13: 10:00~16:00 + </td> <td>古文書ゼミ展示 (古文書ゼミ) </td> </tr> <tr> <td>241</td> - <td>10/12: 9:30~17:00<br />10/13: 9:30~16:00</td> + <td> + 10/12: 9:30~17:00 + <br /> + 10/13: 9:30~16:00 + </td> <td>ぴぴぴッ! 電波広場 (無線通信技術部) </td> </tr> <tr> <td>340</td> - <td>10/12: 9:30~18:00<br />10/13: 9:30~16:00</td> + <td> + 10/12: 9:30~18:00 + <br /> + 10/13: 9:30~16:00 + </td> <td>第4回島大鐵研フェスタ (島根大学鐵道研究会) </td> </tr> <tr> @@ -320,12 +405,20 @@ const places: Place[] = [ </tr> <tr> <td>433 多目的室</td> - <td>10/12: 9:30~18:00<br />10/13: 9:30~16:00</td> + <td> + 10/12: 9:30~18:00 + <br /> + 10/13: 9:30~16:00 + </td> <td>イラスト展,漫画コーナー,缶バッジ製作体験 (漫画研究会) </td> </tr> <tr> <td>436 法廷教室</td> - <td>10/12: 9:30~18:00<br />10/13: 9:30~16:00</td> + <td> + 10/12: 9:30~18:00 + <br /> + 10/13: 9:30~16:00 + </td> <td>鉱石すくい (地学部) </td> </tr> </tbody> @@ -350,12 +443,20 @@ const places: Place[] = [ <tbody> <tr> <td>188 多目的室2</td> - <td>10/12: 10:00~16:00<br />10/13: 10:00~16:00</td> + <td> + 10/12: 10:00~16:00 + <br /> + 10/13: 10:00~16:00 + </td> <td>親子で学んで遊ぼう!消費者教育 (消費者教育プロジェクト) </td> </tr> <tr> <td>189, 190, 191, IPM</td> - <td>10/12: 10:00~18:00<br />10/13: 10:00~16:00</td> + <td> + 10/12: 10:00~18:00 + <br /> + 10/13: 10:00~16:00 + </td> <td>喫茶1904 子ども縁日 (特別支援教育専攻) </td> </tr> </tbody> @@ -377,7 +478,8 @@ const places: Place[] = [ <th>内容</th> </tr> </thead> - <tbody>{/* + <tbody> + {/* <tr> <td>玄関ホール</td> <td>10/12: 10:00~18:00</td> @@ -385,8 +487,14 @@ const places: Place[] = [ </tr>*/} <tr> <td>数学第1講義室</td> - <td>10/12: 10:00~15:00<br />10/13: 10:00~15:00</td> - <td>遊んで,学ぼう! /アプリを使って,数学を視る (数理科学科) </td> + <td> + 10/12: 10:00~15:00 + <br /> + 10/13: 10:00~15:00 + </td> + <td> + 遊んで,学ぼう! /アプリを使って,数学を視る (数理科学科){" "} + </td> </tr> </tbody> </table> @@ -415,7 +523,11 @@ const places: Place[] = [ </tr> <tr> <td>614</td> - <td>10/12: 10:00~12:00,13:00~15:00<br />10/13: 10:00~12:00,13:00~15:00</td> + <td> + 10/12: 10:00~12:00,13:00~15:00 + <br /> + 10/13: 10:00~12:00,13:00~15:00 + </td> <td>VRを体験しよう (建築デザイン学科) </td> </tr> </tbody> @@ -440,13 +552,22 @@ const places: Place[] = [ <tbody> <tr> <td>島大総合博物館アシカル</td> - <td>10/12: 10:00~17:00<br />10/13: 10:00~16:00</td> - <td>展示クイズに答えて島大グッズをもらおう (島根大学総合博物館アシカル) </td> + <td> + 10/12: 10:00~17:00 + <br /> + 10/13: 10:00~16:00 + </td> + <td> + 展示クイズに答えて島大グッズをもらおう + (島根大学総合博物館アシカル){" "} + </td> </tr> <tr> <td>外国語教育センター Global Hub</td> <td>10/12: 10:00~16:00</td> - <td>カフェ&留学生ポスター発表 (外国語教育センター Global Hub) </td> + <td> + カフェ&留学生ポスター発表 (外国語教育センター Global Hub){" "} + </td> </tr> </tbody> </table> @@ -461,8 +582,15 @@ const places: Place[] = [ <> <h3 className="op">サバイバルゲーム部</h3> <h3 className="area">第2体育館</h3> - <h3 className="time">10/12: 9:30~18:00<br />10/13: 9:30~15:00</h3> - <p>射的や赤外線で行う弾が出ないサバゲー等のサバイバルゲーム部の活動を体験していただけるブースを開催しております! ぜひ遊びに来てください! </p> + <h3 className="time"> + 10/12: 9:30~18:00 + <br /> + 10/13: 9:30~15:00 + </h3> + <p> + 射的や赤外線で行う弾が出ないサバゲー等のサバイバルゲーム部の活動を体験していただけるブースを開催しております! + ぜひ遊びに来てください!{" "} + </p> </> ), }, @@ -475,8 +603,14 @@ const places: Place[] = [ <> <h3 className="op">音楽科研究室</h3> <h3 className="area">ブース1</h3> - <h3 className="time">10/12: 9:30~18:00<br />10/13: 9:30~16:00</h3> - <p>私たちは教育学部音楽科教育専攻生です。「やきそばさっちゃん」という店名で,毎年焼きそばを販売しています。今年も丹精込めてつくった焼きそばを販売します。皆様のご来店,お待ちしております! </p> + <h3 className="time"> + 10/12: 9:30~18:00 + <br /> + 10/13: 9:30~16:00 + </h3> + <p> + 私たちは教育学部音楽科教育専攻生です。「やきそばさっちゃん」という店名で,毎年焼きそばを販売しています。今年も丹精込めてつくった焼きそばを販売します。皆様のご来店,お待ちしております!{" "} + </p> </> ), }, @@ -489,7 +623,10 @@ const places: Place[] = [ <h3 className="op">SFIDA</h3> <h3 className="area">ブース2</h3> <h3 className="time"> - 10/12: 9:30~18:00<br />10/13: 9:30~16:00</h3> + 10/12: 9:30~18:00 + <br /> + 10/13: 9:30~16:00 + </h3> <p>たくさんのイケメンが美味しいたこ焼きを作ってます!!</p> </> ), @@ -503,8 +640,14 @@ const places: Place[] = [ <h3 className="op">硬式テニス同好会</h3> <h3 className="area">ブース3</h3> <h3 className="time"> - 10/12: 9:30~18:00<br />10/13: 9:30~16:00</h3> - <p>大学祭フードの“王道”は,この一本。外はカリッ,中は肉汁ジュワッ。厳選肉を高品質な鉄板で丁寧に焼き上げました。香りだけでもお腹が鳴る特製牛串は,大学祭の食べ歩きコースにぴったりです! 売り切れ御免。</p> + 10/12: 9:30~18:00 + <br /> + 10/13: 9:30~16:00 + </h3> + <p> + 大学祭フードの“王道”は,この一本。外はカリッ,中は肉汁ジュワッ。厳選肉を高品質な鉄板で丁寧に焼き上げました。香りだけでもお腹が鳴る特製牛串は,大学祭の食べ歩きコースにぴったりです! + 売り切れ御免。 + </p> </> ), }, @@ -517,7 +660,10 @@ const places: Place[] = [ <h3 className="op">野外研究同好会</h3> <h3 className="area">ブース4</h3> <h3 className="time"> - 10/12: 9:30~18:00<br />10/13: 9:30~16:00</h3> + 10/12: 9:30~18:00 + <br /> + 10/13: 9:30~16:00 + </h3> <p>型抜きをしています! ! 皆さんぜひお越しください! </p> </> ), @@ -531,9 +677,14 @@ const places: Place[] = [ <h3 className="op">合氣道部</h3> <h3 className="area">ブース5</h3> <h3 className="time"> - 10/12: 9:30~18:00<br />10/13: 9:30~16:00</h3> - <p>今年の学祭では,“心も体も満たされる『合氣ドーナツ』” - を販売します。合気道の精神とドーナツの美味しさが,ここで出会います。柔軟な心とお腹を満たす甘いひとときをお楽しみください! </p> + 10/12: 9:30~18:00 + <br /> + 10/13: 9:30~16:00 + </h3> + <p> + 今年の学祭では,“心も体も満たされる『合氣ドーナツ』” + を販売します。合気道の精神とドーナツの美味しさが,ここで出会います。柔軟な心とお腹を満たす甘いひとときをお楽しみください!{" "} + </p> </> ), }, @@ -546,7 +697,9 @@ const places: Place[] = [ <h3 className="op">ジョブカフェしまね</h3> <h3 className="area">ブース6</h3> <h3 className="time">10/12: 10:00~16:00</h3> - <p>ジョブカフェしまねブースでは,就職活動などに関連したイベントの案内を行っております!</p> + <p> + ジョブカフェしまねブースでは,就職活動などに関連したイベントの案内を行っております! + </p> </> ), }, @@ -559,8 +712,14 @@ const places: Place[] = [ <h3 className="op">shimasuno</h3> <h3 className="area">ブース7</h3> <h3 className="time"> - 10/12: 9:30~18:00<br />10/13: 9:30~16:00</h3> - <p>いろんな種類のベビーカステラとドリンク (冷たいものも温かいものもあります) を売ってます!ぜひ足を運んで下さい! </p> + 10/12: 9:30~18:00 + <br /> + 10/13: 9:30~16:00 + </h3> + <p> + いろんな種類のベビーカステラとドリンク + (冷たいものも温かいものもあります) を売ってます!ぜひ足を運んで下さい!{" "} + </p> </> ), }, @@ -573,8 +732,13 @@ const places: Place[] = [ <h3 className="op">総務企画</h3> <h3 className="area">ブース8</h3> <h3 className="time"> - 10/12: 10:00~16:00<br />10/13: 10:00~16:00</h3> - <p>プロ美容師によるヘアアレンジを体験できます! ぜひお越しください! ! </p> + 10/12: 10:00~16:00 + <br /> + 10/13: 10:00~16:00 + </h3> + <p> + プロ美容師によるヘアアレンジを体験できます! ぜひお越しください! !{" "} + </p> </> ), }, @@ -587,8 +751,16 @@ const places: Place[] = [ <h3 className="op">フラット</h3> <h3 className="area">ブース9</h3> <h3 className="time"> - 10/12: 9:30~18:00<br />10/13: 9:30~16:00</h3> - <p>肉の旨味がジュワッ! 外は香ばしく中はほっかほか,フラット特製「肉巻きおにぎり」登場! 秘伝のタレが染み込んだジューシーなお肉でごはんを包み,一口食べれば笑顔間違いなし! 学園祭限定,この味を見逃すな! </p> + 10/12: 9:30~18:00 + <br /> + 10/13: 9:30~16:00 + </h3> + <p> + 肉の旨味がジュワッ! + 外は香ばしく中はほっかほか,フラット特製「肉巻きおにぎり」登場! + 秘伝のタレが染み込んだジューシーなお肉でごはんを包み,一口食べれば笑顔間違いなし! + 学園祭限定,この味を見逃すな!{" "} + </p> </> ), }, @@ -601,7 +773,10 @@ const places: Place[] = [ <h3 className="op">ケバ部</h3> <h3 className="area">ブース10</h3> <h3 className="time"> - 10/12: 9:30~18:00<br />10/13: 9:30~16:00</h3> + 10/12: 9:30~18:00 + <br /> + 10/13: 9:30~16:00 + </h3> <p>おいしいケバブ! </p> </> ), @@ -615,22 +790,32 @@ const places: Place[] = [ <h3 className="op">スナフキン</h3> <h3 className="area">ブース11</h3> <h3 className="time"> - 10/12: 10:00~17:00<br />10/13: 10:00~15:00</h3> - <p>スナフキンでは缶ジュースを販売します! ライブのお供にいかがでしょうか?</p> + 10/12: 10:00~17:00 + <br /> + 10/13: 10:00~15:00 + </h3> + <p> + スナフキンでは缶ジュースを販売します! ライブのお供にいかがでしょうか? + </p> </> ), }, { id: 31, - position: { lat: 35.485890, lng: 133.067450 }, + position: { lat: 35.48589, lng: 133.06745 }, title: "スナフキンライブ", description: ( <> <h3 className="op">スナフキン</h3> <h3 className="area">ブース12</h3> <h3 className="time"> - 10/12: 9:30~18:00<br />10/13: 9:30~16:00</h3> - <p>スナフキンでは,ギター,カホン,キーボード,打楽器など,さまざまな楽器を用いたライブ演奏を2日間にわたって行います。</p> + 10/12: 9:30~18:00 + <br /> + 10/13: 9:30~16:00 + </h3> + <p> + スナフキンでは,ギター,カホン,キーボード,打楽器など,さまざまな楽器を用いたライブ演奏を2日間にわたって行います。 + </p> </> ), }, @@ -643,8 +828,12 @@ const places: Place[] = [ <h3 className="op">水泳部</h3> <h3 className="area">ブース13</h3> <h3 className="time"> - 10/12: 9:30~18:00<br />10/13: 9:30~16:00</h3> - 水泳部は,綿菓子と飲み物を販売します。綿菓子は「ちんちろ」で出目に応じてサイズが変化! 運試しで<p>特大サイズを狙おう! </p> + 10/12: 9:30~18:00 + <br /> + 10/13: 9:30~16:00 + </h3> + 水泳部は,綿菓子と飲み物を販売します。綿菓子は「ちんちろ」で出目に応じてサイズが変化! + 運試しで<p>特大サイズを狙おう! </p> </> ), }, @@ -657,11 +846,17 @@ const places: Place[] = [ <h3 className="op">ざまく</h3> <h3 className="area">ブース14</h3> <h3 className="time"> - 10/12: 9:30~18:00<br />10/13: 9:30~16:00</h3> - <p>下東川津の居酒屋バイトが出店! 炭火の団子と焼き鳥が絶品! ! バイトも募集中♡</p> + 10/12: 9:30~18:00 + <br /> + 10/13: 9:30~16:00 + </h3> + <p> + 下東川津の居酒屋バイトが出店! 炭火の団子と焼き鳥が絶品! ! + バイトも募集中♡ + </p> </> ), - },/* + } /* { id: 34, position: { lat: 35.485856, lng: 133.06797 }, @@ -675,7 +870,7 @@ const places: Place[] = [ <p>美味しいジュースとチョコバナナ等を販売しています。是非お立ち寄りください。</p> </> ), - },*/ + },*/, { id: 35, position: { lat: 35.485907, lng: 133.067961 }, @@ -685,7 +880,10 @@ const places: Place[] = [ <h3 className="op">島根大学ボート部</h3> <h3 className="area">ブース16</h3> <h3 className="time"> - 10/12: 9:30~18:00<br />10/13: 9:30~16:00</h3> + 10/12: 9:30~18:00 + <br /> + 10/13: 9:30~16:00 + </h3> <p>たませんとペットボトルドリンクを販売します。</p> </> ), @@ -699,8 +897,13 @@ const places: Place[] = [ <h3 className="op">ESS部</h3> <h3 className="area">ブース17</h3> <h3 className="time"> - 10/12: 9:30~18:00<br />10/13: 9:30~16:00</h3> - <p>ESS部による餃子パーティー。韓国版の餃子を販売。夕方からはクレープ販売の可能性もあります。</p> + 10/12: 9:30~18:00 + <br /> + 10/13: 9:30~16:00 + </h3> + <p> + ESS部による餃子パーティー。韓国版の餃子を販売。夕方からはクレープ販売の可能性もあります。 + </p> </> ), }, @@ -713,8 +916,13 @@ const places: Place[] = [ <h3 className="op">ダーツ部</h3> <h3 className="area">ブース18,19</h3> <h3 className="time"> - 10/12: 9:30~18:00<br />10/13: 9:30~16:00</h3> - <p>ダーツ部では,実際のダーツを投げる体験とワッフルの販売を行います。賞品も用意しています! </p> + 10/12: 9:30~18:00 + <br /> + 10/13: 9:30~16:00 + </h3> + <p> + ダーツ部では,実際のダーツを投げる体験とワッフルの販売を行います。賞品も用意しています!{" "} + </p> </> ), }, @@ -727,7 +935,10 @@ const places: Place[] = [ <h3 className="op">陶芸部</h3> <h3 className="area">ブース20</h3> <h3 className="time"> - 10/12: 9:30~18:00<br />10/13: 9:30~16:00</h3> + 10/12: 9:30~18:00 + <br /> + 10/13: 9:30~16:00 + </h3> <p>陶芸部による手作り陶器販売。数量限定,売り切れ次第終了。</p> </> ), @@ -741,8 +952,13 @@ const places: Place[] = [ <h3 className="op">小学校教育専攻4回生</h3> <h3 className="area">ブース21,22</h3> <h3 className="time"> - 10/12: 9:30~18:00<br />10/13: 9:30~16:00</h3> - <p>小学校教育専攻4回生によるベビーカステラ販売。ミニゲームでトッピング無料などの企画も。</p> + 10/12: 9:30~18:00 + <br /> + 10/13: 9:30~16:00 + </h3> + <p> + 小学校教育専攻4回生によるベビーカステラ販売。ミニゲームでトッピング無料などの企画も。 + </p> </> ), }, @@ -755,8 +971,13 @@ const places: Place[] = [ <h3 className="op">ぷらす&ぐっぱ</h3> <h3 className="area">ブース23</h3> <h3 className="time"> - 10/12: 9:30~18:00<br />10/13: 9:30~16:00</h3> - <p>献血推進サークルぐっぱと赤十字奉仕団ぷらすによる輸血パックジュースとアイス販売。献血協力者には割引・トッピング特典あり。</p> + 10/12: 9:30~18:00 + <br /> + 10/13: 9:30~16:00 + </h3> + <p> + 献血推進サークルぐっぱと赤十字奉仕団ぷらすによる輸血パックジュースとアイス販売。献血協力者には割引・トッピング特典あり。 + </p> </> ), }, @@ -769,7 +990,10 @@ const places: Place[] = [ <h3 className="op">島根大学eスポーツサークル</h3> <h3 className="area">ブース24</h3> <h3 className="time"> - 10/12: 9:30~12:00<br />10/13: 9:30~16:00</h3> + 10/12: 9:30~12:00 + <br /> + 10/13: 9:30~16:00 + </h3> <p>丹精込めて調理したチュロスを販売します! </p> </> ), @@ -783,7 +1007,10 @@ const places: Place[] = [ <h3 className="op">理科教育専攻</h3> <h3 className="area">ブース25</h3> <h3 className="time"> - 10/12: 9:30~18:00<br />10/13: 9:30~16:00</h3> + 10/12: 9:30~18:00 + <br /> + 10/13: 9:30~16:00 + </h3> <p>ソーダゼリーとドリンクの販売を行います。</p> </> ), @@ -797,7 +1024,10 @@ const places: Place[] = [ <h3 className="op">バドミントン愛好会</h3> <h3 className="area">ブース26</h3> <h3 className="time"> - 10/12: 9:30~18:00<br />10/13: 9:30~16:00</h3> + 10/12: 9:30~18:00 + <br /> + 10/13: 9:30~16:00 + </h3> <p>バドミントン愛好会による唐揚げ販売。手頃な価格で提供します。</p> </> ), @@ -811,7 +1041,10 @@ const places: Place[] = [ <h3 className="op">島大編入会</h3> <h3 className="area">ブース27</h3> <h3 className="time"> - 10/12: 9:30~18:00<br />10/13: 9:30~16:00</h3> + 10/12: 9:30~18:00 + <br /> + 10/13: 9:30~16:00 + </h3> <p>島大編入会による軽飲食ブース。インスタフォローで割引特典あり。</p> </> ), @@ -825,7 +1058,10 @@ const places: Place[] = [ <h3 className="op">裏千家茶道部</h3> <h3 className="area">ブース28</h3> <h3 className="time"> - 10/12: 9:30~18:00<br />10/13: 9:30~16:00 (無くなり次第終了) </h3> + 10/12: 9:30~18:00 + <br /> + 10/13: 9:30~16:00 (無くなり次第終了){" "} + </h3> <p>裏千家茶道部による水餃子・飲み物・お菓子の販売。</p> </> ), @@ -839,8 +1075,14 @@ const places: Place[] = [ <h3 className="op">軽音楽部</h3> <h3 className="area">ブース29</h3> <h3 className="time"> - 10/12: 9:30~18:00<br />10/13: 9:30~16:00</h3> - <p>軽音楽部によるアイスフロート入りドリンクとオリジナルグッズ (タオル・ラバーバンド等) 販売。</p> + 10/12: 9:30~18:00 + <br /> + 10/13: 9:30~16:00 + </h3> + <p> + 軽音楽部によるアイスフロート入りドリンクとオリジナルグッズ + (タオル・ラバーバンド等) 販売。 + </p> </> ), }, @@ -853,8 +1095,16 @@ const places: Place[] = [ <h3 className="op">島根大学吹奏楽部</h3> <h3 className="area">ブース30</h3> <h3 className="time"> - 10/12: 9:30~18:00<br />10/13: 9:30~16:00</h3> - <p>鳥,好きになりました。-島吹編– 現役大学生たちの"運命の鳥とたれの文化祭" リアルで等身大な,本気の"鳥"と"たれ"を追いかけます 果たしてあなたたちは運命の焼き鳥をみつけることができるのか?</p> + 10/12: 9:30~18:00 + <br /> + 10/13: 9:30~16:00 + </h3> + <p> + 鳥,好きになりました。-島吹編– + 現役大学生たちの"運命の鳥とたれの文化祭" + リアルで等身大な,本気の"鳥"と"たれ"を追いかけます + 果たしてあなたたちは運命の焼き鳥をみつけることができるのか? + </p> </> ), }, @@ -867,7 +1117,10 @@ const places: Place[] = [ <h3 className="op">園芸同好会</h3> <h3 className="area">ブース31</h3> <h3 className="time"> - 10/12: 9:30~18:00<br />10/13: 9:30~16:00</h3> + 10/12: 9:30~18:00 + <br /> + 10/13: 9:30~16:00 + </h3> <p>香り広がるほうじ茶ラテ・濃厚抹茶ラテ+さつまいもチップスの販売。</p> </> ), @@ -881,8 +1134,13 @@ const places: Place[] = [ <h3 className="op">BBS</h3> <h3 className="area">ブース32</h3> <h3 className="time"> - 10/12: 9:30~17:00<br />10/13: 9:30~16:00</h3> - <p>BBS ボランティアサークルによるポップコーン販売 (複数フレーバーあり) 。</p> + 10/12: 9:30~17:00 + <br /> + 10/13: 9:30~16:00 + </h3> + <p> + BBS ボランティアサークルによるポップコーン販売 (複数フレーバーあり) 。 + </p> </> ), }, @@ -895,7 +1153,10 @@ const places: Place[] = [ <h3 className="op">香川FC</h3> <h3 className="area">ブース33</h3> <h3 className="time"> - 10/12: 10:00~18:00<br />10/13: 10:00~16:00</h3> + 10/12: 10:00~18:00 + <br /> + 10/13: 10:00~16:00 + </h3> <p>たこ焼き提供 (“香川FC” 名義) +各種トッピングあり。</p> </> ), @@ -909,8 +1170,13 @@ const places: Place[] = [ <h3 className="op">美術科教育専攻</h3> <h3 className="area">ブース34</h3> <h3 className="time"> - 10/12: 9:30~18:00<br />10/13: 9:30~16:00</h3> - <p>美術科教育専攻による鋳造アニマル制作ワークショップおよび部員作品販売。</p> + 10/12: 9:30~18:00 + <br /> + 10/13: 9:30~16:00 + </h3> + <p> + 美術科教育専攻による鋳造アニマル制作ワークショップおよび部員作品販売。 + </p> </> ), }, @@ -923,7 +1189,10 @@ const places: Place[] = [ <h3 className="op">島根大学軟式野球部</h3> <h3 className="area">ブース35</h3> <h3 className="time"> - 10/12: 9:30~18:00<br />10/13: 9:30~16:00</h3> + 10/12: 9:30~18:00 + <br /> + 10/13: 9:30~16:00 + </h3> <p>島根大学軟式野球部によるベビーカステラと かき氷 の販売。</p> </> ), @@ -936,8 +1205,15 @@ const places: Place[] = [ <> <h3 className="op">アイスホッケー部</h3> <h3 className="area">ブース36</h3> - <h3 className="time">10/12: 11:00~14:00<br />10/13: 11:00~14:00</h3> - <p>色んな果物をアメでコーティングしたフルーツアメ販売 (部活動: アイスホッケー部) 。</p> + <h3 className="time"> + 10/12: 11:00~14:00 + <br /> + 10/13: 11:00~14:00 + </h3> + <p> + 色んな果物をアメでコーティングしたフルーツアメ販売 (部活動: + アイスホッケー部) 。 + </p> </> ), }, @@ -950,7 +1226,10 @@ const places: Place[] = [ <h3 className="op">島根大学料理サークル</h3> <h3 className="area">ブース37</h3> <h3 className="time"> - 10/12: 9:30~18:00<br />10/13: 9:30~16:00</h3> + 10/12: 9:30~18:00 + <br /> + 10/13: 9:30~16:00 + </h3> <p>料理サークルによるワッフル販売 (複数味あり) 。</p> </> ), @@ -964,8 +1243,13 @@ const places: Place[] = [ <h3 className="op">天文部</h3> <h3 className="area">ブース38</h3> <h3 className="time"> - 10/12: 10:00~売り切れまで<br />10/13: 10:00~売り切れまで</h3> - <p>天文部によるクレープ販売。学祭期間中の合間にぜひお立ち寄りください。</p> + 10/12: 10:00~売り切れまで + <br /> + 10/13: 10:00~売り切れまで + </h3> + <p> + 天文部によるクレープ販売。学祭期間中の合間にぜひお立ち寄りください。 + </p> </> ), }, @@ -978,7 +1262,10 @@ const places: Place[] = [ <h3 className="op">放送サークル</h3> <h3 className="area">ブース39</h3> <h3 className="time"> - 10/12: 9:30~18:00<br />10/13: 9:30~16:00</h3> + 10/12: 9:30~18:00 + <br /> + 10/13: 9:30~16:00 + </h3> <p>放送サークルによるポップコーン販売。</p> </> ), @@ -992,7 +1279,10 @@ const places: Place[] = [ <h3 className="op">ISF</h3> <h3 className="area">ブース40</h3> <h3 className="time"> - 10/12: 9:30~18:00<br />10/13: 9:30~16:00</h3> + 10/12: 9:30~18:00 + <br /> + 10/13: 9:30~16:00 + </h3> <p>ISFによる噛むほど旨味が広がるワニ肉の唐揚げ販売 (数量限定) 。</p> </> ), @@ -1006,19 +1296,24 @@ const places: Place[] = [ <h3 className="op">地域人材育成コース10期生</h3> <h3 className="area">ブース41</h3> <h3 className="time">10/12: 9:30~18:00</h3> - <p>私たちは,地域人材育成コース,コース生プロジェクトの一環として,島根スサノオマジックとの合同プロジェクトを行っています。今回の大学祭では,体験型の活動を通して,バスケットボールや島根スサノオマジックの魅力について知っていただけたらと思っています。</p> + <p> + 私たちは,地域人材育成コース,コース生プロジェクトの一環として,島根スサノオマジックとの合同プロジェクトを行っています。今回の大学祭では,体験型の活動を通して,バスケットボールや島根スサノオマジックの魅力について知っていただけたらと思っています。 + </p> </> ), }, { id: 59, - position: { lat: 35.486190, lng: 133.067718 }, + position: { lat: 35.48619, lng: 133.067718 }, title: "A.クロスワード", description: ( <> <h3 className="area">本部テント</h3> <h3 className="time"> - 10/12: 9:30~16:00<br />10/13: 9:30~15:00</h3> + 10/12: 9:30~16:00 + <br /> + 10/13: 9:30~15:00 + </h3> <p>会場: 学内全体,受付: 本部テント</p> </> ), @@ -1031,7 +1326,10 @@ const places: Place[] = [ <> <h3 className="area">正門横駐車場</h3> <h3 className="time"> - 10/12: 9:30~11:30,13:00~16:00<br />10/13: 9:30~11:30,13:00~16:00</h3> + 10/12: 9:30~11:30,13:00~16:00 + <br /> + 10/13: 9:30~11:30,13:00~16:00 + </h3> <p>受付: 正門横駐車場</p> </> ), diff --git a/app/globals.css b/app/globals.css @@ -160,9 +160,9 @@ header { color: #000; background-color: #fff; padding: 10px; - height: 45px; + height: 40px; font-size: 1.2rem; - line-height: 1.2; + line-height: 0.9; border-bottom: #000 1px solid; } @@ -170,13 +170,26 @@ footer { text-align: center; color: #000; background-color: #fff; - padding: 5px; - height: 30px; + padding: 4px; + height: 60px; font-size: 0.9rem; - line-height: 0.7; + line-height: 1.6; border-top: #000 1px solid; } +input { + font-family: "Noto Sans JP", sans-serif; + font-optical-sizing: auto; + font-weight: 500; + font-size: 0.9rem; + padding: 3px 6px; + border: 1px solid #aaa; + border-radius: 4px; + width: 96vw; + max-width: 600px; + box-sizing: border-box; +} + .about-link { font-family: "Noto Sans JP", sans-serif; font-optical-sizing: auto; @@ -197,7 +210,7 @@ footer { .floating-modal { position: fixed; - bottom: 45px; + bottom: 75px; left: 10px; right: 10px; width: auto; diff --git a/app/page.tsx b/app/page.tsx @@ -1,5 +1,5 @@ "use client"; -import { useEffect, useState } from "react"; +import { useEffect, useState, useMemo } from "react"; import { APIProvider, Map, @@ -36,6 +36,7 @@ export default function Home() { const [locationLoading, setLocationLoading] = useState(true); const [currentZoom, setCurrentZoom] = useState(17); const isApiLoaded = useApiIsLoaded(); + const [searchTerm, setSearchTerm] = useState(""); /* const searchParams = useSearchParams(); const search = searchParams.get("id"); @@ -44,8 +45,6 @@ export default function Home() { setSelectedPlace(place); }; const handleMapClick = (e: any) => { - // マーカクリック(e.detail.placeIdがある)ではなく、地図自体のクリックであれば閉じる - // MapClickEventはe.detail.latLngを持つが、e.detail.placeIdを持たないことが多い if (!e.detail.placeId) { setSelectedPlace(null); } @@ -53,6 +52,19 @@ export default function Home() { const handleZoomChange = (e: any) => { setCurrentZoom(e.detail.zoom); }; + + const filteredPlaces = useMemo(() => { + if (!searchTerm) { + return places; + } + const lowerCaseSearch = searchTerm.toLowerCase(); + return places.filter( + (place) => + place.title.toLowerCase().includes(lowerCaseSearch) || + (typeof place.description === "string" && + place.description.toLowerCase().includes(lowerCaseSearch)), + ); + }, [searchTerm]); /* useEffect(() => { if (search !== null) { @@ -94,9 +106,11 @@ export default function Home() { <header> <p>島大松江 学祭マップ 2025</p> </header> + <div> + </div> <APIProvider apiKey={process.env.NEXT_PUBLIC_GOOGLE_MAPS_API_KEY || ""}> <Map - style={{ width: "100vw", height: "calc(100svh - 75px)" }} + style={{ width: "100vw", height: "calc(100svh - 100px)" }} defaultCenter={{ lat: 35.4875, lng: 133.068315 }} defaultZoom={17} gestureHandling={"greedy"} @@ -104,7 +118,7 @@ export default function Home() { onClick={handleMapClick} onZoomChanged={handleZoomChange} > - {places.map((place) => ( + {filteredPlaces.map((place) => ( <Marker key={place.id} position={place.position} @@ -134,10 +148,9 @@ export default function Home() { </main> <footer> <small> - <button - className="about-link" - onClick={() => setShowAbout(true)} - > + <input type="text" placeholder="イベント名や説明で検索..." value={searchTerm} onChange={(e) => setSearchTerm(e.target.value)} /> + <br /> + <button className="about-link" onClick={() => setShowAbout(true)}> About </button> &copy; minerva_juppiter All Right Reserved @@ -147,10 +160,29 @@ export default function Home() { <div className="floating-modal"> <div className="about">このサイトについて・免責事項</div> <div> - <p>1. 当サイトは非公式のマップであり,公式サイト,実行委員会,その他一切の関係団体とは関係ございません。</p> - <p>2. 当サイトに掲載する情報の正確性,完全性,最新性について,いかなる保証も行うものではありません。</p> - <p>3. 当サイトの利用により生じた損害または不利益について,当サイト運営者は一切の責任を負わないものとします。</p> - <p>4. 不具合・情報の誤り等がありましたら <a href="https://github.com/minerva-jupiter/shimane-u-fest-map" target="_blank" rel="noopener noreferrer">開発リポジトリ</a> でissueを作成していただけますと幸いです。</p> + <p> + 1. + 当サイトは非公式のマップであり,公式サイト,実行委員会,その他一切の関係団体とは関係ございません。 + </p> + <p> + 2. + 当サイトに掲載する情報の正確性,完全性,最新性について,いかなる保証も行うものではありません。 + </p> + <p> + 3. + 当サイトの利用により生じた損害または不利益について,当サイト運営者は一切の責任を負わないものとします。 + </p> + <p> + 4. 不具合・情報の誤り等がありましたら{" "} + <a + href="https://github.com/minerva-jupiter/shimane-u-fest-map" + target="_blank" + rel="noopener noreferrer" + > + 開発リポジトリ + </a>{" "} + でissueを作成していただけますと幸いです。 + </p> </div> <button className="floating-modal-close" diff --git a/app/testdata.tsx b/app/testdata.tsx @@ -1,83 +0,0 @@ -import React from "react"; -import type { Place } from "./data"; - -const generateRandomPosition = ( - centerLat: number, - centerLng: number, - radiusMeters: number, -): { lat: number; lng: number } => { - const ONE_LAT_DEGREE_IN_METERS = 111132.954; - const ONE_LNG_DEGREE_IN_METERS = - (40075016.686 * Math.cos((centerLat * Math.PI) / 180)) / 360; - - const randomRadius = Math.random() * radiusMeters; - const randomAngle = Math.random() * 2 * Math.PI; - - const dx = randomRadius * Math.cos(randomAngle); - const dy = randomRadius * Math.sin(randomAngle); - - const newLat = centerLat + dy / ONE_LAT_DEGREE_IN_METERS; - const newLng = centerLng + dx / ONE_LNG_DEGREE_IN_METERS; - - return { lat: newLat, lng: newLng }; -}; - -const generateRandomPlaces = (count: number): Place[] => { - const baseLat = 35.486404; - const baseLng = 133.06863; - const radius = 100; - const titles = ["地点A", "地点B", "地点C", "地点D", "地点E"]; - - const timetables = [ - { time: "10:00 - 14:00", event: "オープニングセレモニー" }, - { time: "11:30", event: "地元グルメフェスティバル" }, - { time: "14:00", event: "和太鼓パフォーマンス" }, - { time: "16:00", event: "スペシャルゲストライブ" }, - { time: "18:00", event: "花火大会" }, - { time: "19:30", event: "クロージングセレモニー" }, - { time: "10:00", event: "オープニングセレモニー" }, - { time: "11:30", event: "地元グルメフェスティバル" }, - { time: "14:00", event: "和太鼓パフォーマンス" }, - { time: "16:00", event: "スペシャルゲストライブ" }, - { time: "18:00", event: "花火大会" }, - { time: "19:30", event: "クロージングセレモニー" }, - ]; - - const places: Place[] = Array.from({ length: count }).map((_, index) => { - const position = generateRandomPosition(baseLat, baseLng, radius); - const title = titles[index % titles.length]; - - const description = ( - <div className="table-container"> - <h3>{title}</h3> - <table> - <thead> - <tr> - <th>時間</th> - <th>内容</th> - </tr> - </thead> - <tbody> - {timetables.map((item, i) => ( - <tr key={i}> - <td>{item.time}</td> - <td>{item.event}</td> - </tr> - ))} - </tbody> - </table> - </div> - ); - - return { - id: index + 1, - position, - title, - description, - }; - }); - - return places; -}; - -export default generateRandomPlaces(5);