Add box to enter custom video speed

This commit is contained in:
James Taylor 2020-11-30 17:10:11 -08:00
parent b126ce1aa6
commit 1a7ed0a981

View File

@ -166,10 +166,18 @@
grid-row: 4; grid-row: 4;
justify-self:end; justify-self:end;
} }
.video-info > .download-dropdown{ .video-info > .external-player-controls{
grid-column:1 / span 2; justify-self: start;
grid-row: 6; grid-row: 5;
grid-column: 1;
margin-bottom: 8px;
} }
#speed-control{
width: 65px;
text-align: center;
background-color: var(--interface-color);
color: var(--text-color);
}
.video-info > .checkbox{ .video-info > .checkbox{
justify-self:end; justify-self:end;
align-self: start; align-self: start;
@ -177,6 +185,10 @@
grid-row: 5; grid-row: 5;
grid-column: 2; grid-column: 2;
} }
.video-info > .download-dropdown{
grid-column:1 / span 2;
grid-row: 6;
}
.video-info > .description{ .video-info > .description{
background-color:var(--interface-color); background-color:var(--interface-color);
margin-top:8px; margin-top:8px;
@ -422,6 +434,24 @@ Reload without invidious (for usage of new identity button).</a>
<time datetime="$upload_date">Published on {{ time_published }}</time> <time datetime="$upload_date">Published on {{ time_published }}</time>
<span class="likes-dislikes">{{ like_count }} likes {{ dislike_count }} dislikes</span> <span class="likes-dislikes">{{ like_count }} likes {{ dislike_count }} dislikes</span>
<div class="external-player-controls">
<input id="speed-control" type="text">
<script>
var video = document.querySelector('video');
var speedInput = document.querySelector('#speed-control');
speedInput.addEventListener('keyup', (event) => {
if (event.key === 'Enter') {
var speed = parseFloat(speedInput.value);
if(!isNaN(speed)){
video.playbackRate = speed;
}
}
});
</script>
</div>
<input class="checkbox" name="video_info_list" value="{{ video_info }}" form="playlist-edit" type="checkbox">
<details class="download-dropdown"> <details class="download-dropdown">
<summary class="download-dropdown-label">Download</summary> <summary class="download-dropdown-label">Download</summary>
<ul class="download-dropdown-content"> <ul class="download-dropdown-content">
@ -450,7 +480,6 @@ Reload without invidious (for usage of new identity button).</a>
{% endfor %} {% endfor %}
</ul> </ul>
</details> </details>
<input class="checkbox" name="video_info_list" value="{{ video_info }}" form="playlist-edit" type="checkbox">
<span class="description">{{ common_elements.text_runs(description)|escape|urlize|timestamps|safe }}</span> <span class="description">{{ common_elements.text_runs(description)|escape|urlize|timestamps|safe }}</span>