EDIT : I just created a new Meteor Project and it worked :D wow.But it still doesnt work on my core project..looks like i have different settings.
In my Meteor.js project i have 4 .mp3-files located in public/sounds/xyz.mp3.
I load these .mp3 with :
let soundRequest = new XMLHttpRequest();
soundRequest.open('GET', this._soundPath, true);
soundRequest.responseType = 'arraybuffer';
let $this = this;
soundRequest.onload = function () {
Core.getAudioContext().decodeAudioData(soundRequest.response, function (buffer) {
$this.source.buffer = buffer;
$this.source.loop = true;
$this.source.connect($this.panner);
});
};
soundRequest.send();
This WORKS on google Chrome, but when i build the app via meteor run android-device, i get the following error message : DOMException: Unable to decode audio data
I wonder if this is a bug because loading .png or .jpg works just fine in the mobile version. I have not installed any packages beside meteor add crosswalk but deinstalling this doesnt help either.
You shouldn't need to do a http request to get a local resource. You can just refer to a local url. On the Android device the path is different. See this code:
function getSound(file) {
var sound = "/sounds/"+file;
if (Meteor.isCordova) {
var s;
if (device.platform.toLowerCase() === "android") {
sfile = cordova.file.applicationDirectory.replace('file://', '') + 'www/application/app' + sound;
}
else {
sfile = cordova.file.applicationDirectory.replace('file://', '') + sound;
}
var s = new Media(
sfile,
function (success) {
console.log("Got sound "+file+" ok ("+sfile+")");
s.play();
},
function (err) {
console.log("Get sound "+file+" ("+sfile+") failed: "+err);
}
);
} else {
var a = new Audio(sound);
a.play();
}
}
On a device it loads the sound file asynchronously and then plays it. In the browser it just loads and plays it synchronously.
This web API is not supported on android device but works on chrome browser of android
Check browser specification in this link
https://developer.mozilla.org/en-US/docs/Web/API/AudioContext/decodeAudioData
Related
Web push works fine from iframe in local but when i uploaded to cloud server then it does not work in only chrome or chromium browser.
I have developed a webpush micro-service that serve from a Iframe. That works fine in local but when i uploaded to cloud server then it does not work in only chrome or chromium browser. You can check from https:alemran.me (click ^ icon from bot).
Web Worker:
self.addEventListener('push', function (event) {
if (!(self.Notification && self.Notification.permission === 'granted')) {
return;
}
const sendNotification = (title, body ) => {
return self.registration.showNotification(title,
body
);
};
if (event.data) {
const message = JSON.parse(event.data.text());
event.waitUntil(sendNotification(message.title,message.message));
}
});
There is no error show in console
You can open a new window with a url and get permission from user....
Like :
let win = window.open("your url", "_blank");
let winInterval = window.setInterval(function() {
if (win.closed !== false) {
window.clearInterval(winInterval );
//check your api for user subscription status
}
}, 200);
I've created a cordova Android app where users tap a link and it starts jsartoolkit. It all works fine the first time, but if I tap the back button then open the link again, after a few times it fails with an error:
"typeerror: artoolkit.setup is not a function"
It's happening when it tries to load the ARCameraParam (Data/camera_para.dat) - I've tried loading it both directly into the arcontroller ie var arController = new ARController(video, 'Data/camera_para.dat') and also loading it first ie arCamera = new ARCameraParam.
This error suggests that artoolkit.min.js isn't loading after a few times but I'm bamboozled as to why that would be.
It's not a caching issue - if I clear the app cache when it happens then try again, it still won't load. It always works fine the first time I've installed the app and also if I force stop the app, which suggests there's a process running from a previous session I'm not aware of. I've tried calling dispose on both the arcontroller and the arcameraparam when I tap the back button but that hasn't fixed it.
Does anyone know what processes jsartoolkit might be running that might cause an error like this? Any advice is very gratefully received.
Relevant code:
window.ARThreeOnLoad = function() {
function gotStream(stream) {
camvideo.src = window.URL.createObjectURL(stream);
nextBit(camvideo);
track = stream.getVideoTracks()[0];
camvideo.onerror = function(e)
{ stream.stop(); };
stream.onended = noStream;
}
function noStream(e) {
alert("no stream " + e);
var msg = 'No camera available.';
if (e.code == 1) {
msg = 'User denied access to use camera.'; }
document.getElementById('errorMessage').textContent = msg;
}
var camvideo = document.getElementById('monitor');
var constraints = { video: {facingMode: {exact: "environment"}, width: 1280, height: 960} };
navigator.mediaDevices.getUserMedia(constraints).then(gotStream).catch(noStream);
}
function nextBit(video) {
var arController = new ARController(video, 'Data/camera_para.dat');
arController.onload = function() {
arController.image = video;
Is it possible to listen to the loading of images (or stylesheets) via the Mozilla Add-On SDK?
Having the user load a new URL can be found via the Page-Mod module, AJAX calls via overriding XMLHttpRequest.prototype.*().
Yet both only listen to loading of entirely new pages, not to the attached images of a page. Also, the image source might be changed for example in Javascript.
(It might be possible to use a http-on-modify-request, as pointed to here, but how can you access the nsIHttpChannel's URL and parameters?)
You can listen to every network request via
var {Cc, Ci} = require("chrome");
var httpRequestObserver = {
observe: function(subject, topic, data) {
if (topic == "http-on-modify-request") {
var httpChannel = subject.QueryInterface(Ci.nsIHttpChannel);
var myURL = httpChannel.URI.spec;
console.log("url: " + myURL);
}
},
register: function() {
var observerService = Cc["#mozilla.org/observer-service;1"]
.getService(Ci.nsIObserverService);
observerService.addObserver(this, "http-on-modify-request", false);
},
unregister: function() {
var observerService = Cc["#mozilla.org/observer-service;1"]
.getService(Ci.nsIObserverService);
observerService.removeObserver(this, "http-on-modify-request");
}
};
httpRequestObserver.register();
exports.onUnload = function(reason) {
httpRequestObserver.unregister();
};
See also Firefox Addon observer http-on-modify-request not working properly.
URI access
The nsIHttpChannel extends nsIChannel, which has a URI Attribute of type nsIURI, which has a spec attribute that contains the whole URL (including schema, parameters, ref, etc).
I'm working on an app which needs Websocket to communicate with my server. I'm working with Phonegap so I can run all the code first of all in my browser.
Since Android 4.4 Websockets got native support in Android so it should work...
I've implemented the Websocket with this code:
$(document).ready(function () {
console.log('websocketready');
startwebsocket();
});
var ws;
function startwebsocket() {
ws = new WebSocket('ws://192.168.1.131:8080/.....');
ws.onopen = function () {
console.log("Websocket Ready!!");
}
ws.onclose = function () {
console.log("Websocket Closed!!");
}
ws.onerror = function () {
console.log("Websocket Error!!");
}
ws.onmessage = function (data) {
console.log('getvalue : ' + data.data);
}
}
function sendMessage(temp) {
ws.send(temp);
}
This is just working fine in my browser (Chrome and firefox). But if I start the app with Phonegap on my Nexus 5 with android 4.4.2 I'm getting : 'WebSocket connection to 'ws://192.168.1.131:8080/.....' failed: Unexpected response code: 403'
Do you have any suggestions what I could have missed to do or what I did wrong?
Do you provide 192.168.1.131 as authorised origin to cordova ?
Maybe you should try to add that to your config.xml :
<access origin="192.168.1.131" />
Take a look here for more informations.
Hope that help :)
I am trying to upload video from the users using the media capture interface recently introduced into javascript. Regardless of all the difficulties in browser compatibility, I can't even begin to understand the process of saving the video captured by the users.
I was thinking that I could somehow use ajax to push the streamed video up to the server, but be that as it may, I'm not even sure if I am approaching the problem appropriately.
I included my code, which currently only streams under chrome and opera.
function hasUserMedia()
{
return !!(navigator.getUserMedia ||
navigator.webkitGetUserMedia ||
navigator.mozGetUserMedia ||
navigator.msGetUserMedia);
}
if(hasUserMedia())
{
var onFail = function(error)
{
alert("ERROR >> " + error);
};
var onPass = function(stream)
{
var video = document.querySelector('video');
video.src = window.URL.createObjectURL(stream);
video.onloadedmetadata = function(e)
{
//..what do I put here..?
};
}
navigator.webkitGetUserMedia({video:true, audio:true}, onPass, onFail);
}
else
{
alert("ERROR >> USERMEDIA NOT SUPPORTED");
}
function saveVideo()
{
var connection = new XMLPHttpRequest();
connection.onreadystatechange=function()
{
if(connection.readyState == 4 && connection.status == 200)
{
alert("Your streamed video has been saved..!");
}
}
//..what do I type here..?
connection.open("POST","savevideo.php",true);
connection.send();
}
Currently you can't open a WebRTC connection to a server (though someone may be working on it...). AFAIK the only method is to take a screenshot of each frame by capturing the video to a canvas, then sending each from to the server and compile the video there.
Check out:
https://webrtc-experiment.appspot.com/RecordRTC/
Also may be helpful:
http://www.html5rocks.com/en/tutorials/getusermedia/intro/