add support go to top window

assets/css/index.css

@@ -421,3 +421,20 @@ body::-webkit-scrollbar-thumb {
 	background-color: rgb(79, 78, 78);
 	border-radius: 5px;
 }
+
+#goToTop {
+	display: none;
+	position: fixed;
+	bottom: 10px;
+	right: 10px;
+	z-index: 99;
+	border: none;
+	outline: none;
+	background-image: url(../images/up-arrow.png);
+	background-size: contain;
+	width: 40px;
+	height: 40px;
+	cursor: pointer;
+	color: white;
+	cursor: pointer;
+}  

html/index.html

@@ -149,6 +149,8 @@
     <div id="list">
     </div>
 
+    <div id="goToTop"></div> 
+
     <script>
         require("../src/translate_index")
     </script>

html/playlist.html

@@ -85,6 +85,8 @@
     <h2 id="playlistName"></h2>
     <div id="list">
     </div>
+
+    <div id="goToTop"></div>
 </body>
 
 </html>

src/common.js

@@ -98,3 +98,21 @@ function advancedToggle() {
 		advancedHidden = true;
 	}
 }
+
+// Check scroll go to top
+
+window.onscroll = function() {scrollFunction()};
+
+function scrollFunction() {
+  if (document.body.scrollTop > 50 || document.documentElement.scrollTop > 50) {
+    getId("goToTop").style.display = "block";
+  } else {
+    getId("goToTop").style.display = "none";
+  }
+}
+
+// Function to scroll go to top
+
+getId("goToTop").addEventListener("click", () => {
+	window.scrollTo({top: 0, behavior: 'smooth'});
+});

src/renderer.js

@@ -846,6 +846,8 @@ function afterSave(location, filename, progressId) {
 	).innerHTML = `<b onClick="showItem(\`${finalLocation}\`, \`${finalFilename}\`)">${i18n.__(
 		"File saved. Click to Open"
 	)}</b>`;
+
+	window.scrollTo(0, document.body.scrollHeight);
 }
 
 function showItem(location, filename) {