LBRYCommunity/spee.ch
1
0
Fork 0
Code Issues 95 Pull requests 2 Projects Releases 4 Packages Wiki Activity

Support video #74

Merged
bones7242 merged 2 commits from support-video into master 2017-07-09 00:19:38 +02:00
Conversation 0 Commits 2 Files changed 6 +32 -105
6 changed files with 32 additions and 105 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
config/development.json
View file

@ -9,7 +9,7 @@
}, },
"Database": { "Database": {
"MySqlConnectionUri": "none", "MySqlConnectionUri": "none",
"PublishUploadPath": "C:\\lbry\\speech\\hosted_content" "PublishUploadPath": "C:\\lbry\\speech\\hosted_content\\"
}, },
"Logging": { "Logging": {
"LogLevel": "silly", "LogLevel": "silly",

8
routes/api-routes.js
View file

@ -7,7 +7,15 @@ const { createPublishParams, validateFile } = require('../helpers/libraries/publ
const errorHandlers = require('../helpers/libraries/errorHandlers.js'); const errorHandlers = require('../helpers/libraries/errorHandlers.js');
const { postToStats, sendGoogleAnalytics } = require('../controllers/statsController.js'); const { postToStats, sendGoogleAnalytics } = require('../controllers/statsController.js');
const config = require('config');
const hostedContentPath = config.get('Database.PublishUploadPath');
module.exports = app => { module.exports = app => {
// route to run a claim_list request on the daemon
app.get('/api/streamFile/:name', ({ params, headers }, res) => {
const filePath = `${hostedContentPath}${params.name}`;
res.status(200).sendFile(filePath);
});
// route to run a claim_list request on the daemon // route to run a claim_list request on the daemon
app.get('/api/claim_list/:name', ({ headers, ip, originalUrl, params }, res) => { app.get('/api/claim_list/:name', ({ headers, ip, originalUrl, params }, res) => {
// google analytics // google analytics

37
routes/sockets-routes.js
View file

@ -1,5 +1,4 @@
const logger = require('winston'); const logger = require('winston');
const fs = require('fs');
const publishController = require('../controllers/publishController.js'); const publishController = require('../controllers/publishController.js');
const publishHelpers = require('../helpers/libraries/publishHelpers.js'); const publishHelpers = require('../helpers/libraries/publishHelpers.js');
const errorHandlers = require('../helpers/libraries/errorHandlers.js'); const errorHandlers = require('../helpers/libraries/errorHandlers.js');
@ -57,42 +56,6 @@ module.exports = (app, siofu, hostedContentPath) => {
// to-do: remove the file if not done automatically // to-do: remove the file if not done automatically
} }
}); });
// handle asset requests
socket.on('asset-request', filePath => {
logger.debug('received a request for the following file', filePath);
fs.readFile(filePath, (err, assetBuffer) => {
if (err) {
logger.error('fs.readFile error', err);
return;
};
// set the data
const fileExtension = filePath.substring(filePath.lastIndexOf('.'));
let data = {
type : null,
buffer: assetBuffer.toString('base64'),
};
switch (fileExtension) {
case '.jpeg' || '.jpg':
data['type'] = 'image/jpeg';
break;
case '.gif':
data['type'] = 'image/gif';
break;
case '.png':
data['type'] = 'image/png';
break;
case '.mp4':
data['type'] = 'video/mp4';
break;
default:
data['type'] = 'image/jpeg';
logger.warn('showing file with unknown type as jpeg');
break;
}
// send the asset
socket.emit('asset-transfer', data);
});
});
// handle disconnect // handle disconnect
socket.on('disconnect', () => { socket.on('disconnect', () => {
logger.silly('a user disconnected via sockets'); logger.silly('a user disconnected via sockets');

44
views/partials/asset.handlebars
View file

@ -1,35 +1,13 @@
<div class="panel"> <div class="panel">
<div id="asset-placeholder" data-filepath="{{{fileInfo.filePath}}}"> <div id="asset-placeholder" data-filename="{{{fileInfo.fileName}}}">
<p> loading... </p> {{#ifConditional fileInfo.fileType '===' 'video/mp4'}}
<video class="show-asset" autoplay controls>
<source src="/api/streamFile/{{fileInfo.fileName}}">
{{!--fallback--}}
Your browser does not support the <code>video</code> element.
</video>
{{else}}
<img class="show-asset src="/api/streamFile/{{fileInfo.fileName}}" />
{{/ifConditional}}
</div> </div>
</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;
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>

2
views/partials/assetInfo.handlebars
View file

@ -13,7 +13,7 @@
Embed HTML Embed HTML
<br/> <br/>
{{#ifConditional fileInfo.fileType '===' 'video/mp4'}} {{#ifConditional fileInfo.fileType '===' 'video/mp4'}}
<input type="text" id="embed-text" class="link" readonly="true" spellcheck="false" value='&lt;video controls>&lt;source src="https://spee.ch/{{fileInfo.name}}/{{fileInfo.claimId}}" />&lt;/video>'/> <input type="text" id="embed-text" class="link" readonly="true" spellcheck="false" value='&lt;video autoplay controls>&lt;source src="https://spee.ch/{{fileInfo.name}}/{{fileInfo.claimId}}" />&lt;/video>'/>
{{else}} {{else}}
<input type="text" id="embed-text" class="link" readonly="true" spellcheck="false" value='&lt;img src="https://spee.ch/{{fileInfo.name}}/{{fileInfo.claimId}}" />'/> <input type="text" id="embed-text" class="link" readonly="true" spellcheck="false" value='&lt;img src="https://spee.ch/{{fileInfo.name}}/{{fileInfo.claimId}}" />'/>
{{/ifConditional}} {{/ifConditional}}

44
views/showLite.handlebars
View file

@ -1,33 +1,11 @@
<div id="asset-placeholder" data-filepath="{{{fileInfo.filePath}}}"> <div id="asset-placeholder" data-filename="{{{fileInfo.fileName}}}">
<p> loading... </p> {{#ifConditional fileInfo.fileType '===' 'video/mp4'}}
</div> <video class="show-asset-lite" autoplay controls>
<source src="/api/streamFile/{{fileInfo.fileName}}">
<script src="/socket.io/socket.io.js"></script> {{!--fallback--}}
<script type="text/javascript"> Your browser does not support the <code>video</code> element.
var socket = io(); </video>
var filePath = document.getElementById('asset-placeholder').dataset.filepath; {{else}}
if (filePath) { <img class="show-asset-lite" src="/api/streamFile/{{fileInfo.fileName}}" />
// send request for the file {{/ifConditional}}
socket.emit('asset-request', filePath); </div>
// 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-lite" src="' + base64Image + '"/>';
break;
case 'video/mp4':
const base64video = 'data:' + data.type + ';base64,' + data.buffer;
document.getElementById("asset-placeholder").innerHTML = '<video class="show-asset-lite" controls> <source src="' + base64video + '"></video>';
break;
default: break;
}
});
</script>