diff --git a/LICENSE.txt b/LICENSE-MIT.txt similarity index 100% rename from LICENSE.txt rename to LICENSE-MIT.txt diff --git a/index.html b/MIDIPlayer.html similarity index 98% rename from index.html rename to MIDIPlayer.html index 7aa0213..e3c0ba8 100644 --- a/index.html +++ b/MIDIPlayer.html @@ -4,26 +4,25 @@ MIDI.js - Sequencing in Javascript. - + - + - - - - - - - + + + + + + - - - + + + - - + + @@ -35,8 +34,8 @@
- - + +
0:00 @@ -127,11 +126,6 @@ MIDI.Player.setAnimation(function(data) {
  • base642binary.js:  Cleans up XML base64-requests for Web Audio API.

    • Example(s):  Tweet me your app to be included!

    -
  • - Euphony
    3D visualization of a piano with notes dropping from the sky. -
    Coded by Qiao.
    • -
    -
  • Color Piano
    Learn piano songs without reading sheet music.
    Coded by mud.
    • @@ -156,6 +150,7 @@ MIDI.Player.setAnimation(function(data) { if (typeof(console) === "undefined") var console = { log: function() { } }; // Begin loading indication. +var player; var loader = new widgets.Loader({ message: "loading: Soundfont..." }); @@ -212,7 +207,7 @@ Event.add(window, "load", function(event) { var title = document.getElementById("title"); title.innerHTML = "Sound being generated with " + MIDI.lang + "."; // this sets up the MIDI.Player and gets things going... - var player = MIDI.Player; + player = MIDI.Player; player.timeWarp = 1; // speed the song is played back player.loadFile(song[songid++%3], player.start); // control the piano keys colors @@ -221,7 +216,7 @@ Event.add(window, "load", function(event) { var pianoKey = data.note - MIDI.pianoKeyOffset; var d = colorElements[pianoKey]; if (data.message === 144) { - d.style.background = "#" + colorMap[data.note-27].hex; + d.style.background = colorMap[data.note-27].hex; d.style.color = "#fff"; } else { d.style.background = ""; @@ -245,19 +240,15 @@ var MIDIPlayerPercentage = function(player) { var capsule = document.getElementById("capsule"); var timeCursor = document.getElementById("cursor"); // - Event.drag({ - type: "absolute", - element: capsule, - callback: function (event, coords, state, self) { - var ab = abPos(capsule); - player.currentTime = (coords.x - ab.x) / 420 * player.endTime; - if (player.currentTime < 0) player.currentTime = 0; - if (player.currentTime > player.endTime) player.currentTime = player.endTime; - if (state === "down") { - player.pause(true); - } else if (state === "up") { - player.resume(); - } + Event.add(capsule, "drag", function (event, self) { + Event.cancel(event); + player.currentTime = (self.x) / 420 * player.endTime; + if (player.currentTime < 0) player.currentTime = 0; + if (player.currentTime > player.endTime) player.currentTime = player.endTime; + if (self.state === "down") { + player.pause(true); + } else if (self.state === "up") { + player.resume(); } }); // @@ -267,7 +258,7 @@ var MIDIPlayerPercentage = function(player) { if (seconds.length == 1) seconds = "0" + seconds; return minutes + ":" + seconds; }; - getNextSong = function(n) { + player.getNextSong = function(n) { var id = Math.abs((songid += n) % song.length); player.loadFile(song[id], player.start); // load MIDI }; @@ -314,7 +305,7 @@ var ColorSphereBackground = function() { var onMouseMove = function(event) { ctx.drawImage(theSphere, 0, 0); if (event) { - var coords = Event.coords(event); + var coords = Event.proxy.getCoord(event); coords.x -= document.body.scrollLeft; coords.y -= document.body.scrollTop; px = coords.x; diff --git a/README.html b/README.md similarity index 100% rename from README.html rename to README.md diff --git a/WhitneyMusicBox.html b/WhitneyMusicBox.html index f06ccad..f3cd88f 100644 --- a/WhitneyMusicBox.html +++ b/WhitneyMusicBox.html @@ -2,19 +2,19 @@ Whitney Music Box in HTML5 - + - - - - - - - + + + + + + - + +