32 lines
No EOL
1 KiB
Handlebars
32 lines
No EOL
1 KiB
Handlebars
<div class="panel">
|
|
<div id="asset-placeholder" data-filepath="{{{filePath}}}">
|
|
<p> video loading... </p>
|
|
</div>
|
|
</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);
|
|
}
|
|
// 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-image" src="' + base64Image + '"/>';
|
|
break;
|
|
case 'video/mp4':
|
|
const base64video = 'data:' + data.type + ';base64,' + data.buffer;
|
|
document.getElementById("asset-placeholder").innerHTML = '<video controls class="show-video"> <source src="' + base64video + '"></video>';
|
|
break;
|
|
default: break;
|
|
}
|
|
});
|
|
</script> |