diff options
-rw-r--r-- | src/js/player.js | 15 | ||||
-rw-r--r-- | src/templates/player.template.html | 4 |
2 files changed, 18 insertions, 1 deletions
diff --git a/src/js/player.js b/src/js/player.js index b31c2c6..5efdc2c 100644 --- a/src/js/player.js +++ b/src/js/player.js @@ -7,6 +7,7 @@ var template; var root; var page = { metadata: {}, + isLooping: false, getPosition: function() { if ( this.metadata && this.metadata.position ) { return formatTime(this.metadata.position); @@ -64,6 +65,20 @@ export function init(node) { }); } +export function loop() { + if( !page.isLooping ) { + mediaplayer.loop('track').then(function() { + page.isLooping = true; + show(); + }); + } else { + mediaplayer.loop('playlist').then(function() { + page.isLooping = false; + show(); + }); + } +} + export function play(trackIndex) { if( trackIndex ) { mediaplayer.pickTrack(trackIndex); diff --git a/src/templates/player.template.html b/src/templates/player.template.html index 5b5a7ab..ebf98cc 100644 --- a/src/templates/player.template.html +++ b/src/templates/player.template.html @@ -1,7 +1,9 @@ <div class="container-fluid"> <div class="row align-items-center mt-3"> <div class="col-2 text-left"> - <button type="button" class="btn btn-light"> + <button type="button" + class="btn {{ ^isLooping }}btn-outline-secondary{{ /isLooping }} {{ #isLooping }}btn-danger{{ /isLooping }}" + onclick="player.loop();"> <i class="fas fa-retweet"></i> </button> </div> |