mikka/Esc-Playlists
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

onPlay Function

Browse source
This commit is contained in:
mikka 2026-04-23 16:29:49 +02:00
parent 9c96294e02
commit 5c2d166ff4
1 changed files with 26 additions and 16 deletions
Download patch file Download diff file Expand all files Collapse all files

42
static/script.js
View file

@ -1,22 +1,32 @@
//Ich möchte dafur sorgen das wenn der knopf auf der karte gedrückt wird diese gespielt wird
const audios = document.querySelectorAll("audio") const audios = document.querySelectorAll("audio")
const articles = document.querySelectorAll("article") const articles = document.querySelectorAll("article")
const signs = document.querySelectorAll(".sing")
outindex = 0 outindex = 0
playing = false playing = false
playcolor = "#00ff3c" playcolor = "#00ff3c"
loop = true loop = true
function onplay(id){
id = parseInt(id)
if(id>0){
articles[id-1].style.filter = "grayscale("+(id+1)*50+"%)"
articles[id-1].style.boxShadow = "0 0 0px 0px "+playcolor
}
articles[id].style.filter = "grayscale(0%)"
articles[id].style.margin = "8px"
articles[id].style.boxShadow = "0 0 6px 1px "+playcolor
}
function nächste(id){ function nächste(id){
audios[id].pause() audios[id].pause()
console.log(id)
id = parseInt(id) + 1 id = parseInt(id) + 1
console.log(id)
audios[id].play() audios[id].play()
} }
function vorherige(id){ function vorherige(id){
audios[id].pause() audios[id].pause()
audios[id-1].play() audios[id-1].play()
} }
function looptrue(){ function looptrue(){
if(loop){ if(loop){
loop = false loop = false
@ -28,22 +38,26 @@ function looptrue(){
document.querySelector("#loop").innerHTML = "Loop" document.querySelector("#loop").innerHTML = "Loop"
} }
} }
function abspielendiese(id){ function abspielendiese(id){
if(playing){ if(playing){
//ON PAUSE
audios[id].pause() audios[id].pause()
playing = false playing = false
articles[id].style.margin = "0px" articles[id].style.margin = "0px"
articles[id].style.boxShadow = "0 0 0px 0px "+playcolor articles[id].style.boxShadow = "0 0 0px 0px "+playcolor
} }
else{ else{
//ON PLAY
audios[id].play() audios[id].play()
playing = true playing = true
articles[id].style.margin = "8px" onplay(id)
articles[id].style.boxShadow = "0 0 6px 3px "+playcolor
} }
} }
function abspielen(){ function abspielen(){
if(playing){ if(playing){
//ON PAUSE
audios[outindex].pause() audios[outindex].pause()
playing = false playing = false
articles[outindex].style.margin = "0px" articles[outindex].style.margin = "0px"
@ -51,26 +65,23 @@ function abspielen(){
document.querySelector("#play").innerHTML = "Abspielen" document.querySelector("#play").innerHTML = "Abspielen"
} }
else{ else{
//ON PLAY
audios[outindex].play() audios[outindex].play()
playing = true playing = true
articles[outindex].style.margin = "8px"
articles[outindex].style.boxShadow = "0 0 6px 3px "+playcolor
document.querySelector("#play").innerHTML = "Pausieren" document.querySelector("#play").innerHTML = "Pausieren"
onplay(outindex)
} }
} }
for (const [index,audio] of audios.entries()){ for (const [index,audio] of audios.entries()){
audio.addEventListener("ended", (event) => { audio.addEventListener("ended", (event) => {
if (index != audios.length -1){ if (index != audios.length -1){
outindex = index +1 outindex = index +1
audios[outindex].play() audios[outindex].play()
// Visueles onplay(index)
articles[index].style.filter = "grayscale("+(index+1)*50+"%)"
articles[index].style.boxShadow = "0 0 0px 0px "+playcolor
articles[outindex].style.filter = "grayscale(0%)"
articles[outindex].style.margin = "8px"
articles[outindex].style.boxShadow = "0 0 6px 1px "+playcolor
} }
else{ else{
//Last song ON END
articles[index].style.filter = "grayscale(80%)" articles[index].style.filter = "grayscale(80%)"
articles[index].style.boxShadow = "0 0 0px 0px "+playcolor articles[index].style.boxShadow = "0 0 0px 0px "+playcolor
articles[index].style.margin = "8px" articles[index].style.margin = "8px"
@ -80,5 +91,4 @@ for (const [index,audio] of audios.entries()){
} }
} }
}) })
} }
console.log(audios)