From 7b899af6a811e3a883415c8622e4c3d153fb7a80 Mon Sep 17 00:00:00 2001
From: Pierre Dubouilh <pldubouilh@gmail.com>
Date: Sat, 4 Mar 2023 16:02:29 +0100
Subject: [PATCH] download icon on video page

closes #90
---
 ui/script.js |  4 ++++
 ui/style.css | 15 +++++++++++++++
 ui/ui.tmpl   |  5 ++++-
 3 files changed, 23 insertions(+), 1 deletion(-)

diff --git a/ui/script.js b/ui/script.js
index 845288e..4c71f52 100755
--- a/ui/script.js
+++ b/ui/script.js
@@ -599,6 +599,10 @@ function videosOff () {
   return true
 }
 
+window.videodl = function() {
+  dl(getASelected())
+}
+
 // help
 const isHelpMode = () => help.style.display === 'block'
 
diff --git a/ui/style.css b/ui/style.css
index 9e2f9e7..823853e 100644
--- a/ui/style.css
+++ b/ui/style.css
@@ -358,6 +358,16 @@ h1 > span:hover {
   font-size: 1em !important;
 }
 
+#video-dl {
+  position: fixed;
+  right: 8px;
+  top: 80px;
+  width: 65px;
+  height: 65px;
+  cursor: pointer;
+  z-index: 101;
+}
+
 .icon-large-folder {
   background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgBAMAAACBVGfHAAAABGdBTUEAALGPC/xhBQAAACBjSFJNAAB6JgAAgIQAAPoAAACA6AAAdTAAAOpgAAA6mAAAF3CculE8AAAAJFBMVEUAAACZmQAICAj4+Pj//5nMzGb/+/AAAAD/zJkzMwAAAP////+gebovAAAAAXRSTlMAQObYZgAAAAFiS0dECx/XxMAAAAAHdElNRQfiBhgXAy5jJ3EAAAAA1klEQVQoz42RMQ7CMBAEQ0mZIIp0/AGecJFO7kC2FKXmATxikaxUtPS48Ss5XxwnoWI7j3f3fHJV/aFa1KzOuwsRdacFHCjpthjuChbL0U261ipJnDd65IokJhCaGTCzEOZ25SAwaAUgASoOyFFzxWEsEkQGz2BskFJfHMMwWB07AVAXg/QwZscYPzHqXAVicDE4eJ47QOOoHexzhINxQRxIEVkC6I217OGLg9DLIn7qkHHEWiAvEwAdJyQlNKK3gKfcITuxZjzrO+qt2mr/3uj1z1//6AsSG3mwAQQN9wAAACV0RVh0ZGF0ZTpjcmVhdGUAMjAxOC0wNi0yNFQyMzowMzo0Ni0wNDowMFfZ8nYAAAAldEVYdGRhdGU6bW9kaWZ5ADIwMTgtMDYtMjRUMjM6MDM6NDYtMDQ6MDAmhErKAAAAAElFTkSuQmCC");
 }
@@ -432,3 +442,8 @@ h1 > span:hover {
 .icon-zip, .icon-tar, .icon-gz, .icon-bz2, .icon-rar, .icon-7z {
   background-image: url("data:image/svg+xml;base64,PHN2ZyBoZWlnaHQ9IjE2cHQiIHZpZXdCb3g9IjAgMCAxNiAxNiIgd2lkdGg9IjE2cHQiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiPjxsaW5lYXJHcmFkaWVudCBpZD0iYSIgZ3JhZGllbnRVbml0cz0idXNlclNwYWNlT25Vc2UiIHgxPSI3LjkzNzUiIHgyPSI3LjkzNzUiIHkxPSIxNC4wMTY4NzUiIHkyPSIxNC42NzgzNDM3NSI+PHN0b3Agb2Zmc2V0PSIwIiBzdG9wLW9wYWNpdHk9Ii4yNzUiLz48c3RvcCBvZmZzZXQ9IjEiIHN0b3Atb3BhY2l0eT0iMCIvPjwvbGluZWFyR3JhZGllbnQ+PGxpbmVhckdyYWRpZW50IGlkPSJiIj48c3RvcCBvZmZzZXQ9IjAiIHN0b3Atb3BhY2l0eT0iLjMxNCIvPjxzdG9wIG9mZnNldD0iLjIyMiIgc3RvcC1vcGFjaXR5PSIuMjc1Ii8+PHN0b3Agb2Zmc2V0PSIxIiBzdG9wLW9wYWNpdHk9IjAiLz48L2xpbmVhckdyYWRpZW50PjxyYWRpYWxHcmFkaWVudCBpZD0iYyIgY3g9IjQ1MC45MDkiIGN5PSIxODkuNTc5IiBncmFkaWVudFRyYW5zZm9ybT0ibWF0cml4KDAgLS4wMzkwNyAtLjA3MDMyIDAgMjUuMDczIDMxLjc5OCkiIGdyYWRpZW50VW5pdHM9InVzZXJTcGFjZU9uVXNlIiByPSIyMS4xNjciIHhsaW5rOmhyZWY9IiNiIi8+PHJhZGlhbEdyYWRpZW50IGlkPSJkIiBjeD0iNDUwLjkwOSIgY3k9IjE4OS41NzkiIGdyYWRpZW50VHJhbnNmb3JtPSJtYXRyaXgoMCAuMDM5MDcgLjA3MDMyIDAgLTkuMTk3IC0zLjc2NCkiIGdyYWRpZW50VW5pdHM9InVzZXJTcGFjZU9uVXNlIiByPSIyMS4xNjciIHhsaW5rOmhyZWY9IiNiIi8+PHJhZGlhbEdyYWRpZW50IGlkPSJlIiBjeD0iNDUwLjkwOSIgY3k9IjE4OS41NzkiIGdyYWRpZW50VHJhbnNmb3JtPSJtYXRyaXgoMCAtLjAzOTA3IC4wNzAzMiAwIC05LjE5NyAzMS43OTgpIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgcj0iMjEuMTY3IiB4bGluazpocmVmPSIjYiIvPjxyYWRpYWxHcmFkaWVudCBpZD0iZiIgY3g9IjQ1MC45MDkiIGN5PSIxODkuNTc5IiBncmFkaWVudFRyYW5zZm9ybT0ibWF0cml4KDAgLjAzOTA3IC0uMDcwMzIgMCAyNS4wNzMgLTMuNzY0KSIgZ3JhZGllbnRVbml0cz0idXNlclNwYWNlT25Vc2UiIHI9IjIxLjE2NyIgeGxpbms6aHJlZj0iI2IiLz48bGluZWFyR3JhZGllbnQgaWQ9ImciIGdyYWRpZW50VHJhbnNmb3JtPSJtYXRyaXgoLjAzNzY3IDAgMCAuMTA4NyAtMi45MjcgMTYuODIpIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjMwNi45MTciIHgyPSIzMDUuOTU1IiB5MT0iLTI1Ljc5MiIgeTI9Ii0xNDEuNDE1Ij48c3RvcCBvZmZzZXQ9IjAiIHN0b3AtY29sb3I9IiNmZmNjODAiLz48c3RvcCBvZmZzZXQ9IjEiIHN0b3AtY29sb3I9IiNmZmUwYjIiLz48L2xpbmVhckdyYWRpZW50PjxsaW5lYXJHcmFkaWVudCBpZD0iaCI+PHN0b3Agb2Zmc2V0PSIwIiBzdG9wLWNvbG9yPSIjZmZhNzI2Ii8+PHN0b3Agb2Zmc2V0PSIxIiBzdG9wLWNvbG9yPSIjZmZiNzRkIi8+PC9saW5lYXJHcmFkaWVudD48bGluZWFyR3JhZGllbnQgaWQ9ImkiIGdyYWRpZW50VHJhbnNmb3JtPSJtYXRyaXgoNC41NTYxNCAwIDAgMTMuMTQ2MTggLTM1My45NzMgMjAzNC4xOCkiIGdyYWRpZW50VW5pdHM9InVzZXJTcGFjZU9uVXNlIiB4MT0iMTY1LjQ4NSIgeDI9IjE2NS40ODUiIHhsaW5rOmhyZWY9IiNoIiB5MT0iLTI1Ljc5MiIgeTI9Ii0xNDEuNDE1Ii8+PGxpbmVhckdyYWRpZW50IGlkPSJqIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9Ijc2MCIgeDI9Ijc2MCIgeGxpbms6aHJlZj0iI2giIHkxPSIxNjk1LjExNyIgeTI9IjE3NS4xMTciLz48cGF0aCBkPSJtMy45NjkgMTQuMDE2aDcuOTM3di42NjRoLTcuOTM2em0wIDAiIGZpbGw9InVybCgjYSkiLz48cGF0aCBkPSJtMTEuOTA2IDE0LjAxNmgxLjMyNHYtLjY2aC0xLjMyNHptMCAwIiBmaWxsPSJ1cmwoI2MpIi8+PHBhdGggZD0ibTMuOTY5IDE0LjAxNmgtMS4zMjR2LjY2NGgxLjMyNHptMCAwIiBmaWxsPSJ1cmwoI2QpIi8+PHBhdGggZD0ibTMuOTY5IDE0LjAxNmgtMS4zMjR2LS42NmgxLjMyNHptMCAwIiBmaWxsPSJ1cmwoI2UpIi8+PHBhdGggZD0ibTExLjkwNiAxNC4wMTZoMS4zMjR2LjY2NGgtMS4zMjR6bTAgMCIgZmlsbD0idXJsKCNmKSIvPjxwYXRoIGQ9Im0zLjMwOSAxLjQ1aDkuMjYxYy4zNjQgMCAuNjYuMjk2LjY2LjY2djExLjI0NWEuNjYuNjYgMCAwIDEgLS42Ni42NmgtOS4yNmEuNjYuNjYgMCAwIDEgLS42NjQtLjY2di0xMS4yNDVjMC0uMzYzLjI5Ni0uNjYuNjY0LS42NnptMCAwIiBmaWxsPSJ1cmwoI2cpIi8+PHBhdGggZD0ibTQwMC4xMiAxNzUuMjU5Yy00NC40MDYgMC04MC4zMDggMzUuNDMtODAuMzA4IDc5LjgzNXYxMzYwLjAyNmMwIDQ0LjQwNiAzNS45MDIgNzkuODM1IDgwLjMwNyA3OS44MzVoMTE5Ljk4OXYtMTUxOS42OTV6bTAgMCIgZmlsbD0idXJsKCNpKSIgc3Ryb2tlPSIjMjEyMTIxIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS13aWR0aD0iMTEuMzM5IiB0cmFuc2Zvcm09Im1hdHJpeCguMDA4MjY5MDIgLjAwMDEyNzMgLS4wMDAxMjczIC4wMDgyNjkwMiAwIDApIi8+PHBhdGggZD0ibTMuMzA5IDEzLjk4YS42NjQuNjY0IDAgMCAxIC0uNjY0LS42NjR2LS4wODJjMCAuMzY4LjI5Ni42NjQuNjY0LjY2NGg5LjI2MWMuMzY0IDAgLjY2LS4yOTYuNjYtLjY2NHYuMDgyYS42NjMuNjYzIDAgMCAxIC0uNjYuNjY0em0wIDAiIGZpbGwtb3BhY2l0eT0iLjE5NiIvPjxwYXRoIGQ9Im02NzkuNzc4IDE3NS4yNTl2OTU5LjkwOGM1OS45OTQtMTYwLjE0MiAxMDAuMTQ4LTE2MC4xNDIgMTYwLjE0MiAwdi05NTkuOTA3em0wIDAiIGZpbGw9InVybCgjaikiIHN0cm9rZT0iIzIxMjEyMSIgc3Ryb2tlLWxpbmVjYXA9InJvdW5kIiBzdHJva2UtbGluZWpvaW49InJvdW5kIiBzdHJva2Utd2lkdGg9IjExLjMzOSIgdHJhbnNmb3JtPSJtYXRyaXgoLjAwODI2OTAyIC4wMDAxMjczIC0uMDAwMTI3MyAuMDA4MjY5MDIgMCAwKSIvPjxwYXRoIGQ9Im0zLjMwOSAxLjQ4NGEuNjY0LjY2NCAwIDAgMCAtLjY2NC42NjR2LjA4MmMwLS4zNjcuMjk2LS42NjQuNjY0LS42NjRoOS4yNjFjLjM2NCAwIC42Ni4yOTcuNjYuNjY0di0uMDgyYS42NjMuNjYzIDAgMCAwIC0uNjYtLjY2NHptMCAwIiBmaWxsPSIjZmZmIiBmaWxsLW9wYWNpdHk9Ii4zOTIiLz48cGF0aCBkPSJtMy4zMDkgMS40MDJhLjcwOC43MDggMCAwIDAgLS43MTEuNzA3djExLjI0NmMwIC4zOTEuMzE2LjcwNy43MS43MDdoOS4yNjJjLjM5IDAgLjcwNy0uMzE2LjcwNy0uNzA3di0xMS4yNDVhLjcwNy43MDcgMCAwIDAgLS43MDctLjcwN3ptMCAuMDk0aDkuMjYxYy4zNCAwIC42MTQuMjc0LjYxNC42MTN2MTEuMjQ2YzAgLjM0LS4yNzQuNjE0LS42MTQuNjE0aC05LjI2YS42MTMuNjEzIDAgMCAxIC0uNjE4LS42MTR2LTExLjI0NWMwLS4zNC4yNzQtLjYxMy42MTgtLjYxM3ptMCAwIiBmaWxsPSIjMjEyMTIxIi8+PC9zdmc+");
 }
+
+.icon-dl {
+  background-image: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz48IS0tIFVwbG9hZGVkIHRvOiBTVkcgUmVwbywgd3d3LnN2Z3JlcG8uY29tLCBHZW5lcmF0b3I6IFNWRyBSZXBvIE1peGVyIFRvb2xzIC0tPg0KPHN2ZyB3aWR0aD0iODAwcHgiIGhlaWdodD0iODAwcHgiIHZpZXdCb3g9IjAgMCAyNCAyNCIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4NCjxwYXRoIGQ9Ik0yMCAxNVYxOEMyMCAxOS4xMDQ2IDE5LjEwNDYgMjAgMTggMjBINkM0Ljg5NTQzIDIwIDQgMTkuMTA0NiA0IDE4TDQgMTVNOCAxMUwxMiAxNU0xMiAxNUwxNiAxMU0xMiAxNVYzIiBzdHJva2U9IiNmZmYiIHN0cm9rZS13aWR0aD0iMS41IiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiLz4NCjwvc3ZnPg==");
+}
+
diff --git a/ui/ui.tmpl b/ui/ui.tmpl
index 5c49873..55eb499 100644
--- a/ui/ui.tmpl
+++ b/ui/ui.tmpl
@@ -54,7 +54,10 @@
     </div>
 
     <div id="pics" style="display:none;"> <img draggable="false" onclick="window.picsNav()" id="picsHolder" /></div>
-    <div id="video" style="display:none;"> <video controls id="videoHolder"></video></div>
+    <div id="video" style="display:none;">
+        <div onclick="window.videodl()" class="icon-dl" id="video-dl"></div>
+        <video controls id="videoHolder"> </video>
+    </div>
 
     <table id="linkTable">
     {{range .RowsFolders}}