Git Product home page Git Product logo

phonegap-play-audio's Introduction

PhoneGap / Cordova audio player

A PhoneGap / Cordova project that is a simple API for playing audio files on Android and iOS

This projects aims to give some simple HTML5 style functionality to the audio playback for the phonegap/cordova media plugin. https://cordova.apache.org/docs/en/latest/reference/cordova-plugin-media/index.html

The api takes care of instantiating a media object for each audio file, keeping track of which audio file is playing and constructing filepaths to the cordova / phonegap www folder.

This allows an audio file to play using the familiar and simple HTML5 / JavaScript:

audio.play("path/to/my/audioFile.mp3");

Usage

Create a new phonegap project using Phonegap cli or desktop app. Replace the www directory with this demo / working repository (it includes test audio files).

audio-player.js file should be added to index.html

<script type="text/javascript" src="js/audio-player.js"></script>

audio.play

To play audio use the following inside the 'deviceready' function

audio.play("path/to/my/audioFile.mp3");

The path to the audioFile should be configured from the www directory

(typically these would be triggered by an event listener)

It is possible to use multiple audio files with multiple instances of audio.play without conflict. Triggering multiple files to play will result in overlapping audio playback.

audio.play("path/to/my/audioFile1.mp3"); 
audio.play("path/to/my/audioFile2.mp3"); 

audio.pause

To pause an audio file use the following inside the 'deviceready' function

audio.pause("path/to/my/audioFile.mp3");

The path to the audioFile should be configured from the www directory

audio.getDuration

To get the duration of an audio file add the following inside the 'deviceready' function

audio.getDuration("path/to/my/audioFile.mp3");

The path to the audioFile should be configured from the www directory

audio.seekTo

To go to a specific point in an audio file add the following inside the 'deviceready' function

audio.seekTo("path/to/my/audioFile.mp3", milliseconds);

The path to the audioFile should be configured from the www directory

audio.getCurrentPosition

To return the current position of an audio file that is playing add the following inside the 'deviceready' function

audio.getCurrentPosition("path/to/my/audioFile.mp3");

The path to the audioFile should be configured from the www directory. If the audio is not playing 0 will be returned

android-minSdkVersion (Android only)

Minimum SDK version supported on the target device. Maximum version is blank by default.

This template sets the minimum to 14.

<preference name="android-minSdkVersion" value="14" />

<access ...> (All)

This template defaults to wide open access.

<access origin="*" />

It is strongly encouraged that you restrict access to external resources in your application before releasing to production.

For more information on whitelist configuration, see the Cordova Whitelist Guide and the Cordova Whitelist Plugin documentation

Content Security Policy (CSP)

The default CSP is similarly open:

<meta http-equiv="Content-Security-Policy" content="default-src * 'unsafe-inline'; style-src 'self' 'unsafe-inline'; media-src *" />

Much like the access tag above, you are strongly encouraged to use a more restrictive CSP in production.

A good starting point declaration might be:

<meta http-equiv="Content-Security-Policy" content="default-src 'self' data: gap: 'unsafe-inline' https://ssl.gstatic.com; style-src 'self' 'unsafe-inline'; media-src *" />

For more information on the Content Security Policy, see the section on CSP in the Cordova Whitelist Plugin documentation.

Another good resource for generating a good CSP declaration is CSP is Awesome

Generate icons

Generate icons from a 1024px x 1024px master at http://pgicons.abiro.com/

phonegap-play-audio's People

Contributors

roddicki avatar

Watchers

James Cloos avatar Josh Connor avatar  avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.