jshanley / blip Goto Github PK
View Code? Open in Web Editor NEWSweet, sugary goodness for looping and sampling with the Web Audio API
Home Page: http://jshanley.github.io/blip
License: ISC License
Sweet, sugary goodness for looping and sampling with the Web Audio API
Home Page: http://jshanley.github.io/blip
License: ISC License
Blip doesn't work on mobile because it loads all the samples on page start. On mobile, the sample loading needs to be kicked off with an event like a button press.
A loop shouldn't be restricted to using tempos based on ticks-per-minute. It should be possible to set the interval between ticks to a specific amount of time.
I'm thinking loop.tickInterval()
. It should be a setter/getter function just like loop.tempo()
and they should work in tandem, such that either can be set, and then the related value can be pulled down from the other..
Example:
var loop = blip.loop();
// set the tempo
loop.tempo(120);
// get the tick interval
loop.tickInterval(); // should return 0.5 (seconds per tick)
// now set the tick interval
loop.tickInterval(1.0);
// get the tempo
loop.tempo(); // should return 60 (ticks per minute)
This should be done while implementing #4
It would be convenient to be able to stop a clip before it's finished
The time interval between ticks should be made available within the tick callback so that events may be scheduled using offsets relative to the current tempo.
Since the this
context of the tick callback is the loop object, this should just involve adding the tick interval to the loop api.
Is it possible to play sound effects without iOS pausing the music playing in other apps?
Unfortunately, Safari 8 still requires the "webkit" prefix when creating an AudioContext. I was trying to avoid allowing the prefixed version, since the Web Audio API has gone through a number of changes recently, and some older versions of browsers that support webkitAudioContext
are not up to spec, which could cause some features to work and others to break unpredictably.
Safari 8 should be supported however, so perhaps it should check that key methods within the API are supported before creating the audio context, and give meaningful feedback to the user otherwise.
Would you be into a PR that enabled setting a start and end point on a loop? It looks pretty straightforward to add those as params that would be passed in just like 'rate'.
You should be able to precisely schedule when to perform a tempo change.
To accomplish this, there should be a second argument for the loop.tempo
setter which specifies the time at which to schedule the change:
blip.loop()
.tempo(120)
.data([120,120,160,160,160])
.tick(function(t,d) {
clip.play(t);
this.tempo(d, t);
}
Add a feature so that samples can be played at different notes of musical scale. So as to play notes and chords from a sample. I am looking forward to create a melodic sequencer app with this.
Currently, there is no info relating to how to contribute to the project.
At the very least, there needs to be a CONTRIBUTING.md file in the root of the repo.
Better still, I'd like to have some developer-centric documentation on the website. There is already extensive documentation on how to use Blip, but there is no documentation on how it actually works.
var bassDrum = blip.clip()
.sample('bassDrum');
// play the clip immediately
bassDrum.play();
// play the clip again in 5 seconds
bassDrum.play(5);
There should be a way to run code on each full iteration of a loop.
It would be awesome to be able to hook into SoundCloud and other online sound sources to pull down audio to use in blip.
There should be a convenient way to create and loop synthesized sounds in blip.
Perhaps there should be an object analogous to blip.clip
which, instead of wrapping a sound sample, wraps an OscillatorNode (or multiple oscillators) and pairs it with a GainNode that can be set as an ADSR envelope.
Right now, loops aren't that useful, because the ticks are all the same duration. That's fine for making a step-sequencer, but it's not very good for anything else.
You should be able to pass an array of durations to loop over, in the same way that the data array is handled.
blip.loop()
.tempo(120)
.duration([2, 1, 1])
Here, the values are relative to the length of a tick. Basically, a tick is a quarter note, so the loop above would play a half-note followed by two quarter-notes each time through the loop.
Also, this should not be constrained to being the same length as the data array. For instance, this should be possible:
blip.loop()
.tempo(120)
.data([60,67])
.duration([2, 1, 1])
There should be a node method to insert another node into its input or output chain, and then rewire all previously existing connections.
An obvious use case would be to re-route all inputs to the DestinationNode to go through an AnalyserNode first.
Currently this can be done like this:
var analyser = blip.node('analyser');
var connections = [];
blip.destination.inputs.each(function(node) {
connections.push(node);
});
connections.forEach(function(node) {
node.disconnect(blip.destination);
node.connect(analyser);
});
analyser.connect(blip.destination);
There should be a shortcut method like this:
var analyser = blip.node('analyser');
blip.destination.inputs.thru(analyser);
You should be able to set a default rate and gain for a clip, so that this value will be used if a value is not passed in at the time the clip is played.
Something like this:
var clip = blip.clip()
.sample('mySample')
.rate(0.4)
.gain(0.5);
clip.play(blip.time.now()); // should play the clip with rate 0.4 and gain 0.5
clip.play(blip.time.now() + 1, { rate: 0.6 }); // the rate should be 0.6 and the gain 0.5
A declarative, efficient, and flexible JavaScript library for building user interfaces.
๐ Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. ๐๐๐
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google โค๏ธ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.