I want to make a looper similar to this website https://learningmusic.ableton.com/
users will be able to upload their own audio files to each pad, so long as all the loops are in the same bpm it should sound concise.
I'm having a problem figuring out how to sync the audio files together.
For example, if one loop is playing and I click on another loop, there should be a delay for when the new loop starts playing, similar to this example https://tonejs.github.io/examples/daw
I think what I need tone.js might have, but I'm having a hard time implementing it in code.
Should I take the longest loop and have the length of that be the baseline for the track? And then turn the length into bars so I can have a reference of when to start the next loop played?
any resources or help would be amazing!!! thanks
Related
I need to show three timers, something like this:
'https://codepen.io/kaicarver/pen/pyaKVR' or 'https://jsfiddle.net/7bk5mw9y' of whatever as long as it shows three timers, (preferably with a start all button)
the three contesters need to stop their time, so far all possible with both scripts.
After the last one presses stop the page should show a message below the scores.
I am searching and coding for days now without luck.
I am way to beginner to achieve this. Is there anyone here who knows an existing script that does this of maybe have a simple solution?
I'm asking a question for a school project. I am trying to play a video in a loop and change its speed according to the distance from the Kinect 1414. When you are far the video plays at normal speed, which then increases as you get closer.
I tried in different ways but sometimes either the video doesn't loop or it doesn't show, I can only hear the audio. Other solutions don't let me change the speed of the video. Do you know any way to have the distance of a person affect the video?
Thanks.
Stack Overflow isn't designed for general "how do I do this" type questions like this. It's for specific "I tried X, expected Y, but got Z instead" type questions. But I'll try to help in a general sense.
You need to break your problem down into smaller pieces and then take on those pieces one at a time. For example, can you start with a very basic sketch that just displays the distance from the Kinect? Don't worry about the video yet, just display the distance on the screen.
Separately from that, can you create another sketch that just shows a video playing in a loop? Work your way up from there: can you make it so its speed is based on a hard-coded value? How about on a value like mouseX?
Get those two basic sketches working perfectly by themselves before you start thinking about combining them. Then if you get stuck on one of those steps, you can post a MCVE along with a specific question (in a new question post), and we'll go from there. Good luck.
I've got a little side project going on using SDL2/SDL_mixer and a couple other sound libraries. I've been trying for a while now to synchronize my audio and video but haven't been able to get it anywhere near successfully. All new to this stuff so forgive the poorman's logic and coding. At first I thought to set the delay to SDL_Delay(30) after every frame, and then a few other numbers in that range. Not quite right. Then I tried doing it by getting Ticks. Where I would get the difference between current_ticks and last_ticks and set a delay if the delta between ticks was <=30 and set the delay to 30-delta. Still not quite right (by far). Hoping someone on here with more experience might guide me in the right direction. In regards to the video, it's a visualizer of course, seems like a popular beginners project.
The basic way you synchronize audio and video is that you choose one to use as a timer source and present the other according to that timer. The easiest is generally audio, but because it's generally buffered ahead, you need some method of measuring what time in the audio stream is actually coming out of the speakers. Once you get that, it's just a matter of waiting until the audio reaches the right time for the next video frame and displaying it.
I'm trying to make a guitar practice website, and a critical functionality is to loop over very short mp3 files (a few seconds long), with absolutely zero gap in between. For example, it could a 4-measures-long chord progression, and I want to allow the user to loop over it seamlessly.
I tried using the HTML5 <audio> tag with the loop attribute. Google Chrome gives a small gap between the loops, but big enough to be totally unacceptable for my purpose. I haven't tested the other browsers, but I believe it won't work.
A possible workaround is to use ffmpeg to stream repetitions the same audio as an mp3. However, this costs a lot of bandwidth.
For myself I use Audacity to loop without gaps, but unfortunately Audacity doesn't have a web version.
So, do you have any ideas how I may loop over an mp3 in a browser with zero gap? I prefer non-Flash solutions, but if nothing else works I'll use Flash.
Edit:
Thank you for all your suggestions. Flash turns out to work decently. I've made a toy demo at http://vmlucid.lcm.hk/~netvope/audio/flash.html. To my surprise (I use to associate Flash with resource hog and browser crashes only), Flash and ActionScript are rather well designed and easy to use. It took me only 3 hours on my first Flash project :)
Have a look at this page. Listening for a while using Google Chrome 7, I found Method 1 works decently, while Method 3 gives the best results, though it's a bit of a hack. Ultimately, all browsers work differently, especially since HTML5 isn't finalized yet. If possible, you should opt for a Flash version, which I would think would give you the best loop.
in flash AS3 you can extract sound data with computeSpectrum() and give it to your Sound object exactly when it's needed (SampleDataEvent is fired).
I am not sure how well this will work, but if you knew your loop lasted 800 milliseconds - you could have the browser call the play method every 800ms... it still wouldn't be guaranteed to be perfect though. I don't think the browser is natively capable of delivering reliable audio looping at this point.
setInterval(function(){
document.getElementById("loop").play();
}, 800);
Rumor has it the best way to do pull this off in the most gapless fashion to use to multiple audio tags and alternate between them.
Or check out this utility: http://www.compuphase.com/mp3/mp3loops.htm I used it successfully for my flash projects when music had to be looped without gaps, and 99% of the time it worked. It takes WAV as an input.
Basically it is a kind of front-end for LAME mp3 encoder, which uses such settings as to prevent the gaps appearing. It won't work on very short sound effects (less than 0.5 second I believe).
Afterward all you have to do is use:
var sound:Sound = new MySoundEffect();
sound.play(0, 1000);
and it will loop one thousand times.
I'm attempting to use a large number of short sound samples in a game I'm creating in Silverlight 2. The samples are less than 2 seconds long.
I would prefer to load all the audio samples onto the canvas during the initualization. I have been adding the media element to the canvas and a generic list to manage it. So far, it appears to work.
When I play the sample the first time, it plays perfectly. If it has finished playing and I want to re-use the same element, it cuts off the first part of the sound. To play the sample again, I stop and play the media element.
Is there another method I should use the samples so that the audio is not clipped and good performance is obtained?
Also, it's probably a good idea to make sure that all of your audio samples are brought down to the client side initially. Depending on how you set it up, it's possible that the MediaElements are using their progressive download functionality to get the media files from the server. While there's nothing wrong with this per se (browser caching should be helping you out after the initial download), it does mean that you have to deal with the browser cache, and there are some potential issues there.
Possible steps to try:
Mark your audio files as "Content". This will get them balled up in the .xap.
Load your audio files into MemoryStreams (see Application.GetResourceStream method) and call MediaElement.SetSource().
HTH,
Erik
Some comments:
From MSDN:
Try to limit the number of MediaElement objects you have in your application at once. If you have over one hundred MediaElement objects in your application tree, regardless of whether they are playing concurrently or not, MediaFailed events may be raised. The way to work around this is to add MediaElement objects to the tree as they are needed and remove them when they are not.
You could try to seek to the start of the sample to reset the point currently being played before re-using it with:
mediaelement.Position = new TimeSpan();
See also MSDNs MediaElement.Position.
One techique you can use, although I'm not sure how well it will work in Silverlight, is create one large file with all of your samples joined together (probably with a half-second or so of silence between each). Figure out the timecode for each sample and seek the media element to that position and play. You'll only need as many media elements as simultaneous sounds you want to play.