Media Source Extension on Firefox and IE - html

I'm creating a Audio Player with HTML5, using the MediaSource Object.
My code is similar to MediaSource API Demo
But when executing the line
var ms = new MediaSource();
And exception is throwed on Firefox and Internet Explorer
ReferenceError: MediaSource is not defined
In Firefox Support says that this feature is only enabled to Youtube and Netflix.
There is a way to handle this restriction?
In Chrome, I have not problem!

At time of writing, IE11 only has support when run on Windows 8.1 or above.
Firefox will only enable MSE when about:config param media.mediasource.enabled = true (this restriction will be removed eventually, once the FF implementation is globally stable). There is no way around this, so unless you are YouTube or Netflix, consider Firefox MSE as coming soon.

Firefox has been lagging behind quite badly when it comes to MSE support in their browser. Firefox Nightly build however now seems to be pretty close to working properly. It still has to go through nightly build and beta phase before it's released to the public, so expect a few months.

Related

Service Worker - Browser support

CanIUse and MDN doesn;t seems to be agree on the support for service worker. In the midst of Chrome going to remove support for appcach, we are trying to ascertain the impact of moving to Service Worker. Are we reading the above two pages incorrectly?
We tried Google's own samples against device/browser combinations and results wore not encouraging. For example the 'custom offline page' demo failed in iOS Chrome (v80) where it worked in iOS Safari (12.4.5).
The 'Selective caching' and 'Read through caching' pages clearly show "service worker is not supported in the current browser" in Chrome 80. It is checking the if ('serviceWorker' in navigator) {, but other samples doesn't show such a message.
All and all it is confusing on the browser support for the Service worker. Is there there a universally tested sample which we can use as a benchmark for different device/browser combination.
I asked Jake Archibald of Google on this and he replied with the following SO post which must be still valid.
Chrome Service Worker iOS Support
Therefore apparently Safari is the only option at the moment. I am still wondering what Google is recommending developers to use once they remove support for AppCache.
Jake continued saying there is no way they can add support as Apple is not giving them full rights on iOS. But he mentioned appcache will continue to work as usual. His exact words are
"However, since Chrome on iOS is just a skin over Safari, appcache will continue to work while it works in Safari webview."
on iOS only Safari supports service workers. You can test browsers if it supports with this code
if ('serviceWorker' in navigator) { /*supported*/ }

SpeechRecognization for firefox web extension

As chrome has webkitspeechrecognition api for speech detection , what can we use for firefox webextension(web speech api not working for me).
I'm making an extension which will continuously listen for speech and then process it.
I have already made a chrome extension which is up and running,so wanted to extend it to Firefox, need an alternative to this line(which is for chrome extension)
recognition = new webkitSpeechRecognition();
I haven't used the Speech Recognition API yet, but you should be able to use
recognition = new SpeechRecognition();
In order for this to work, you need to set
media.webspeech.recognition.enable
to true in about:config. Source: https://developer.mozilla.org/en-US/docs/Web/API/Web_Speech_API
There are a number of outstanding bugs around the implementation of Web Speech in Firefox, so I'm not sure the above is implemented or working well. The basic implementation was done in Firefox 44 / 49.

How to enable WebVR on Google Chrome?

I am trying to create a WebVR scene. For this task, I want to enable WebVR on Google Chrome. My OS is Windows 8.
I open flags using chrome://flags/. WebVR is not there. How can I enable it?
Official channels of Google Chrome do not support WebVR. (now they do, see below)
There is an unofficial build of chrome that does. FYI Firefox Nightly also supports WebVR in their official and current release, as does Samsung Internet Beta for GearVR (the latter after some configuration).
UPDATE: Chrome Android now works with WebVR if you enable chrome://flags/#enable-webvr. See this manual on how to enable WebVR on different browsers.
You can install Google Chrome extension for WebVR debugging
It can really help to debug your VR application.
You will be able change the position of the virtual device in the environment, to see the change of camera position.
Also, it is possible to emulate the HTC Vive controllers.
Alternative is to use WebVR polyfill
It adds WebVR-API to your browser.
Currently you can test your sample webVR code on the following browsers :
Google Chromium
Firefox Nightly
Samsung browser for webVR
Google Chrome version 54.0 onwards was expected to support webVR, but it seems we have to wait a little more.
If you are not very comfortable with ThreeJS library for VR projects, you should try aframe framework ( check http://aframe.io ). Here you will focus only on the VR code flow and all other graphics related overheads (camera, rendering etc) will be taken care by aframe itself.
Do you still need this special Chromium build?
In latest Chrome #58 it seems the feature is available within chrome://flags now
WebVR Mac, Windows, Linux, Chrome OS, Android Enabling this option
allows web applications to access experimental Virtual Reality APIs.
#enable-webvr
Didnt try it out yet though (dont want to break my productive browser)
Greetz

jplayer just stopped working in Chrome - OK in other browsers

I've been using jplayer jukebox for some time with no problems but it has suddenly stopped working in Chrome. Still works fine in IE and Firefox but the playlist no longer shows in Chrome. It was definitely working at the end of June 2014 when I last added a track. webpage is http://www.jonphilibert.com/gallery.htm
Any suggestions gratefully received
Hilary
Try changing the "mp3" to "M4A".
https://groups.google.com/forum/#!topic/jplayer/Lyk7Znv1pWE
What has happened is that this Chromium issue means that Chrome uses Flash for playback since Chrome 36, rather than HTML5.
Your problem is that the path to the SWF path is set up incorrectly - Chrome Console tells me "GET http://www.jonphilibert.com/Jplayer.swf 404 (Not Found)"
So once you configure the player to have the correct SWF file path, playback should start working again in Chrome.
Note this means that playback also won't be working in other browsers that don't support HTML5 audio.

Soundcloud HTML5 Player Not Showing Up in IE9

I've put a Soundcloud HTML5 player on my website and am generally quite pleased with it.
However, while browser testing in IE9 on Windows 7, The player is not loading, and I am seeing the following error in the debugging console:
SCRIPT429: Automation server can't create object
widget-b8220e90.js, line 2 character 1738
The poking around that I have been able to do suggests that this has something to do with the IE9 security settings and/or ActiveX, which makes me shudder. I have IE9 running on its default security settings.
Is there anything that can be done to get the HTML5 player to show in this situation, or will I need to fallback to the flash player?
EDIT: The problem also occurs in IE8, which isn't surprising but I add for completeness' sake
EDIT: I am seeing the problem using the Win7/IE9 Virtual Machine provided by Microsoft at their new Modern IE site, and using the default security settings in IE9
I used the same code you specified above to try to reproduce, but it works fine for me in IE9. In compatibility mode it just falls back to the old Flash widget. Can you have a look here and say if it still doesn’t work for you?
http://jsbin.com/otulas
This is indeed a problem in IE, testing on IE8 and this is what I have found:
The Widget API Playground doesn't work.
URLs with "/favorites" doesn't work, as in the Widget API Playground.
Getting this error:
"Webpage error details
Message: Object doesn't support this property or method
Line: 1
Char: 6061
Code: 0
URI: https://w.soundcloud.com/player/api.js
So I did unminify the JS file and got that it's talking about this line of code:
return r && r.instance ? r.instance : (i = a.indexOf(S(e)) > -1, s = new p(e), f.push(new d(s, e, i)), s)
It is important to mention that the player works fine without any API and without including the API script.
Hope this can be helpful for the dev team.
IE9 and 10 don't like third party cookies. SoundCloud's HTML5 widget uses those.
More from SoundCloud: http://help.soundcloud.com/customer/portal/articles/1331463-why-is-my-widget-not-showing-up-in-internet-explorer-
More from Microsoft: http://answers.microsoft.com/en-us/ie/forum/ie10-windows_8/soundcloud-html5-widget-wont-display-in-ie-9-or-10/79aaab55-44d8-414f-9d06-939bbdf25676