の作業記録
ゆっくりしたい日曜日
- 作業記録の共有
- STLの確認
- KW+表玄関の記事
- トンネルChannel+頭と行動の整理
- Textboxのリファクタリング
7:00
おはようございます。本日は来週の予定の確認をして、あとはコードのリファクタリングをしたいところ。KWの表玄関の記事も書きましょう。
STLの確認
来週のスケジュール、タスク、リストを確認します。
＊ ＊ ＊
だいたいOKです。
8:00
KW:
表玄関の記事を書きましょう。
＊ ＊ ＊
書けました。
土曜日に書こうと思っているのですが、だいたい日曜日になってしまっていますね。
9:00
トンネルChannel:
書きます。
＊ ＊ ＊
12:00
Textbox:
コードを書き換えていきましょう。
＊ ＊ ＊
まず、「今のページ」を保存するプロパティと「ページヒストリー」を保存するプロパティーをオブジェクト内に設定します。これまではグローバル変数を使っていたものを個別のオブジェクトに再配置する試みです。
＊ ＊ ＊
まず、「今のページ」をグルーバル変数から追い出しました。オブジェクト中にプロパティーを作り、さらにそのプロパティを直接書き換えるのではなく、setメソッドを使って編集するように。ついでにgetメソッドも作って置きました。
できれば、この変数は隠蔽したいところですが、さて。
＊ ＊ ＊
ChatGPTによるとクロージャーの仕組みを使うのがよろしいとのこと。プロパティとして書くのではなく、普通の変数として宣言すればいいらしい。
が、まあいまのところはまあいいかで済ませておく。
＊ ＊ ＊
次にページリンク機能を変更する。これまではlinkbtmというクラスがついているspanにクリックイベントを設定し、それでmainpageを書き換えていたが、クリックイベントに読み込みたいページに加えて、書き換える領域を管理するオブジェクトを渡すようにする。これで、個別でリンク表示が作れるはず。
＊ ＊ ＊
だいたいOK。とりあえずmainpageでは不具合はない。違うオブジェクトを作ってもたしかめたいが、とりあえずはhistory機能に以降。というか、ヒストリー機能を自前で実装するのではなく、Knowledge Walkersで実装したみたいにブラウザの戻るを使えるようにした方が早い気がする。
まあいいか。とりあえずグローバルに置いてあるhistoryオブジェクトを、上記のオブジェクトに加える。あとはだいたい一緒。
＊ ＊ ＊
ページを読み込むためのオブジェクト（インスタンス）の中にそのままhistoryオブジェクトを追加して、thisなどの参照をちょっといじれば簡単に実装できました。これで個別のページ領域がそれぞれに履歴を持つことができます。
これで準備は整いました（たぶん）。ためしにどこかのページでオブジェクトを生成してみましょう。
＊ ＊ ＊
できるようになりましたが、問題は循環を阻止することです。つまり、Aという頁の中にBというページ領域があるときに、BにAへのリンクがあると無限に参照しあう形になります。これをどのように阻止するか。
今表示しているページの一覧があればいいでしょうか。クリックしてページを描写しようとするときにページリストを参照して、一致するものが一つもない場合だけページの描写を許可する、というもの。
いや、まてよ。リンクをクリックしたら、だろう。ということは、別に大丈夫なのか。初期状態では含まれていないわけだから。いや、divのid名が重複することになるか。そのページ内にそのページを読み込んでいるわけだから。
やっぱりだめだ。これは分家のページがその親もとのページと同じでなければいい、という制約でよいだろうか。存在するすべてのページにおいて重複のチェックが必要？ 必要だな。やっぱりIDの重複があるから。
ということは、ページのインスタンスを作るとき、そのインスタンスを管理するリストにも追加する、という感じがいいか。その中身を見て回る。
途端にややこしくなってきた。
＊ ＊ ＊
pageManagerというグローバルな配列を作り、リンクのクリック時に同じページがないかをチェックするようにしました。ここまでは簡単なのですが、ページを移動する際にその配列を編集しなければなりません（でないと別のページに移動した後もそのページが開けなくなる）。
mainPageでのリンクにおいて？ すべてのリンクにおいて？
これはちょっとややこしいですね。ページを移動するたびに配列をリセットして、そこにmainpageを再度追加する、というのは簡単です。が、それでいいのかどうか。
ページを管理するオブジェクトの中に、「そのページで表示されているページリスト」を持つようにする？ リンクのチェックは、そのオブジェクトで表示しているページと、そのオブジェクトが持つページの両方を行う？。この場合、描写するページが書き変わるたびにページリストをクリアすればいいことになる。
ふむ。
ようはグローバルなページリストではなく、mainPageのプロパティーとして持っておく、ということ。それはいいのだけども、じゃあ、リンクをクリックしたときに「どこのプロパティのリストをチェックするのか」をどう判断すればいい？
いや、そもそもページ領域を新しく作成するときに、どのオブジェクトに追加するのかの方が問題か。maiPageの描写の中のページAの中でさらにsubをBページとして切ったとき、もしページAにおいて「Mainにaddする」というのでは、うまくかない。この書きかたをまず改める必要がある。
このページを描写しているオブジェクトを参照する形に変更が必要。
＊ ＊ ＊
描写されたページのscript内において、このページを描写しているオブジェクトを参照できる必要がある。
これはなかなか難しい。
まず、各ページのscriptは、自分の親となるdivを見つけられるか？
それを見つけられるとすると、存在しているすべてのオブジェクトから、targetがそのdivになっているものを探せば、自身を描写しているオブジェクトが見つけられる。ということは、存在しているすべてのオブジェクトのリストが必要。あるいは、mainから始めてそのsubを探索していく。
仮に存在しているすべてのオブジェクトのリストをグローバルで作ったとする。で、それぞれのページのScriptは自分を描写しているオブジェクトが見つけられるようになったとする。もし、ページ内で新規でページを描写する場合は、見つけたそのオブジェクトのsubpagelistプロパティに新しいページを描写するためのオブジェクトを追加しておく。当然、同じものをグローバルのリストにも追加する必要がある（すでに重複がある）。
そのグローバルのリストは、一次の配列ではなく階層構造にすればページ群の管理が楽だがそれはさておく。
今考えているのは、リンクを押してページ転移が行われる際に、消えるオブジェクトを削除すること。いや、そのオブジェクトはそもそも残っていない？
即実行関数内で宣言しているので、そもそも残らないのだ。であれば、ページの再描写は作成したオブジェクトではできないことになる。
ふむ。
今考えているのは、即実行関数外で描写オブジェクトを宣言した場合の処理、ということになる。
ページが所有している一つのオブジェクトのすべてのインスタンスを見つけられる？ リストとして保存しておかないと無理なようだ。
ふむ。即実行関数内で宣言すれば、オブジェクトの消去といった手間は考えなくても済む。一方で、インスタンスを再利用してページを書き換えることができない。であれば、今やろうとしている目的には合わない。
よって、ごく普通にインスタンスを宣言するとする。で、その消しかたを考える。
letを使って上書きする？
＊ ＊ ＊
リンクボタンを押す。そのときページの描写が切り替わる。そのタイミングで、その描写オブジェクト（自身）が持っているsubpagelistを空にする。今描写されているページを管理するリストを変更する。
＊ ＊ ＊
なんとかできたような気がしないでもない。
グローバルのページリストを作るのはちょっとな、という感じもするけども、それをはずすと大分面倒になりそうなので、これで良しとしておく。