Develop Reference

How can I solve this cordova media capture error?

I'm trying to register a video in my application through the cordova plugin Media Capture. According to the documentation, this is my code :
startRegistration(){
var captureSuccess = function(mediaFiles) {
var i, path, len;
for (i = 0, len = mediaFiles.length; i < len; i += 1) {
path = mediaFiles[i].fullPath;
// do something interesting with the file
}
};
// capture error callback
var captureError = function(error) {
};
navigator.device.capture.captureVideo(captureSuccess, captureError, {limit:1});
}
I tried compiling the code but I received the following error :
Property 'device' does not exist on type 'Navigator'
What is going wrong?

Its used to work like this in Ionic 1 but not anymore. Now you will need to install #ionic-native/media-capture as well.
Skip first command if you already have latest plugin installed.
ionic cordova plugin add cordova-plugin-media-capture
npm install #ionic-native/media-capture
After installing you can use this plugin like this
import { MediaCapture, MediaFile, CaptureError, CaptureImageOptions } from '#ionic-native/media-capture/ngx';
constructor(private mediaCapture: MediaCapture) { }
...
let options: CaptureImageOptions = { limit: 3 }
this.mediaCapture.captureImage(options)
.then(
(data: MediaFile[]) => console.log(data),
(err: CaptureError) => console.error(err)
);
Here is the link where you can find details
Corodva or Capacitor Please follow accordingly. You can find guides for both in this link.

Is there a native solution to pick files in NativeScript Angular?

I am trying to implement a feature to let the user upload a file in my NativeScript Angular Project. NativeScript does not seem to have a native implementation of a file picker and there are limited plugins available that can do the job. Plus they have their own set of problems. The closest I have come to a workable solution is using the nativescript-mediafilepicker and that opens a blank page like the one below instead of the file explorer.
I exactly followed the documentation and can't figure out why it's not working. Here is the service I wrote:
payload.service.ts
import { Injectable } from '#angular/core';
import { Mediafilepicker, ImagePickerOptions, VideoPickerOptions, AudioPickerOptions,
FilePickerOptions } from 'nativescript-mediafilepicker';
#Injectable({
providedIn: 'root'
})
export class PayloadService {
constructor() { }
pickFile(){
console.log('Pick File Payload Service requested');
const extensions = ['pdf'];
let options: FilePickerOptions = {
android: {
extensions: extensions,
maxNumberFiles: 1
},
ios: {
extensions: extensions,
multipleSelection: false
}
};
let mediafilepicker = new Mediafilepicker();
mediafilepicker.openFilePicker(options);
mediafilepicker.on("getFiles", function (res) {
let results = res.object.get('results');
console.dir('File Pick Success: ',results);
});
mediafilepicker.on("error", function (res) {
let msg = res.object.get('msg');
console.log('File Pick Error: ',msg);
});
mediafilepicker.on("cancel", function (res) {
let msg = res.object.get('msg');
console.log('File Pick Cancel: ',msg);
});
}
}
Can someone help me fix this or rather provide me with a native implementation? I don't need much customization options and user will only upload one file at a time.

Receive Url in Cordova/Ionic

i want to receive a url from other apps like facebooks or youtube in my cordova apps. I view this:
docs
plugins
i install the plugins and then i write this piece of code.
window.plugins.webintent.hasExtra(window.plugins.webintent.EXTRA_TEXT,
function(url) {
// url is the value of EXTRA_TEXT
}, function() {
// Something really bad happened.
}
);
I use cordova/ionic with typescript
I've some question:
first : where i put this piece of code?in a method?in the constructor?
second : i have this error -> property plugins does not exist on type windows
EDIT:
This is the constructor
constructor(public navCtrl: NavController,platform: Platform) {
platform.ready().then(() => {
WebIntent.hasExtra(WebIntent.EXTRA_TEXT).then(
function(url) {
console.log("succes" + url);
}, function(url) {
console.log("error" + url)
});
})
}

If you have used ionic-native ,according to the docs
import {WebIntent} from 'ionic-native';
WebIntent.hasExtra(WebIntent.EXTRA_TEXT).then(onSuccess, onError);
You can use it after
platform.ready().then(() => {
//use plugin
})

playing audio sounds in Cordova application

I'm using Cordova media plugin for playing audio sound in my mobile application
I tried many codes but I didn't figure out what I'm doing wrong at the bottom I put two piece of code that I tried them
the first code (js code in a separate file)
var app = {
initialize: function() {
this.bindEvents();
},
bindEvents: function() {
document.addEventListener('deviceready', this.onDeviceReady, false);
},
onDeviceReady: function() {
var myMedia = new Media("../sounds/clapping.mp3");
myMedia.play();
}
};
app.initialize();
the second code (js code in a script tag) :
document.addEventListener("deviceready", function(){
var myMedia = null;
function playAudio() {
var src = "sounds/clapping.mp3";
if(myMedia === null) {
myMedia = new Media(src, onSuccess, onError);
function onSuccess() {
console.log("playAudio Success");
}
function onError(error) {
console.log("playAudio Error: " + error.code);
}
}
myMedia.play();
}
document.getElementById("playAudio").addEventListener("click", playAudio);
});
with a button :
<button id ="playAudio">PLAY</button>
How can I solve this problem ?

Wasted 2 hours on this, sharing it here:
This should not be this difficult. No full example at: https://cordova.apache.org/docs/en/latest/reference/cordova-plugin-media/
Simple step by step details:
Put my file in www:
Example at: www/audio/button-1.mp3
Install plugin:
cordova plugin add cordova-plugin-media
Copy paste code below:
`
function getFullMediaURL(s) {
return cordova.file.applicationDirectory + 'www/audio/button-1.mp3'
}
function playMP3() {
let src = getFullMediaURL();
var myMedia =
new Media(src,
function () { },
function (e) { alert('Media Error: ' + JSON.stringify(e)); }
);
myMedia.play();
myMedia.setVolume('1.0');
}
`
Step 4: Call below where you need play sound:
playMP3();

To answer your question, you can find the working sample of cordova app using Media Plugin in the following github page.
As mentioned in the sample project's README, you gotta install cordova device plugin as well to check the device platform.
Also to clarify the doubt you mentioned in the comment, android_asset refers to the project's root folder.

Ext.device.notification.show creating errors in Phonegap - Sencha Touch 2

I have a Sencha Touch 2 project and everything works great in the web browser. No errors in the console, and everything looks good. Once I package it with Phonegap and run it on a mobile device, however, things don't work as well.
I am using ext.device.notification.show in two places in my application. At first, I was doing requires: 'Ext.device.*' and while it worked in web, the app wouldn't run on mobile and eclipse would give me the error message Uncaught TypeError: Cannot read property 'name' of undefined. I switched over to requires: Ext.device.Notification (exact spelling and capitalization) and now the app runs but when I click a button that should create a message box, I get the error Uncaught TypeError: Cannot call method 'confirm' of undefined. The problem is I have no method called confirm. In one case I have a method called confirmItem, but for the second button that should be invoking a message box I have no method remotely close to "confirm."
I'll post one of the controllers below (this one has the confirmItem method):
Ext.define('MyApp.controller.MainController',
{
extend: 'Ext.app.Controller',
requires: ['Ext.device.Notification'],
config:
{
refs:
{
mainView: 'mainview',
btnConfirm: 'mainview button[action=confirmItem]',
},
control:
{
'btnConfirm':
{
tap: 'confirmItem'
},
mainView:
{
onSignOffCommand: 'onSignOffCommand'
}
}
},
// Transitions
getSlideLeftTransition: function ()
{
return {
type: 'slide',
direction: 'left'
};
},
getSlideRightTransition: function ()
{
return {
type: 'slide',
direction: 'right'
};
},
onSignOffCommand: function ()
{
var me = this;
console.log('Signed out.');
loginView = this.getLoginView();
//MainView.setMasked(false);
Ext.Viewport.animateActiveItem(loginView, this.getSlideRightTransition());
},
confirmItem: function ()
{
Ext.device.Notification.show(
{
title: 'Confirm',
message: 'Would you like to Confirm?',
buttons: ['No', 'Yes'],
callback: function (button)
{
if (button == "Yes")
{
MyApp.app.getController('MainController')
.confirmPickup();
}
else
{
console.log('Nope.');
}
}
});
},
confirmPickup: function ()
{
var me = this;
var loginStore = Ext.getStore('LoginStore');
mainView = this.getMainView();
mainView.setMasked(
{
xtype: 'loadmask',
message: ' '
});
if (null != loginStore.getAt(0))
{
var user_id = loginStore.getAt(0).get('id');
var name = loginStore.getAt(0).get('name');
var winner = loginStore.getAt(0).get('winner');
}
if (winner === 1)
{
console.log('success');
}
else
{
console.log('fail');
}
}
});
I only assume this is a problem because whenever I push the button that should be calling confirmItem I get the error. Am I using Ext.device.Notification correctly, or Have I missed something needed to make it work in Phonegap?

I found the solution! Everything was fine from a Sencha Touch point of view in terms of using requires: Ext.device.Notification but some things were missing on the Phonegap side. Specifically, I needed to install the appropriate plugins.
Open a terminal and type: Phonegap local plugin list to see your currently installed plugins. I had none. I went ahead and installed:
org.apache.cordova.device
org.apache.cordova.dialogs
org.apache.cordova.vibration
by using the following reference: http://docs.phonegap.com/en/3.0.0/cordova_device_device.md.html and selecting options from the menu on the left.