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

Merge pull request #147 from lbryio/gifv

Browse source 
added basic support for showing .mp4 as .givf
This commit is contained in:
Bill Bittner 2017-08-18 17:12:46 -07:00 committed by GitHub
commit 667f1d55d7
4 changed files with 51 additions and 24 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

14
routes/serve-routes.js
View file

@ -26,9 +26,13 @@ function getAsset (claimType, channelName, shortId, fullClaimId, name) {
} }
} }
function serveOrShowAsset (fileInfo, method, headers, originalUrl, ip, res) { function serveOrShowAsset (fileInfo, extension, method, headers, originalUrl, ip, res) {
// add file extension to the file info // add file extension to the file info
fileInfo['fileExt'] = fileInfo.fileName.substring(fileInfo.fileName.lastIndexOf('.')); if (extension === '.gifv') {
fileInfo['fileExt'] = '.gifv';
} else {
fileInfo['fileExt'] = fileInfo.fileName.substring(fileInfo.fileName.lastIndexOf('.'));
}
// serve or show // serve or show
switch (method) { switch (method) {
case SERVE: case SERVE:
@ -106,7 +110,7 @@ module.exports = (app) => {
name = identifier; name = identifier;
identifier = tempName; identifier = tempName;
} }
/* end */ /* end patch */
logger.debug('claim name =', name); logger.debug('claim name =', name);
logger.debug('method =', method); logger.debug('method =', method);
// parse identifier for whether it is a channel, short url, or claim_id // parse identifier for whether it is a channel, short url, or claim_id
@ -134,7 +138,7 @@ module.exports = (app) => {
if (!fileInfo) { if (!fileInfo) {
res.status(200).render('noClaims'); res.status(200).render('noClaims');
} else { } else {
return serveOrShowAsset(fileInfo, method, headers, originalUrl, ip, res); return serveOrShowAsset(fileInfo, extension, method, headers, originalUrl, ip, res);
} }
}) })
// 3. update the file // 3. update the file
@ -174,7 +178,7 @@ module.exports = (app) => {
if (!fileInfo) { if (!fileInfo) {
res.status(200).render('noClaims'); res.status(200).render('noClaims');
} else { } else {
return serveOrShowAsset(fileInfo, method, headers, originalUrl, ip, res); return serveOrShowAsset(fileInfo, null, method, headers, originalUrl, ip, res);
} }
}) })
// 3. update the database // 3. update the database

18
views/partials/asset.handlebars
View file

@ -2,11 +2,19 @@
<div id="asset-placeholder"> <div id="asset-placeholder">
<a href="/{{fileInfo.claimId}}/{{fileInfo.name}}{{fileInfo.fileExt}}"> <a href="/{{fileInfo.claimId}}/{{fileInfo.name}}{{fileInfo.fileExt}}">
{{#ifConditional fileInfo.fileType '===' 'video/mp4'}} {{#ifConditional fileInfo.fileType '===' 'video/mp4'}}
<video class="show-asset" autoplay loop controls> {{#ifConditional fileInfo.fileExt '===' '.gifv'}}
<source src="/media/{{fileInfo.fileName}}"> <video class="show-asset" autoplay loop muted>
{{!--fallback--}} <source src="/media/{{fileInfo.fileName}}">
Your browser does not support the <code>video</code> element. {{!--fallback--}}
</video> Your browser does not support the <code>video</code> element.
</video>
{{else}}
<video class="show-asset" autoplay controls>
<source src="/media/{{fileInfo.fileName}}">
{{!--fallback--}}
Your browser does not support the <code>video</code> element.
</video>
{{/ifConditional}}
{{else}} {{else}}
<img class="show-asset" src="/media/{{fileInfo.fileName}}" /> <img class="show-asset" src="/media/{{fileInfo.fileName}}" />
{{/ifConditional}} {{/ifConditional}}

24
views/partials/assetInfo.handlebars
View file

@ -4,23 +4,30 @@
</div> </div>
<div class="panel links"> <div class="panel links">
<h2 class="subheader">Links</h2> <h2 class="subheader">Links</h2>
{{!--short direct link to asset--}}
<div class="share-option">
<a href="/{{fileInfo.shortId}}/{{fileInfo.name}}{{fileInfo.fileExt}}">Permanent Short Link</a> (most convenient)
<div class="input-error" id="input-error-copy-short-link" hidden="true"></div>
<br/>
<input type="text" id="short-link" class="link" readonly spellcheck="false" value="https://spee.ch/{{fileInfo.shortId}}/{{fileInfo.name}}{{fileInfo.fileExt}}" onclick="select()"/>
<button class="copy-button" data-elementtocopy="short-link" onclick="copyToClipboard(event)">copy</button>
</div>
{{!-- link to show route for asset--}} {{!-- link to show route for asset--}}
<div class="share-option"> <div class="share-option">
<a href="/{{fileInfo.claimId}}/{{fileInfo.name}}{{fileInfo.fileExt}}">Permanent Long Link</a> <a href="/{{fileInfo.claimId}}/{{fileInfo.name}}{{fileInfo.fileExt}}">Permanent Long Link</a> (fastest service)
(fastest service)
<div class="input-error" id="input-error-copy-long-link" hidden="true"></div> <div class="input-error" id="input-error-copy-long-link" hidden="true"></div>
</br> </br>
<input type="text" id="long-link" class="link" readonly onclick="select()" spellcheck="false" value="https://spee.ch/{{fileInfo.claimId}}/{{fileInfo.name}}{{fileInfo.fileExt}}"/> <input type="text" id="long-link" class="link" readonly onclick="select()" spellcheck="false" value="https://spee.ch/{{fileInfo.claimId}}/{{fileInfo.name}}{{fileInfo.fileExt}}"/>
<button class="copy-button" data-elementtocopy="long-link" onclick="copyToClipboard(event)">copy</button> <button class="copy-button" data-elementtocopy="long-link" onclick="copyToClipboard(event)">copy</button>
</div> </div>
{{!--short direct link to asset--}} {{!-- gif v link --}}
{{#ifConditional fileInfo.fileType '===' 'video/mp4'}}
<div class="share-option"> <div class="share-option">
<a href="/{{fileInfo.shortId}}/{{fileInfo.name}}{{fileInfo.fileExt}}">Permanent Short Link</a> <a href="/{{fileInfo.shortId}}/{{fileInfo.name}}.gifv">gifv</a>
(most convenient) <div class="input-error" id="input-error-copy-gifv-text" hidden="true"></div>
<div class="input-error" id="input-error-copy-short-link" hidden="true"></div>
<br/> <br/>
<input type="text" id="short-link" class="link" readonly spellcheck="false" value="https://spee.ch/{{fileInfo.shortId}}/{{fileInfo.name}}{{fileInfo.fileExt}}" onclick="select()"/> <input type="text" id="gifv-text" class="link" readonly onclick="select()" spellcheck="false" value='https://spee.ch/{{fileInfo.shortId}}/{{fileInfo.name}}.gifv'/>
<button class="copy-button" data-elementtocopy="short-link" onclick="copyToClipboard(event)">copy</button> <button class="copy-button" data-elementtocopy="gifv-text" onclick="copyToClipboard(event)">copy</button>
</div> </div>
{{!-- html text for embedding asset--}} {{!-- html text for embedding asset--}}
<div class="share-option"> <div class="share-option">
@ -34,6 +41,7 @@
{{/ifConditional}} {{/ifConditional}}
<button class="copy-button" data-elementtocopy="embed-text" onclick="copyToClipboard(event)">copy</button> <button class="copy-button" data-elementtocopy="embed-text" onclick="copyToClipboard(event)">copy</button>
</div> </div>
{{/ifConditional}}
{{!--markdown text using asset--}} {{!--markdown text using asset--}}
{{#ifConditional fileInfo.fileType '===' 'video/mp4'}} {{#ifConditional fileInfo.fileType '===' 'video/mp4'}}
{{else}} {{else}}

19
views/showLite.handlebars
View file

@ -1,12 +1,19 @@
<div id="asset-placeholder"> <div id="asset-placeholder">
<a href="/{{fileInfo.claimId}}/{{fileInfo.name}}"> <a href="/{{fileInfo.claimId}}/{{fileInfo.name}}">
{{#ifConditional fileInfo.fileType '===' 'video/mp4'}} {{#ifConditional fileInfo.fileType '===' 'video/mp4'}}
<video class="show-asset-lite" autoplay loop controls> {{#ifConditional fileInfo.fileExt '===' '.gifv'}}
<source src="/media/{{fileInfo.fileName}}"> <video class="show-asset-light" autoplay loop muted>
{{!--fallback--}} <source src="/media/{{fileInfo.fileName}}">
Your browser does not support the <code>video</code> element. {{!--fallback--}}
</video> Your browser does not support the <code>video</code> element.
</video>
{{else}}
<video class="show-asset-light" autoplay controls>
<source src="/media/{{fileInfo.fileName}}">
{{!--fallback--}}
Your browser does not support the <code>video</code> element.
</video>
{{/ifConditional}}
{{else}} {{else}}
<img class="show-asset-lite" src="/media/{{fileInfo.fileName}}" alt="{{fileInfo.fileName}}"/> <img class="show-asset-lite" src="/media/{{fileInfo.fileName}}" alt="{{fileInfo.fileName}}"/>
{{/ifConditional}} {{/ifConditional}}