カレンダー>>
<<<担当>>>
上見 礼奈
<<<動き>>>
:表示
::・カレンダー自体の表示→年・月・日付 '''〆'''
・個々の日付の金額の表示→日付の欄の中に '''△'''
・月の収支、目標、目標達成率の表示→位置等用調整 '''〆(?)'''
・褒めるマンの表示、台詞の内容
:動作
::・ボタンクリックで画面移動→日付&詳細画面、戻る&タイトル '''〆'''
・月を1つずつ移動 '''〆'''
・月を飛ばして移動 '''〆(?)''' ==formを利用して作成したい 下記も同じく==
・年を飛ばして移動 '''〆(?)''' 一応完成した 日付も選択しなければならない点についてはマウスホバーなどを利用して説明すべき?
・褒めるマンにマウスホバーで台詞を表示
:データのやり取り
::・詳細画面→年・月・日付を__'''送る'''__
データ管理のために年・月もいると判明 追加で抽出
・詳細画面→総計金額を__'''受け取る'''__
テキストデータに書き込むことでデータの受け渡しを簡単にすることが出来ないか?
===次回(6/10)テストする===
最終的にlocalStrogeを単体で利用することで確定
>>{22::gr02::data}{data.js}に詳細
・目標画面→記録のための年・月を__'''送る'''__
目標を__'''受け取る'''__
<<<モジュール>>>
・calendar.js→必須 カレンダー表示用
・calendar.html→==ページ遷移のため統合??? '''要検討'''==
ページ遷移実装により必要
・calendar.css→==着せ替え機能のため統合予定==
着せ替え機能の主な点が色変えなので別々にすることができる???
・homeru.js→褒めるマン全般の機能のために実装
<<<関数>>>
:calendar.js
::
・prev() 月を前に変更
・next() 月を後に変更
・on_off() 日付選択部分の表示非表示用
・document.getElementById("date_on_off").onchange 日付データが選択された際のデータ取得
・year_month_change(year, month) 引数year,monthの通りにカレンダーの表示を変更
・month_change(month) 月を、引数monthの値に変更
・showProcess(date) 引数data内の年、月、日付を利用し、カレンダーを表示
・createProcess(year, month) 引数year、monthから計算によりカレンダーを作成
・click_get_day(collum) 引数collumは表のクリックした箇所を示す 年・月・日と金額を取り出し localStrogeに保存し詳細画面へ
・allclean() データ削除用
・make_day_key(day) 年月日を示すdayからデータ管理用の文字列keyを作成 returnはkey
・calendar_read(day) 年月日を示すdayを利用してその日の合計金額だけを得る returnのallmoneyは合計金額
・back() タイトル画面に戻る
・make_target_key() 目標管理用のkeyの取得
・target_parsent_c() 目標の達成率計算
・target_get() 目標の値自体の取得
:homeru.js
::
<<<画像>>>
<<{10calender.png}
・カレンダー自体の設計としてはほぼ最終系
・データのやり取りはlocalStrogeで確定
・アイコン等を表示したり、画面サイズによってカレンダーサイズが可変に
・見やすさ・配置等についてはまだ検討の余地あり
<<<参考サイト>>>
・カレンダー作成
https://nyanblog2222.com/programming/javascript/2749/
・日付データ関連
https://techacademy.jp/magazine/5587
>>{22::gr02::モジュール}{戻る}