I'm am attempting to record audio using Ionic and ngCordova.
Here is my code:
$scope.captureAudio = function() {
var options = { limit: 3, duration: 10 };
$cordovaCapture.captureAudio(options).then(function(audioData) {
// Success! Audio data is here
alert(audioData);
console.log(audioData);
}, function(err) {
// An error occurred. Show a message to the user
alert(err);
});
};
When I run this in the emulator it works fine and brings up the voice recorder and when the recording is done it logs out the audioData.
When I upload it to ionic view and run it I get nothing. Not even an error.
Has anyone seen anything like this before ?
Thanks
Kevin
$cordovaCapture plugin is not yet supported by ionic view.
Please see the list of supported plugins in this link.
You can run the code in device directly using run command.
ionic run android
Related
I'm looking for a way to take a screenshot of a long web page every time it changes. I would like to use Node.js for this. My question is about how to render the full page with images and save it to disk ad an image file.
Most images on the webpage is lazy loaded. So I guess that I need to scroll down the entire page first, before taking a screen shot.
I tried different tools:
casperjs
node-webshot
phantomjs
All of them seems way too complicated, if not impossible, to even install. I didn't succeed with any of them.
casperjs seems like a really nice choice, but I can't get it to work within node.js. It keeps complaining, that casper.start() is not a valid method...
I got closest with node-webshot, but I did not manage to scroll down page.
This is my code so far:
var webshot = require('webshot');
var options = {
shotSize: {
height: 'all',
streamType: 'jpg'
}
};
webshot('www.xx.com', 'xx.com.jpg', options, function(err) {
// screen shot saved to 'xx.com.jpg'
});
BTW I'm developing on a mac. The finished Node app will be on a linux server.
Any comments or experiences are appreciated!
Can't really help with installing CasperJS since on Windows it works by simply using npm install casperjs -g.
I've put up a simple script to do screenshots:
var casper = require('casper').create();
casper.options.viewportSize = {width: 1600, height: 950};
var wait_duration = 5000;
var url = 'http://stackoverflow.com/questions/33803790/capture-screen-shot-of-lazy-loaded-page-with-node-js';
console.log("Starting");
casper.start(url, function() {
this.echo("Page loaded");
});
casper.then(function() {
this.scrollToBottom();
casper.wait(wait_duration, function() {
casper.capture('screen.jpg');
this.echo("Screen captured");
});
});
casper.then(function() {
this.echo("Exiting");
this.exit();
});
casper.run();
The code is fairly straightforward:
Load the url
Scroll to the bottom
Wait for a specific duration (wait_duration) for stuff to load
Do a screenshot
End
Hopefully, that works for you!
this code work for me with node in OSX, save it like test.js and run node test.js in CLI
var webshot = require('webshot');
var options = {
streamType: 'png',
windowSize: {
width: 1024,
height: 768
},
shotSize: {
width: 'all',
height: 'all'
}
};
webshot("blablabla.com","bla-image.png",options,(err) => {
if(err){
return console.log(err);
}
console.log('image succesfully');
});
you can automate it via Selenium, http://webdriver.io/. Yes, it's most like a testing engine, not a screen shot application, but you can fully control the browser automation and see the browser on your display while debugging
Start selenium server, with, for example, Google Chrome
Load your page
Do scrolling, clicking, everything with webdriver.io
Take a picture when you think it's a good time
close session
fast way to install selenium with nodejs -> https://github.com/vvo/selenium-standalone
I am building a NW.js (Node-Webkit) dashboard app which I want to be able to control with a game controller (for example: XBox 360 controller or Logitech controller).
I'm calling the following onready but when I debug its not recognizing any gamepads.
angular.element(document).ready(function() {
if(canGame()) {
var prompt = "To begin using your gamepad, connect it and press any button!";
$("#gamepadPrompt").text(prompt);
$(window).on("gamepadconnected", function() {
$("#gamepadPrompt").html("Gamepad connected!");
console.log("connection event");
});
$(window).on("gamepaddisconnected", function() {
console.log("disconnection event");
$("#gamepadPrompt").text(prompt);
});
}
});
function canGame() {
return "getGamepads" in navigator;
}
When I debug the code, it doesn't appear to be detecting any gamepads. I also try:
navigator.webkitGetGamepads()
but it doesn't show any gamepads being detected either.
Has anyone successfully used gamepads with a NW.js app?
I would greatly appreciate some help getting this to work.
I found the answer to my issue. Gamepads are indeed compatible with NW.js. I however, was using an old version (~v0.08).
The code I posted earlier when running with NW.js v0.12.2.
I am using Cordova / Phonegap iBeacon plugin with ionicframework at my cordova project. I am tryin to send a local notification both on android and ios with cordova local notification plugin while entering monitored region , when the app is killed.
Here is my code :
document.addEventListener("deviceready", onDeviceReady, false);
function didDetermineStateForRegion(pluginResult) {
}
function didStartMonitoringForRegion (pluginResult) {
}
function didExitRegion(pluginResult) {
$cordovaLocalNotification.add({
id: 30244234234,
title: "Good By!",
text: "Hope to see you again."
}).then(function () {
});
}
function didEnterRegion (pluginResult) {
$cordovaLocalNotification.add({
title: "Welcome",
text: "Tap to launch app"
}).then(function () {
});
};
function didRangeBeaconsInRegion (pluginResult) {
}
function onDeviceReady() {
// Now safe to use device APIs
function createBeacon(uuid,nofiyState) {
var uuid = uuid; // mandatory
var identifier = 'estimote'; // mandatory
// throws an error if the parameters are not valid
var beaconRegion = new cordova.plugins.locationManager.BeaconRegion(identifier, uuid);
beaconRegion.notifyEntryStateOnDisplay = true;
return beaconRegion;
}
var delegate = new cordova.plugins.locationManager.Delegate();
delegate.didDetermineStateForRegion = didDetermineStateForRegion;
delegate.didStartMonitoringForRegion = didStartMonitoringForRegion;
delegate.didRangeBeaconsInRegion = didRangeBeaconsInRegion;
delegate.didEnterRegion = didEnterRegion;
delegate.didExitRegion = didExitRegion;
var beaconRegion = createBeacon('02681445-8D1B-4F58-99D4-B25F4B129A58',true);
// var beaconRegionBlue = createBeacon('02681445-8D1B-4F58-99D4-B25F4B129A58',1,,true);
cordova.plugins.locationManager.setDelegate(delegate);
// required in iOS 8+
//cordova.plugins.locationManager.requestWhenInUseAuthorization();
cordova.plugins.locationManager.requestAlwaysAuthorization();
cordova.plugins.locationManager.startMonitoringForRegion(beaconRegion)
.fail(console.error)
.done();
}
cordova plugins :
com.unarin.cordova.beacon 3.3.0 "Proximity Beacon Plugin"
de.appplant.cordova.plugin.local-notification 0.8.1 "LocalNotification"
nl.x-services.plugins.socialsharing 4.3.16 "SocialSharing"
org.apache.cordova.console 0.2.13 "Console"
org.apache.cordova.device 0.3.0 "Device"
cordova version : 4.3.0
this works fine for ios even if the app is killed but on android notifications cames only if app in the background. When i kill the app from task manager on android i never seen any local notification.
Is it possible to receive notification on android even if app is killed ?
thanks for help.
lets clear some stuff , there are states that yo are confusing :
App as a service
App running in background (i.e minimized).
App killed (not running at all)
in all cases the 3rd state when you kill app ( via long press back button in custom roms , or force stop from app menu in your OS ) , the app is simply removed from memory , no code is being excuted !
what usually is done in this case is automatically relaunching the service after it has been stopped check this answer , and as you can read :
it is really very bad pattern to run service forcefully against the
user's willingness.
there are so many cordova plugins to create BroadcasteReceiver , however the simple answer to your question , if app is killed it is not possible to receive notification .
But you should consider this: if user kills your app , it means it was done intentionally , so you shouldnt really worry if your app will work or not , as this is the user's issue , and not yours as a developer.
Im buildning an application with intel xdk for android and ios. Im having trouble saving a pdf on the sdcard in android. im able to get the file directory of the unit and my alert text show that im progressing fine. But when i try to save the pdf nothing happens.
The application just skip the "fileTransfer.download(...)", no exception, no nothing.
Im probebly missing something but, is filetransfer not supported? been searching but no luck. All ideas are most welcome :o)
/Anders
my code:
function download()
{
window.appRootDirName = "download_test";
document.addEventListener("deviceready", onDeviceReady, false);
function onDeviceReady() {
alert("device is ready");
window.requestFileSystem(LocalFileSystem.PERSISTENT, 0, gotFS, fail);
}
function fail() {
alert("failed to get filesystem");
}
function gotFS(fileSystem) {
alert("filesystem got");
window.fileSystem = fileSystem;
fileSystem.root.getDirectory(window.appRootDirName, {
create: true,
exclusive: false
}, dirReady, fail);
}
function dirReady(entry) {
window.appRootDir = entry;
alert("application dir is ready");
}
var filePathx = window.appRootDir.fullPath + "/test.pdf";
alert(filePathx);
try{
downloadFile = function() {
var fileTransfer = new FileTransfer();
var url = "http://myserver/file.pdf";
var filePath = window.appRootDir.fullPath + "/test.pdf";
fileTransfer.download(
url, filePath, function(entry) {
alert("download complete: " + entry.fullPath);
}, function(error) {
alert("download error" + error.source);
});
}
}
catch(e)
{
alert("error in filetransfer.download: " + e.message);
}
}
You need to include the WRITE_EXTERNAL_STORAGE permissions in the manifest file but the Intel XDK does not provide a UI to enable this permission. I will file a bug for you.
http://developer.android.com/reference/android/Manifest.permission.html#WRITE_EXTERNAL_STORAGE
You you should be able to use the Cordova for Android build. There is a PhoneGap Audio example application that I just tested but it does not work. I have filed an bug for the Intel XDK.
You can try a Cordova Android build by doing the following:
Use Intel XDK version 0876:
Click Start a New Project
Click Work with a Demo
Click PhoneGap Audio
Click USE THIS DEMO
Name your project
Click CREATE
Click the Develop tab
Click 'intelxdk.config.xml'
Copy this file for your own project
On line 4: change to the name of your project
On line 4: change to the name of your username without any symbols or spaces
You can check this by going to BUILD tab
Click on Cordova for Android BUILD button
Click UPLOAD CODE
See your Team name: displayed in the right hand 'Cordova Development Build' box above the green Build App Now button
Click Close Build Page
Click Develop and update your to match the Build screen
ie. Line 4: id="usernamewithoutsymbols.audioproject"
Note: I will also file a bug for a better UI needed to find the team name
Click BUILD tab
Click on Cordova for Android BUILD button
Click UPLOAD CODE
Click Build App Now
Click Download build
Install the .apk using adb install .apk
Launch the application
Tap the red record icon
Tap Stop
Tap Play
This app should create and save an audio file using Cordova APIs. I just tried this on a 4.0 and Android 2.3 phone and it did not work. Bug filed for you and I will update this post as the issue is tracked.
Documentation can be found at https://software.intel.com/en-us/html5/articles/using-the-cordova-for-android-ios-etc-build-option
(works fine in Chrome on the iPhone)
I get this error:
TypeError: 'undefined' is not an object (evaluating 'win.location') in dg.js line 3
And the lightbox does not open.
The code in question inside PayPal's dg.js is:
startFlow: function (url) {
var win = that._render();
if (win.location) {
win.location = url;
} else {
win.src = url;
}
}
So does mobile Safari not understand that._render()? How do I get around this?
If it matters, I'm using Adaptive Payments, calling it like so:
var dg = new PAYPAL.apps.DGFlow({
trigger: null,
expType: 'light'
});
dg.startFlow('https://www.paypal.com/webapps/adaptivepayment/flow/pay?expType=light&payKey=' +data.paykey);
I don't have any problems getting the payKey & the entire payflow works on desktops and in mobile browsers other than Safari (it works on desktop Safari). It also does not work when our site is run as an iOS web app, which I assume is just a shell for Safari anyway.
I can explain why you are seeing this error.
Safari on iOS only allows a window to be opened as a result of a user click/touch event.
The DGFlow._render() function executes:
window.open('', "PPDG");
which returns null if triggered by anything other than a user click/touch event.
I am guessing you are issuing an XMLHttpRequest to generate a PayRequest/PayKey on the server and then in the onsuccess callback you are calling DGFlow.startFlow().
The solution is two split the process into two steps:
When the user is ready to checkout, issue the call to the server to
generate the pay key.
Then, present the user with a button to Checkout with PayPal and when that is clicked, call DGFlow.startFlow()
Found a couple of ways to get around this...location.replace with the PayPal URL or using your own lightbox. I used easybox.
// Replace
dg.startFlow('https://www.paypal.com/webapps/adaptivepayment/flow/pay?expType=light&payKey=' +data.paykey);
// with
var RUNNING_AS_WEB_APP = (window.navigator.standalone == true ? true : false);
if (RUNNING_AS_WEB_APP === false) {
dg.startFlow('https://www.paypal.com/webapps/adaptivepayment/flow/pay?expType=light&payKey=' +data.paykey);
} else {
location.replace('https://www.paypal.com/webapps/adaptivepayment/flow/pay?expType=light&payKey=' +data.paykey);
// Or, lightbox option:
// $.easybox([{url: 'https://www.paypal.com/webapps/adaptivepayment/flow/pay?expType=light&payKey=' +data.paykey, width: 320, height: 480}]);
}
Try using the mini browser experience where expType=mini. Seems to work better than the lightbox on mobile devices.
Adaptive Payments without modal box or popups?