css | ||
demo | ||
dist | ||
jsmediatags@b7bbcdccee | ||
mediaelement@0026d05078 | ||
mediaelement-plugins@6b5de466fd | ||
patches | ||
plugins | ||
src | ||
.gitignore | ||
.gitmodules | ||
.minify.json | ||
COPYING.txt | ||
eslint.config.js | ||
index.html | ||
LICENSE.txt | ||
Makefile | ||
package.json | ||
README.md | ||
RELEASE.txt |
MyPlayer - A Web-MP3-Player with Playlist Support
This iteraton of MyPlayer, as present in this GIT repository, has known issues, especially when changing tracks in the playlist, and not all configuration demos/source types have been extensively tested (i currently focus on the "m3u" scenario).
Since i am doing this in my free time, i can not give you a roadmap or timeline on when the rewrite will be done and the software fully tested. Until then, the previous version of MyPlayer is available at https://tk-sls.de/ref/myplayer.dist.tar.gz.
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:
<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>
Sample instanciation reading playlist entries from a file ./mp3.m3u
:
<div class="player"></div>
<script>
$(function(){ MyPlayer({
element: '.player',
mode: 'm3u',
detachable: false,
m3u: './mp3.m3u',
loop: true,
shuffle: false
})});
</script>
</div>
Contributing
- Use
npm install
to install some JavaScript utilities. - Use
make
to perform a build of the software. - See subdirectory src for javascript sources, specifically player.js.
- Use
src/build.sh
to re-generate the minified scriptjs/myplayer.min.js
.
- Use
- See subdirectory css for CSS, specifically local.css.
- Use
css/build.sh
to re-generate the minified CSScss/myplayer.min.css
.
- Use
Author, Copyright and License
- Author: tilt@linuxfoo.de
- Release: Nov. 10 2024
- License: MIT