I am trying to implement an HTML5 WebWorker and I am using rails 3. I have this in my js code:
//When body(DOM) is ready
$(function() {
....
..
//test html5 webworkers
$('#test_html5_workers').click(function() {
var worker=new Worker('play.js');
worker.addEventListener('message', function(e) {
console.log('Worker said: ', e.data);
}, false);
worker.postMessage('Hello World'); // Send data to our worker.
});
..
....
)};
and in another file I have this (in play.js)
self.addEventListener('message', function(e) {
self.postMessage(e.data);
}, false);
I am currently getting this error:
Script file not found: play.js
I have tried other file path names with no luck.
Any ideas why I am getting this since both files are in the same directory, assets/javascripts?
I am using Firefox 17.0.1
The javascript file (play.js) should go in the public folder, or at least that's what I did to get it working.
This works on mine.
(function() {
//test html5 webworkers
$('#test').on('click', function(){
if(window.Worker){
var worker = new Worker('test.js');
worker.onmessage = function(e){
alert('worker said: ' + e.data);
}
worker.postMessage('start');
}
});
})();
//test.js
self.onmessage = function(e){
if(e.data === 'start'){
self.postMessage('booyeah');
}
}
Related
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
I'm trying to create an app that allows the user to record audio. I'm using the cordova-plugin-media for this.
Using the sample from the documentation I can record sound on iOS (specifying a *.wav file), Android (*.amr), Windows Phone 8 (*.aac), but Windows Phone 8.1 doesn't work. I've tried it with *.mp3, *.wma, and *.m4a, but in every case I get this error:
No suitable transform was found to encode or decode the content.
Here's part of the code:
var that = this;
try {
this._media = new Media('recording.mp3', function () {
that._log('Audio success');
}, function (e) {
that._log('Error: ' + e.code + ': ' + e.message);
});
// Bind buttons
document.querySelector('#recordStart').addEventListener('click', function () {
// Record
that._log('Recording...');
that._media.startRecord();
});
document.querySelector('#recordStop').addEventListener('click', function () {
that._log('Recording stopped');
that._media.stopRecord();
});
}
catch (e) {
this._log('An error occurred!');
this._log(e.message);
}
I've implemented a webworker inside a web-page that uses backbone. I want to start the webworker in my index.html file as soon as the web page begins to load.
Here's my index.html's javascript code:
var w;
startWorker();
function startWorker() {
alert("new worker");
if(typeof(Worker) !== "undefined") {
alert("new worker");
if(typeof(w) == "undefined") {
alert("new worker");
w = new Worker("js/models/worker_prefetch_starred.js");
}
w.onmessage = function(event) {
// Comunication WebWorker <-> Webapp
};
}
}
As you can se I'm only creating the worker and works fine.
Here's my worker_prefetch_starred.js webworker's javascript code:
define(["underscore", "backbone" ],
function ($, _) {
require('collections/folder_items').starred_items_fetched().then(function(starred_items) {
_.each(starred_items, function(item) {
var linked_item = item.get("item");
linked_item.isOnWebsql(linked_item);
});
});
});
When I execute the code it throws me : define is not defined
What should I do?
You should include importScripts('require.js'); in worker_prefetch_starred.js file.
I'm unable to pass messages between a trusted page-worker script, and the addon.
main.js:
var pageWorkers = require("sdk/page-worker");
var self = require("sdk/self");
// Create a page worker that loads Wikipedia:
pageWorkers.Page({
contentURL: self.data.url("html/worker.html"),
onAttach: function(worker) {
console.log("within onAttach");
worker.port.on("message", function() {
console.log("Message received");
});
worker.port.on("message", function(message) {
console.log("Message received1");
});
},
onReady: function(worker) {
console.log("within onReady");
worker.port.on("message", function() {
console.log("Message received");
});
}
});
worker.html:
<html>
<head>
<script src="../js/worker.js"></script>
</head>
<body>
</body>
</html>
worker.js:
console.log("trying to emit message");
addon.port.emit("message");
addon.port.emit("message", "value");
console.log("tried to emit message");
In main.js, If I try the following outside of the pageWorkers.Page() call:
pageWorkers.port.on("message", function() {
console.log("Message received");
});
I get the following exception:
Message: TypeError: pageWorkers.port is undefined
Any help would be appreciated. I have tried using postMessages to no avail. If asked, I can add that code also.
Page workers, like tab attaching and unlike pageMods, don't have an onAttach function. Nor do they have an onReady, since the contentScriptFile is automatically attached when the HTML is ready.
main.js
var worker = pageWorkers.Page({
contentURL: self.data.url("html/worker.html")
});
worker.port.on("message", function() {
console.log("Message received");
});
//If your events have the same name then they're the same event,
//irrespective of arguments passed
worker.port.on("message1", function(message) {
console.log("Message received1");
});
worker.js
console.log("trying to emit message");
addon.port.emit("message");
console.log("trying to emit message1");
addon.port.emit("message1", "value");
I am trying to create a file in the PERSISTENT (sd card) storage using cordova's api in javascript. I am able to create the file, but unable to write data to it (data is empty on read). Below is my JS code:
$(document).ready(function() {
document.addEventListener("deviceready", onDeviceReady, false);
});
function onDeviceReady() {
writeTestList();
}
function writeTestList() {
window.requestFileSystem(LocalFileSystem.PERSISTENT, 0, gotFileSystemForWrite, function() { showMsg('Unable to access file system for write'); });
}
function gotFileSystemForWrite(fileSystem) {
fileSystem.root.getFile('testList.txt', {create: true, exclusive: false}, gotFileEntryForWrite, function() { showMsg('Unable to access file for write'); });
}
function gotFileEntryForWrite(fileEntry) {
fileEntry.createWriter(gotFileWriter, function() { showMsg('Unable to create test list'); });
}
function gotFileWriter(writer) {
writer.onwrite = function(evt) {
// show a message
alert('created the test lists');
readSavedContent();
};
writer.onerror = function(evt) {
alert(JSON.stringify(evt));
};
writer.write("raj");
alert(writer.length);
}
The control always goes inside onerror of writer and on alerting the event obj, i see a type: "error", error: "JSON error". I completely don't get this. I am writing to a txt file, but getting json error. I have put write permissions in android manifest. Also, I have storage plugin for cordova enabled in config.xml preferences. People, pls help me out with this..!!
Unable to fix this issue in cordova 3.0. Moved to cordova 2.9 and everything works perfectly.