暑くなってきましたね。
本編進捗
私は相変わらず本編を頑張って作っています。
イラストの納品ペース次第ですが、今年中に出せるかなーという感触です。
使用している音楽素材のライセンスがネックで Windows 版しか出さないつもりだったのですが、改めて最新のライセンスを見たら Web 版を出しても大丈夫そうだったので、今回は Web 版も出そうと思っています。
動作確認は Windows でしかやらないつもりですが……。
下記の記事を見て知ったんですけど
https://zenn.dev/catnose99/articles/547cbf57e5ad28
最近のiOS SafariではITPの仕様により、ブラウザ上のJavaScriptから保存されたCookieやローカルストレージの内容は7日以上ユーザーが触らないと自動で削除される
ということらしくて、もしもティラノスクリプト製のゲームがセーブデータを localStorage に保存しているなら iOS Safari でプレイするとうっかりセーブデータ消えるんですよね。
やっぱりゲームはダウンロードして遊ぶのが一番安心です……。
らくがき
ちょっとゲーム製作の過程で最新のクリスタが欲しくなったので、ついでに優待で 2 デバイス版を年間契約しました。
久々にクリスタで描いたらくがき。
クリスタは色んなツールの配置などを覚えているので使いやすいです。
あと iPad はやっぱり動作が快適で良いですね。
もう raytrektab には戻れない……。
サイトの改善
上のほうで書きましたが、iOS Safari では localStorage のデータが消えてしまうとのことなので、本サイトの初期表示時のカラーテーマは端末の設定を見るようにしました。
たぶんできてると思います!
それに伴って、今まで端末はダークモードだけど本サイトはライトモードで見てましたって方がもしいたら、本サイトの表示がダークモードになってると思います。
すみませんが、ライトモードを指定し直してください。
初期値で端末の設定を見つつ、動的に切り替えることも可能にするやり方はそんなに難しくなくて、JavaScript で
window.matchMedia('(prefers-color-scheme: dark)').matches;
これで端末の設定がダークモードかどうかが取得できるんですよ。
なので、localStorage に設定値が無かったら端末の設定を見て、localStorage に設定値を保存します。
こんな感じの関数を <head>
内で実行しています!
function restoreMode() {
const dark = localStorage.getItem("dark");
const osDark = window.matchMedia('(prefers-color-scheme: dark)').matches;
if (dark !== null) {
if (dark === "on") {
doc.documentElement.classList.add("dark");
}
} else {
if (osDark) {
doc.documentElement.classList.add("dark");
localStorage.setItem("dark", "on");
} else {
localStorage.setItem("dark", "off");
}
}
}
もしバグってそうだったら教えてください。
おわり