【abcjsアプリ】スケール(音階)を表示するプログラム

<form method="post" action="#" id="register">
        <select id="postKey">
            <option value=0>C</option>
            <option value=2>D</option>
            <option value=4>E</option>
            <option value=5>F</option>
          　・・・以下略・・・
　　　　<option value=11>B</option>

            <!-- #系 -->
            <option value=1>C#</option>
            <option value=3>D#</option>
          　・・・以下略・・・
　　　　<option value=10>A#</option>

            <!-- ♭系 -->
            <option value=12>D♭</option>
            <option value=14>E♭</option>
          　・・・以下略・・・
　　　　<option value=21>B♭</option>
        </select>
        <select id="postScale">
            <option value="0">イオニアン</option>
            <option value="1">ドリアン</option>
            <option value="2">フリジアン</option>
            ・・・以下略

        </select>
        <button>表示</button></p>
    </form>

const notes = [
    ['C,','C,'],['^C,','_D,'],['D,','D,'],['^D,','_E,'],['E,','E,'],['F,','F,'],
    ['^F,','_G,'],['G,','G,'],['^G,','_A,'],['A,','A,'],['^A,','_B,'],['B,','B,'],
    /* 12番目からが一般的な音域のドレミファソラシド */
    ['C','C'],['^C','_D'],['D','D'],['^D','_E'],['E','E'],['F','F'],
    ['^F','_G'],['G','G'],['^G','_A'],['A','A'],['^A','_B'],['B','B'],
    ['c','c'], ・・・以下略

];

//POST で発火
$('#register').on('submit', function() {
    //HTML の Form から Key と Scale を取得
    const postKey = Number($('#postKey').val());　// value の値を取得, Number でゼロサプレス

    if (postKey >= 12) {          // 12以上が♭系
        var key = postKey +1;   //♭系の場合、#postKey から 1を足して＃系の同音程に合わせる
    } else {
        var key = postKey +12;  // 基音になる Cは、配列 notes の12番目のため、♮#系は12を足す
    }

    let postScale = $('#postScale').val(); 

    /* Ionian 以外のスケールを Ionian とした場合のキーに変更する
        例えば選択したスケールが Dドリアンの場合、Cイオニアンの２番目からなので、
        var key から２を引いて(Dは key=2)キーCにする(Cは key=0) */
    if (postScale == 1) {           // Dorian
        key = key -2;
    } else if (postScale == 2) { // Phrygian
        key = key -4;
    } else if (postScale == 3) { // Lydian
        key = key -5;
    } else if (postScale == 4) { // Mixolydian
        key = key -7;
    } else if (postScale == 5) { // Aeolian
        key = key -9;
    } else if (postScale == 6) { // Locrian
        key = key -11;
    }

    // #♭ 表示切替
    const sign = key;
    if (postKey >= 12){
        if (sign == 8   || // Key = A♭
            sign == 13     // Key = D♭
    　　　・・・以下略
        ) {
            var b = 1;
        } else {
            var b = 0;
        }
    } else {
        if (sign == 17  || // Key = F
            sign == 5   || // Key = F
            sign == 8   || // Key = A♭
            sign == 10     // Key = B♭
    　　　・・・以下略
        ) {
            var b = 1;
        } else {
            var b = 0;
        }
    }
    
    /* スケールを構築
       [b]で二次元配列の #♭ を選択する */
    const ionian = [
        notes[key][b], notes[key +2][b], notes[key +4][b], notes[key +5][b], 
        notes[key +7][b], notes[key +9][b], notes[key +11][b],notes[key +12][b],
        notes[key +14][b], notes[key +16][b], notes[key +17][b], notes[key +19][b],
        notes[key +21][b], notes[key +23][b]
    ];

    // 選択した基音から８音取り出す
    var scale = ionian.slice(postScale, postScale +8);

    let setScale = scale[0] + scale[ 1] + scale[ 2] + scale[ 3] + " " + scale[ 4] + scale[5] + scale[6] + scale[7];
    let renderScale = "\nT:" + key + " Ionian\n" + setScale + "|\n";

    ABCJS.renderAbc("score", renderScale);
    return false; // 画面遷移を防ぐ
});