前回は、新規追加ページを作りましたが、まだビューができただけで実際にはregisterボタンを押しても追加できません。
今回は、新規追加する施設をDBに保存する処理を実装します。
このコミットです。
今回は変更内容が多いので、ソースコードを貼り付けるのはやめます。コミット毎に記事を投稿して詳細に説明を、と思っていたのですが、だんだん厳しくなってきました。そもそもこのスタイルにしてから2,3記事しか出してないのにもう挫折。
変更内容だけ簡単にまとめて置きます。
- パッケージの追加インストールです。
elm-package install danyx23/elm-uuid -- 施設追加時にuuidを使うため
elm-package install mgold/elm-random-pcg -- uuidパッケージに必要
registerNewFacilityCmd
は、新規追加用コマンドで、Update.elmから呼ばれます。registerNerFacilityRequest
は実際の施設追加リクエストです。json serverの仕様として、新規フィールド追加時は、パスの最後にidを含めずに、POST
リクエストを送ります。そうすると追加されます。新規フィールドのidは、フィールド内で空になっている場合は自動で付与されますが、今回はFacility
データにidを付与した状態で送っているので、そのidで登録されます。もしidが既にある場合はリクエストが失敗します。- 参考:json serverについて
src/Facilities/AddNewFacility.elm
newFacility
をview
の引数に追加しました。施設情報を変更した時と同様に、各フィールドの入力時にこのnewFacility
にデータを保存して置き、registerボタンが押された時に一度だけリクエストを送るようにします。- 各フィールドの入力時に
newFacility
にデータを保存するため、onInputでメッセージを送ります。 - registerボタンは、onClickでHttpリクエスト用のメッセージを送ります。
- デバッグ文を削除しました。
- port というのを使ってjavascriptとデータをやり取りします。今回は、uuid生成のための初期seedをjsから受け取るために使います。js側で乱数生成をして、それをelmで受け取って初期seedとして使います。
- 参考:ElmのPortでJSを使う。(qiita)
- 参考:公式チュートリアルのページ
- モデルにデータを追加しました。
newFacility
は上に書いたとおりです。newFacilityRegisteringStatus
は施設編集の時と同様に、リクエストが成功したか失敗したかを画面に表示するための状態値です。uuidSeed
はuuid生成のためのseedです。純粋関数型言語では、乱数の扱いが通常の言語に比べて少し面倒なようです。uuidSeed
はjsから受け取った乱数で初期化した後は、uuid生成時に出てくる新しいseed
で更新していきます。そうすることで生成されるuuidのランダム性が保証されるようです。というか当たり前ですが毎回同じseedを使っていたら毎回同じuuidが生成されます。 initialModel
も合わせて修正しました。newFacility
の初期値はemptyFacility
です。- uuidモジュールでは、randomパッケージではなくelm-random-pcgパッケージが必要です。この二つの乱数パッケージはほぼ同じインターフェイスを提供しているようです。
type alias UuidSeed
は、削除し忘れていますが、使っていません。
- jsで生成した乱数を受け取るために
GetRandomSeed Int
を追加しました。portでjsから値を受け取るためには、subscriptionsを使う必要があり、そこからこのメッセージが送信されます。 - 後は、新規施設の各フィールド入力時のメッセージと登録リクエスト送信用メッセージです。
- 新規施設ページでの各フィールド入力時のアップデートと、登録リクエストのためのアップデートです。ポイントとしては、
Msgs.RegisterNewFacility
のところで、uuidを生成してnewFacility
に追加してからリクエストコマンドに渡しています。その時に新しいseedも生成されるので、Model.uuidSeed
も更新して置きます。
- 新規施設追加ページと編集ページの両方で、リクエスト結果表示機能を使うので、
viewWithRequestStatus
でビューをラップすることで共通化しました。
- jsでintの乱数を生成し、ports機能を使ってelmの
randomSeed
に値を送ります。
以上で、施設新規追加ができるようになりました。
今の所、どうでもいい情報しか載っていないので、何か意味のある情報を得られるサイトにしたいです。やっぱりまずはトイレかなあ。