Comments (24)
Watch out for browser caching of the soundfront files. I've seen it hold on to them even when doing a hard refresh.
from midi.js.
@kusog I don't think its the browser caching - the website and the old demos play fine in different tabs of the same window when invoked together.
I have also tried it on 2 different machines and found that the latest demos don't play.
Thanks,
Shantanu
from midi.js.
Hi @Morpheus0Neo, I'm not entirely sure what's going on, but here's an idea. It's possible the original midi.js didn't use XHR requests, in which case that'd mean it could be run from the local filesystem. The live version currently must be run on a server (be that localhost, or a website).
from midi.js.
yup - @mudcube - that was the reason the demos were not working. When I debug it through visual studio the temporary web server serves the files and the MIDIPlayer works.
But I wonder why it has been changed to this behavior. If I understand it correctly, a application will now need an active internet connection and have to connect to the server to download the sounfonts from the hosted location so that the app is functional. Also, it wont be possible to develop a plain client side app without a server.
If this is true, does it mean that I cannot use and deploy the library with the soundfonts in a packaged app that cannot connect to the internet? If it is possible, how can I do that?
Thanks for the help @mudcube.
from midi.js.
Also, can I package more soundfonts other than the default ones?
from midi.js.
@Morpheus0Neo, good call. It's not hard to do, but noticed it's broken in latest branch, so pushed a new copy on the dev branch: https://github.com/mudcube/MIDI.js/tree/dev
As far as playing from file:// (which is what your'e asking), it's not hard, just include the soundfont into the HTML under... e.g. if you wanna include the piano and load from file:// use this:
<script src="./soundfont/acoustic_grand_piano-ogg.js"></script>
Let me know how it goes.
from midi.js.
@mudcube I dint quite get the first part of what you are saying there.
I downloaded the latest dev branch zip and it still cannot play without a web server - was that supposed to be fixed - or did I miss what it was that was broken and was then fixed?
As for including the new soundfonts - I'll try and update you.
-Shantanu
from midi.js.
No, the fix is adding the script tag. The latest dev version just makes it so that works (otherwise it would try to download twice).
from midi.js.
I still cannot get it to work without a server...using the latest dev source - am I supposed to be able to play the demos without a server or not?
from midi.js.
I updated the MIDIPlayer demo to include the script by default. Tested on my computer using the filesystem (running from a folder on my desktop without localhost), works fine.
from midi.js.
Yup - the demo player does work now. Will pull when merged in master.
Thanks @mudcube ! :)
-Shantanu
from midi.js.
It took me a while to figure it out, but the latest demo has an issue with IE because you preload the grand piano sounds directly on the page rather than let loader work:
<script src="./soundfont/acoustic_grand_piano-ogg.js"></script>
When on a browser that doesn't have support for ogg, it wont play any sound due to line 148 in plugin.js:
if (MIDI.Soundfont[instrumentId]) {
self.next();
}
Because the grand piano was loaded as ogg, it didn't try to download the mp3. Once I remove the script tag from the demo, the demo plays great in IE11. No clipping sounds.
from midi.js.
@kusog Ahh, good point. I've updated the method in dev so it uses the same detection script as the non-XHR version. There's now a flag called MIDI.USE_XHR that can be set to false if the programmer wants to not use xhr. By doing this, you can load from file://, but you cannot get the progress of the download (which shouldn't matter if you're using on file:// as it should be instant).
from midi.js.
If you are going to support hard coding the JS for a soundfont onto the page so it isn't loaded, I guess it might be good to allow both ogg and mp3 to be loaded at the same time. Why not use the type as part of the key into the map loading the sounds?
from midi.js.
@kusog I think it's best to not enable hard coding, as then the client needs to download resources they're not necessarily going to use. I know the example did that, but not recommended. I altered the lib to make file:// work with the plugin.js where it detects the proper format to include, and only downloads that file.
from midi.js.
@mudcube Further to the previous posting (Feb 18th), any chance of posting some sample code for how to load the soundfont file as a local file (rather than the XMLHttpRequest with the file:// ) and then use the 'MIDI' object properly ? I'm keen on writing midi code which works in the browser without a server, and presently I have the "Cross origin requests" problem which is stopping me.
Inlining the soundfont (using <script src="./soundfont/acoustic_grand_piano-ogg.js"></script>) seems a good idea, but do I then have to call something else other than MIDI.loadPlugin to run my midi actions ?
eg. if I just directly run the lines in demo-Basic.html (below), rather than in the MIDI.loadPlugin callback, then I get an obvious error that the MIDI object doesn't have 'setVolume'..
var delay = 0; // play one note every quarter second
var note = 50; // the MIDI note
var velocity = 127; // how hard the note hits
// play the note
MIDI.setVolume(0, 127);
MIDI.noteOn(0, note, velocity, delay);
MIDI.noteOff(0, note, delay + 0.75);
You mentioned above that "the latest dev version makes it work", is that still right ? .. is the fix now in the master branch ?
Any help much appreciated.. thanks!
from midi.js.
.. further to my previous post, I've managed to get the the example scripts playing (eg. basic.html) on but only using the DEV branch on github.
Then I just needed to add the soundfont inline at the top of the file, presumably to stop it trying to issue an XHR request to go fetch it..
<script src="./soundfont/acoustic_grand_piano-ogg.js"></script>The only thing is I have it running on Mac OS Chrome (36.0), but it doesn't work on Mac OS Safari (7.0.5).. ie. no sound, but nothing in the JS error console either ?
Can you answer if it is supposed to run on desktop Safari, and further mobile safari on iOS ?
thanks again..
from midi.js.
.. further to previous post again.. i now have sound on desktop & mobile safari (iOS 8 beta 5 sdk).
Since I'd inlined the soundfont using (<script src="./soundfont/acoustic_grand_piano-ogg.js"></script>), I was only using the 'ogg' format, which Safari doesn't support. Loading in the mp3 file instead for Safari & it all just works.
can't wait to get going with midi.js now ! ..
from midi.js.
Hi @mudcube, can you please provide the changes that lets the Dev branch work locally and how we should set up MIDI.js for our local projects? Also, can this run with the current master setup on a Github page?
Thanks.
P.S. Kickass work with the whole library.
from midi.js.
I am so thrilled to find these midi libraries! Wow! Like the folks who have posted already, I would like to be able to use MIDI.js in a browser where the files are local and don't have to run from a server. I have tried to follow the earlier posts, but can't figure this out. I downloaded the current Dev branch files. I tried adding the code you mention in your Feb 18 post:
<script src="./soundfont/acoustic_grand_piano-ogg.js"></script>to the demo-MIDIPlayer.html file, in the section where the other scripts are located. I tried to open the file locally. This is on a Mac (Yosemite), tried both safari and google chrome. The color wheel spins and spins. I'm pretty much a javascript novice -- so, if you could help with specific details about any additional changes that need to be made -- would be so grateful! Thanks!
from midi.js.
I would up completely rewriting this project to fit my needs (http://kusogmusic.com/compact). I dropped everything but web audio api support because if its going to “sound like a drunken sailor” in IE then it may as well not work at all. I did take chunks of code from MIDI.js to get things done, but in the end I needed it to work a certain way and it was easier to pare it down to what I really needed. IE12 is going to support web audio api, so until then no IE support.
I’ve even written my own soundfont file generator in C# so that I can take sound files created by my genius music friends which are not used on the kusogmusic.com demo site.
From: Dave Corboy [mailto:[email protected]]
Sent: Sunday, November 2, 2014 12:24 AM
To: mudcube/MIDI.js
Cc: kusog
Subject: Re: [MIDI.js] The demo files are not playing from the zip download (#63)
This looks really awesome and I'd like to use MIDI.js for an upcoming project. At the moment, I'm getting the cross-origin XHR request locally and would like to use USE_XHR (=false) as well.
How does one get access to the dev branch of MIDI.js? Alternately, when do the developers plan on refreshing Master?
—
Reply to this email directly or view it on GitHub #63 (comment) .Image removed by sender.
from midi.js.
I dont know why this is closed. Your most basic example does not work STILL. The Ajax xhr request dies when this is downloaded as a zip. Why does this library need xhr and why doesn't this work?
from midi.js.
I want to play happy birthday using basic.html but I am unable to play one note at a time as they all play at once. I Placed 2 sets of code lines and it plays like a chord instead of 1 note then the next note. How can I play notes to play a song?
<script type="text/javascript"> window.onload = function () {MIDI.loadPlugin({soundfontUrl: "./soundfont/", instrument: "acoustic_grand_piano", onprogress: function(state, progress) { console.log(state, progress);}, onsuccess: function() { var delay = 0; // play one note every quarter second var note = 50; // the MIDI note var velocity = 127; // how hard the note hits // play the note MIDI.setVolume(0, 127); MIDI.noteOn(0, note, velocity, delay); MIDI.noteOff(0, note, delay + 0.75); note= 60; MIDI.noteOn(0, note, velocity, delay); MIDI.noteOff(0, note, delay + 0.75); });}; </script>from midi.js.
@john02813 For last two notes you have same delay [ i.e. delay + 0.75 ] , so both notes are playing at same time, change delay parameter for all notes, then they will be played at different interval. For example : delay , delay + 0.75, delay + 1 & so on
from midi.js.
Related Issues (20)
- very long notes are truncated HOT 2
- pitch bending in webaudio HOT 2
- How can i send a note to specific stereo channel? HOT 1
- tracks
- Audio Mobile App : MIDI.js or Native ? HOT 2
- k
- Is it impossible to pause when using noteon noteoff instead of player HOT 3
- How to disable sound in Player.js?
- There is no sound when I am playing my own midi file HOT 2
- Question, Piano Layout HOT 1
- Midi files with multi channels doesn't work using MIDI.Player.Loadfile HOT 3
- How to play file.mid HOT 4
- can i use midi.js to create a online piano and guitar? HOT 1
- Color piano not found in chrome web store HOT 2
- Playing midi file with the wrong tempo HOT 1
- ReferenceError: Base64Binary is not defined HOT 1
- Current Position / Event Listener
- Loading all GM instruments for midi file HOT 25
- Slow start of playing HOT 3
- Bug: MIDI events not being fired HOT 5
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from midi.js.