カウントダウン・スケジューラー 使い方

1. 予定を追加する

• 画面上の 新規作成 ボタンを押します。
• ダイアログで、日時・地域・タイムゾーン・予定名・背景色を入力します。
• 予定名を空欄にした場合は、自動的に 予定1、予定2 のような名前が補完されます。
• 追加する を押すとカードが画面に追加されます。

2. カウントダウン表示

• 予定の日時までの残り時間が、カード下部の白いエリアに表示されます。
• 表示形式は 1時間 00分 00秒 などの見やすい日本語表記です。
• 時間が経過すると 終了 と表示されます。
• 1秒ごとに更新されるため、常に現在時刻との差分を表示しています。

3. 予定の修正・削除

• 予定カードをクリックすると、追加・修正・削除のダイアログが開きます。
• 日時やタイトル、背景色を修正できます。
• 削除する を押すと確認ダイアログが出て、削除できます。

4. 背景色を変更する

• 追加・修正ダイアログの 背景色 で、各予定のカード色を選べます。
• 色ごとに付箋のように区別できるので、重要度や種別を見分けやすくなります。

5. カードを自由に移動する

• 予定カードをドラッグすると、画面上の位置を自由に移動できます。
• 付箋のように並べて、見やすいレイアウトに整理できます。
• ドラッグ後の位置は保存されるので、再読込しても位置が維持されます。

6. 保存・読み込み

• 画面上の 保存 ボタンで、現在の予定データをブラウザのローカル保存領域に保存します。
• 読み込み ボタンで、保存済みデータを呼び出せます。
• 保存対象には、予定名・日時・タイムゾーン・色・カード位置が含まれます。
• この機能はブラウザごとの保存領域を使うため、他のブラウザや他の端末には自動で共有されません。

7. 使い方のポイント

• 予定のタイムゾーンを変えれば、全国や海外の予定も同じ画面で管理できます。
• 色分けとドラッグ移動で、複数の予定を見やすく整理できます。
• ブラウザを閉じても保存されるため、再度開いたときにそのまま使えます。

8. 参考

• 本アプリは、JavaScript の利用例として構成されており、時間の扱いやブラウザの保存機能を活用しています。