<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="description" content="myMPD - fast and lightweight MPD webclient"> <meta name="author" content="mail@jcgames.de"> <title>myMPD: Local Player</title> <link href="css/bootstrap.css" rel="stylesheet"> <link href="css/mpd.css" rel="stylesheet"> <link href="assets/favicon.ico" rel="shortcut icon" type="image/vnd.microsoft.icon"> <meta name="apple-mobile-web-app-capable" content="yes" /> <meta name="apple-mobile-web-app-status-bar-style" content="black"/> <link rel="apple-touch-icon" href="assets/appicon.png"/> </head> <body> <header> <nav class="navbar navbar-expand navbar-dark fixed-top bg-dark"> <a class="navbar-brand" data-toggle="dropdown" href="#"> <span class="material-icons header-logo">play_circle_outline</span>myMPD </a> </nav> </header> <main role="main" class="container"> <div class="card"> <div class="card-header">Local Player</div> <div class="card-body"> <audio id="player" preload="none" controls=""></audio> </div> </div> </main> <script src="js/jquery-3.3.1.min.js"></script> <script src="js/js.cookie.js"></script> <script type="text/javascript"> var mpdstream = Cookies.get('mpdstream'); player.src = mpdstream; console.log('playing mpd stream: ' + player.src); player.load(); player.play(); </script> </body> </html>