i have html5 audio player like play, pause, stop buttons.
function onUpdate()
{
var isPlaying = (!getAudioElement().paused);
document.getElementById("playerplay").style.display = (isPlaying)?"none":"block";
document.getElementById("playerpause").style.display = (isPlaying)?"block":"none";
};
function getAudioElement()
{
return document.getElementById("id_audio_element");
}
function play() {
getAudioElement().play();
onUpdate();
}
function pause() {
getAudioElement().pause();
onUpdate();
}
function stop() {
getAudioElement().pause();
getAudioElement().currentTime=0;
onUpdate();
getAudioElement().load();
}
And audio tag:
<audio id="id_audio_element" onended="onUpdate();load();"><source src="105.ogg" type="audio/ogg"></audio>
it works all on browsers perfectly, exept iPhone and iPad's Safari and Chrome. When I call load() , audio starts playing, although I don't call play().
Anybody has a solution? Thanks!
If the source is not changing, there is no need to call load(). If it is changing, try calling pause() after it loads.
Related
I am trying to build a midi player using web audio API. I used tonejs to parse midi file into JSON. I am using mp3 files to play notes. Following are the relevant parts of the code:
//create audio samples
static async setupSample(audioContext, filepath) {
const response = await fetch(filepath);
const arrayBuffer = await response.arrayBuffer();
const audioBuffer = await audioContext.decodeAudioData(arrayBuffer);
return audioBuffer;
}
//play a single sample
static playSample(audioContext, audioBuffer, time) {
const sampleSource = new AudioBufferSourceNode(audioContext, {
buffer: audioBuffer,
playbackRate: 1,
});
sampleSource.connect(audioContext.destination);
sampleSource.start(time);
return sampleSource;
}
Scheduling samples:
async start() {
this.startTime = this.audioCtx.currentTime;
this.play();
}
play() {
let nextNote = this.notes[this.noteIndex];
//schedule samples
while ((nextNote.time + this.startTime) - this.audioCtx.currentTime <= 0.250) {
let s = Audio.playSample(this.audioCtx, this.samples[nextNote.midi], this.startTime + nextNote.time);
s.stop(this.startTime + nextNote.time + nextNote.duration);
this.noteIndex++;
if (this.noteIndex == this.notes.length) {
break;
}
nextNote = this.notes[this.noteIndex];
}
if (this.noteIndex == this.notes.length) {
return;
}
requestAnimationFrame(() => {
this.play();
});
}
I am testing code with a midi file which contains C major scale. I have tested the midi file using timidity and it is fine.
The code does play the midi file correctly execpet a small problem: I hear some clicking sounds during playback. The clicking increases with increasing tempo but does not completely go away even with tempo as small as 50bpm. Any ideas what could be going wrong?
Full code can be viewed at : https://test.meedee.in/
Nothing is "wrong". You are observing a phenomenon intrinsic to the physics of audio.
Chopping audio samples arbitrarily like this creates clicks at the transitions. Any instantaneous change in level is heard as a click. To get rid of the clicks, apply an envelope to the sample, blend adjacent notes, or apply a low-pass filter.
I am trying to play a beep sound with vibration before starting video recording. However, there is a delay for _cameraController.startVideoRecording()
to start video recording and this delay is not constant. Each time I try recording the delay is different.
How can I do this in a way that recording starts instantly after the beep sound finishes.
my code:
Future _handleRecording() async {
try {
await _audioCache.play(_soundPath);
Vibration.vibrate(duration: 350);
await _cameraController.startVideoRecording();
} catch (e) {
throw (e);
}
}
I am using camera: ^0.8.1+7 dependency the CameraController class.
The problem here is you are calling the startVideoRecording after initiating the play function
You have two options since your audio duration is fixed :
First one is to surround you startVideoRecording with delay like that:
Future.delay(Duration(seconds:"You audio time"),(){
await _cameraController.startVideoRecording();
} catch (e) {
throw (e);
}
});
and the second one is to check when play finish then call startVideoRecording
I'm coding a small game with the Flutter Framework.
I'm using audioplayers for the Sounds.
It works fine like this, when calling it for example 2 times a second.
But whenn I call it more than 5 times and again in the next second at some point the sound has like a delay and then after a second or so all the sounds play at once :) That sounds weired.
I also tested the audioplayers example from github on my iphone. Repeating the sounds in low frequency is ok, but when I repeat clicking the button as fast as possible at some point it gets some delay and the same thing is happening.
Is there some way to stop the previous Sound before and then playing the next one or isnt this possible?
Or is there some other Idea how to deal with the sounds?
This is how I use it:
AudioCache upgradeSound = new AudioCache();
void playUpgradeSound() {
_playUpgradeSound(upgradeSound);
}
void _playUpgradeSound(AudioCache ac) async{
await ac.play('audio/upgr.mp3');
}
Thank you very much in advance
I solve similar problem by having singleton class, and after first play I can get the state, and I can stop previous play.
class Audio {
static final playerCache = AudioCache();
static AudioPlayer audioPlayer;
static void play(String audioName) async {
audioPlayer = await playerCache.play('$audioName.mp3');
}
static void stop() {
audioPlayer.stop();
}
}
...
child: IconButton(
onPressed: () {
try {
if (Audio.audioPlayer.state ==
AudioPlayerState.PLAYING) {
Audio.stop();
} else {
Audio.play('bid');
}
} catch (e) {
Audio.play('bid');
}
},
...
There is a line of code in its own documentation.
To use the low latency API, better for gaming sounds, use:
AudioPlayer audioPlayer = AudioPlayer(mode: PlayerMode.LOW_LATENCY);
In this mode the backend won't fire any duration or position updates. Also, it is not possible to use the seek method to set the audio a specific position. This mode is also not available on web.
I hope it is useful.
Essentially the app is like snapchat. I take pics and reset back to camera mode, the issue comes when I record video and reset, it goes back to camera mode but the audio form the video keeps playing in the background. The functions are somwhat exactly like the camera doc, with a few addition to reset the camera.
I added this:
_reset() {
if (mounted)
setState(() {
if (this._didCapture) {
this._didCapture = false;
this._isRecording = false;
this._isPosting = false;
this._file = File('');
this._fileType = null;
this._captions.clear();
this._textEditingControllers.clear();
this._videoController = null;
this._videoPlayerListener = null;
}
});
}
It works just fine but the audio in the background is still on. Also wondering if the video/picture is saved on the phone, which I don't want to...
i had been looking for a similar answer, but i didn´t find it. You could try to stop it adding this to your function:
this._controller.setVolume(0.0);
that´s what i did in my app
My Codename One app features audio playback in the background when the user taps the screen. The audio I use is an mp3. Here is how I use the Media playback :
public static void playSound(boolean stop) {
sound.reset(); // The input stream needs to go back to the beginning
Media myClip = MediaManager.createMedia(sound, "audio/mp3", () -> {
// If there is no order to stop playback, we keep playing when it has completed (looping)
playSound(false);
});
if (!stop) {
myClip.play();
} else {
myClip.cleanup();
}
}
So hen the user taps the screen components change and I pass true to playSound method. On Android the current playback stops not on iOS with an iPhone 4.
Please note that when the app gets minimized (center button pressed) the playback stops (even if I don't call cleanup() on the Media which I do on Android to stop the playback when the app is minimized).
How can I stop the playback on iPhone ?
Any help appreciated,
#Shai pointed me to the right direction so here is the code finally used :
Media myClip = null;
public static void playSound(boolean stop) {
sound.reset(); // The input stream needs to go back to the beginning
/**
* If the media is playing we don't create it
* otherwise we would have several media in the wild
* that could not be stopped
*/
if (myClip == null || !myClip.isPlaying()) {
myClip = MediaManager.createMedia(sound, "audio/mp3", () -> {
// If there is no order to stop playback, we keep playing when it has completed (looping)
playSound(false);
});
}
if (!stop) {
myClip.play();
} else {
myClip.cleanup();
}
}