I have a big challenge.
Currently searched on the internet, content that could help me with this question: I need to develop a Multitrack Player as those of music recording studios.
The idea is to make 3 or more MP3 files play at the same time, simultaneously and synchronized like a player example of this page: http://www.multitracks.com/songs/Steffany-Gretzinger/The-Undoing/Constant-One/
Ok. I have used the <audio> of html5. 0 of latency on a user of PC. But when testing realized on a cell phone, audio is out of sync. For there is a minimum latency of 1 second or longer to begin each tag <audio>.
I have also tested Web Audio API and derivatives. This API is amazing. There are several ways of developing what I want with it however, the support is only for users with CHROME.
So the challenge is this. How do I develop a Multitrack Player as the sample page where audios touch without latency and the entire script development is compatible with all browsers?
Related
My website is currently playing sounds when the user answers a question right/wrong. But I notice that on my tablet (iPad) and mobile (iPhone) it plays the sounds even though I put it in silence mode. And I don't want the phone/tablet to play sounds when the user has clearly set their device in silent mode (the Ringer). So, can I detect whether a device is muted/silenced and then not play any sounds? I tested on Safari and Chrome, and it always plays the sound, irrespective of the Ringer's state.
EDIT: If it is not possible to read this information, then my question would be if there is a way to play sounds that DOES respect the user's muting preferences? I am using jQuery's $("#correctsound").trigger('play'), and clearly this doesn't respect those settings. Do we have a different way to play sounds that takes these settings into account?
The simple answer to your question is no. Web pages don't have access to that kind of information about the client. More info here: Javascript: Can you read the systems volume? Furthermore, it is important to note that iOS has different volume settings for ringers and for media, according to Macworld:
The key to mastering volume adjustment is understanding that most of
the sounds on your device fall into one of two categories. General
audio includes music and other media, and the voice volume on the
iPhone and for FaceTime on all devices. The “ringers and alerts”
category includes not only the iPhone ringer, but also: FaceTime
rings; Clock app alarms; notifications and individual app alerts;
keyboard clicks; and miscellaneous app sounds like the whoosh of
sending Mail.
In other words, if a user wants to mute audio coming from web pages, they should mute the media volume. Ringer volume has nothing to do with web pages, so putting your phone in "silent" mode is only meant to affect the ringer volume. If you need help changing your device's volume settings, check out How can I lower the media volume on my iPhone when no media are playing? on the Apple Stack Exchange.
I have built a webRTC application that streams audio.
The application works as intended on all devices and the client is able to hear the audio stream. At a very high level, the RTC stream is simply attached to an audio element which works great.
The problem: I am trying to utilize the Android Chrome background audio feature. At the moment the stream keeps playing in the background (even when chrome is minimized) however about 5 seconds after screen timeout/lock, the peer connection is closed. This is not a memory issue (I have several test devices including a Galaxy S7).
In contrast if I simply point to url of an mp3 file, the audio context will keep playing indefinitely. Is there a way to achieve this indefinite background with a webRTC stream?
Cheers in advance!
Looks like this old bug made its way back into Chromium :
https://bugs.chromium.org/p/chromium/issues/detail?id=951418
Verified resolved in issue 513633 with no background logic required: https://bugs.chromium.org/p/chromium/issues/detail?id=513633
I've been looking for a solution that detects the difference between the default speakers and headphones on a computer. I understand that with Web Audio API, AudioDestinationNode represents the output device, where users hear audio.
My question (to be specific) is whether or not it is possible to detect a change in the users' audio output device (wired/wireless headphones). If this is not possible, is there a way to use phonegap to do so, for computers as well as mobile devices?
My goal is to initiate an event only when the AudioDestinationNode maps to headphones or external speakers.
There's nothing in the Web Audio API spec for this.
It might be possible in Phonegap (at least if you were willing to write your own Phonegap plugin) – but that's only going to help on mobile. As far as I know, there's no way to determine the audio output device in any of the major desktop browsers.
Just out of curiosity, what are you hoping to do as a result of the user switching between built-in speakers and an external device?
I'm trying to implement audio recording in a website. Basically the user should be able to press a button and speak something into the microphone. The recorded audio should then be sent to the server for further processing. I realise that you can do this with Flash, but for now I'm trying to avoid that.
I found several resources on the internet about it (i.e. link) but as it seems, this functionality is not widly supported yet. I experienced differences betweet the used browser and between the used operating system. For instance, the Chrome Browser doesn't seem to access any microphone on Linux correctly. So i was wondering if anyone knows a good resource to dive into this. Or maybe someone tried to set up something like this himself, and can help with some suggestions about where the limitations of HTML5 and the JavaScript Web Audio API are right now.
Thanks!
As of Chrome Version 27.0.1453.56 beta Mac, audio recording works with this demo application https://github.com/mattdiamond/Recorderjs
This app returns back a WAV file for the user which can be uploaded to the server.
If you want a truly robust solution that works on most desktop web browsers, you may need to resort to Flash.
This article covers up pretty well the current state of audio video capture possibilites using HTML5:
http://hdfvr.com/html5-video-recording
Also for just audio capture, here's a gitHub project that records audio to mp3 directly from the browser:
https://github.com/nusofthq/Recordmp3js
I'm building a simulator that runs in the browser and needs to be deployed to the iPad. I've run into an issue where I need to be able to play a .wav file on a button click.
I know that the ipad supports the HTML5 audio tag, but this application will run on PC's, Mac's and the iPad and all browsers do not support the HTML5 audio tag yet. So I really need a solution that will work on the ipad, as well as the desktop.
Thanks in advance for any help with this issue.
I know it's not best practice to play audio in web pages, but it's what the client ordered, and he's the one paying the bills.
The JavaScript would be:
var audio = new Audio("noise.mp3");
audio.play();
I've heard, however, that iOS devices (iPad, iPhone, iPod) disable autoplay and the JavaScript .play() method at start up and will only play a noise in response to a explicit user action.
Google "HTML5 audio" to find out more details (and there are lots of detail.)
<object type="audio/mpeg" data="muzak.mp3">Your browser doesn't seem to like MP3s</object>
that should fire up whatever plugin's registered for mpeg audio, or display the alternate text.
You're better off embedding an mp3, because support for that is very widespread. A .wav, by comparison, can be anything. Wav is a container format and can use any number of different codecs, most of which are probably NOT supported by your average pc/browser.