spee.ch/views/show.handlebars

43 lines
1.3 KiB
Handlebars
Raw Normal View History

<div class="wrapper">
{{> topBar}}
<div class="main">
{{> asset}}
</div>
<div class="sidebar">
<h1>{{fileInfo.name}}</h1>
{{> assetLinks}}
{{> assetMetadata}}
</div>
{{> footer}}
</div>
<script src="/socket.io/socket.io.js"></script>
<script type="text/javascript">
var socket = io();
var filePath = document.getElementById('asset-placeholder').dataset.filepath;
console.log(filePath);
if (filePath) {
// send request for the file
socket.emit('asset-request', filePath);
// update the html
document.getElementById('asset-placeholder').innerHTML = '<p>Loading...</p><div id="progress-bar"></div>';
// start a progress animation
createProgressBar(document.getElementById('progress-bar'), 12);
}
// wait for the file to be sent
socket.on('asset-transfer', function(data) {
switch (data.type) {
case 'image/jpeg':
case 'image/gif':
case 'image/png':
const base64Image = 'data:' + data.type + ';base64,' + data.buffer;
document.getElementById("asset-placeholder").innerHTML = '<img class="show-asset" src="' + base64Image + '"/>';
break;
case 'video/mp4':
const base64video = 'data:' + data.type + ';base64,' + data.buffer;
document.getElementById("asset-placeholder").innerHTML = '<video class="show-asset" controls> <source src="' + base64video + '"></video>';
break;
default: break;
}
});
</script>