Move player options into initialization

src/invidious/views/embed.ecr

@@ -130,12 +130,11 @@ var player = videojs('player', options, function() {
         }
     }
   });
-});
 
-player.share(shareOptions);
+  this.share(shareOptions);
 
-<%- if video_start > 0 || video_end > 0 -%>
+  <% if video_start > 0 || video_end > 0 %>
-player.markers({
+  this.markers({
       onMarkerReached: function(marker) {
           if (marker.text === 'End') {
               if (player.loop()) {
@@ -147,28 +146,29 @@ player.markers({
       },
       markers: [
           {time: <%= video_start %>, text: 'Start'},
-        <%- if video_end < 0 -%>
+          <% if video_end < 0 %>
           {time: <%= video.info["length_seconds"].to_f - 0.5 %>, text: 'End'}
-        <%- else -%>
+          <% else %>
           {time: <%= video_end %>, text: 'End'}
-        <%- end -%>
+          <% end %>
       ]
-});
+  });
 
-player.currentTime(<%= video_start %>);
+  this.currentTime(<%= video_start %>);
-<%- end -%>
+  <% end %>
 
-<%- if !listen -%>
+  <% if !listen %>
-var currentSources = player.currentSources();
+  var currentSources = player.currentSources();
-for ( var i = 0; i < currentSources.length; i++ ) {
+  for ( var i = 0; i < currentSources.length; i++ ) {
       if (player.canPlayType(currentSources[i]['type'].split(';')[0]) === '') {
           currentSources.splice(i);
           i--;
       }
-}
+  }
   
-player.src(currentSources);
+  player.src(currentSources);
-<%- end -%>
+  <% end %>
+});
 </script>
 </body>
 

src/invidious/views/watch.ecr

@@ -40,7 +40,7 @@
 
 <div class="h-box">
     <video style="width:100%" playsinline poster="<%= thumbnail %>" title="<%= HTML.escape(video.title) %>" 
-        id="player" class="video-js" data-setup="{}" 
+        id="player" class="video-js"
         <% if autoplay %>autoplay<% end %>
         <% if video_loop %>loop<% end %>
         controls>
@@ -138,17 +138,11 @@ var player = videojs('player', options, function() {
         }
     }
   });
-});
-
-player.share(shareOptions);
 
-<% if preferences %>
+  this.share(shareOptions);
-player.volume(<%= preferences.volume.to_f / 100 %>);
-player.playbackRate(<%= preferences.speed %>);
-<% end %>
 
-<% if video_start > 0 || video_end > 0 %>
+  <% if video_start > 0 || video_end > 0 %>
-player.markers({
+  this.markers({
       onMarkerReached: function(marker) {
           if (marker.text === 'End') {
               if (player.loop()) {
@@ -166,22 +160,28 @@ player.markers({
           {time: <%= video_end %>, text: 'End'}
           <% end %>
       ]
-});
+  });
 
-player.currentTime(<%= video_start %>);
+  this.currentTime(<%= video_start %>);
-<% end %>
+  <% end %>
 
-<% if !listen %>
+  <% if !listen %>
-var currentSources = player.currentSources();
+  var currentSources = player.currentSources();
-for ( var i = 0; i < currentSources.length; i++ ) {
+  for ( var i = 0; i < currentSources.length; i++ ) {
       if (player.canPlayType(currentSources[i]['type'].split(';')[0]) === '') {
           currentSources.splice(i);
           i--;
       }
-}
+  }
   
-player.src(currentSources);
+  player.src(currentSources);
-<% end %>
+  <% end %>
+ 
+  <% if preferences %>
+  this.volume(<%= preferences.volume.to_f / 100 %>);
+  this.playbackRate(<%= preferences.speed %>);
+  <% end %>
+});
 
 function toggle(target) {
   body = target.parentNode.parentNode.children[1];