Playing generated MIDI file with MediaPlugin

Ionic Framework ionic-v3
1

Hi all, trying to get a generated midi file to play with Media Plugin

Im generating the midi file on the fly, looks something like this:
data:audio/midi;base64,TVRoZAAAAAYAAAABAIBNVHJrAAAAfQCQR0AggEdAAJBHQCCAR0AA…CAR0AAkEdAIIBHQACQR0AggEdAAJBHQCCAR0AAkEdAYIBHQAD/UQMPQkAA/wQFc25hcmUA/y8A

And im creating the MediaObject like so:

const onStatusUpdate = (status) => console.log(status);
const onSuccess = () => console.log('Action is successful.');
const onError = (error) => console.error(error.message);

const file: MediaObject = this.media.create(track.dataUri(), onStatusUpdate, onSuccess, onError);

file.play();

Where track.dataUri() is the midi string above.
When I call .play() im getting a error code message of 1 with no error message.

My only suspicion is that the midi file generated isnt valid? Anyone else try this?

4

From looking at the docs it seems create() expects a URI to a real file. Are you sure this should work this way?

5

Ya the docs say for the first param of create() is “src: A URI containing the audio content. (DOMString)”

Id expect that to work since its read as a DOMString and its a uri. But im not totally sure either, all examples ive seen are getting the src param from a file location instead of a variable.

1 Like
6

I would test that by using a real file to see if if then works fine with the data you have.

7

Ya I agree. I put a actual midi file in my assets/sounds folder and Im still having trouble getting it to play.

Im calling it like:
const file: MediaObject = this.media.create('assets/sounds/test.midi', onStatusUpdate, onSuccess, onError);

Any idea as to why this wouldnt work? I also tried with mp3.

8

Did you do everything needed to install?
What is your ionic info output?

9

Yes everything for the plugin was installed correctly.

$ ionic info

global packages:

    @ionic/cli-utils : 1.4.0
    Cordova CLI      : 7.0.1
    Ionic CLI        : 3.4.0

local packages:

    @ionic/app-scripts              : 1.3.7
    @ionic/cli-plugin-cordova       : 1.4.0
    @ionic/cli-plugin-ionic-angular : 1.3.1
    Cordova Platforms               : android 6.2.3 ios 4.4.0
    Ionic Framework                 : ionic-angular 3.4.2

System:

    Node       : v6.11.0
    OS         : macOS Sierra
    Xcode      : Xcode 8.3.3 Build version 8E3004b
    ios-deploy : not installed
    ios-sim    : not installed
    npm        : 3.10.10

image
Screen Shot 2017-06-29 at 3.16.42 PM.png1850×424 58 KB

I logged out the MediaObject and the src property looks correct? But still getting the undefined error message back when I call play().

10

That is different than what you described in your first post, right?

11

Okay I got it playing an mp3 with the file path /android_asset/www/assets/sounds/tamb.mp3 However, I changed it to /android_asset/www/assets/sounds/test.midi which contains the midi encoding from earlier. And now im getting the error code of 1 and undefined. Will try adding a real midi file to see if it reads correctly.

1 Like
12

Okay so I created a legit midi file in Logic and imported it into the assets folder with the url looking like /android_asset/www/assets/sounds/acdc.mid. Still getting the same issue. Which leads me to think that MediaPlugin doesnt support midi files :frowning:

13

Did you find any method to play a midi file within Ionic Framework? I used MIDI.js and Tone JS, no luck… My final method is buffering the Midi file from volume and note number data into a wav file. However, it is hard to implement with different instrument by ‘Mathematic’ way…