improve build process; add documentation
This commit is contained in:
parent
eeeb9a9559
commit
491a6e2dad
6
.gitignore
vendored
6
.gitignore
vendored
@ -1,3 +1,3 @@
|
|||||||
css/mejs-controls.svg
|
dist/js/*.js
|
||||||
css/myplayer.min.css
|
dist/css/*.css
|
||||||
css/playlist-controls.svg
|
dist/css/*.svg
|
||||||
|
|||||||
66
README.md
Normal file
66
README.md
Normal file
@ -0,0 +1,66 @@
|
|||||||
|
# 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.
|
||||||
|
|
||||||
|
MyPlayer requires the Javascript file from `dist/js` and the CSS and SVG files from `dis/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>
|
||||||
|
```
|
||||||
|
|
||||||
|
Sample instanciation:
|
||||||
|
|
||||||
|
```html
|
||||||
|
<div class="player"></div>
|
||||||
|
<script>
|
||||||
|
$(function(){ MyPlayer({
|
||||||
|
element: '.player',
|
||||||
|
mode: 'm3u',
|
||||||
|
detachable: false,
|
||||||
|
m3u: 'mp3.m3u',
|
||||||
|
mejs: { loop: true, shuffle: true }
|
||||||
|
})});
|
||||||
|
</script>
|
||||||
|
</div>
|
||||||
|
```
|
||||||
|
|
||||||
|
See also [the demo page](demos/index.html) for several examples.
|
||||||
|
|
||||||
|
## Contributing
|
||||||
|
|
||||||
|
* 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`.
|
||||||
|
* See subdirectory [css](./css) for CSS, specifically [local.js](src/local.js).
|
||||||
|
- 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
|
||||||
|
|
||||||
|
|
||||||
32
README.txt
32
README.txt
@ -1,32 +0,0 @@
|
|||||||
Project: MyPlayer - A Web-MP3-Player with Playlist Support
|
|
||||||
Author: tilt@linuxfoo.de
|
|
||||||
Release: 01-10-2014
|
|
||||||
License: MIT
|
|
||||||
|
|
||||||
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
|
|
||||||
|
|
||||||
How to Use:
|
|
||||||
|
|
||||||
See demos/index.html for several examples.
|
|
||||||
|
|
||||||
How to Hack:
|
|
||||||
|
|
||||||
Directory src contains the input files. See player.js for the MyPLayer implementation.
|
|
||||||
Use build.sh (with the Google closure compiler) to rebuild myplayer.min.js.
|
|
||||||
|
|
||||||
The Flash and Silverlight plugins are taken from mediaelement.js and are included
|
|
||||||
in binary form only. If you want to modify them, use the mediaelement.js sources.
|
|
||||||
15
css/build.sh
15
css/build.sh
@ -4,26 +4,31 @@
|
|||||||
|
|
||||||
dir=$(readlink -f "$(dirname "$0")")
|
dir=$(readlink -f "$(dirname "$0")")
|
||||||
|
|
||||||
|
cssdir="$(readlink -f "$dir/../dist/css")"
|
||||||
|
|
||||||
if ! cd "$dir" ; then
|
if ! cd "$dir" ; then
|
||||||
echo "ERROR: Could not change working directory; aborted." >&2 ;
|
echo "ERROR: Could not change working directory; aborted." >&2 ;
|
||||||
exit 1 ;
|
exit 1 ;
|
||||||
|
elif ! mkdir -p "$cssdir" ; then
|
||||||
|
echo "ERROR: Could not create directory $cssdir; aborted." >&2 ;
|
||||||
|
exit 1 ;
|
||||||
elif [[ -z $(type -p r.js) ]] ; then
|
elif [[ -z $(type -p r.js) ]] ; then
|
||||||
echo "ERROR: r.js optimizer not found; install it using 'npm install -g requirejs'." >&2
|
echo "ERROR: r.js optimizer not found; install it using 'npm install -g requirejs'." >&2
|
||||||
exit 1
|
exit 1
|
||||||
elif ! r.js -o cssIn=myplayer.css out=myplayer.min.css optimizeCss=standard.keepComments.keepLines ; then
|
elif ! r.js -o cssIn=myplayer.css out="$cssdir"/myplayer.min.css optimizeCss=standard.keepComments.keepLines ; then
|
||||||
echo "ERROR: r.js failed; aborted." >&2
|
echo "ERROR: r.js failed; aborted." >&2
|
||||||
exit 1
|
exit 1
|
||||||
else
|
else
|
||||||
sed -i -e 's|../mediaelement-plugins/dist/playlist/||' myplayer.min.css
|
sed -i -e 's|../mediaelement-plugins/dist/playlist/||' "$cssdir"/myplayer.min.css
|
||||||
chmod 0644 myplayer.min.css
|
chmod 0644 "$cssdir"/myplayer.min.css
|
||||||
|
|
||||||
echo "INFO: Minimized CSS to $dir/myplayer.min.css" >&2
|
echo "INFO: Minimized CSS to $cssdir/myplayer.min.css" >&2
|
||||||
|
|
||||||
for svg in \
|
for svg in \
|
||||||
../mediaelement-plugins/dist/playlist/playlist-controls.svg \
|
../mediaelement-plugins/dist/playlist/playlist-controls.svg \
|
||||||
../mediaelement/build/mejs-controls.svg
|
../mediaelement/build/mejs-controls.svg
|
||||||
do
|
do
|
||||||
svg_out="$dir/$(basename "$svg")"
|
svg_out="$cssdir/$(basename "$svg")"
|
||||||
|
|
||||||
if ! cp "$svg" "$svg_out" ; then
|
if ! cp "$svg" "$svg_out" ; then
|
||||||
echo "ERROR: Copying controls SVG $svg failed; aborted." >&2
|
echo "ERROR: Copying controls SVG $svg failed; aborted." >&2
|
||||||
|
|||||||
File diff suppressed because it is too large
Load Diff
0
dist/css/.gitignore
vendored
Normal file
0
dist/css/.gitignore
vendored
Normal file
0
dist/js/.gitignore
vendored
Normal file
0
dist/js/.gitignore
vendored
Normal file
9597
js/jquery.js
vendored
9597
js/jquery.js
vendored
File diff suppressed because it is too large
Load Diff
8673
js/myplayer.js
8673
js/myplayer.js
File diff suppressed because it is too large
Load Diff
23
js/myplayer.min.js
vendored
23
js/myplayer.min.js
vendored
File diff suppressed because one or more lines are too long
13
src/build.sh
13
src/build.sh
@ -4,11 +4,17 @@
|
|||||||
|
|
||||||
dir=$(readlink -f "$(dirname "$0")")
|
dir=$(readlink -f "$(dirname "$0")")
|
||||||
|
|
||||||
jsdir=$(readlink -f "$dir/../js")
|
jsdir=$(readlink -f "$dir/../dist/js")
|
||||||
|
|
||||||
if ! cd "$dir" ; then
|
if ! cd "$dir" ; then
|
||||||
echo "ERROR: Could not change working directory; aborted." >&2 ;
|
echo "ERROR: Could not change working directory; aborted." >&2 ;
|
||||||
exit 1 ;
|
exit 1 ;
|
||||||
|
elif ! mkdir -p "$jsdir" ; then
|
||||||
|
echo "ERROR: Could not create directory $jsdir; aborted." >&2 ;
|
||||||
|
exit 1 ;
|
||||||
|
elif ! type yui-compressor > /dev/null ; then
|
||||||
|
echo "ERROR: Executable \"yui-compressor\" not found in PATH; aborted." >&2 ;
|
||||||
|
exit 1 ;
|
||||||
fi
|
fi
|
||||||
|
|
||||||
echo '/*
|
echo '/*
|
||||||
@ -29,11 +35,6 @@ MyPlayer
|
|||||||
Copyright (c) 2014 - 2024 tilt@linuxfoo.de MIT License
|
Copyright (c) 2014 - 2024 tilt@linuxfoo.de MIT License
|
||||||
*/' > "$jsdir"/myplayer.min.js
|
*/' > "$jsdir"/myplayer.min.js
|
||||||
|
|
||||||
type yui-compressor > /dev/null || {
|
|
||||||
echo "ERROR: Executable \"yui-compressor\" not found in PATH; aborted." >&2 ;
|
|
||||||
exit 1 ;
|
|
||||||
}
|
|
||||||
|
|
||||||
rm -f "$jsdir"/myplayer.min.js
|
rm -f "$jsdir"/myplayer.min.js
|
||||||
|
|
||||||
for js in \
|
for js in \
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user