CODEWITHSUNDEEP
cordovaionic-frameworkcordova-pluginsvisual-studio-cordova
pdschuller
pdschuller

Reputation: 584

cordova typescript Media plugin MediaPlayer

In Visual Studio Community 2017, I started with the "Ionic 2 - Sidemenu" template. (Ionic2, Angular2, TypeScript) I want to use the Media cordova plugin, and play an (audio) mp3 file. Case: the app opens > the audio controls are displayed > the actor taps the play button > the audio file plays.

In VS, I used the config.xml > Plugins UI to install the plugin. Then in my app.component.ts file I have this at the top.

import { MediaPlugin } from 'ionic-native';

And this in the same file

initializeApp() {
  this.platform.ready().then(() => {
    console.log(MediaPlugin);
  });
}

Which spits out this in the console. enter image description here

Question #1: do I have to do 

var myPlayer = new Media(src, success, fail)

somewhere in a ts file? I'm thinking I have to use different code because I am using TypeScript.

Question #2: What do I put in the html to display the media player in the UI? I have this in the html now

<audio controls></audio>

But maybe I need something else because I am using ionic.

Currently I try to make the player play an mp3 file with this for a buttons click handler:

setSrc() {
    var myPlayer = document.getElementsByTagName('audio')[0];
    // the intellisense verifies that this path is correct
    myPlayer.src = '../../audio/Capitolo_7s.mp3'; 
}

I get an error in the Media player's UI:

This type of audio file isn't supported

Thanks.

Upvotes: 3

Views: 438

Answers (1)

Mohammad Waleed
Mohammad Waleed

Reputation: 305

Ionic have a wrapper for the cordova native plugin

check their documentation and usage in this link Ionic Native - Media

Upvotes: 1

Related Questions