いきなりゲームブック3・・・とは行きません(´・ω・`)・・・と思ったら・・・
さて、前回までテンション高く、Ionicと戯れていましたが、そう簡単には行かない模様。
当面の壁はTypeScript と言う言語ですね。
プログラム言語と言うものは、結構個性や相性があるように思っています。
今までいじった中では、(あまり長い付き合いでは無かったですが)Pythonが圧倒的にフレンドリーな気がします。
付き合いの長さと書いたコードの量だとVBA（Excelなんかに入ってるやつですね）ですが、これは初心者にはそれなりに優しく、慣れた人にはそれなりに行儀よくと言う感じでキライじゃないですが、今更おすすめは出来ないかも？
TypeScript もマイクロソフトによって開発されたそうですが、あんまりとっつきの良い方ではなさそうです。ただ、そういう言語の方が長い付き合いのなれば信頼できそうなイメージはありますけどね。
しかしプログラミング言語の栄枯盛衰、面白くもあり厄介でもありますね。
さて閑話休題
今回は、可能な限りモバイルアプリ（ゲームブック）を完成させようと言うのが目的ですので、TypeScriptの基礎から付き合う気はありません。（あとで急がば回れが正解という事もあり得ますが）
参考書籍"Ionicで作るモバイルアプリ制作入門[Angular版]"（ISBN978-4-86354-292-1)(以降、参考書籍と呼びますね)を元にトライしてみます。（書籍の宣伝する気もないのですが、これがベースの一つなので仕方ない）
もちろん参考書籍の順番にやっても良いのですが、今回のゲームブック、HTML版は完成済みなので、必要な機能の書き方を手に入れる！と言う感じで進めたいと思います。
まず、ゲームブックHTML版について書きますと
・ブック情報、ページ情報がある。（JSONと言うモバイルアプリでも使えるであろう形式です）
・これをページに適宜表示する。
・プレイヤーに選択させたり、あるいはサイコロあるいはステータスにより別のページを表示する。
こんな感じです。
ですので、１．ページの書き換え。２．外部データの取り込み。３．ロジックを使う。の順で試していきたいと思います。
１．ページの書き換え
まずコマンドプロンプトを立ち上げ、ゲームブックプロジェクトをカレントディレクトリーにしてコマンド"ionic serve"を走らせたまま作業します。（と参考書籍に書いて有ります）
ブラウザにプロジェクト作成時に作ったテンプレート通りの画面が表示されます。
エクスプローラーでプロジェクト内の\src\app\home\home.page.tsを変更します。
ファイルを選択状態にして右クリック、プログラムから開く→VisualStudioCodeで行けると思います。
なお、開いたときにこのワークスペースを信頼する。とVisualStudioCodeに指示した方が良さそうです。
(なんとなくできたのでやり方メモしてないです)
以下の部分にタイトルを付け加えます。
------------------------------------------------------------
export class HomePage {
title = 'テストタイトル'; ←この行を追加
constructor() {}
}
------------------------------------------------------------
さて、このままアプリをリロードします。何も変わりません（笑）
次に、参考書籍に従いプロジェクト内の\src\app\home\home.page.htmlを変更します。
(ファイルを選択状態にして右クリック、プログラムから開く→VisualStudioCode)
拡張子はhtmlですが、htmlじゃないので、一寸びっくりしましたが参考書籍によると下のBlankと書いたる部分を修正しろという事です。
------------------------------------------------------------
<ion-header [translucent]="true">
<ion-toolbar>
<ion-title>
Blank
</ion-title>
</ion-toolbar>
</ion-header>
------------------------------------------------------------
早速指示に従い修正します。
Blank → {{title}}
なお、最初、title を Title と書いたらエラーで怒られました。
するとリロードするまでもなく、テンプレートページがテストタイトルに書き換わりました！
ちょっと前進した気がしますね。(細かい疑問やらはいっぱい出てきましたが)
２．外部データの取り込み
あっさり、この文章を書く手間を除けば数分で１．ページの書き換え達成しましたが、次はどうでしょう？
外部データの値を使ってページの変更を行うが目標です。
恐らくですが、上の変更、プロジェクト内の\src\app\home\home.page.tsのtitleの箇所、homepageクラスのプロパティとして記述してるようですので、大分勝手が違うかも？
(翻訳入ります。クラスと言うのは性格や能力、スキルなどを持った一つの存在です。クラスには、プロパティ(性質)とメソッド（スキル）があります。例えば主人公クラスにタイプ：異世界転生系主人公、名前：名無しの権兵衛・・・と色々設定してやるとプログラムの中で動かしやすい訳です。）
続けて試そうと思いましたが、少し集中してみたいので、ここまでで投稿してみます。
と書いたばかりで恐縮です。
テンプレートのタイトルを変更する部分まで達成しましたが、改めてVisualStudioCodeでプロジェクト内の\src\app\home\home.page.ts と \src\app\home\home.page.html を眺めてみると・・・
あれ？これ、この二ついじるだけでゲームブック出来るよね？と気づきました。
細かいところはともかく、また、泥臭い事に目をつぶれば、表示関係を \src\app\home\home.page.html で行い、そして、ゲームブックのデータをhomepageクラスにプロパティとして入れてやり、選択肢を選んだサイト化の動きをメソッドとして実装すれば、うまく行くように思います。
ただ、色々折り合いと言うか、調べものの必要が出来てきたので、ここで投稿完了。
次は時間をだいぶ置くかもしれません。(完成報告だと良いのですが)
