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

separated client functions into availability and get

Browse source
This commit is contained in:
bill bittner 2017-11-21 15:44:27 -08:00
parent cda9efa800
commit 58cb05d2dc
9 changed files with 102 additions and 141 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

5
helpers/serveHelpers.js
View file

@ -47,9 +47,8 @@ module.exports = {
if (filePath) {
res.status(200).sendFile(filePath, options);
} else {
// 'get' the file
// send the file
res.status(307).redirect(`/api/get/${name}/${claimId}`);
// res.status(307).redirect(`/api/get/${name}/${claimId}`);
res.status(400).json({success: false, message: 'that claim is not hosted locally by Spee<ch yet'});
}
},
showFile (fileInfo, claimInfo, shortId, res) {

29
public/assets/css/general.css
View file

@ -99,6 +99,10 @@ h3, p {
font-size: small;
}
#show-body > .fine-print {
text-align: center;
}
.blue {
color: #4156C5;
}
@ -153,9 +157,7 @@ a, a:visited {
.link--primary, .link--primary:visited {
color: #4156C5;
}
.link--primary.fine-print {
text-align: center;
}
.link--nav {
color: black;
border-bottom: 2px solid white;
@ -513,24 +515,25 @@ table {
/* Show page */
.video-show, .gifv-show, .image-show {
display: block;
width: 100%;
}
#video-player, .showlite-asset {
#video-player {
display: block;
margin: 0 auto;
background-color: #fff;
background-color: #fff;
cursor: pointer;
}
#showlite-body #video-player {
margin-top: 2%;
padding: 6px;
max-width: 50%;
padding: 6px;
max-width: 50%;
border: 1px solid #d0d0d0;
}
.showlite-asset {
max-width: 100%;
.asset {
max-width: 100%;
}
#showlite-body > .asset {
max-width: 50%;
}
/* item lists */

2
public/assets/css/mediaQueries.css
View file

@ -36,7 +36,7 @@
padding-right: 1.5em;
}
.showlite-asset {
#showlite-body > asset {
max-width: 100%;
}

79
routes/api-routes.js
View file

@ -30,57 +30,6 @@ function createFileRecord ({ name, claimId, outpoint, height, address, nsfw, con
};
}
// function getAssetByLongClaimId (fullClaimId, name) {
// logger.debug('...getting asset by claim Id...');
// return new Promise((resolve, reject) => {
// // 1. check locally for claim
// checkForLocalAssetByClaimId(fullClaimId, name)
// .then(dataValues => {
// // if a result was found, return early with the result
// if (dataValues) {
// logger.debug('found a local file for this name and claimId');
// resolve(dataValues);
// return;
// }
// logger.debug('no local file found for this name and claimId');
// // 2. if no local claim, resolve and get the claim
// db.Claim
// .resolveClaim(name, fullClaimId)
// .then(resolveResult => {
// // if no result, return early (claim doesn't exist or isn't free)
// if (!resolveResult) {
// resolve(NO_CLAIM);
// return;
// }
// logger.debug('resolve result >> ', resolveResult.dataValues);
// let fileRecord = {};
// // get the claim
// lbryApi.getClaim(`${name}#${fullClaimId}`)
// .then(getResult => {
// logger.debug('getResult >>', getResult);
// fileRecord = createFileRecord(resolveResult);
// fileRecord = addGetResultsToFileRecord(fileRecord, getResult);
// // insert a record in the File table & Update Claim table
// return db.File.create(fileRecord);
// })
// .then(() => {
// logger.debug('File record successfully updated');
// resolve(fileRecord);
// })
// .catch(error => {
// reject(error);
// });
// })
// .catch(error => {
// reject(error);
// });
// })
// .catch(error => {
// reject(error);
// });
// });
// }
module.exports = (app) => {
// route to run a claim_list request on the daemon
app.get('/api/claim_list/:name', ({ ip, originalUrl, params }, res) => {
@ -93,30 +42,42 @@ module.exports = (app) => {
errorHandlers.handleApiError('claim_list', originalUrl, ip, error, res);
});
});
// route to see if asset is available locally
app.get('/api/local/:name/:claimId', ({ ip, originalUrl, params }, res) => {
const name = params.name;
const claimId = params.claimId;
let isLocalFileAvailable = false;
db.File.findOne({where: {name, claimId}})
.then(result => {
if (result) {
isLocalFileAvailable = true;
}
res.status(200).json({status: 'success', isLocalFileAvailable});
})
.catch(error => {
errorHandlers.handleApiError('get', originalUrl, ip, error, res);
});
});
// route to get an asset
app.get('/api/get/:name/:claimId', ({ ip, originalUrl, params }, res) => {
if (!params.name || !params.claimId) {
res.status(400).json({success: false, message: 'provide a claimId and/or a name'});
}
let fileRecord;
// 1. resolve the claim
// resolve and get the claim
db.Claim.resolveClaim(params.name, params.claimId)
.then(resolveResult => {
if (!resolveResult) {
throw new Error('No matching uri found in Claim table');
}
fileRecord = createFileRecord(resolveResult);
// 2. get the claim
// get the claim
return getClaim(`${params.name}#${params.claimId}`);
})
.then(getResult => {
res.status(200).json({status: 'success', message: getResult});
logger.debug('response was sent to the client');
fileRecord = addGetResultsToFileRecord(fileRecord, getResult);
// 3. insert a record for the claim into the File table
// insert a record for the claim into the File table
return db.File.create(fileRecord);
})
.then(() => {
res.status(200).json({status: 'success', message: 'content was successfully retrieved via lbrynet'});
logger.debug('File record successfully created');
})
.catch(error => {

2
views/layouts/showlite.handlebars
View file

@ -17,7 +17,7 @@
{{ googleAnalytics }}
</head>
<body id="showlite-body">
{{> getAsset}}
{{{ body }}}
<script src="/assets/js/showFunctions.js"></script>
</body>
</html>

105
views/partials/asset.handlebars
View file

@ -1,41 +1,26 @@
{{#ifConditional claimInfo.contentType '===' 'video/mp4'}}
{{#ifConditional claimInfo.fileExt '===' 'gifv'}}
<video class="gifv-show" autoplay loop muted>
<source src="/{{claimInfo.claimId}}/{{claimInfo.name}}.{{claimInfo.fileExt}}">
{{!--fallback--}}
Your browser does not support the <code>video</code> element.
</video>
{{else}}
<video id="video-player" class="video-show video" controls poster="{{claimInfo.thumbnail}}">
<source src="/{{claimInfo.claimId}}/{{claimInfo.name}}.{{claimInfo.fileExt}}">
{{!--fallback--}}
Your browser does not support the <code>video</code> element.
</video>
<script type="text/javascript">
document.addEventListener('DOMContentLoaded', resizeVideoPlayer)
window.addEventListener("resize", resizeVideoPlayer);
function resizeVideoPlayer() {
const div = document.getElementById('video-player');
const width = div.offsetWidth;
div.height = (width * 9 / 16);
}
<div id="asset-display-component">
<p id="search-message" hidden="true">We're currently combing the blockchain for your asset!</p>
<p id="failure-message" hidden="true"></p>
<div id="asset-holder" hidden="true">
{{#ifConditional claimInfo.contentType '===' 'video/mp4'}}
<video id="video-player" controls poster="{{claimInfo.thumbnail}}">
<source id="asset">
<!--fallback-->
Your browser does not support the <code>video</code> element.
</video>
<!--dynamically resize video player-->
<script type="text/javascript">
document.addEventListener('DOMContentLoaded', resizeVideoPlayer)
window.addEventListener("resize", resizeVideoPlayer);
function resizeVideoPlayer() {
const div = document.getElementById('video-player');
const width = div.offsetWidth;
div.height = (width * 9 / 16);
}
</script>
{{/ifConditional}}
{{else}}
<a href="/{{claimInfo.claimId}}/{{claimInfo.name}}.{{claimInfo.fileExt}}">
<img class="image-show" src="/{{claimInfo.claimId}}/{{claimInfo.name}}.{{claimInfo.fileExt}}" />
</a>
{{/ifConditional}}
<div id="asset-holder">
<div id="search-message" hidden="true">
<p>We're currently combing the blockchain for your asset!</p>
</div>
<div id="failure-message" hidden="true">
<p>Hmmm, looks like no peers have your content. How anti-social!</p>
</div>
<div id="asset" hidden="true">
{{else}}
<img id="asset" class="asset" />
{{/ifConditional}}
</div>
</div>
@ -44,9 +29,16 @@
const getAssetFunctions = {
showAsset: function () {
const searchMessage = document.getElementById('search-message');
const assetHolder = document.getElementById('asset-holder');
const asset = document.getElementById('asset');
searchMessage.hidden = true;
asset.hidden = false;
assetHolder.hidden = false;
asset.setAttribute('src', `/{{claimInfo.claimId}}/{{claimInfo.name}}.{{claimInfo.fileExt}}`);
},
showSearchMessage: function (msg) {
console.log(msg);
const searchMessage = document.getElementById('search-message');
searchMessage.hidden = false;
},
showFailureMessage: function (msg) {
console.log(msg);
@ -54,26 +46,49 @@
const failureMessage = document.getElementById('failure-message');
searchMessage.hidden = true;
failureMessage.hidden = false;
failureMessage.innerText(msg);
},
displayAsset: function(contentType, source) {
checkClaimAvailability: function (claimName, claimId) {
console.log(`getting ${claimName}#${claimId}}`)
var uri = `/api/get/${claimName}/${claimId}`;
var xhr = new XMLHttpRequest();
var that = this;
xhr.open("GET", uri, true);
xhr.onreadystatechange = function() {
if (xhr.readyState == 4) {
const response = JSON.parse(xhr.response);
if (xhr.status == 200 && response.message === false) {
that.showSearchMessage();
that.getAsset(claimName, claimId)
} else {
console.log('get failed:', response);
that.showFailureMessage('Well this sucks, but we can\'t seem to phone home');
}
} else {
console.log('xhr.readyState', xhr.readyState);
}
};
// Initiate a multipart/form-data upload
xhr.send();
},
getAsset: function(claimName, claimId) {
console.log(`getting ${claimName}#${claimId}}`)
var uri = `/api/get/${claimName}/${claimId}`;
var xhr = new XMLHttpRequest();
var that = this;
xhr.open("GET", uri, true);
xhr.onreadystatechange = function() {
if (xhr.readyState == 4) {
const response = JSON.parse(xhr.response);
if (xhr.status == 200) {
console.log('get returned successfully', xhr.response);
this.showAsset();
console.log('get returned successfully', response);
that.showAsset();
} else {
console.log('get failed:', xhr.response);
console.log('get failed:', response);
that.showFailureMessage('Hmmm, looks like no peers have your content. How anti-social!');
}
} else {
console.log('xhr.readyState', xhr.readyState);
this.showFailureMessage(xhr.readyState.message);
}
};
// Initiate a multipart/form-data upload
@ -81,4 +96,6 @@
},
}
getAssetFunctions.checkClaimAvailability('{{claimInfo.name}}', '{{claimInfo.claimId}}');
</script>

17
views/show-local.handlebars
View file

@ -1,17 +0,0 @@
<div class="row row--tall row--padded">
<div class="column column--10">
<!-- title -->
<span class="text--large">{{claimInfo.title}}</span>
</div>
<div class="column column--5 column--sml-10 align-content-top">
<!-- asset -->
<div class="row row--padded">
{{> asset}}
</div>
</div><div class="column column--5 column--sml-10 align-content-top">
<!-- details -->
<div class="row row--padded">
{{> assetInfo}}
</div>
</div>
</div>

2
views/showLite-local.handlebars
View file

@ -1,2 +0,0 @@
{{> asset }}
<a class="link--primary fine-print" href="/{{claimInfo.claimId}}/{{claimInfo.name}}">hosted via spee&lt;h</a>

2
views/showLite.handlebars
View file

@ -1,2 +1,2 @@
{{> asset }}
<a class="link--primary fine-print" href="/{{claimInfo.claimId}}/{{claimInfo.name}}">hosted via spee&lt;h</a>
<a class="link--primary fine-print" href="/{{claimInfo.claimId}}/{{claimInfo.name}}">hosted via Spee&lt;h</a>