summaryrefslogtreecommitdiff
path: root/libs/music/player.d/player.php
diff options
context:
space:
mode:
authorGravatar Chris Xiong <chirs241097@gmail.com> 2019-02-10 11:16:07 +0800
committerGravatar Chris Xiong <chirs241097@gmail.com> 2019-02-10 11:16:07 +0800
commit9d3c8c0e6e1a7ba43bf3dc19350d1dca68b657a3 (patch)
tree339de0698c13e1763d3361d70fb1266621025c91 /libs/music/player.d/player.php
downloadweb-9d3c8c0e6e1a7ba43bf3dc19350d1dca68b657a3.tar.xz
Initial commit.
Diffstat (limited to 'libs/music/player.d/player.php')
-rw-r--r--libs/music/player.d/player.php147
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 &amp; About</b> [<a href="#" onclick="var e=document.getElementById(&quot;help&quot;);if(e.style.display==&quot;block&quot;){e.style.display=&quot;none&quot;;this.innerHTML=&quot;show&quot;;}else {e.style.display=&quot;block&quot;;this.innerHTML=&quot;hide&quot;;}">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>
+ &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
+ 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>