Buffering on audio source - javascript

i'm using the Javascript for a radio player, so, sometimes someone got a bad network and the connection drops out, i want to know if there's a function like buffering, for reload the stream if it crashes.
I hope that someone could answer, thanks.
Greetings,
Julia.

if your use case is a radio the data is streaming so you can't access past data, if the use case is just a media-player you can use the buffered property of the audio element to query which is the range of the media that has been buffered at the moment or the currentTime property to access the current execution time.
var myAudioElement = document.createElementbyTag('audio')
// let's suppose that the audio element has a radio streaming attached as source
myAudioElement.buffered // returns the last data that has been downloaded from the source
myAudioElement.currentTime // returns the time of the last data played
Maybe you should see something like the connection API to be aware of when your user go offline

Related

How can I take one frame from each MediaStream?

In our javascript app we are trying to extract a single frame from each video tag, which includes
'MediaStream's from each user (with audioTrack and videoTrack), which they received using navigator.mediaDevices.getUserMedia and then send said stream using peerjs API, with peerConnection.answer(stream).
Now I am trying to extract a single frame from MediaStream's videoTrack, which will then be sent to another server.
I have not dealt with mediaStreams in the past and will like to know any suggestions on how to implement it. will include in the next days entire code but will take some time to crop the relevant segments of the code. Thank you

How to constantly get Information from the Backend into the dom in node?

I got a question concerning the relationship of the DOM and my Backend. I have a website running with node.js and express and now I want to implement a "live counter" feature.
The counter should actualize every 10 seconds or so and show the user the current "score". The problem is that this score is saved in my Mongo-Database and but I want to show the new information to the user (without loading a completely new page, this would be annoying).
It is no problem for me to run a script that actulizes every seconds or so, but I either had to:
1) Let a script run on the client side and retrieve information from my DB like this:
setInterval(function(){
//get Information from Server (X)
//manipulate div in the DOM
}, 1000
);
Or 2) Let a script run on the server side and somehow manipulate the DOM from there
setInterval(function(){
//get value from DB
//somehow access DOM and change the value there (X)
}, 1000
);
(The "(X)" marks the tricky part for me)
I also know that it is not really possible to manipulate the DOM from node and not a good idea to access my DB from the clientside. But I am out of ideas here. Can some of you explain to me how this problem could be solved?
Thanks a lot,
Paul
You can use socket.io for this type of problem where you can emit the data from your server on specific time interval or on any specific event. And then subscribe that event to get that data in realtime.

Web Audio API: Collect all audio informations at "once"

I know that I can collect Audio Data of an currently played audio with getByteFrequenzyData() and I'll get back an Uint8Array.
Now I collect all data of one Audio File by pushing each animationFrame the currently data in an Array, do for example:
I have a audio file with duration of 20min.
Then I have after 20min all Audio data in one Array, which then looks kind a like this:
var data = [Uint8Array[1024], Uint8Array[1024], Uint8Array[1024], Uint8Array[1024], ... ];
Is there a faster way to get all these audio data, so I don't have to wait the full 20 minutes of the video, and get the audio data nearly instant?
It would be good to receive the audio information in fixed steps for, like 50ms or so!
Instead of using an AudioContext, use an OfflineAudioContext to process the data. This can run much faster than real time. To get consistent data at well defined times, you'll also need to use a browser that implements the recently added suspend and resume feature for offline contexts so that you can sample the data for getByteFrequencyData at well-defined time intervals.

1 video view = 1 Parse request? How to improve that?

I'm working on an app a little like Vine, where several looped videos are displayed on the screen of the user. I need to count one view per loop. It means, if the user repeat the video 5 times, it will count 5 views. And this is the model I want to use for every videos of my app.
I use Parse for my back-end and a webview to show the videos. It means that I use Javascript to send requests to Parse, with Ajax calls.
My problem is that I don't really know how to limit the number of requests sent to Parse when I add a view on a video.
Maybe I should save the video views to a MySQL database and then, once a day with a cron task, save the MySQL results to Parse? I don't really know how to proceed, but I really need to limit the number of requests to Parse.
How would you design this?
Thanks!
My first thought is to not optimize too early. There should be plenty of time, as you accrue zillions of users, to improve the design.
If you want to improve it early (and still use parse), keep the object that tracks views "pinned" locally (see this blog entry). Update the view count as often as needed, then update parse on an NSTimer.
The app may become inactive at any time, and if unsaved views have been counted since last time the timer fired, then there's one more problem to solve. The app delegate gets told that applicationDidEnterBackground, and can request a moment to finish "one last thing". See here under "Executing Finite Length Tasks".
There (iIn the dispatch block suggested by the sample code), save the object that counts views (saveInBackgroundWithBlock:), invalidate the timer, and tell iOS you're done with [application endBackgroundTask:bgTask];
What I should is store the video's somewhere else and save 1 view per click.
You can save this click in the background using something like this:
userClick.saveInBackground()
It saves the click in a background proces so the user doesn't have to wait for the sync with Parse.
note: You should use Bolts (https://github.com/BoltsFramework/Bolts-iOS) to get saveInBackground() working.
* edit *
Maybe it's smart to sync with parse every x amount of clicks, maybe 5 or 10. To limit the amount of requests.

Time to first byte with javascript?

Is there any modern browser that via javascript exposes time to first byte (TTFB) and/or time to last byte (TTLB) on a http request without resorting to any plugin?
What I would like is a javascript snippet that can access these values and post them back the the server for performance monitoring purposes.
Clarification:
I am not looking for any js timers or developer tools. What I wonder and hoping is if there are any browsers that measures load times and exposes those value via javascript.
What you want is the W3C's PerformanceTiming interface. Browser support is good (see this survey from Sep 2011). Like you speculated in response to Shadow Wizard's answer, these times are captured by the browser and exposed to javascript in the window object. You can find them in window.performance.timing. The endpoint of your TTFB interval will be window.performance.timing.responseStart (defined as "the time immediately after the user agent receives the first byte of the response from the server, or from relevant application caches or from local resources"). There are some options for the starting point, depending on whether you're interested in time to unload the previous document, or time to resolve DNS, so you probably want to read the documentation and decide which one is right for your application.
I fear it's just not possible.
JavaScript becomes "active" only after part of the request has been sent from server, accepted by the browser and parsed.
What you ask is kind like asking "Can I measure the weight of a cake after eating it?" - you need to first weight and only then eat the cake.
You can see the response time in the Chrome Developer Tools.
It's impossible to get the true TTFB in JS, as the page gets a JS context only after the first byte has been received. The closest you can get is with something like the following:
<script type="text/javascript">var startTime = (new Date()).getTime()</script>
very early in your <head> tag. Then depending on if you want to check when the html finishes, or everything finishes downloading, you can either put a similar tag near the bottom of your html page (and subtract the values), and then do an XHR back to the server (or set a cookie, which you can retrieve server side on the next page request) or listen to the onload event, and do the same.

Categories

Resources