diff options
Diffstat (limited to 'libs/music/player.d/player.php')
| -rw-r--r-- | libs/music/player.d/player.php | 147 |
1 files changed, 147 insertions, 0 deletions
diff --git a/libs/music/player.d/player.php b/libs/music/player.d/player.php new file mode 100644 index 0000000..6d20ddc --- /dev/null +++ b/libs/music/player.d/player.php @@ -0,0 +1,147 @@ +<!DOCTYPE html> +<html> +<head> + <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> + <meta http-equiv="expires" content="Friday 24 October 1997 09:30 GMT"> + <meta name="viewport" content="width=device-width, initial-scale=1"> + <title>The Stupid Online Player</title> + <link rel=stylesheet href='/common.css' type='text/css'> + <link rel=stylesheet href='styles.css' type='text/css'> + <script type="text/javascript" src="jquery-3.0.0.min.js"></script> + <script type="text/javascript" src="main.js"></script> + <script type="text/javascript"> + function changeImage(img){ + document.getElementById('aqt').src=img; + } + </script> +</head> +<body onload="init();"> + <div class="TText" style="font-size:2em"><a href="/">Chrisoft</a>::<a href="/libs/music/player">Music Library</a></div> + <p class="TText" id="plname"></p> + <div style="padding:7px;border:1px solid #aaa;display:table;"> + <div style="text-align:center;"> + <b>Help & About</b> [<a href="#" onclick="var e=document.getElementById("help");if(e.style.display=="block"){e.style.display="none";this.innerHTML="show";}else {e.style.display="block";this.innerHTML="hide";}">show</a>] + </div> + <div id="help" style="display:none;"> + Click something to play.<br> + Tested on Chrome, Firefox and Microsoft Edge. Doesn't work at all on Internet Explorer.<br> + WARNING!!: Microsoft Edge and Safari plays huge wav streams!<br> + As of 2016-07-03, visualization doesn't work on Chrome for Android unless "unified media pipeline" is enabled in chrome://flags.<br> + Written in html, javascript, css and php. Uses html5 features, jQuery and some css3 transitions.<br> + This page uses cookies to save your preferences.<br> + History: + <pre style="white-space: pre-wrap;"> +2016.11.03 +Canvas is no longer blurred on HiDPI screens. UI changes. +Makes mobile version less painful to view. Code cleanup. +Save preferences in cookies. +2016.07.23 +UI bug fixes. +2016.07.07 +Behavior changes. Custom audio controls. +2016.07.03 +Ink fountain performance boost. Minor UI changes. Bug fixes. +2016.07.02 +The online player received a major overhaul. +Merged the experimental version. +The playlist can now be hidden. +2016.02.13 +Two new visualization modes for the experimental online player. +New playlist mechanism for the online player, not added to the experimental version. +2016.02.06 +New experimental online player with visualization. +2015.11.7 +The online player was added. + </pre> + </div> + </div> + <div id="cvsdiv"> + <canvas width="800" height="450" id="cvs"></canvas> + </div> + <div id="ctrlcontainer"> + <div class="switches" style="text-align:right;padding-top:0.25em 0 0.25em 0;"> + <span style="text-align:center;color:#000;width:100%;display:inline-block;position:absolute;left:50%;top:0.1em;transform:translateX(-50%);z-index:-1" id="nowplaying"></span> + <sw id="plistsw">[↓Hide Playlist]</sw> + </div> + <div class="centered-audio"> + <audio id="audio" preload="auto" tabindex="0" type="audio/ogg" autoplay="autoplay" style="display:none;"> + Sorry, but your browser does not support HTML5 audio.<br> + 请使用支持HTML5音频的浏览器访问本页面. + </audio> + <div style="position:relative;height:1em;margin:0.25em;"> + <div id="tsliderbase" style="position:absolute;width:100%;height:100%;background-color:rgba(204,204,204,0.6);"></div> + <div id="cbuff" style="position:absolute;width:0%;height:100%;background-color:rgba(64,192,255,0.6);pointer-events:none;"></div> + <div id="ctime" style="position:absolute;width:0%;height:100%;background-color:#1194FF;pointer-events:none;"></div> + </div> + <span id="timenow" style="position:absolute;left:1em;">0:00</span> + <div class="buttondiv" id="pbprev"><img src="prev.svg" alt="prev" width="24"></div> + <div class="buttondiv" id="pbplaypause"><img src="play.svg" alt="playpause" width="24" id="imgplaypause"></div> + <div class="buttondiv" id="pbnext"><img src="next.svg" alt="next" width="24"></div> + <span id="timeleft" style="position:absolute;right:1em;">0:00</span> + </div> + <div class="switches"> + Shuffle: <sw id="shufflesw">Off</sw> + + Repeat current: <sw id="repeatsw">Off</sw> + <br> + Visualization: + <select id="visualizationsel" onfocus="this.oldvalue=this.value;"> + <option value="none">None</option> + <option value="spectrum">Spectrum</option> + <option value="spectrumring">Spectrum Ring</option> + <option value="scope">Scope</option> + <option value="spectrogram">Spectrogram</option> + <option value="inkfountain">Ink Fountain</option> + <option value="shakeurbody">Shake your body(defunct)</option> + </select> + </div> + </div> + <div id="plistref"></div> + <ul id="playlist"> + <?php + function useWav($user_agent) + { + if(strpos($user_agent,'Edge'))return true; + elseif(strpos($user_agent,'Chrome'))return false; + elseif(strpos($user_agent,'Safari'))return true; + elseif(strpos($user_agent,'MSIE')||strpos($user_agent,'Trident/7'))return true; + return false; + } + if(!isset($_GET["plistid"]))$_GET["plistid"]="0"; + if(intval($_GET["plistid"])<0||intval($_GET["plistid"])>=100)$_GET["plistid"]="0"; + $plist=sprintf("/var/www/html/libs/music/player.d/playlists/%s",$_GET["plistid"]); + $file=fopen($plist,"r"); + $l=fgets($file);$l=substr($l,0,strlen($l)-1); + echo "<script type=\"text/javascript\">","document.getElementById('plname').innerHTML=\"Playlist: ",$l," \";"; + echo "var a=document.createElement('a');a.href=\"plisteditor.php?plistid=",$_GET["plistid"],"\";a.innerHTML=\"Edit playlist\";document.getElementById('plname').appendChild(a);</script>"; + for($i=0;$item=fgets($file);$i++) + { + while(ord($item[strlen($item)-1])==10||ord($item[strlen($item)-1])==13) + $item=substr($item,0,strlen($item)-1); + if(useWav($_SERVER['HTTP_USER_AGENT'])) + { + $tfilen=sprintf("/var/www/html/libs/music/wav/%s.wav",$item); + if(!file_exists($tfilen)) + $cur=sprintf("<li><a href=\"../wav/%s.wav\" tr=\"%s\" ord=\"%d\" style=\"color:#f00;\">%s</a></li>",$item,$item,$i,$item); + else + $cur=sprintf("<li><a href=\"../wav/%s.wav\" tr=\"%s\" ord=\"%d\">%s</a></li>",$item,$item,$i,$item); + echo $cur; + } + else + { + $tfilen=sprintf("/var/www/html/libs/music/ogg/%s.ogg",$item); + if(!file_exists($tfilen)) + $cur=sprintf("<li><a href=\"../ogg/%s.ogg\" tr=\"%s\" ord=\"%d\" style=\"color:#f00;\">%s</a></li>",$item,$item,$i,$item); + else + $cur=sprintf("<li><a href=\"../ogg/%s.ogg\" tr=\"%s\" ord=\"%d\">%s</a></li>",$item,$item,$i,$item); + echo $cur; + } + } + ?> + </ul> + <div style="height:160px;"></div> + <!--<div class="floatingl"> + <img src="../../../koishi_norm.png" alt="" width="320" id="aqt" style="transition:0.4s;"> + </div>--> +</body> +</html> |