2023 ソフトウェア設計及び演習用の班Wiki

23::gr03::モジュール分け(中間発表)

モジュール分け(html, js, cssファイルの順)

top.html(担当:刈谷、中野、角掛)

  • トップページ。他のhtmlファイルのパスを使って画面切り替えを行えるようにする

setting.html(担当:角掛)

  • 背景やBGM(未定)を設定する画面。

input_choice.html(担当:角掛)

  • 音域入力の方法(音声 or 手動)を選択する画面

voice_imput.html(担当:吉田、中島)

  • 声の入力を行う画面。
  • マイクでの入力を行い、以下のものを表示する
    • 現在観測中の音
    • 読み取った最高音・最低音
    • 読み取っている音声波形
  • 観測音をもとに、音域の決定は手動で行う

manual_input.html(担当:角掛)

  • 音域を自分で選択する画面。最低音、地声最高音、裏声最高音をそれぞれ入力する
  • 入力はint型の整数戻り値も整数。

singer_search.html(担当:角掛)

  • 歌手名を入力する画面
  • 入力された文字が含まれている歌手を表示するサジェスト機能あり
  • 入力はstring型の文字列
  • data_search.jsから該当歌手の曲名が入ったリストを返す

song_search.html(担当:角掛)

  • 曲名を入力する画面。
  • 入力された文字が含まれている曲を表示するサジェスト機能あり
  • 入力はstring型の文字列。
  • data_search.jsから該当の曲名が入ったリストを返す

output.html(担当:角掛)

  • 音域検索では、その音域に当てはまる曲のリストを出力する。
  • 歌手名や曲名検索では、該当する歌手の曲のリスト又は、検索した曲をピンポイントで出力する。
  • 表形式で出力し、歌手名や音域での並び替えを行えるようにする。




data_search.js(担当:島脇、清水、正野、角掛)

  • 構造体で曲のデータを入れる。
  • 受け取った変数に応じて返す構造体の中身を決定する。
  • 検索結果に対応した曲のリスト(構造体)をoutput.jsに渡す

tuner.js(担当:吉田、中島)

  • 音声入力の結果から音域を割り出し、結果をdeta_search.jsに送る

output.js(担当:角掛)

  • 出力を制御するファイル。
  • data_search.jsで決定した構造体の中身を出力する。

pitch_match.js(担当:角掛、島脇)

  • 数字で管理している音階を文字で書いた音階に変換する

pitch_match_rev.js(担当:角掛)

  • 文字で書いた音階を数字で管理している音階に変換する

sort.js(担当:角掛)




top.css(担当:刈谷)

  • トップページのデザイン

input.css(担当:角掛)

  • 音域検索(manual_input.html)、歌手名検索(singer.html)、曲名検索(song.html)に用いるデザイン

textbox.css

  • 曲名や歌手名で検索ページの検索バーのデザイン

setting.css

  • 設定画面(setting.html)のデザイン

output.css

  • 検索結果の出力画面(output.html)のデザイン




モジュール分けの図

モジュール分け.jpg


最終更新日:2023/06/17 17:23:44