pages.tsx (22628B)
1 "use client"; 2 3 import React from 'react'; 4 import { UPDATE_LOGS } from '@/lib/updateLogs'; 5 6 export const OVERLAY_CONTENTS: Record<string, { title: string; body: React.ReactNode }> = { 7 about: { 8 title: "About", 9 body: ( 10 <div className="space-y-4 font-normal"> 11 <p> 12 「Cafe Timer」は、ゲーム『ブルーアーカイブ』のカフェ機能を支援する非公式ファンメイドツールです。<br /> 13 生徒さんのカフェ訪問タイミングを通知でお知らせし、先生方の業務をサポートします。 14 </p> 15 <h2 className="text-xl font-bold mt-8 mb-4 text-(--foreground)">主な機能</h2> 16 <ul className="list-disc pl-5 space-y-2"> 17 <li>生徒さんの再タップ可能タイミングのカウントダウン</li> 18 <li>生徒さんの訪問タイミング（4:00/16:00 JST）のカウントダウン</li> 19 <li>招待券のクールタイム管理</li> 20 <li>タップ履歴のカレンダー表示</li> 21 <li>絆上げの記録とグラフ表示</li> 22 </ul> 23 <h2 className="text-xl font-bold mt-8 mb-4 text-(--foreground)">対応プラットフォーム</h2> 24 <p> 25 PCおよびスマートフォンの最新ブラウザで動作します。<br /> 26 PWAに対応しているため、ホーム画面に追加してアプリのように使うことができます。 27 </p> 28 </div> 29 ), 30 }, 31 guide: { 32 title: "使い方ガイド", 33 body: ( 34 <div className="space-y-6 font-normal"> 35 <section> 36 <h2 className="text-xl font-bold mb-3 text-(--foreground) border-b border-muted pb-2"> 37 🟦 カフェタイマーの使い方 38 </h2> 39 <ul className="list-disc pl-5 space-y-2"> 40 <li> 41 <strong>Next Tap:</strong> 生徒さんと触れ合うことができるまでの時間をカウントダウンします。「Tap」ボタンを押すと履歴が記録され、カウントダウンが始まります。 42 </li> 43 <li> 44 <strong>Next Call:</strong> 生徒さんを招待するチケット（招待券）のクールタイムを管理します。使用した時刻にボタンを押すと、次の使用可能時刻までのカウントダウンが始まります。 45 </li> 46 </ul> 47 </section> 48 <section> 49 <h2 className="text-xl font-bold mb-3 text-(--foreground) border-b border-muted pb-2"> 50 🟨 Tap履歴の使い方 51 </h2> 52 <ul className="list-disc pl-5 space-y-2"> 53 <li> 54 <strong>SAVE IMAGE:</strong> Tap履歴を月ごとに画像で保存できます。SNSへの投稿などにご利用いただけます。 55 </li> 56 </ul> 57 </section> 58 <section> 59 <h2 className="text-xl font-bold mb-3 text-(--foreground) border-b border-muted pb-2"> 60 🟦 履歴と同期 61 </h2> 62 <p> 63 Discordログインにより、タップ履歴がサーバーに保存されます。 64 同じアカウントでログインすると、PCやスマホなど異なる端末でも同じデータを共有・同期できます。 65 </p> 66 </section> 67 <section> 68 <h2 className="text-xl font-bold mb-3 text-(--foreground) border-b border-muted pb-2"> 69 🟨 通知設定について 70 </h2> 71 <p className="mb-4"> 72 メニュー内の「通知設定」から、生徒さんと触れ合える時刻をプッシュ通知でお知らせします。 73 4:00/16:00 JSTについては、時刻が固定されている&負荷軽減のため、通知を行いません。<br /> 74 </p> 75 <div className="bg-blue-500/10 border border-blue-500/50 rounded-lg p-4 text-sm mb-4"> 76 <p className="font-bold mb-2">ℹ️ お願い</p> 77 <p> 78 通知登録されている端末数が増加すると、運営者の大人のカードの出番がやってくるかもしれません。 79 </p> 80 <p className="mt-1"> 81 通知登録は1ユーザーあたり2端末までを目安とし、通知が不要な端末は都度登録解除していただくよう、何卒ご協力をお願いいたします。 82 </p> 83 </div> 84 <div className="bg-red-500/10 border border-red-500/50 rounded-lg p-4 text-sm"> 85 <p className="font-bold mb-2">⚠️ 通知設定がうまくいかない場合</p> 86 <p> 87 AdGuard や uBlock Origin などの広告ブロック（コンテンツブロッカー）機能を使用している場合、通知システムが「トラッキング」と誤認され、許可ダイアログが表示されないことがあります。 88 </p> 89 <p className="mt-1"> 90 通知設定を行う際は、このサイト（ドメイン）を許可リストに追加するか、一時的に機能をOFFにしてからページを再読み込み・通知設定を行ってください。 91 </p> 92 </div> 93 </section> 94 </div> 95 ), 96 }, 97 faq: { 98 title: "FAQ", 99 body: ( 100 <div className="space-y-4 font-normal"> 101 <h2 className="text-xl font-bold mb-3 text-(--foreground) border-b border-muted pb-2"> 102 🟦 機能 103 </h2> 104 <div className="flex flex-col gap-1"> 105 <h3 className="font-bold text-(--foreground)"> 106 Q: 記録を間違えてタップしてしまいました。削除できますか？</h3> 107 <p className="font-normal text-(--secondary-foreground) text-sm"> 108 A: カフェタッチのTap履歴は個別に編集・削除することはできません。絆ランク記録は直近6件のデータまで削除可能です。</p> 109 </div> 110 111 <div className="flex flex-col gap-1"> 112 <h3 className="font-bold text-(--foreground)"> 113 Q: 追加招待券には対応しますか？</h3> 114 <p className="font-normal text-(--secondary-foreground) text-sm"> 115 A: 今のところは対応していません。</p> 116 </div> 117 118 <div className="flex flex-col gap-1"> 119 <h3 className="font-bold text-(--foreground)"> 120 Q: ゲーム内でタップしたら自動で反映されますか？</h3> 121 <p className="font-normal text-(--secondary-foreground) text-sm"> 122 A: 本サイトはゲーム内のデータに一切アクセスしていません。ゲーム内カフェでのタップ後は、こちらでも手動でTapボタンを押してください。</p> 123 </div> 124 125 <div className="flex flex-col gap-1"> 126 <h3 className="font-bold text-(--foreground)"> 127 Q: Tap履歴のエクスポートはできますか？</h3> 128 <p className="font-normal text-(--secondary-foreground) text-sm"> 129 A: テキストデータなどによるエクスポートは、今のところは対応していません。SNSなどへの共有は、月ごとの画像エクスポート機能をご使用ください。</p> 130 </div> 131 132 <div className="flex flex-col gap-1"> 133 <h3 className="font-bold text-(--foreground)"> 134 Q: The history calendar doesn't match the dates I actually tapped.</h3> 135 <p className="font-normal text-(--secondary-foreground) text-sm"> 136 A: The historical calendar considers the period from 4:00 AM to 3:59 AM the following day (Japan Standard Time) as one day. If you reside in a country using a time zone different from UTC+9, please understand this may not match the actual date you use.</p> 137 </div> 138 139 <h2 className="text-xl font-bold mb-3 text-(--foreground) border-b border-muted pb-2"> 140 🟨 システム 141 </h2> 142 <div className="flex flex-col gap-1"> 143 <h3 className="font-bold text-(--foreground)"> 144 Q: オフラインでも利用できますか？</h3> 145 <p className="font-normal text-(--secondary-foreground) text-sm"> 146 A: 利用できません。インターネットへの接続が必要です。</p> 147 </div> 148 149 <div className="flex flex-col gap-1"> 150 <h3 className="font-bold text-(--foreground)"> 151 Q: ゲーム内部のデータを使用していますか？</h3> 152 <p className="font-normal text-(--secondary-foreground) text-sm"> 153 A: 本サイトはゲーム「ブルーアーカイブ」内に実装されている機能などは使用していません。また、ゲームデータ自体にもアクセスしていませんので、本サイトがゲーム内のアカウントに影響を与えることはありません。</p> 154 </div> 155 156 <div className="flex flex-col gap-1"> 157 <h3 className="font-bold text-(--foreground)"> 158 Q: アプリを閉じてもタイマー・チケットは維持されますか？</h3> 159 <p className="font-normal text-(--secondary-foreground) text-sm"> 160 A: はい、維持されます。時間はサーバー側に保存されているため、ブラウザを閉じたり、別の端末からアクセスしたりしても、最新の状態が反映されます。</p> 161 </div> 162 163 <div className="flex flex-col gap-1"> 164 <h3 className="font-bold text-(--foreground)"> 165 Q: データのバックアップは必要ですか？</h3> 166 <p className="font-normal text-(--secondary-foreground) text-sm"> 167 A: ログインに使用しているDiscordアカウントに紐づいてクラウド上に保存されるため、ログアウトしてもデータが消えることはありません。ただし、データの永久保存については保証しておりませんので、各自で別途記録しておくことをおすすめします。</p> 168 </div> 169 170 <div className="flex flex-col gap-1"> 171 <h3 className="font-bold text-(--foreground)"> 172 Q: 複数の端末で同時に使えますか？</h3> 173 <p className="font-normal text-(--secondary-foreground) text-sm"> 174 A: 複数端末でお使いいただけますが、複数端末での同時操作はデータの不整合を引き起こす可能性があります。データの整合性を保つために、他方の端末では再読み込みを行ってから操作を開始してください。</p> 175 </div> 176 177 <div className="flex flex-col gap-1"> 178 <h3 className="font-bold text-(--foreground)"> 179 Q: 1つの端末で複数アカウントを管理できますか？</h3> 180 <p className="font-normal text-(--secondary-foreground) text-sm"> 181 A: 可能ですが、本サイトはアカウントを切り替えて使うシステムを実装していませんので、都度ログアウト・ログインが必要となります。また、通知機能は端末ごとに管理されており、1つの端末につき1つのアカウントのみ通知を受信できますのでご了承ください。</p> 182 </div> 183 184 <div className="flex flex-col gap-1"> 185 <h3 className="font-bold text-(--foreground)"> 186 Q: このサービスは無料で使えますか？</h3> 187 <p className="font-normal text-(--secondary-foreground) text-sm"> 188 A: はい、すべての機能を無料でご利用いただけます。ただし、個人開発のサービスであるため、予告なく仕様変更やサービス停止を行う可能性がある点はあらかじめご了承ください。</p> 189 </div> 190 191 <div className="flex flex-col gap-1"> 192 <h3 className="font-bold text-(--foreground)"> 193 Q: 通知が届きません。</h3> 194 <p className="font-normal text-(--secondary-foreground) text-sm"> 195 A: ブラウザの設定で通知が「許可」になっているかご確認ください。また、本サイトの通知設定をやり直してみてください（使い方ガイドのページも参照）。ご利用の端末に起因する通知の不着は、申し訳ありませんが対応いたしかねます。利用規約にもある通り、通知は必ず届くことを保証しておりません。</p> 196 </div> 197 198 <div className="flex flex-col gap-1"> 199 <h3 className="font-bold text-(--foreground)"> 200 Q: Discord以外のログイン方法はありますか？</h3> 201 <p className="font-normal text-(--secondary-foreground) text-sm"> 202 A: 現在はDiscord認証のみに対応しています。本サイトはアカウントを切り替えて使用する設計になっていないため、他の認証システムを導入する予定もありません。</p> 203 </div> 204 </div> 205 ), 206 }, 207 terms: { 208 title: "利用規約", 209 body: ( 210 <div className="space-y-4 font-normal text-sm"> 211 <p>この利用規約は、本ウェブサイト上で提供するサービス（以下、「本サービス」といいます。）の利用条件を定めるものです。</p> 212 213 <h3 className="font-bold text-(--foreground) mt-6">1. 免責事項</h3> 214 <ul className="list-disc text-(--secondary-foreground) pl-5"> 215 <li>本サービスは現状有姿で提供され、その機密性、完全性、可用性を保証するものではありません。</li> 216 <li>本サービスの利用により生じた損害（ゲーム内での損失、データ消失など）について、運営者は一切の責任を負いません。</li> 217 <li>通知機能はブラウザや設定、端末、ネットワーク環境等に依存するため、確実に届くことを保証するものではありません。</li> 218 </ul> 219 220 <h3 className="font-bold text-(--foreground) mt-6">2. 禁止事項</h3> 221 <ul className="list-disc text-(--secondary-foreground) pl-5"> 222 <li>本サービスのサーバーに過度な負荷をかける行為</li> 223 <li>不正アクセス行為</li> 224 <li>本サービスを営利目的に使用する行為</li> 225 <li>日本国における法令に反する行為</li> 226 <li>その他、運営者が不適切と判断する行為</li> 227 <li>禁止事項に違反した場合は、アカウント及び保存されたデータの削除、IPアドレス遮断などの相当な措置を行うことがあります。</li> 228 </ul> 229 230 <h3 className="font-bold text-(--foreground) mt-6">3. サービスの変更・停止</h3> 231 <ul className="list-disc text-(--secondary-foreground) pl-5"> 232 <li>運営者は、ユーザーに通知することなく、本サービスの内容を変更または提供を中止することができるものとします。</li> 233 </ul> 234 235 <h3 className="font-bold text-(--foreground) mt-6">4. 著作権</h3> 236 <ul className="list-disc text-(--secondary-foreground) pl-5"> 237 <li>本サービスは個人によって制作された非公式ツールであり、株式会社Yostar、NEXON Games、およびその他の関連団体とは一切関係ありません。</li> 238 <li>本サービス中の『ブルーアーカイブ』に関係するデータ等の著作権は、株式会社Yostar、NEXON Games、およびその他の権利者に帰属します。</li> 239 <li>本サービスのファビコンおよびアプリアイコンは、<a href="https://www.flaticon.com/free-icons/coffee-break" title="coffee break icons" target="_blank" rel="noopener noreferrer" className="hover:underline text-blue-400">Freepik社</a> のライセンスの下で使用しています。</li> 240 </ul> 241 242 <p className="text-right">2026年2月8日 発効</p> 243 </div> 244 ), 245 }, 246 privacy: { 247 title: "プライバシーポリシー", 248 body: ( 249 <div className="space-y-4 font-normal text-sm"> 250 <p>当サイトは、ユーザーの個人情報の取扱いについて、以下のとおりプライバシーポリシーを定めます。</p> 251 252 <h3 className="font-bold text-(--foreground) mt-6">1. 収集する情報</h3> 253 <ul className="list-disc text-(--secondary-foreground) pl-5"> 254 <li><b>認証情報</b>: Discordログイン時に提供されるユーザーID、メールアドレス、プロフィール画像URL。これらはユーザーの識別とデータ保存のためにのみ使用されます。</li> 255 <li><b>利用データ</b>: タイマーのタップ履歴、設定情報。</li> 256 <li><b>通知トークン</b>: プッシュ通知を送信するために必要なトークン。</li> 257 </ul> 258 259 <h3 className="font-bold text-(--foreground) mt-6">2. 利用目的</h3> 260 <ul className="list-disc text-(--secondary-foreground) pl-5"> 261 <li>本サービスの提供・運営のため</li> 262 <li>通知機能の提供のため</li> 263 <li>アクセス解析による利便性向上のため</li> 264 <li>不正アクセスの防止のため</li> 265 </ul> 266 267 <h3 className="font-bold text-(--foreground) mt-6">3. アクセス解析ツール</h3> 268 <p className="text-(--secondary-foreground)"> 269 当サイトでは、サービスの改善を目的として以下のツールを利用し、個人を特定できない匿名のトラフィックデータを収集しています。 270 </p> 271 <ul className="list-disc text-(--secondary-foreground) pl-5"> 272 <li><b>Google Analytics</b>: Cookieを使用してサイトの利用状況を収集するために使用されます。</li> 273 <li><b>Cloudflare Browser Insights</b>: サイトのパフォーマンスや接続状況を分析するために使用されます。</li> 274 </ul> 275 276 <h3 className="font-bold text-(--foreground) mt-6">4. 第三者への提供</h3> 277 <p className="text-(--secondary-foreground)"> 278 当サイトは、法令に基づく場合を除き、予めユーザーの同意を得ることなく第三者に個人情報を提供することはありません。ただし、本サービスの基盤としてSupabaseを使用しており、データはSupabaseのサーバー上で管理されます。 279 </p> 280 281 <h3 className="font-bold text-(--foreground) mt-6">5. データの削除</h3> 282 <p className="text-(--secondary-foreground)"> 283 ユーザーは設定画面の「データ削除」ボタンから、いつでも自身の全データをサーバーから完全に削除することができます。なお、アクセス解析によって収集された匿名情報については、本操作の対象外となります。 284 </p> 285 </div> 286 ), 287 }, 288 operator: { 289 title: "運営者情報など", 290 body: (() => { 291 const pastLogs = UPDATE_LOGS; 292 293 return ( 294 <div className="space-y-4 font-normal"> 295 <div className="grid grid-cols-1 gap-6"> 296 <div className="flex flex-col gap-2"> 297 <h3 className="font-bold text-(--foreground) border-b border-muted pb-1">運営代表・開発</h3> 298 <p className="font-normal"> 299 さにー<span className="ml-2 mr-1">X:</span><a href="https://x.com/156miyako" target="_blank" rel="noopener noreferrer" className="hover:underline text-blue-400">@156miyako</a><br /> 300 <span className="ml-11 mr-1">HP:</span><a href="https://rabbit1.cc" target="_blank" rel="noopener noreferrer" className="hover:underline text-blue-400">https://rabbit1.cc</a> 301 </p> 302 </div> 303 <div className="flex flex-col gap-2"> 304 <h3 className="font-bold text-(--foreground) border-b border-muted pb-1">開発協力</h3> 305 <p className="font-normal"> 306 ハチか<span className="ml-2 mr-1">X:</span><a href="https://x.com/bite_sour_sweet" target="_blank" rel="noopener noreferrer" className="hover:underline text-blue-400">@bite_sour_sweet</a> 307 </p> 308 </div> 309 <div className="flex flex-col gap-2"> 310 <h3 className="font-bold text-(--foreground) border-b border-muted pb-1">謝辞</h3> 311 <p className="font-normal"> 312 ブルーアーカイブ（ブルアカ）攻略 Wiki 様（絆ランクテーブル・生徒さんごとの贈り物対応付けに使用）<span className="ml-2 mr-1">HP:</span><a href="https://bluearchive.wikiru.jp/" target="_blank" rel="noopener noreferrer" className="hover:underline text-blue-400">https://bluearchive.wikiru.jp/</a> 313 </p> 314 </div> 315 </div> 316 317 <div className="flex flex-col gap-2"> 318 <h3 className="font-bold text-(--foreground) border-b border-muted pb-1">変更履歴</h3> 319 <div className="show-scrollbar bg-background/50 rounded-md p-3 max-h-60 overflow-y-auto space-y-1 text-sm"> 320 {pastLogs.map((log, index) => ( 321 <div key={index} className="flex flex-col gap-0.5"> 322 <div className="flex gap-3 text-(--foreground)"> 323 <span className="shrink-0 w-18">{log.date}</span> 324 <p>{log.content}</p> 325 </div> 326 {log.comment && ( 327 <p className="text-xs text-(--secondary-foreground) pl-21 leading-relaxed"> 328 {log.comment} 329 </p> 330 )} 331 </div> 332 ))} 333 </div> 334 </div> 335 336 <div className="flex flex-col gap-2"> 337 <h3 className="font-bold text-(--foreground) border-b border-muted pb-1">連絡先・フィードバック</h3> 338 <p className="text-sm leading-relaxed"> 339 不具合・ミスのご報告やご要望は、 340 <a href="https://github.com/Sunny-JP/ba-cafe" target="_blank" rel="noopener noreferrer" className="mx-1 hover:underline text-blue-400"> 341 GitHub 342 </a> 343 または X (Twitter) までお願いいたします。 344 個人開発のため全てのご意見への対応は難しい場合がありますが、Pull Requestなど積極的に受け付けています。特にWeb開発経験をお持ちの方は、ご協力いただけると幸いです。 345 </p> 346 </div> 347 </div> 348 ); 349 })(), 350 }, 351 };