2018-02-24-gaaamii
昼の部
すでに最低限文章を書くだけの機能はできてきたので、自分で使いながら必要なものを考えることができるようになった
今17:41なので18:45までやろう
今日は何をやろう
ノートを削除できるようにしよう
削除どこからできるようにしようか
まず思いつくのは、なんかいろいろ書いてるうちに不要なメモが貯まってきて、それをリストで見ている時に気付いて消すみたいなシチュエーション
ノートを消したいと思うタイミング、そんなに多くはないと思う
書いてる途中で頻繁に消したくなるということはなさそう
プレビューエリアをhoverしたときにアイコンを表示 -> クリック -> confirm('消しますか?') -> はい -> 削除という流れでいいのでは
そうしよう
まず何からやろう
deleteNote 関数のテストを書こう
テスト書くほどじゃないような気が...
書かない!
いや、やっぱり書く!
hem6.iconえらい
tommy.icon /icons/いいぞ!.icon
思いの外決めないといけないことが多い
決めないといけないこととは
以下の各種で振る舞いが違う気がする
ノート0件のときの削除
そもそも今はアクセスした瞬間に新しいノートが作成されるので0件という状態はない
これはこれでちゃんと考えたほうがよさそうだけど今のところ問題そんなにないので放置
ノート1件のときの削除
新しいノートを作成してそれが開かれた状態
ノート2件のときの削除
残りの1件が開かれた状態
ノート3件のときの削除
リストの最後の1件が開かれた状態
とりあえずこれ↑をテストケースにするか
残りの1件というようなロジックは実際ないので1件のときと3件のときだけテストすればいいや
テストあれだな、期待する値の方をできるだけ冗長にというかそのまま表現したいけどmodel丸ごと毎回かくのもつらいし結局それ用の関数を書かないといけない。どれくらいがちょうどいいのか難しい
テスト書いたので実装へ
実装
まずはnoteListが1件のときに削除を実行した時
JSで書くなら (targetNoteId) => this.model.noteList.filter(note => note.id !== targetNoteId) みたいな感じになりそう
Elmだとどう書くんだっけか
List.filter があった気がする
これじゃん
List.filter (\note -> note.id != id) model.noteList的な
not equal なやつどう書くんだっけふい〜
\= か(たしか)
バックスラッシュじゃない!スラッシュ /= だった
実装した
テスト実行
こけた
code:bash
↓ Tests
↓ Main
↓ deleteNote
✗ 1件のとき, 指定したIDのノートを消して新しい空のノートを作成して開く
{ listVisible = False, activeNoteId = 1, noteList = id = 1, body = "" } }
╷
│ Expect.equal
╵
{ listVisible = False, activeNoteId = 1, noteList = [] }
ほひ〜〜
なんだこれ
ああふむ
意図通りの失敗結果じゃないか、テスト書いてよかた
id指定して消してmodel返すだけだと activeNoteId = 1 なのに noteList は空という不整合になってしまう
なので、if newNoteList isEmpty then emptyNoteListが入ったモデル的なものを実装しないといけない
List.isEmptyがあった気がする
あった
{ model | noteList = [emptyNote] }な形がいいかなふむ
すでに emptyModel というのを作っていたけど、ほかの状態を変える必要はないだろう
code:elm
167 if List.isEmpty newNoteList then
169 else
170 { model | noteList = newNoteList }
こんな感じ
テスト通った
3件の場合もやらねば
ふひ〜もう時間が18:48
code:elm
39 dummyModelWithThreeNotes =
40 { listVisible = False
41 , activeNoteId = 1
42 , noteList =
43 [ { id = 1, body = "This is active" }
44 , { id = 2, body = "This is not active" }
45 , { id = 3, body = "This is not active" }
46 ]
47 }
この状態のときに、idが1番のノートを削除すると activeNoteId が3になること
この状態のときに、idが2番のノートを削除すると activeNoteId が1のままであること
テスト書けた
ちゃんとこけた
code:bash
✗ 3件のとき, 現在開いてるノートを消すと最新(最後)のノートを開く
3
╷
│ Expect.equal
╵
1
TEST RUN FAILED
そろそろ帰らねば
もう少しなので実装までやってしまおう
実装
実装してテストも通った。あとは画面にアイコン出してonClickに紐付けるだけか
そういえばwindow.confirmとかどうやって使うんだろう
まあいいか、今日はここまで
やってて気付いたけどテストコードだけ日本語書いてて意識が低い
英語にせねば
deleteNote : Model -> Int -> ModelのInt、Int ではなく type alias で定義して Id 型みたいなのにしたほうがいいんだろうな
そうしよう
18:45までと言いつつ結局終了したのは19:20になってた tommy.icon /icons/乙.icon
今日やったこと
雑談はこちらへどうぞ
しかしこうやって全てメモに考えたことを吐き出していると、自分の思考が普段いかに散らばっているのかがわかる
夜の部
なんか夜も時間ができたのでやっていく
なにしてたんだっけ
ああ削除だ、削除すればいいんだ
あとは画面に出すだけなのですぐできそう
意外と見せ方が難しい
ゴミ箱アイコンだけでわかるものだろうか
まあとりあえずこれで
できた tommy.icon /icons/いいぞ!.icon
https://gyazo.com/5c9030a288a0c6209f6470cea69baf9b
別件で、開かれているノートはdisableにして、見た目的にもクリックできなそうな感じにしておきたいな
あと、ElmコードもCSSも汚れてきたのでそろそろ整理せねば
昼の部に比べて圧倒的にパワーが出てない。カフェイン切れだ。
なまじ使えるようになってきた反面、直したいところだらけで焦る