((outline))

!!! ページリンク
>>{24::gr10}{班ページトップへ}<br><br>
<br><br>


!!!モジュール分け

!!htmlファイル（cssも付随）

:__search.html__
* プルダウンを使って音域を入力できるようにする。
* 曲名や歌手名を入力できるようにする。
** 検索時にサジェスト機能があると良い
*data_search.jsから該当歌手の曲名が入ったリストを返す
<br><br>

:__list_output.html__
*「音域検索」では、その音域に当てはまる曲のリストを出力する。
*「歌手名検索」や「曲名検索」では、該当する歌手の曲のリスト又は、検索した曲をピンポイントで出力する。
*表形式で出力し、歌手名や音域での並び替えや、歌手名でのフィルタリングを行えるようにする。
*キー変更したときに自分の音域に当てはまる曲もわかるようにする
<br><br>

:__song_output.html__
* 楽曲の「曲名」、「歌手名」、「音域」、「MV」、「歌詞」など、楽曲にまつわる情報を出力する。
<br><br>

:__input.html__
*トップページ。楽曲を曲名や歌手名、音域から検索する。
*お試しで音を聞くことができるキーボードと、マイクから音を拾って、最高音、最低音を出力してくれる簡易音域チェッカーを使って、検索に役立てられるようにする。
*右上のアイコンから、ログイン画面に遷移する。
<br><br>

!!javascriptファイル

:__data_search.js__
*構造体で曲のデータをデータベ保存するデータベース。
*検索結果に対応した曲のリスト（構造体）をoutput.jsに渡す
<br><br>


:__output.js__
*出力方法を制御するファイル。
**数字で管理しているが、表示形式に変換しなければならないもの
**表形式での表示のさせ方
<br><br>


:__sort.js__
*結果表示画面における音階での並び替えを制御するファイル。
<br><br>


:__singer_filter.js__
*結果表示画面において出力する歌手名などに条件で絞り込みをする
<br><br>

:__login.js__
* アカウント作成やログイン時に参照するデータ。
<br><br>

:__input.js__
* input.htmlに関するscriptが入っている。
*入力した曲名をsong_output.htmlに、歌手名をartist_song.htmlに、音域をsearch.htmlに渡すための関数が入っている。
*キーボード部分で鳴らす音の制御、周波数解析部分の制御を行っている。
*
検索部分
search()...音階での検索
search_so()...曲名での検索
search...si()...歌手名での検索

キーボード部分
make_sound()...設定した周波数から正弦波で音を作成
play_sound()...make_soundで作成した音の再生

周波数解析部分
addEventListner()...周波数解析の制御
function draw()...波形の描画
frequencyToPitch()...周波数→音階の変換を行う