Add title listen button time updates (#5625)

When switching between Listen and Watching the timestamp in the url of
the listen of watch button is now updated automatically.

This means if you switch between listening and viewing you keep in sync
with time.

assets/js/player.js

@@ -166,6 +166,12 @@ player.on('timeupdate', function () {
         let base_url_iv_other = elem_iv_other.getAttribute('data-base-url');
         elem_iv_other.href = addCurrentTimeToURL(base_url_iv_other, domain);
     }
+
+    let elem_iv_listen = document.getElementById('link-iv-listen');
+    if (elem_iv_listen) {
+        let base_url_iv_listen = elem_iv_listen.getAttribute('data-base-url');
+        elem_iv_listen.href = addCurrentTimeToURL(base_url_iv_listen, domain);
+    }
 });
 
 

src/invidious/views/watch.ecr

@@ -79,11 +79,11 @@ we're going to need to do it here in order to allow for translations.
     <h1>
         <%= title %>
         <% if params.listen %>
-            <a title="<%=translate(locale, "Video mode")%>" href="/watch?<%= env.params.query %>&listen=0">
+            <a title="<%=translate(locale, "Video mode")%>" id="link-iv-listen" data-base-url="/watch?<%= env.params.query %>&listen=0" href="/watch?<%= env.params.query %>&listen=0">
                 <i class="icon ion-ios-videocam"></i>
             </a>
         <% else %>
-            <a title="<%=translate(locale, "Audio mode")%>" href="/watch?<%= env.params.query %>&listen=1">
+            <a title="<%=translate(locale, "Audio mode")%>" id="link-iv-listen" data-base-url="/watch?<%= env.params.query %>&listen=1" href="/watch?<%= env.params.query %>&listen=1">
                 <i class="icon ion-md-headset"></i>
             </a>
         <% end %>