実家に帰ると高齢の母は日にちの感覚が薄く、今日は何日なのかと一日10回は聞かれる。あるいは日にちを勘違いして朝からデイサービスの準備を始ることもしばしば。ネットを見てみると同様の悩みを抱えた人が多くいるようでもう使わなくなったスマホを活用して日めくりカレンダーができないか作ってみた。

スマホの操作不要で特別なアプリのインストールをしなくても常時今日の日付けを表示、ネットに接続していなくても日付けを更新するようにした。
定期的な曜日の予定を表示可能(デイサービス・可燃ゴミ出しなど)。
使わなくなった古いスマホを有効活用する。
日付け表示 (手もとにあったアンドロイド端末を用いた場合)
アプリをインストールするのではなく、“日めくり.html”を既存のChromeなどのブラウザで表示できるようにする。
日付けはスマホ内部のデータをScriptで読み込むことでネットに接続しなくても動作するようにする。
スマホの内のローカルファイル、“日めくり.html”のショートカットをホーム画面に置きたかったけど簡単でなさそうなので、代わりにカレンダーフォルダを作成してそこからアクセスするようにした。
スクリーンサイズ980×1860に合うようにフォントサイズを調整したけど、スマホにより再調整は必要。
常時日付けを表示するには、スクリーンセーバをOFFにし、画面表示を消灯しない設定にする必要がある。開発者オプションはシステムのビルド番号を数回クリックすることで選択できるようになる。

特定曜日の予定表示
“日めくり.html”をテキストエディタで編集、Weekdaysの配列に予定を下記のように追加する。追加文字数は6文字以下とすればスクロールしなくてもいい。
予定なし const weekdays = [“日”, “月”, “火”, “水”, “木”, “金”, “土”];
予定あり const weekdays = [“日”, “月”, “火”, “水”, “木 デイサービス”, “金”, “土”];
スマホの充電
スマホの充電は適度にON/OFFしてあげることが望ましいけど、それが難しい場合 お勧めはできないけど過充電に気を付けてながら常に充電ケーブルをつなげておくこととなる。ただしフル充電時の充電量を80~90%にし、充電器は過充電保護機能を備えたものを使う。

日めくり.html
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>日付表示</title>
<style>
.container {
text-align: center;
font-family: Arial, sans-serif;
}
.monh {
text-align: left;
font-size: 60px;
font-weight: bold;
}
.date {
font-size: 260px;
font-weight: bold;
}
.day {
text-align: left;
font-size: 80px;
font-weight: bold;
}
</style>
</head>
<body>
<div class="container">
<div id="monh" class="monh"></div>
<div id="date" class="date"></div>
<div id="day" class="day"></div>
</div>
<script>
function updateDate() {
const now = new Date();
const year = now.getFullYear();
const month = now.getMonth() + 1;
const day = now.getDate();
const weekdays = ["日", "月", "火", "水", "木", "金", "土"];
const weekday = weekdays[now.getDay()];
const hour = now.getHours();
<!-- const minu = now.getMinutes(); -->
const minu = String(now.getMinutes()).padStart(2,"0");
document.getElementById("monh").textContent = `${month}月/ ${hour}:${minu}`;
<!-- document.getElementById("monh").textContent = ` ${minu}分`; -->
document.getElementById("date").textContent = `${day}`;
document.getElementById("day").textContent = weekday;
}
updateDate();
<!-- Interval 720000=12min, 7200000=120min -->
setInterval(updateDate, 180000);
</script>
</body>
</html>

とても便利そうですね
いいねいいね