liushengqiang
/
music-score


			
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104
							<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">

<head>
    <meta http-equiv="content-type" content="text/html; charset=utf-8" />
    <title>MIDI.js - Sequencing in Javascript.</title>
    <!-- midi.js css -->
    <!-- shim -->
    <script src="./inc/shim/Base64.js" type="text/javascript"></script>
    <script src="./inc/shim/Base64binary.js" type="text/javascript"></script>
    <script src="./inc/shim/WebAudioAPI.js" type="text/javascript"></script>
    <script src="./inc/shim/WebMIDIAPI.js" type="text/javascript"></script>
    <!-- jasmid package -->
    <script src="./inc/jasmid/stream.js"></script>
    <script src="./inc/jasmid/midifile.js"></script>
    <script src="./inc/jasmid/replayer.js"></script>
    <!-- midi.js package -->
    <script src="./js/midi/audioDetect.js" type="text/javascript"></script>
    <script src="./js/midi/gm.js" type="text/javascript"></script>
    <script src="./js/midi/loader.js" type="text/javascript"></script>
    <script src="./js/midi/plugin.audiotag.js" type="text/javascript"></script>
    <script src="./js/midi/plugin.webaudio.js" type="text/javascript"></script>
    <script src="./js/midi/plugin.webmidi.js" type="text/javascript"></script>
    <script src="./js/midi/player.js" type="text/javascript"></script>
    <script src="./js/midi/synesthesia.js" type="text/javascript"></script>
    <!-- utils -->
    <script src="./js/util/dom_request_xhr.js" type="text/javascript"></script>
    <script src="./js/util/dom_request_script.js" type="text/javascript"></script>
</head>

<body>
    <button id="playBtn">播放</button>
    <button id="pauseBtn">暂停</button>
    <button id="stopBtn">跳跃</button>
    <input type="range" id="skipBtn" value="100" min="45" max="200" />
    <script type="text/javascript">
        var midiData = {
            src: '',
            timeWarp: 1,
        }
        var currentTime = 0
        var MIDI = window.MIDI
        MIDI.loadPlugin({
            soundfontUrl: "./soundfont/",
            // instrument: ["acoustic_grand_piano", "synth_drum"],
            onsuccess: function () {
                console.log(MIDI)
                window.handleRendered && window.handleRendered()
                // MIDI.setInstrument(0, MIDI.GM.byName['synth_drum'].number)
                // MIDI.setInstrument(1, MIDI.GM.byName['acoustic_grand_piano'].number)
            }
        });

        // 播放音符
        function playNote(note, delay) {
            MIDI.noteOn(0, note, 100, 0);
            MIDI.noteOff(0, note, delay);
        }


        // MIDI.Player.currentTime = 100000
        // MIDI.Player.timeWarp = 0.6289308176100629
        // setInterval(() => {
        //     // console.log(MIDI.Player.currentTime / 1000, MIDI.Player.restart)
        // }, 100)

        var playBtn = document.getElementById('playBtn')
        // var pauseBtn = document.getElementById('pauseBtn')
        // var stopBtn = document.getElementById('stopBtn')
        // var skipBtn = document.getElementById('skipBtn')
        playBtn.addEventListener('click', () => {
            MIDI.noteOn(0, 50, 50, 0);
            MIDI.noteOff(0, 50, 1);
            MIDI.noteOn(0, 50, 100, 1);
            MIDI.noteOff(0, 50, 2);
            console.log(MIDI)
        })
        // pauseBtn.onclick = function () {
        //     MIDI.Player.pause();
        // }
        // stopBtn.onclick = function () {
        //     MIDI.Player.currentTime = 100000
        //     MIDI.Player.resume();
        //     console.log(MIDI)
        // }
        // skipBtn.onchange = function (e) {
        //     var timeWarp = Number(e.target.value) / 100
        //     // MIDI.Player.stop()
        //     // const oldCurrent = MIDI.Player.currentTime
        //     // const ab = MIDI.Player.replayer.getData()
        //     // console.log(ab)
        //     MIDI.Player.loadMidiFile(() => {
        //         MIDI.Player.timeWarp = 1 / timeWarp
        //         console.log('播放倍数', 1 / timeWarp, Number(e.target.value))
        //         MIDI.Player.resume();
        //     })


        // }
    </script>
</body>

</html>