---
tags: c_lock_row, c_yokai, c_fumei
---

# 正体不明TODO

# 1. タスク一覧

## 1.1 ファイルの分割

- [ ] 注意事項画面(スマホは横のほうが良い/色覚配慮ON・OFF)
- [x] スタート画面(とりあえずOK 2/13)
- [ ] 第1段階
- [ ] 遷移アニメーション
- [ ] 第2段階

## 1.2 「わたし」「した」の見た目
- [x] スタート画面から「(?)=わたし」を消す
- [x] 丸に書かれた「?」を「わたし」に変更
- [ ] 「わたし」「した」で点滅していた動作を「↓/わたし の文字がn回大きくなる」に変更 (見たときにわかりやすいくらい大きめが良いです)

## 1.3 第2段階に移るための配列
- [ ] 第2段階に移る配列が「かわしたわしか」だったのを、左右逆にした「かしわたしわか」に変更
- [x] それに伴いスタート画面の数字も上2つと下2つを入れ替える

## 1.4 第2段階
- [ ] 「かしわたしわか」の両端が今までと同様に消え、現れる濁点と矢印を以下に変更
　[　][　][　゛][　][　]
　 ⇈　・　・　↑　↑
- [ ] タップでマスは「赤→青→緑→黄→赤」 (配置順) に変わり、矢印は時計回りで90度ずつ回る
- [ ] わたかわし　と　⇉・・→↓　で「やたがらす」になりクリア

## 1.5 その他
- [x] 数字が一致したときに枠内が白くなる法則を削除 (2/14)
- [ ] 色覚配慮バージョンを作る
- 4つのボタンを灰と黒の縦縞、横縞、斜め縞2種にしたものを作り、「色覚配慮on/off」をタップすると切り替えられるようにする (参考: http://zerokitsunehal.org/6_23/)
- 現状、ボタンをコンポーネントライブラリを使って実装しているので、模様はそのままだと実装できない(指定できるのは色のみ)
解決策としては、
1. ボタンを独自に実装しなおす
2. ライブラリを書き換える
のいずれかだが、1はデザインが周りの部品から浮く, 2は出来るか不明
→**模様ではなく、色の変更で対応**
- 濃淡の違う灰色4色, 色覚配慮ON/OFF
- 注意事項画面入れる
- [x] ページ名を「わたしは何者？」にする
- [ ] クリア時の表記を「正体不明　クリア！」にする

# 2. 進捗メモ

## 2.1 現在進行中

**Main.vueの移行および作成**

- [ ] MvNumAndMe.vueの作成(startComponents/NumAndMeと共通化できると良い) (2/14)
- 点滅動作以外は完成 (2/15)
- [x] 共通化(おそらく余裕) (2/15, 2/19)
- [ ] 「わたし」「した」で点滅していた動作を「↓/わたし の文字がn回大きくなる」に変更 (見たときにわかりやすいくらい大きめが良いです) (2/14)
- [ ] MeCircleに点滅動作 (2/15)
- [ ] NumCardに点滅動作 (2/15)
- [ ] updateCanvasSizeの作成(quesrySelecterの型指定 HTMLElementがどうのこうの) (2/15)
- [ ] Vuetifyの型が反映されているか (2/15)

## 2.2 Done

- [x] TSの導入
- [x] 丸に書かれた「?」を「わたし」に変更
- [x] これを共通化して、 Window.vueにまとめる (2/14)

<v-row>
      <TopMargin :canvas-size="canvasSize" :window-size="windowSize" />
</v-row>

- [x] 数字が一致したときに枠内が白くなる法則を削除(NumCardを白固定) (2/14)
- [x] 第1段階の動物カウント関数をTSで書き直す (2/14, 15)

# 3. その他

## 3.1 議論・メモ

- [ ] 背景色: 白、寂しくない? 画像入れる?
- [ ] スタートボタンが浮いているので変更
- 納得いくものが見つからなかった(2/13)
- [ ] 上部の空白は、windowリサイズ時にメイン要素の高さを取得しそれに基づいて変更
- メイン要素の高さが変わっても、空白の高さは変更したくない
- canvasサイズが常にメイン要素の高さを示してはいないので注意(windowリサイズされるまで同じ) (2/13)
- [x] Start以外のシーンにおいて、矢印等canvasSizeに頼っているコンポーネントはリサイズが行われない限り、値がバグる(baseStyleに変更する) (2/13)
- コンポーネントにcanvasSizeを用いない. baseStyleに書き換えることで対応 (2/14)
- [ ] Mainにアニメーションは付けない. 第1段階条件満たした段階で入力禁止して、そのままMain2Finalでアニメーション. 入力許可後、Finalにシーン移行 (2/14)
- [ ] スマートフォンの場合、画面横でのプレイを推奨いたします。
- [ ] リロードボタン欲しいな ()

## 3.2 リーディングリスト

- [Nuxt.js + TypeScript + Composition APIで作るSPA](https://qiita.com/mmclsntr/items/15acb44ab1746f097a89)
- https://github.com/vuejs/composition-api