差分

このページの2つのバージョン間の差分を表示します。

--- ハイハイスクールアドベンチャー_web版 [2024/02/16 00:35] – [音とか] araki
+++ ハイハイスクールアドベンチャー_web版 [2025/09/18 01:28] (現在) – [画面の描画] araki
@@ 行 66: / 行 66: @@
 じゃあ、メモリ上に置いといて、書き込みは処理が終わってまとめてやればいいんじゃないかということになるが、画像を RGBA形式で保持していると、結局読み出しが遅いのだ。
-そもそもそんなに色数使わないので、8bitのインデックスを作ってペイントバッファとしてそれを使えばいいんじゃないかということに気づいてそのようにした。
+そもそもそんなに色数使わないので、8bitのインデックスを作ってペイントバッファとしてそれを使えばいいんじゃないかということに気づいて((気づきが遅い!))そのようにした。
 なお、当初は、普通に一枚の canvasでやりくりしてたし、速度的には十分だったが、下に書くように、画面の表示領域をネイティブのサイズより大きくしたかったので、画面の canvas要素へ拡大転送するための canvasを作成して、ネイティブサイズ((256x152ピクセル))の画像はそこに描画されている。
@@ 行 249: / 行 249: @@
 if ('serviceWorker' in navigator)
 {
-    navigator.serviceWorker.register('js/sw.js');
+    navigator.serviceWorker.register('sw.js');
 }
 </code>
@@ 行 279: / 行 279: @@
         'js/global.js',
         'js/map.js',
-        'js/sw.js'
+        'sw.js'
 ];
@@ 行 303: / 行 303: @@
 要はキャッシュを登録しているだけである。
 これでオフラインでも使えるようになるらしい((そのように作られていれば))が、やってみていないのでわからない。
+なお、キャッシュされるオブジェクトの指定は、sw.jsのある場所からの相対パスまたは絶対パス、URIなどで、これを間違うとエラーをはいてキャッシュに失敗する。
+ブラウザによってはsw.jsがエラーを出しているとインストールボタンを表示してくれない厳格なやつもいたりするので、よく確認してほしい。
 === トラブルシュート ===
@@ 行 417: / 行 421: @@
 なお、実際に使用しているスタイルシートは、レスポンシブデザインっぽく、px使わないでサイズを指定しています。
+==== 設定 ====
+基本的には、特に設定項目はなかったのだが、音を鳴らすことにしたら、Qt版同様に、音を鳴らすのかどうかを覚えておいた方がいいような気がしてきた。
+まあ、毎回 Mute ONにしてしまうでもいいような気もしたが、将来何かの設定を追加したときに、それも覚えておいた方がいいような気がしたので、保存できるようにした。
+ゲームデータ保存用objectStoreはIndexedDBに作ってあったので、バージョンを2にして、設定用のobjectStoreも作るようにした。
+DBのアップグレードとかしないと思ってたが、いきなりすることになるとは先見の明がなさ過ぎた。
+<code>
+const req = indexedDB.open(Database.DBNAME,Database.VERSION);
+req.onupgradeneeded = (event) =>
+{
+	const db = event.target.result;
+	const oldver = event.oldVersion;
+	const newver = event.newVersion;
+	const migrations = {
+		"1": () => {
+			db.createObjectStore(Database.STORENAME, {keyPath:'id'});
+		},
+		"2": () => {
+			db.createObjectStore(Database.PREFSTORE, {keyPath:'pref'});
+		}
+	}
+	for (var v = oldver + 1 ; v <= newver ; v++)
+	{
+		if (migrations[v]) migrations[v]();
+	}
+};
+</code>
+バージョン更新のやり方は、どこかで見かけたのを参考にした。