Finish hash

index.js

@@ -87,7 +87,7 @@ const createVidList = () => {
     var vidElements = '';
 
     videoList.forEach((item, index) => {
-        vidElements += `<div class="media" id="playlistEntry${index}" onclick="changeVid(${index})" style="transition-timing-function:ease-in-out">
+        vidElements += `<div class="media" id="playlistEntry${index}" onclick="changeVid(${index})" style="cursor: pointer; transition-timing-function:ease-in-out">
       <img class="mr-3" src="${item.thumbnail}" alt="thumbnail" height="96">
       <div class="media-body">
         <h5 class="mt-0">${item.name}</h5>
@@ -104,8 +104,8 @@ var hls = null;
 var currentVideoIndex = 0;
 if(window.location.hash) {
     let hash = window.location.hash;
-    if(hash.startsWith('#')) {
-        hash = hash.substring(1);
+    if(hash.startsWith('#playlistEntry')) {
+        hash = hash.substring(14);
     }
     if(videoList[hash]){
         currentVideoIndex = hash;
@@ -113,6 +113,9 @@ if(window.location.hash) {
 }
 
 const changeVid = index => {
+    if (index === currentVideoIndex){
+        return;
+    }
     let oldSelectedVideo = document.querySelector(`#playlistEntry${currentVideoIndex}`);
     oldSelectedVideo.classList.remove("bg-dark");
     oldSelectedVideo.classList.remove("text-light");
@@ -126,7 +129,7 @@ const changeVid = index => {
     titleText.innerHTML = videoList[index].name;
     currentVideoIndex = index;
 
-    window.location.hash = currentVideoIndex;
+    window.location.hash = 'playlistEntry' + currentVideoIndex;
 
     let newSelectedVideo = document.querySelector(`#playlistEntry${currentVideoIndex}`);
     newSelectedVideo.classList.add("bg-dark");