【在线应用开发】进阶版：Brainwave Music2.0

进阶版：脑波音乐2.0
进阶版取名为脑波音乐（Brainwave Music），在基础版功能的基础上，进阶版可以通过点击两侧的脑波图片播放相应的脑波音乐，实现音频播放的操控功能。α波8-13Hz，放松波，身心平静；β波14-30Hz，压力波，紧张；θ波4-17Hz，嗜睡波，放松更深；δ波0.5-3.5Hz，睡眠波。每个波形对应一段波幅范围下的脑波音乐，不同的脑波音乐有不同的功能，点击对应图片即可播放。

基础代码与1.0一致，js代码有所区别，使用sublime代码编辑器

"use strict";
function audioContextCheck() {
    if (typeof AudioContext !== "undefined") {
        return new AudioContext();
    }
    else if (typeof webkitAudioContext !== "undefined") {
        return new webkitAudioContext();
    }
    else if (typeof mozAudioContext !== "undefined") {
        return new mozAudioContext();
    }
    else {
        throw new Error('AudioContext not supported')
    }
}
var audioContext = audioContextCheck();
window.onload = function () {
    var onOff = document.getElementById("on-off");
    /*_________________________________________BEGIN set initial
    osc state to false*/
    var osc = false;
    var span = document.getElementsByTagName("span")[0];
    var freqSliderVal = document.getElementsByTagName("input")[1].value;
    var spanslide = document.getElementsByTagName("p")[0];
    var selectedWaveform = "sine";
    var defaultfrequency = 440;
    var slidemulti = 10;
    var scalemulti = 10
    var waveformTypes = document.getElementsByTagName('li');

    var defultWaveformElement = document.getElementById(selectedWaveform);
    defultWaveformElement.classList.add("selected-waveform");

    function select() {
        if (this.classList[0] == 'keyboard') return
        var selectedWaveformElement = document.getElementById(this.id);
        selectedWaveform = document.getElementById(this.id).id;

        for (var i = 0; i < waveformTypes.length; i += 1) {
            waveformTypes[i].classList.remove("selected-waveform");
        }
        selectedWaveformElement.classList.add("selected-waveform");

        console.log(selectedWaveform);
    }

    for (var i = 0; i < waveformTypes.length; i++) {
        waveformTypes[i].addEventListener('click', select);
    }
    var scalebuttons = document.getElementsByClassName('keyboard');
    function refreshfrequency() {
        console.log(defaultfrequency, '88888888');
        spanslide.innerHTML = "Use slider or buttons to modify frequency: " + defaultfrequency + "Hz";
        document.getElementsByTagName("input")[1].value = defaultfrequency / scalemulti;
    }
    for (var i = 0; i < scalebuttons.length; i++) {
        scalebuttons[i].addEventListener('click', setfrequency);
    }
    function setfrequency() {
        defaultfrequency = document.getElementById(this.id).id;
        document.getElementsByTagName("input")[1].value = defaultfrequency;
        console.log(defaultfrequency, '11');
        refreshfrequency();
    }

    setInterval(function () {
        if (!osc) {
            console.log("Oscillator is stopped. Waiting for oscillator to start");
        } else {
            freqSliderVal = document.getElementsByTagName("input")[1].value;
            osc.frequency.value = freqSliderVal * slidemulti;
            console.log("Oscillator is playing. Frequency value is " + freqSliderVal);
            spanslide.innerHTML = "Use slider to modify frequency: " + osc.frequency.value + "Hz";
            osc.type = selectedWaveform;
        }
    }, 50);


    /*_________________________________________END set initial
    
    osc state to false*/
    onOff.addEventListener("click", function () {

        /*_____________________________________BEGIN Conditional
        statement to check if osc is TRUE or FALSE*/
        if (!osc) { /*_________________________Is osc false? If so then
           create and assign oscillator to osc and play it.*/
            osc = audioContext.createOscillator();
            osc.type = "sawtooth";
            osc.frequency.value = defaultfrequency;
            osc.connect(audioContext.destination);
            osc.start(audioContext.currentTime);
            onOff.value = "stop";
            span.innerHTML = "Click to stop oscillator";
            spanslide.innerHTML = "Use slider to modify frequency: " + defaultfrequency + "Hz";
            document.getElementsByTagName("input")[1].value = defaultfrequency / slidemulti;
            /*_________________________________Otherwise stop it and
            reset osc to false for next time.*/
        } else {
            osc.stop(audioContext.currentTime);
            osc = false;
            onOff.value = "start";
            span.innerHTML = "Click to start oscillator";
        }
        /*_____________________________________END Conditional
        statement to check if osc is TRUE or FALSE*/
    });
    };