react-tunes-player
A simple .ogg/.mp3 player.
Last updated a month ago by zulucoda .
MIT · Bugs · Original npm · Tarball · package.json
$ cnpm install react-tunes-player 
SYNC missed versions from official npm registry.

React Tunes Player

npm status Build Status Coverage Status

A simple responsive .ogg/.mp3 player.

react-tunes-player-example

Demo

Demo - https://react-tunes-player.mfbproject.co.za/

Installation

npm install --save react-tunes-player

or

yarn add react-tunes-player

Usage

import React from 'react';
import ReactDOM from 'react-dom';
import ReactTunesPlayer from 'react-tunes-player';

const data = [
  {
    tune:
      'https://react-tunes-player.mfbproject.co.za/assets/audio/the_lego_tune.ogg',
    name: 'The lego tune',
    album: 'https://react-tunes-player.mfbproject.co.za/assets/images/dune.jpg',
  },
  {
    tune:
      'https://react-tunes-player.mfbproject.co.za/assets/audio/bensound-funkysuspense.mp3',
    name: 'Funky Suspense',
    album:
      'https://react-tunes-player.mfbproject.co.za/assets/images/funkysuspense.jpg',
  },
];

ReactDOM.render(
  <ReactTunesPlayer tunes={data} />,
  document.querySelector('.app'),
);

Example folder on how to use react-tunes-player

example

Tune Type

Name Type Description Example
tune string This is the tune location tune: 'https://react-tunes-player.mfbproject.co.za/assets/audio/the_lego_tune.ogg'
name string This is the tune name name: 'The lego tune'
album string This is the tune album art location album: 'https://react-tunes-player.mfbproject.co.za/assets/images/dune.jpg'

Example:

// Tune Type
{
     tune: "/assets/audio/the_lego_tune.ogg",
     name: "The lego tune",
     album: "/assets/images/dune.jpg"
}

Available Props

Prop Type Description
tunes Array<Tune> Array of Tune Type

Example:

// tunes
[
 {
     tune: "/assets/audio/the_lego_tune.ogg",
     name: "The lego tune",
     album: "/assets/images/dune.jpg"
 }
]

Responsive Design

375 Mobile

react-tunes-player-mobile.png

768 Tablet

react-tunes-player-tablet.png

1024 Laptop

react-tunes-player-laptop

Greater than 1024 is the same laptop

Music Credits

Royalty Free Music from Bensound

Dune: The Battle for Arrakis

License

MIT License.

Copyright (c) 2017 Muzikayise Flynn Buthelezi (zuluCoda).

Current Tags

  • 4.0.2                                ...           latest (a month ago)

14 Versions

  • 4.0.2                                ...           a month ago
  • 4.0.1                                ...           a month ago
  • 4.0.0                                ...           a month ago
  • 3.0.0                                ...           a year ago
  • 2.0.0                                ...           a year ago
  • 1.1.1                                ...           2 years ago
  • 1.1.0                                ...           2 years ago
  • 1.0.4                                ...           2 years ago
  • 1.0.3                                ...           2 years ago
  • 1.0.2                                ...           2 years ago
  • 1.0.1                                ...           2 years ago
  • 1.0.0                                ...           2 years ago
  • 0.2.5                                ...           2 years ago
  • 0.2.4                                ...           2 years ago
Maintainers (1)
Downloads
Today 0
This Week 0
This Month 0
Last Day 0
Last Week 0
Last Month 84
Dependencies (2)
Dependents (0)
None

Copyright 2014 - 2016 © taobao.org |