2024-11-11 08:24:44 +01:00
|
|
|
# MyPlayer - A Web-MP3-Player with Playlist Support
|
|
|
|
|
|
|
|
|
|
About:
|
|
|
|
|
|
|
|
|
|
This project provides a JavaScript constructor MyPlayer({...options...}) that can be used
|
|
|
|
|
to embed lists of audio files as read from an index document or an M3U into a web document.
|
|
|
|
|
|
|
|
|
|
They will be displayed in a playback GUI with a playlist that can optionally be filled
|
|
|
|
|
from the "title" and "artist" values of the files' ID3 tags (v1 and v2 are supported).
|
|
|
|
|
|
|
|
|
|
The player is "detachable", meaning it can start in a detached state or the user can open
|
|
|
|
|
it in a new window, preventing that playback breaks when the user leaves the page.
|
|
|
|
|
|
|
|
|
|
Tested Compatibility:
|
|
|
|
|
|
|
|
|
|
MP3: Firefox, Chrome, Internet Exploder
|
|
|
|
|
OGG Audio: Firefox, Chrome
|
|
|
|
|
|
|
|
|
|
## Usage
|
|
|
|
|
|
|
|
|
|
MyPlayer requires jQuery. See for example <https://www.w3schools.com/jquery/jquery_get_started.asp> on how to include a recent version.
|
|
|
|
|
|
|
|
|
|
MyPlayer requires the Javascript file from `dist/js` and the CSS and SVG files from `dist/css`.
|
|
|
|
|
|
|
|
|
|
Sample inclusions in an HTML document:
|
|
|
|
|
|
|
|
|
|
```html
|
|
|
|
|
<head>
|
|
|
|
|
<link href="css/myplayer.min.css" type="text/css" rel="stylesheet" />
|
|
|
|
|
<script type="text/javascript" src="js/jquery.min.js"></script>
|
|
|
|
|
<script type="text/javascript" src="js/myplayer.min.js"></script>
|
|
|
|
|
</head>
|
|
|
|
|
```
|
|
|
|
|
|
2024-11-13 07:42:01 +01:00
|
|
|
Sample instanciation reading playlist entries from a file `./mp3.m3u`:
|
2024-11-11 08:24:44 +01:00
|
|
|
|
|
|
|
|
```html
|
|
|
|
|
<div class="player"></div>
|
|
|
|
|
<script>
|
|
|
|
|
$(function(){ MyPlayer({
|
|
|
|
|
element: '.player',
|
|
|
|
|
mode: 'm3u',
|
|
|
|
|
detachable: false,
|
2024-11-13 07:42:01 +01:00
|
|
|
m3u: './mp3.m3u',
|
2024-11-11 08:24:44 +01:00
|
|
|
loop: true,
|
|
|
|
|
shuffle: false
|
|
|
|
|
})});
|
|
|
|
|
</script>
|
|
|
|
|
</div>
|
|
|
|
|
```
|
|
|
|
|
|
|
|
|
|
## Contributing
|
|
|
|
|
|
2024-11-13 07:47:11 +01:00
|
|
|
* Use `npm install` to install some JavaScript utilities.
|
|
|
|
|
* Use `make` to perform a build of the software.
|
2024-11-11 08:24:44 +01:00
|
|
|
* See subdirectory [src](./src) for javascript sources, specifically [player.js](src/player.js).
|
|
|
|
|
- Use `src/build.sh` to re-generate the minified script `js/myplayer.min.js`.
|
2024-11-13 07:48:12 +01:00
|
|
|
* See subdirectory [css](./css) for CSS, specifically [local.css](src/local.css).
|
2024-11-11 08:24:44 +01:00
|
|
|
- Use `css/build.sh` to re-generate the minified CSS `css/myplayer.min.css`.
|
|
|
|
|
|
|
|
|
|
## Author, Copyright and License
|
|
|
|
|
|
|
|
|
|
* Author: tilt@linuxfoo.de
|
|
|
|
|
* Release: Nov. 10 2024
|
|
|
|
|
* License: MIT
|
|
|
|
|
|
|
|
|
|
|
