DMC/multiplayer
13
0
Fork 0
Code Issues1 Pull Requests Releases Wiki Activity

Added a button to copy a link to the current time

Browse Source 
Also self-closed some tags for consistency
This commit is contained in:
Erik Thuning 2022-02-18 14:54:14 +01:00
parent 4c0cd8d887
commit 9091de8a65
2 changed files with 39 additions and 4 deletions

18
index.html

@ -106,6 +106,12 @@
</svg>
</div>
<div id="right-controls" class="control-box">
<button id="timelink-button"
title="Kopiera länk till den här tidpunkten">
<svg>
<use href="#timelink-icon">
</svg>
</button>
<!--
<button id="subtitles-button"
title="Undertexter är av">
@ -213,11 +219,11 @@
</symbol>
<symbol id="volume-icon" viewBox="0 0 24 24">
<path d="M14.016 3.234q3.047 0.656 5.016 3.117t1.969 5.648-1.969 5.648-5.016 3.117v-2.063q2.203-0.656 3.586-2.484t1.383-4.219-1.383-4.219-3.586-2.484v-2.063zM16.5 12q0 2.813-2.484 4.031v-8.063q1.031 0.516 1.758 1.688t0.727 2.344zM3 9h3.984l5.016-5.016v16.031l-5.016-5.016h-3.984v-6z"></path>
<path d="M14.016 3.234q3.047 0.656 5.016 3.117t1.969 5.648-1.969 5.648-5.016 3.117v-2.063q2.203-0.656 3.586-2.484t1.383-4.219-1.383-4.219-3.586-2.484v-2.063zM16.5 12q0 2.813-2.484 4.031v-8.063q1.031 0.516 1.758 1.688t0.727 2.344zM3 9h3.984l5.016-5.016v16.031l-5.016-5.016h-3.984v-6z"/>
</symbol>
<symbol id="mute-icon" viewBox="0 0 24 24">
<path d="M12 3.984v4.219l-2.109-2.109zM4.266 3l16.734 16.734-1.266 1.266-2.063-2.063q-1.547 1.313-3.656 1.828v-2.063q1.172-0.328 2.25-1.172l-4.266-4.266v6.75l-5.016-5.016h-3.984v-6h4.734l-4.734-4.734zM18.984 12q0-2.391-1.383-4.219t-3.586-2.484v-2.063q3.047 0.656 5.016 3.117t1.969 5.648q0 2.203-1.031 4.172l-1.5-1.547q0.516-1.266 0.516-2.625zM16.5 12q0 0.422-0.047 0.609l-2.438-2.438v-2.203q1.031 0.516 1.758 1.688t0.727 2.344z"></path>
<path d="M12 3.984v4.219l-2.109-2.109zM4.266 3l16.734 16.734-1.266 1.266-2.063-2.063q-1.547 1.313-3.656 1.828v-2.063q1.172-0.328 2.25-1.172l-4.266-4.266v6.75l-5.016-5.016h-3.984v-6h4.734l-4.734-4.734zM18.984 12q0-2.391-1.383-4.219t-3.586-2.484v-2.063q3.047 0.656 5.016 3.117t1.969 5.648q0 2.203-1.031 4.172l-1.5-1.547q0.516-1.266 0.516-2.625zM16.5 12q0 0.422-0.047 0.609l-2.438-2.438v-2.203q1.031 0.516 1.758 1.688t0.727 2.344z"/>
</symbol>
<symbol id="down-icon" viewBox="0 0 24 24">
@ -227,17 +233,21 @@
<symbol id="subtitles-off-icon" viewBox="0 0 24 24">
<path d="M20,4H6.83l8,8H19c0.55,0,1,0.45,1,1c0,0.55-0.45,1-1,1h-2.17l4.93,4.93C21.91,18.65,22,18.34,22,18V6C22,4.9,21.1,4,20,4 z"/><path d="M20,20l-6-6l-1.71-1.71L12,12L3.16,3.16c-0.39-0.39-1.02-0.39-1.41,0c-0.39,0.39-0.39,1.02,0,1.41l0.49,0.49 C2.09,5.35,2,5.66,2,6v12c0,1.1,0.9,2,2,2h13.17l2.25,2.25c0.39,0.39,1.02,0.39,1.41,0c0.39-0.39,0.39-1.02,0-1.41L20,20z M8,13 c0,0.55-0.45,1-1,1H5c-0.55,0-1-0.45-1-1c0-0.55,0.45-1,1-1h2C7.55,12,8,12.45,8,13z M14,17c0,0.55-0.45,1-1,1H5 c-0.55,0-1-0.45-1-1c0-0.55,0.45-1,1-1h8c0.08,0,0.14,0.03,0.21,0.04l0.74,0.74C13.97,16.86,14,16.92,14,17z"/>
</symbol>
<symbol id="timelink-icon" viewBox="0 0 24 24">
<path d="M0 0h24v24H0z" fill="none"/><path d="M3.9 12c0-1.71 1.39-3.1 3.1-3.1h4V7H7c-2.76 0-5 2.24-5 5s2.24 5 5 5h4v-1.9H7c-1.71 0-3.1-1.39-3.1-3.1zM8 13h8v-2H8v2zm9-6h-4v1.9h4c1.71 0 3.1 1.39 3.1 3.1s-1.39 3.1-3.1 3.1h-4V17h4c2.76 0 5-2.24 5-5s-2.24-5-5-5z"/>
</symbol>
<symbol id="subtitles-on-icon" viewBox="0 0 24 24">
<path d="M20 4H4c-1.1 0-2 .9-2 2v12c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V6c0-1.1-.9-2-2-2zM5 12h2c.55 0 1 .45 1 1s-.45 1-1 1H5c-.55 0-1-.45-1-1s.45-1 1-1zm8 6H5c-.55 0-1-.45-1-1s.45-1 1-1h8c.55 0 1 .45 1 1s-.45 1-1 1zm6 0h-2c-.55 0-1-.45-1-1s.45-1 1-1h2c.55 0 1 .45 1 1s-.45 1-1 1zm0-4h-8c-.55 0-1-.45-1-1s.45-1 1-1h8c.55 0 1 .45 1 1s-.45 1-1 1z"/>
</symbol>
<symbol id="fullscreen-enter-icon" viewBox="0 0 24 24">
<path d="M14.016 5.016h4.969v4.969h-1.969v-3h-3v-1.969zM17.016 17.016v-3h1.969v4.969h-4.969v-1.969h3zM5.016 9.984v-4.969h4.969v1.969h-3v3h-1.969zM6.984 14.016v3h3v1.969h-4.969v-4.969h1.969z"></path>
<path d="M14.016 5.016h4.969v4.969h-1.969v-3h-3v-1.969zM17.016 17.016v-3h1.969v4.969h-4.969v-1.969h3zM5.016 9.984v-4.969h4.969v1.969h-3v3h-1.969zM6.984 14.016v3h3v1.969h-4.969v-4.969h1.969z"/>
</symbol>
<symbol id="fullscreen-exit-icon" viewBox="0 0 24 24">
<path d="M15.984 8.016h3v1.969h-4.969v-4.969h1.969v3zM14.016 18.984v-4.969h4.969v1.969h-3v3h-1.969zM8.016 8.016v-3h1.969v4.969h-4.969v-1.969h3zM5.016 15.984v-1.969h4.969v4.969h-1.969v-3h-3z"></path>
<path d="M15.984 8.016h3v1.969h-4.969v-4.969h1.969v3zM14.016 18.984v-4.969h4.969v1.969h-3v3h-1.969zM8.016 8.016v-3h1.969v4.969h-4.969v-1.969h3zM5.016 15.984v-1.969h4.969v4.969h-1.969v-3h-3z"/>
</symbol>
</defs>
</svg>

25
player.js

@ -60,6 +60,7 @@ function init() {
setupBlur()
setupSpeed()
setupFullscreen()
setupCopying(mainstream)
setupVolume(mainstream)
setupResSwitching(presentation.sources, defaultres)
setupSwitching(mainstream)
@ -81,6 +82,11 @@ function getArgs() {
'playlist': null,
'hasMore': null,
'timecode': 0}
var shortnames = {'presentation': 'p',
'playlist': 'l',
'hasMore': 'm',
'timecode': 't',
'debug': 'debug'}
get.split('&').forEach(function(arg) {
[name, value] = arg.split('=')
value = decodeURIComponent(value)
@ -112,6 +118,15 @@ function getArgs() {
break
}
})
out.toString = function() {
var result = []
for(key of Object.keys(shortnames)) {
if(this[key]) {
result.push(shortnames[key] + '=' + this[key])
}
}
return result.join('&')
}
if(!out.debug) {
if(out.presentation && !out.presentation.startsWith('/presentation/')) {
out.presentation = '/presentation/' + out.presentation
@ -229,6 +244,16 @@ function setupBuffer(mainstream) {
window.requestAnimationFrame(paintBuffer)
}
function setupCopying(mainstream) {
var copyButton = document.querySelector('#timelink-button')
copyButton.addEventListener('click', function(event) {
var url = window.location.href.split('?')[0]
var args = getArgs()
args.timecode = mainstream.currentTime
navigator.clipboard.writeText(url + '?' + args)
})
}
function setupFullscreen() {
var body = document.querySelector('body')
var icons = document.querySelectorAll('#fullscreen-button > svg > use')