diff --git a/instance/index.js b/instance/index.js index 1df2781b358cf23bd050f719c5447d3763a6b66a..2df10e99135be35590c4d6bcfc6e82e9fb422cb9 100644 --- a/instance/index.js +++ b/instance/index.js @@ -8,6 +8,7 @@ const { ipcRenderer } = require('electron'), /* Global variables */ var countKaraInQueue = 0; var currentSong = 0; +var currentSongElement; var dragCounter = 0; var leavedElement; var isDnDFromDB = false; @@ -353,13 +354,23 @@ ipcRenderer.on('send-song-time-data', (event, timeData) => { }px`; if (timeData.state == 'play' || timeData.state == 'pause') { if (currentSong != timeData.song) { - document.getElementsByClassName('karaQueue')[currentSong].style.background = '#4e5d6c'; - currentSong = timeData.song; - document.getElementsByClassName('karaQueue')[timeData.song].scrollIntoView(true); + document.getElementsByClassName('karaQueue').some((element) => { + if(element.getElementsByClassName('position')[0].innerHTML == timeData.song+1){ + element.style.background = '#6b7d8e'; + if(prevElement) { + prevElement.style.background = '#4e5d6c'; + } + element.scrollIntoView(true); + currentSongElement = element; + return true; + } + prevElement = element; + }); + } - document.getElementsByClassName('karaQueue')[timeData.song].style.background = '#6b7d8e'; - } else if (document.getElementsByClassName('karaQueue')[timeData.song]) { - document.getElementsByClassName('karaQueue')[timeData.song].style.background = '#4e5d6c'; + currentSongElement.style.background = '#6b7d8e'; + } else if (currentSongElement) { + currentSongElement.style.background = '#4e5d6c'; } });