summaryrefslogtreecommitdiff
path: root/libs
diff options
context:
space:
mode:
authorGravatar Chris Xiong <chirs241097@gmail.com> 2021-04-05 12:17:26 +0800
committerGravatar Chris Xiong <chirs241097@gmail.com> 2021-04-05 12:17:26 +0800
commitc721b50661d2f9c7d1edd7ba997460f51ec4bb58 (patch)
treedf6acbaaee0a44ceb08e1f97343f29257eb53a0e /libs
parentefa8c8821f87bfca47477102d08c89e1826ff391 (diff)
downloadweb-c721b50661d2f9c7d1edd7ba997460f51ec4bb58.tar.xz
Random bullshit go!!!
Finally, add notes to TSOP.
Diffstat (limited to 'libs')
-rw-r--r--libs/music/player10
-rw-r--r--libs/music/player.d/main_static.js59
-rw-r--r--libs/music/player.d/styles.css14
3 files changed, 68 insertions, 15 deletions
diff --git a/libs/music/player b/libs/music/player
index 6f5b4d8..f885d87 100644
--- a/libs/music/player
+++ b/libs/music/player
@@ -25,6 +25,12 @@
The Stupid Online Player
License: Expat (MIT)
Changelog:
+2021.04.05 2.7.0
+Clicking the track name after "Now Playing" shows the note for it.
+2020.08.04 2.6.1+b1
+Follow system theme if user has a preference.
+2020.05.21 2.6.1
+Added bouncy spectrum visualization from ShadowPlayer.
2019.12.20 2.6.0
Added multitrack audio support.
2018.11.29 2.5.4
@@ -86,13 +92,15 @@ The online player was added.
-->
<body onload="init();">
<div id="overlay"><span style="text-align:center;" id="overlaytext" class="TText">LOADING...</span></div>
+ <div id="notes" class="TText" style="display:none;"><pre class="TText" id="ntext"></pre>
+ <a href="javascript:NSUI.hideNotes()">close</a></div>
<div id="panel" class="TText">
<ul id="panellist">
<li><a href="/"><h1>Chrisoft</h1></a></li>
<li><a href="/libs/music/player"><h2>Music Library</h2></a></li>
<li><ul id="plists"></ul></li>
<li><a href="//filestorage.chrisoft.org/music/" target="_blank">Downloads</a></li>
- <li><a>TSOP 2.6.1</a></li>
+ <li><a>TSOP 2.7.0</a></li>
</ul>
</div>
<div id="content">
diff --git a/libs/music/player.d/main_static.js b/libs/music/player.d/main_static.js
index 51f7243..cc327d8 100644
--- a/libs/music/player.d/main_static.js
+++ b/libs/music/player.d/main_static.js
@@ -1,5 +1,6 @@
-//Chris Xiong 2015,2016,2017,2018
+//Chris Xiong 2015-2021
//License: Expat
+//WARNING: This file contains profanity (thrown as exceptions).
let NSInk=null;
let NSAudio=null;
@@ -49,10 +50,9 @@ NSPlayer={
load_playlist:async function(pln,ord)
{
let r=null;
- try{
- const resp=await fetch(new Request(`/libs/music/player.d/playlists/${pln}.playlist?${new Date().getTime()}`));
- r=await resp.text();
- }catch(e){return;}
+ const resp=await fetch(new Request(`/libs/music/player.d/playlists/${pln}.playlist?${new Date().getTime()}`));
+ if(!resp.ok)throw "shit";
+ r=await resp.text();
let rarr=r.split('\n');
let tarr=[];
const fmt=sh.useFLAC()?'flac':'ogg';
@@ -75,7 +75,11 @@ NSPlayer={
`#${encodeURIComponent(this.plistname)}/${encodeURIComponent(this.tracks[id].title)}`);
NSUI.iplaypause.style.backgroundPosition=`${NSUI.bpauserect}`;
this.current=id;
- NSUI.lbnowplaying.innerHTML=`Now Playing: ${this.tracks[id].title}`;
+ NSUI.lbnowplaying.innerHTML="Now Playing: ";
+ const a=sh.newelem("a");
+ a.innerHTML=this.tracks[id].title;
+ a.href=`javascript:NSUI.showNotes("${this.tracks[id].title}")`;
+ NSUI.lbnowplaying.appendChild(a);
if(navigator.mediaSession)
navigator.mediaSession.metadata=new MediaMetadata({title:this.tracks[id].title,album:this.plistname});
NSUI.set_highlighted(this.plistname,this.tracks[id].title);
@@ -253,10 +257,9 @@ NSUI={
{
const moi=this;
let r=null;
- try{
- const resp=await fetch(new Request(`/libs/music/player.d/playlists/playlists?${new Date().getTime()}`));
- r=await resp.text();
- }catch(e){return;}
+ const resp=await fetch(new Request(`/libs/music/player.d/playlists/playlists?${new Date().getTime()}`));
+ if(!resp.ok)throw "shit";
+ r=await resp.text();
let rarr=r.split('\n');
let tarr=[];
let cnt=0;
@@ -270,7 +273,7 @@ NSUI={
NSPlayer.load_playlist(t,i).then((rp)=>{
tarr[rp.plistord]=rp;
if(--cnt<=0)a(null);
- });
+ },()=>{b(null);});
}
});
await p;
@@ -288,7 +291,11 @@ NSUI={
{
const ta=NSUI.ulplaylists.childNodes[i].firstChild;
if(ta.pid==this.pid)
- {ta.classList.add('highlighted');ta.classList.add('active');}
+ {
+ if(ta.classList.contains('highlighted'))
+ NSUI.showNotes(this.innerHTML);
+ ta.classList.add('highlighted');ta.classList.add('active');
+ }
else{ta.classList.remove('highlighted');ta.classList.remove('active');}
}
NSUI.present_playlist.bind(NSUI,this.pid)();
@@ -395,7 +402,28 @@ NSUI={
document.getElementById('timeleft').innerHTML=`-${NSUI.formatTime(NSUI.audio.duration-NSUI.audio.currentTime)}`;
document.getElementById('ctime').style.width=NSUI.audio.currentTime/NSUI.audio.duration*100+'%';
NSUI.bufferedUpdate();
- }
+ },
+ showNotes:async function(title)
+ {
+ const nd=sh.elem("notes");
+ const nt=sh.elem("ntext");
+ nt.innerHTML="Loading..."
+ nd.style.display="block";
+ setTimeout(()=>{nd.style.opacity=1.;});
+ const url=`//filestorage.chrisoft.org/music/notes/${title}.note`;
+ try{
+ const resp=await fetch(new Request(url));
+ if(!resp.ok)throw "shit";
+ r=await resp.text();
+ nt.innerHTML=r;
+ }catch(e){nt.innerHTML="This particular track doesn't seem to have a note.";}
+ },
+ hideNotes:function(title)
+ {
+ const nd=sh.elem("notes");
+ nd.style.opacity=0.;
+ setTimeout(()=>{nd.style.display="none";},500);
+ }
};
NSAudio={
@@ -711,7 +739,10 @@ function init()
}
sh.elem('overlay').style.display='none';
}
- });
+ },
+ ()=>{
+ sh.elem('overlaytext').innerHTML+="Failed...<br>Maybe try refreshing the page?"
+ });
NSVisualization.init();NSInk.inkPrepare();
NSUI.audio.ontimeupdate=NSUI.timeUpdate;
NSUI.audio.onended=NSPlayer.next.bind(NSPlayer);
diff --git a/libs/music/player.d/styles.css b/libs/music/player.d/styles.css
index 354fd45..bcbfee3 100644
--- a/libs/music/player.d/styles.css
+++ b/libs/music/player.d/styles.css
@@ -24,6 +24,20 @@
top:50%;
transform:translateXY(-50%,-50%);
}
+#notes{
+ bottom:0;
+ right:0;
+ position:absolute;
+ width:min(80%,480px);
+ height:min(80%,300px);
+ z-index:9;
+ background-color:rgba(0,0,0,0.6);
+ transition:opacity 0.3s;
+ opacity:0;
+ color:#FFF;
+ margin:1em;
+ padding:1em;
+}
.switches{text-align:center;width:100%;padding:0.25em 0 0.25em 0;}
.centered-audio{text-align:center;width:100%;}
canvas#cvs{width:100%;height:100%;}
generated by cgit v1.2.3 (git 2.39.1) at 2024-05-05 07:39:32 +0000