update to submodule
parent
e357c1515b
commit
c24994c009
@ -0,0 +1,3 @@
|
||||
[submodule "layouts/shortcodes"]
|
||||
path = layouts/shortcodes
|
||||
url = ssh://forge/gabriel/shortcodes.git
|
||||
@ -0,0 +1 @@
|
||||
Subproject commit 55ba1d977dea3aa73c84353be0856d2910d639eb
|
||||
@ -1,188 +0,0 @@
|
||||
<style>
|
||||
.audio-player {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
justify-content:center;
|
||||
width: 100%;
|
||||
}
|
||||
.audio-player>*{
|
||||
height:fit-content;
|
||||
padding:0.25rem;
|
||||
}
|
||||
.audio-player p{
|
||||
width: fit-content;
|
||||
}
|
||||
|
||||
.media-seek {
|
||||
width: 100%;
|
||||
}
|
||||
.audio-player{
|
||||
border: 0.15rem solid var(--theme-accent);
|
||||
padding:0.5rem;
|
||||
border-radius: 0.5rem;
|
||||
color:var(--theme-accent);
|
||||
flex-wrap: nowrap;
|
||||
}
|
||||
.audio-player>*{
|
||||
margin:5px;
|
||||
}
|
||||
|
||||
.audio-player select, .audio-player button{
|
||||
background-color: transparent;
|
||||
border-color: var(--theme-accent);
|
||||
color:var(--theme-accent);
|
||||
border-radius: 3px;
|
||||
padding:0.5rem;
|
||||
}
|
||||
|
||||
.icon svg{
|
||||
width:2.25rem;
|
||||
height:2.25rem;
|
||||
z-index: -1;
|
||||
background-color: transparent;
|
||||
pointer-events: none;
|
||||
}
|
||||
.icon path,
|
||||
.icon rect {
|
||||
stroke: var(--theme-accent);
|
||||
fill: var(--theme-accent);
|
||||
}
|
||||
|
||||
.icon svg circle {
|
||||
stroke: var(--theme-accent);
|
||||
fill: transparent;
|
||||
stroke-width: 6;
|
||||
}
|
||||
@keyframes spin-icon {
|
||||
0%{rotate:0;}
|
||||
100%{rotate:360deg;}
|
||||
}
|
||||
.spin{
|
||||
animation:spin-icon 3s linear infinite;
|
||||
}
|
||||
</style>
|
||||
<div class="media-container">
|
||||
<div class="audio-player">
|
||||
<audio onended="audio_end(event)" onloadedmetadata="setup_audio_metadata(event)" ontimeupdate="setup_audio_metadata(event)">
|
||||
<source src='{{.Site.BaseURL}}{{.Get "src" }}'>
|
||||
</audio>
|
||||
<div class="icon" onclick="toggle_play_audio(event)">
|
||||
<svg viewBox="0 0 120 120"><circle style="opacity:0.99;fill-opacity:0;stroke-width:6.4;stroke-dasharray:none;stroke-opacity:1" id="path2040" cx="60.062084" cy="62.077591" r="52.403164" /><path style="opacity:0.99;fill-opacity:1; stroke-width:4;stroke-dasharray:none;stroke-opacity:1" d="m 36.961917,29.902848 c 3.596357,-1.826163 63.333473,26.918008 63.449063,32.530093 0.1386,6.729203 -61.229407,35.615675 -63.254766,33.796117 -1.971501,-1.557746 -3.672784,-64.52183 -0.194297,-66.32621 z" id="path1060"> </svg>
|
||||
</div>
|
||||
<input class="media-seek" type="range" onchange="update_audio_time(event)" value="0">
|
||||
<select onchange="update_audio_speed(event)">
|
||||
<option value="1" selected>1x</option>
|
||||
<option value="1.5">1.5x</option>
|
||||
<option value="2">2x</option>
|
||||
<option value="2.5">2.5x</option>
|
||||
<option value="3">3x</option>
|
||||
</select>
|
||||
<div class="audio-preview">
|
||||
</div>
|
||||
<p><span class="audio-currentTime"></span><span class="audio-duration"></span></p>
|
||||
<div class="icon" onclick="toggle_loop_audio(event)">
|
||||
<svg viewBox="0 0 120 120" version="1.1"> <circle style="opacity:0.99;fill-opacity:0;stroke-width:6.4;stroke-dasharray:none;stroke-opacity:1" id="path2040" cx="60.062084" cy="62.077591" r="52.403164" /> <path style="opacity:0.99;fill-opacity:1;stroke-width:1.1;stroke-linecap:butt;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1" d="M 49.086093,104.69797 53.85938,96.982017 C -0.70319734,64.562086 46.019709,40.176232 48.130402,38.442953 c 0,0 4.487934,4.354976 5.546329,5.309403 1.84557,1.664276 5.129158,-20.199369 5.129158,-20.199369 l -22.368136,0.483004 5.548034,5.713299 c 0,0 -56.905236,37.386495 7.100306,74.94868 z" id="path4435" /> <path style="opacity:0.99;fill-opacity:1;stroke-width:1.1;stroke-linecap:butt;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1" d="m 72.493272,21.303543 -4.773287,7.715948 c 54.562575,32.419931 7.839671,56.805785 5.728978,58.539064 0,0 -4.487934,-4.354976 -5.546329,-5.309403 -1.845568,-1.664276 -5.129158,20.199368 -5.129158,20.199368 l 22.368136,-0.483 -5.548034,-5.713302 c 0,0 56.905242,-37.386495 -7.100306,-74.948675 z" id="path4435-7" /></svg>
|
||||
</div>
|
||||
<script src="/js/icons.js"></script>
|
||||
<script>
|
||||
function audio_end(event){
|
||||
p = event.target.parentElement;
|
||||
if (!event.target.loop){
|
||||
p.children[1].innerHTML=icons['play'];
|
||||
}
|
||||
}
|
||||
function setup_audio_metadata(event) {
|
||||
audio = event.target;
|
||||
var seek = audio.parentElement.children[2];
|
||||
seek.min = 0;
|
||||
seek.max = audio.duration;
|
||||
seek.value = audio.currentTime;
|
||||
audio.parentElement.children[5].children[0].innerHTML = "" + timeToText(audio.currentTime) + "/";
|
||||
audio.parentElement.children[5].children[1].innerHTML = "" + timeToText(audio.duration);
|
||||
}
|
||||
function toggle_loop_audio(event) {
|
||||
audio = event.target.parentElement.children[0];
|
||||
audio.loop = !audio.loop;
|
||||
if (audio.loop){
|
||||
event.target.children[0].classList.add("spin");
|
||||
}
|
||||
else{
|
||||
event.target.children[0].classList.remove("spin");
|
||||
}
|
||||
}
|
||||
function update_audio_time(event) {
|
||||
audio = event.target.parentElement.children[0];
|
||||
audio.currentTime = event.target.value;
|
||||
}
|
||||
function toggle_play_audio(event) {
|
||||
el = event.target;
|
||||
audio = el.parentElement.children[0];
|
||||
speed = el.parentElement.children[3].value;
|
||||
audio.playbackRate = speed;
|
||||
if (audio.paused) {
|
||||
audio.play();
|
||||
el.innerHTML = icons['pause'];
|
||||
}
|
||||
else {
|
||||
audio.pause();
|
||||
el.innerHTML = icons['play'];
|
||||
}
|
||||
}
|
||||
function update_audio_speed(event) {
|
||||
el = event.target;
|
||||
audio = event.target.parentElement.children[0];
|
||||
audio.playbackRate = el.value;
|
||||
|
||||
}
|
||||
function timeToText(t) {
|
||||
hours = 0;
|
||||
minutes = 0;
|
||||
seconds = 0;
|
||||
if (t > 60 * 60) {
|
||||
hours = Math.floor(t / 60 / 60);
|
||||
t = t - hours * 60 * 60;
|
||||
}
|
||||
if (t > 60) {
|
||||
minutes = Math.floor(t / 60);
|
||||
t = t - minutes * 60
|
||||
|
||||
}
|
||||
if (t > 1) {
|
||||
seconds = Math.floor(t);
|
||||
}
|
||||
text = "";
|
||||
if (hours > 0) {
|
||||
text += hours + ":";
|
||||
}
|
||||
if (minutes > 0 || hours > 0) {
|
||||
if (minutes == 0) {
|
||||
minutes = "00"
|
||||
}
|
||||
if (minutes < 10) {
|
||||
text += "0"
|
||||
}
|
||||
text += minutes + ":"
|
||||
}
|
||||
if (seconds == 0 && (minutes > 0 || hours > 0)) {
|
||||
seconds = "00";
|
||||
}
|
||||
if (seconds < 10) {
|
||||
text += "0";
|
||||
}
|
||||
text += seconds
|
||||
return text;
|
||||
}
|
||||
</script>
|
||||
</div>
|
||||
<noscript>
|
||||
<style>
|
||||
.audio-player {
|
||||
display: none;
|
||||
}
|
||||
</style>
|
||||
<audio controls preload="false">
|
||||
<source src='{{.Site.BaseURL}}{{.Get "src" }}'>
|
||||
</audio>
|
||||
</noscript>
|
||||
</div>
|
||||
@ -1,2 +0,0 @@
|
||||
<iframe src='{{.Get "src" }}'>
|
||||
</iframe>
|
||||
@ -1 +0,0 @@
|
||||
</div>
|
||||
@ -1 +0,0 @@
|
||||
<div class="gallery">
|
||||
@ -1,11 +0,0 @@
|
||||
{{ if .Get "href"}}
|
||||
<a href='{{.Get "href"}}'>
|
||||
{{end}}
|
||||
<video autoplay muted loop preload="true" class="gif">
|
||||
{{if .Get 0}}<source src='{{.Site.BaseURL}}{{.Get 0 }}'>{{end}}
|
||||
{{if .Get "src"}}<source src='{{.Site.BaseURL}}{{.Get "src" }}'>{{end}}
|
||||
</video>
|
||||
{{ if .Get "href"}}
|
||||
</a>
|
||||
{{end}}
|
||||
|
||||
@ -1,23 +0,0 @@
|
||||
<div class="image-container">
|
||||
{{ if .Get "href"}}
|
||||
<a href='{{.Get "href"}}'>
|
||||
{{end}}
|
||||
<img loading="lazy"
|
||||
src='{{.Get "src"}}'
|
||||
{{if .Get "alt"}}
|
||||
alt='{{.Get "alt"}}'
|
||||
{{end}}
|
||||
{{if .Get "float"}}
|
||||
style='float:{{.Get "float"}}'
|
||||
{{end}}>
|
||||
{{ if .Get "href"}}
|
||||
</a>
|
||||
{{end}}
|
||||
{{if .Get "caption"}}
|
||||
<p class="caption">
|
||||
{{.Get "caption"}} {{if .Get "source"}}<a href='{{.Get "source"}}'>Source</a>{{end}}
|
||||
|
||||
</p>
|
||||
{{end}}
|
||||
|
||||
</div>
|
||||
@ -1,9 +0,0 @@
|
||||
<a href="{{ .Get 0 }}" class="link-preview">
|
||||
{{if .Get 3}}
|
||||
<img src='{{.Get 3}}'>
|
||||
{{end}}
|
||||
<div>
|
||||
<h3>{{ .Get 1 }}</h3>
|
||||
<p>{{.Get 2 }}</p>
|
||||
</div>
|
||||
</a>
|
||||
@ -1 +0,0 @@
|
||||
<embed type="application/pdf"{{if .Get 0 }} src="{{.Get 0}}" {{else}} {{if .Get "src" }} src='{{.Get "src"}}' {{end}}{{end}}>
|
||||
@ -1,44 +0,0 @@
|
||||
# Shortcodes
|
||||
|
||||
My hugo shortcodes for all my themes
|
||||
|
||||
|
||||
## Themes
|
||||
- [Freedom](https://code.gabe.rocks/gabriel/freedom)
|
||||
- [Valor](https://code.gabe.rocks/gabriel/valor)
|
||||
|
||||
|
||||
### Audio
|
||||
|
||||
Embeds an audio player for an audio source
|
||||
|
||||
### Embed
|
||||
|
||||
Embeds an URL
|
||||
|
||||
### Gallery-(start/end)
|
||||
Starts and closes a `div` element with the class `gallery`
|
||||
|
||||
### gif
|
||||
|
||||
A muted video with autoplay and no controls
|
||||
|
||||
### image
|
||||
|
||||
An image, optionally includes links and captions
|
||||
|
||||
### link-preview
|
||||
|
||||
A fancy preview for links
|
||||
|
||||
### pdf
|
||||
Embeds a pdf
|
||||
|
||||
### recent-items
|
||||
|
||||
### relevant-items
|
||||
|
||||
### video
|
||||
|
||||
A video player with controls
|
||||
|
||||
@ -1,5 +0,0 @@
|
||||
<div class="gallery">
|
||||
{{range first 3 .Site.RegularPages}}
|
||||
{{partial "item" .}}
|
||||
{{end}}
|
||||
</div>
|
||||
@ -1,7 +0,0 @@
|
||||
|
||||
<div class="gallery">
|
||||
{{ $tag := .Get 0 }}
|
||||
{{range .Site.RegularPages.RelatedTo (keyVals "tags" $tag) }}
|
||||
{{partial "item" .}}
|
||||
{{end}}
|
||||
</div>
|
||||
@ -1,34 +0,0 @@
|
||||
<style>
|
||||
body{
|
||||
background-color: black;
|
||||
}
|
||||
header,footer{
|
||||
display:none;
|
||||
}
|
||||
#main{
|
||||
position: absolute;
|
||||
top:0;
|
||||
left: 0;
|
||||
width:100vw;
|
||||
height: 100vh;
|
||||
max-height: 100vh;
|
||||
max-width: initial;
|
||||
}
|
||||
</style>
|
||||
<video controls id="main" class="video-player">
|
||||
<source src="">
|
||||
</video>
|
||||
|
||||
<script>
|
||||
//https://davidwalsh.name/query-string-javascript
|
||||
function getUrlParameter(name) {
|
||||
name = name.replace(/[\[]/, '\\[').replace(/[\]]/, '\\]');
|
||||
var regex = new RegExp('[\\?&]' + name + '=([^&#]*)');
|
||||
var results = regex.exec(location.search);
|
||||
return results === null ? '' : decodeURIComponent(results[1].replace(/\+/g, ' '));
|
||||
};
|
||||
|
||||
var source = document.createElement('source')
|
||||
source.src = ''+getUrlParameter('v');
|
||||
document.getElementById('main').appendChild(source);
|
||||
</script>
|
||||
@ -1,221 +0,0 @@
|
||||
<style>
|
||||
.video-player {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.video-controls {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
width: 100%;
|
||||
height: fit-content;
|
||||
flex-wrap: nowrap;
|
||||
}
|
||||
|
||||
.video-controls p {
|
||||
width: min-content;
|
||||
}
|
||||
|
||||
.media-seek {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.video-controls>* {
|
||||
margin: 5px;
|
||||
}
|
||||
|
||||
.video-controls select,
|
||||
.video-controls button {
|
||||
background-color: transparent;
|
||||
border-color: var(--theme-accent);
|
||||
color: var(--theme-accent);
|
||||
border-radius: 3px;
|
||||
padding: 0.5rem;
|
||||
}
|
||||
|
||||
.icon svg {
|
||||
width: 2.25rem;
|
||||
height: fit-content;
|
||||
z-index: -1;
|
||||
background-color: transparent;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.icon path,
|
||||
.icon rect {
|
||||
stroke: var(--theme-accent);
|
||||
fill: var(--theme-accent);
|
||||
}
|
||||
|
||||
.icon svg circle {
|
||||
stroke: var(--theme-accent);
|
||||
fill: transparent;
|
||||
stroke-width: 6;
|
||||
}
|
||||
.video-player:fullscreen{
|
||||
height:100vh;
|
||||
width:100vw;
|
||||
}
|
||||
.video-player:fullscreen video{
|
||||
max-height: 100vh;
|
||||
height:100%;
|
||||
max-width: 100vw;
|
||||
width: 100vw;
|
||||
}
|
||||
</style>
|
||||
<script src="/js/icons.js"></script>
|
||||
<div class="video-container">
|
||||
<div class="video-player">
|
||||
<video preload="metadata" onclick="playthis(event)" onloadedmetadata="setup_video_metadata(event)"
|
||||
ontimeupdate="setup_video_metadata(event)">
|
||||
<source src='{{.Site.BaseURL}}{{.Get "src" }}'>
|
||||
</video>
|
||||
<div class="video-controls">
|
||||
<div onclick="toggle_video_play(event)" class="icon">
|
||||
<svg viewBox="0 0 120 120"><circle style="opacity:0.99;fill-opacity:0;stroke-width:6.4;stroke-dasharray:none;stroke-opacity:1" id="path2040" cx="60.062084" cy="62.077591" r="52.403164" /><path style="opacity:0.99;fill-opacity:1; stroke-width:4;stroke-dasharray:none;stroke-opacity:1" d="m 36.961917,29.902848 c 3.596357,-1.826163 63.333473,26.918008 63.449063,32.530093 0.1386,6.729203 -61.229407,35.615675 -63.254766,33.796117 -1.971501,-1.557746 -3.672784,-64.52183 -0.194297,-66.32621 z" id="path1060"> </svg>
|
||||
</div>
|
||||
</button>
|
||||
<input class="media-seek" type="range" onchange="update_video_time(event)" value="0">
|
||||
<select onchange="update_video_speed(event)">
|
||||
<option value="1" selected>1x</option>
|
||||
<option value="1.5">1.5x</option>
|
||||
<option value="2">2x</option>
|
||||
<option value="2.5">2.5x</option>
|
||||
<option value="3">3x</option>
|
||||
</select>
|
||||
<p><span class="audio-currentTime"></span><span class="audio-duration"></span></p>
|
||||
<div class="icon" onclick="fullscreen(event)">
|
||||
<svg viewBox="0 0 120 120">
|
||||
<path
|
||||
style="opacity:0.99;fill-opacity:1;stroke-width:2.58928;stroke-linecap:butt;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1"
|
||||
d="M 46.964564,56.005523 29.64354,38.443145 15.744327,51.812481 15.624368,16.779513 l 36.623948,0.03226 -13.177737,14.17536 16.622539,16.392689 z"
|
||||
id="path8948-3"/>
|
||||
<path
|
||||
style="opacity:0.99;fill-opacity:1;stroke-width:2.58928;stroke-linecap:butt;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1"
|
||||
d="M 55.129887,73.388205 38.422614,90.210417 51.067135,104.89922 16.395468,104.33333 16.434945,67.605641 30.111493,81.28219 46.504182,64.659651 Z"
|
||||
id="path8948-3-5"/>
|
||||
<path
|
||||
style="opacity:0.99;fill-opacity:1;stroke-width:2.58928;stroke-linecap:butt;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1"
|
||||
d="M 63.363444,46.935211 80.997081,30.825588 67.627745,17.036604 102.68744,17.447746 102.62846,52.646518 88.168059,39.041226 71.989147,55.663767 Z"
|
||||
id="path8948-3-6"/>
|
||||
<path
|
||||
style="opacity:0.99;fill-opacity:1;stroke-width:2.58928;stroke-linecap:butt;stroke-linejoin:round;stroke-dasharray:none;stroke-opacity:1"
|
||||
d="M 71.956318,65.743071 91.343851,82.735377 104.06395,70.648701 103.79532,105.13832 69.166628,105.79193 82.579575,93.184265 63.227764,74.368773 Z"
|
||||
id="path8948-3-5-2"/>
|
||||
</svg>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
<script>
|
||||
function setup_video_metadata(event) {
|
||||
video = event.target;
|
||||
var seek = video.parentElement.children[1].children[1];
|
||||
seek.min = 0;
|
||||
seek.max = video.duration;
|
||||
seek.value = video.currentTime;
|
||||
details = video.parentElement.children[1].children[3].children;
|
||||
details[0].innerHTML = timeToText(video.currentTime) + "/";
|
||||
details[1].innerHTML = timeToText(video.duration);
|
||||
|
||||
}
|
||||
function playthis(event) {
|
||||
if (event.target.paused) {
|
||||
event.target.playbackRate = video.parentElement.children[1].children[2].value;
|
||||
event.target.play();
|
||||
video.parentElement.children[1].children[0].innerHTML = icons['pause'];
|
||||
}
|
||||
else {
|
||||
event.target.pause();
|
||||
video.parentElement.children[1].children[0].innerHTML = icons['play'];
|
||||
}
|
||||
}
|
||||
function fullscreen(event) {
|
||||
video = event.target.parentElement.parentElement;
|
||||
if (document.fullscreenElement) {
|
||||
document.exitFullscreen();
|
||||
event.target.innerHTML = icons['expand'];
|
||||
}
|
||||
else {
|
||||
video.requestFullscreen();
|
||||
event.target.innerHTML = icons['shrink'];
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
function toggle_video_play(event) {
|
||||
video = event.target.parentElement.parentElement.children[0];
|
||||
if (video.paused) {
|
||||
video.playbackRate = video.parentElement.children[1].children[2].value;
|
||||
video.play();
|
||||
video.parentElement.children[1].children[0].innerHTML = icons['pause'];
|
||||
}
|
||||
else {
|
||||
video.pause();
|
||||
video.parentElement.children[1].children[0].innerHTML = icons['play'];
|
||||
}
|
||||
}
|
||||
function update_video_speed(event) {
|
||||
video = event.target.parentElement.parentElement.children[0];
|
||||
video.playbackRate = event.target.value;
|
||||
}
|
||||
function update_video_time(event) {
|
||||
video = event.target.parentElement.parentElement.children[0];
|
||||
video.currentTime = event.target.value;
|
||||
}
|
||||
|
||||
function timeToText(t) {
|
||||
hours = 0;
|
||||
minutes = 0;
|
||||
seconds = 0;
|
||||
if (t > 60 * 60) {
|
||||
hours = Math.floor(t / 60 / 60);
|
||||
t = t - hours * 60 * 60;
|
||||
}
|
||||
if (t > 60) {
|
||||
minutes = Math.floor(t / 60);
|
||||
t = t - minutes * 60
|
||||
|
||||
}
|
||||
if (t > 1) {
|
||||
seconds = Math.floor(t);
|
||||
}
|
||||
text = "";
|
||||
if (hours > 0) {
|
||||
text += hours + ":";
|
||||
}
|
||||
if (minutes > 0 || hours > 0) {
|
||||
if (minutes == 0) {
|
||||
minutes = "00"
|
||||
}
|
||||
if (minutes < 10) {
|
||||
text += "0"
|
||||
}
|
||||
text += minutes + ":"
|
||||
}
|
||||
if (seconds == 0 && (minutes > 0 || hours > 0)) {
|
||||
seconds = "00";
|
||||
}
|
||||
if (seconds < 10) {
|
||||
text += "0";
|
||||
}
|
||||
text += seconds
|
||||
return text;
|
||||
}
|
||||
</script>
|
||||
</div>
|
||||
<noscript>
|
||||
<style>
|
||||
.video-player {
|
||||
display: none;
|
||||
}
|
||||
</style>
|
||||
<video controls preload="false">
|
||||
<source src='{{.Site.BaseURL}}{{.Get "src" }}'>
|
||||
</video>
|
||||
</noscript>
|
||||
|
||||
<p class="caption">{{.Get "caption"}} {{if .Get "source"}}<a href='{{.Get "source"}}'>Source</a>{{end}}
|
||||
</p>
|
||||
</div>
|
||||
@ -1,46 +0,0 @@
|
||||
<style>
|
||||
#wtmedia{
|
||||
width:100%;
|
||||
}
|
||||
#wtmedia video{
|
||||
width:100%;
|
||||
}
|
||||
</style>
|
||||
<script src="/webtorrent.js"></script>
|
||||
<div class="webtorrent">
|
||||
<noscript>
|
||||
<video controls>
|
||||
<source src={{.Get "source"}}>
|
||||
</video>
|
||||
</noscript>
|
||||
<div id="wtmedia">
|
||||
</div>
|
||||
<div>
|
||||
<span id="torrent-info">Waiting for peers.</span>
|
||||
<span id="torrent-peers"></span>
|
||||
<span id="torrent-progress"></span>
|
||||
</div>
|
||||
</div>
|
||||
<script>
|
||||
function updateData(torrent) {
|
||||
if (torrent.numPeers > 0) {
|
||||
document.getElementById('torrent-info').innerHTML="This video is being served with webtorrent";
|
||||
document.getElementById('torrent-peers').innerHTML="Peers:"+torrent.numPeers;
|
||||
}
|
||||
}
|
||||
const client = new WebTorrent();
|
||||
const magnetURI = "{{.Get "magnet"}}";
|
||||
torrent = client.add(magnetURI, function (torrent) {
|
||||
// Got torrent metadata!
|
||||
torrent.addWebSeed("{{.Get "source"}}");
|
||||
console.log("Torrent Peers: "+torrent.numPeers);
|
||||
console.log('Client is downloading:', torrent.infoHash);
|
||||
torrent.files.forEach(function (file) {
|
||||
// Display the file by appending it to the DOM. Supports video, audio, images, and
|
||||
// more. Specify a container element (CSS selector or reference to DOM node).
|
||||
file.appendTo('#wtmedia');
|
||||
})
|
||||
|
||||
});
|
||||
window.setInterval(updateData,250,torrent);
|
||||
</script>
|
||||
Loading…
Reference in New Issue