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

Use existing thumbs for channel content #162

Merged
bones7242 merged 10 commits from use-existing-thumbs into master 2017-09-12 03:04:47 +02:00
Conversation 1 Commits 10 Files changed 13 +85 -104
13 changed files with 85 additions and 104 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

14
config/test.json
View file

@ -1,14 +0,0 @@
{
"WalletConfig": {
"LbryClaimAddress": "none"
},
"AnalyticsConfig":{
"GoogleId": "UA-100747990-1"
},
"Database": {
"MySqlConnectionUri": "none"
},
"Logging": {
"LogLevel": "debug"
}
}

18
controllers/serveController.js
View file

@ -7,6 +7,7 @@ const { postToStats, sendGoogleAnalytics } = require('../controllers/statsContro
const SERVE = 'SERVE';
const SHOW = 'SHOW';
const SHOWLITE = 'SHOWLITE';
const DEFAULT_THUMBNAIL = 'https://spee.ch/assets/img/content-freedom-large.png';
function checkForLocalAssetByClaimId (claimId, name) {
return new Promise((resolve, reject) => {
@ -95,6 +96,13 @@ function getAssetByLongClaimId (fullClaimId, name) {
});
}
function chooseThumbnail (claimInfo, defaultThumbnail) {
if (!claimInfo.thumbnail || claimInfo.thumbnail === '') {
return defaultThumbnail;
}
return claimInfo.thumbnail;
}
module.exports = {
getAssetByClaim (claimName, claimId) {
logger.debug('getting asset by claim');
@ -153,10 +161,11 @@ module.exports = {
.then(allChannelClaims => {
if (allChannelClaims) {
allChannelClaims.forEach(element => {
element['channelName'] = channelName;
element['longChannelId'] = longChannelId;
element['shortChannelId'] = shortChannelId;
element['fileExtension'] = element.contentType.substring(element.contentType.lastIndexOf('/') + 1);
const fileExtenstion = element.contentType.substring(element.contentType.lastIndexOf('/') + 1);
element['showUrlLong'] = `/${channelName}:${longChannelId}/${element.name}`;
element['directUrlLong'] = `/${channelName}:${longChannelId}/${element.name}.${fileExtenstion}`;
element['directUrlShort'] = `/${channelName}:${shortChannelId}/${element.name}.${fileExtenstion}`;
element['thumbnail'] = chooseThumbnail(element, DEFAULT_THUMBNAIL);
});
}
return resolve(allChannelClaims);
@ -192,6 +201,7 @@ module.exports = {
return db.resolveClaim(fileInfo.name, fileInfo.claimId);
})
.then(resolveResult => {
fileInfo['thumbnail'] = chooseThumbnail(resolveResult, DEFAULT_THUMBNAIL);
fileInfo['title'] = resolveResult.title;
fileInfo['description'] = resolveResult.description;
showFile(fileInfo, res);

10
controllers/statsController.js
View file

@ -148,6 +148,16 @@ module.exports = {
// get the raw requests data
db.getTrendingClaims(startDate)
.then(results => {
if (results) {
results.forEach(element => {
const fileExtenstion = element.fileType.substring(element.fileType.lastIndexOf('/') + 1);
element['showUrlLong'] = `/${element.claimId}/${element.name}`;
element['directUrlLong'] = `/${element.claimId}/${element.name}.${fileExtenstion}`;
element['directUrlShort'] = `/${element.claimId}/${element.name}.${fileExtenstion}`;
element['contentType'] = element.fileType;
element['thumbnail'] = 'https://spee.ch/assets/img/content-freedom-large.png';
});
}
resolve(results);
})
.catch(error => {

4
models/index.js
View file

@ -226,7 +226,7 @@ db['getAllFreeClaims'] = (name) => {
db['resolveClaim'] = (name, claimId) => {
return new Promise((resolve, reject) => {
db
.sequelize.query(`SELECT name, claimId, outpoint, height, address, title, description FROM Claim WHERE name = '${name}' AND claimId = '${claimId}'`, { type: db.sequelize.QueryTypes.SELECT })
.sequelize.query(`SELECT name, claimId, outpoint, height, address, title, description, thumbnail FROM Claim WHERE name = '${name}' AND claimId = '${claimId}'`, { type: db.sequelize.QueryTypes.SELECT })
.then(result => {
switch (result.length) {
case 0:
@ -266,7 +266,7 @@ db['getAllChannelClaims'] = (channelId) => {
return new Promise((resolve, reject) => {
logger.debug(`finding all claims in channel "${channelId}"`);
db
.sequelize.query(`SELECT name, claimId, outpoint, height, address, contentType, title, description, license FROM Claim WHERE certificateId = '${channelId}' ORDeR BY height DESC;`, { type: db.sequelize.QueryTypes.SELECT })
.sequelize.query(`SELECT name, claimId, outpoint, height, address, contentType, title, description, license, thumbnail FROM Claim WHERE certificateId = '${channelId}' ORDeR BY height DESC;`, { type: db.sequelize.QueryTypes.SELECT })
.then(result => {
switch (result.length) {
case 0:

33
public/assets/css/componentStyle.css
View file

@ -154,27 +154,50 @@ button.copy-button {
height: 1em;
kauffj commented 2017-09-11 23:39:34 +02:00 (Migrated from github.com)
Review
Copy link

We ought to consider adopting a CSS class naming standard. I'm a fan of BEM http://getbem.com

This is non-blocking, but should probably be done before a large HTML/CSS change (such as the re-design).

We ought to consider adopting a CSS class naming standard. I'm a fan of BEM http://getbem.com This is non-blocking, but should probably be done before a large HTML/CSS change (such as the re-design).
bones7242 commented 2017-09-12 02:46:39 +02:00 (Migrated from github.com)
Review
Copy link

agreed

agreed
}
/* all claims */
.all-claims-item {
/* content lists */
.content-list-card {
margin-top: 2px;
padding-top: 2px;
border-top: 1px lightgrey solid;
overflow: auto;
position: relative;
}
.all-claims-asset {
.content-list-card-link {
position:absolute;
width:100%;
height:100%;
top:0;
left: 0;
z-index: 1;
}
.content-list-asset {
width: 20%;
float: left;
margin: 5px 30px 5px 0px;
}
.all-claims-details {
.content-list-title {
color: black;
font-weight: bold;
}
.content-list-details {
word-wrap: break-word;
}
.content-list-details > ul {
position: relative;
z-index: 2;
list-style: none;
list-style-type: none;
}
.content-list-card:hover {
background-color: #F5F0EF;
}
/* statistics */
.totals-row {
border-top: 1px solid grey;

9
public/vendors/masonry/masonry.pkgd.min.js vendored
View file

File diff suppressed because one or more lines are too long

5
routes/page-routes.js
View file

@ -50,15 +50,14 @@ module.exports = (app) => {
errorHandlers.handleRequestError(error, res);
});
});
// route to display all free public claims at a given name
// route to send embedable video player (for twitter)
app.get('/embed/:claimId/:name', ({ params }, res) => {
const claimId = params.claimId;
const name = params.name;
const dummyParam = '.b';
console.log('claimId ==', claimId);
console.log('name ==', name);
// get and render the content
res.status(200).render('embed', { layout: 'embed', claimId, name, dummyParam });
res.status(200).render('embed', { layout: 'embed', claimId, name });
});
// route to display all free public claims at a given name
kauffj commented 2017-09-11 23:40:57 +02:00 (Migrated from github.com)
Review
Copy link

🥂

:clinking_glasses:
app.get('/:name/all', ({ ip, originalUrl, params }, res) => {

4
speech.js
View file

@ -48,14 +48,14 @@ const hbs = expressHandlebars.create({
</script>`
);
},
addOpenGraph (title, mimeType, showUrl, source, description) {
addOpenGraph (title, mimeType, showUrl, source, description, thumbnail) {
let basicTags = `<meta property="og:title" content="${title}">
<meta property="og:url" content="${showUrl}" >
<meta property="og:site_name" content="Spee.ch" >
<meta property="og:description" content="${description}">`;
if (mimeType === 'video/mp4') {
return new Handlebars.SafeString(
`${basicTags} <meta property="og:image" content="https://spee.ch/assets/img/content-freedom-large.png" >
`${basicTags} <meta property="og:image" content="${thumbnail}" >
<meta property="og:image:type" content="image/png" >
<meta property="og:image:width" content="600" >
<meta property="og:image:height" content="315" >

25
views/channel.handlebars
View file

@ -2,30 +2,9 @@
{{> topBar}}
<div>
<h3>{{this.channelName}}</h3>
<p>Below are all the free claims in this channel.</p>
<p>Below is all the free content in this channel.</p>
{{#each channelContents}}
<div class="all-claims-item">
<a href="/{{this.channelName}}:{{this.shortChannelId}}/{{this.name}}.{{this.fileExtension}}">
{{#ifConditional this.contentType '===' 'video/mp4'}}
<img class="all-claims-asset" src="/assets/img/content-freedom-large.png"/>
{{else}}
<img class="all-claims-asset" src="/{{this.claimId}}/{{this.name}}.{{this.fileExtension}}" />
{{/ifConditional}}
</a>
<div class="all-claims-details">
<ul style="list-style-type:none">
<li><strong>{{this.title}}</strong></li>
<li><i> {{this.description}}</i></li>
<li><a href="/{{this.channelName}}:{{this.shortChannelId}}/{{this.name}}.{{this.fileExtension}}">spee.ch/{{this.channelName}}:{{this.shortChannelId}}/{{this.name}}.{{this.fileExtension}}</a></li>
<li>License: {{this.license}}</li>
<li>
Claim:
<a href="lbry://{{this.name}}">lbry://{{this.name}}</a>
</li>
<li>Claim Id: {{this.claimId}}</li>
</ul>
</div>
</div>
{{> contentListItem}}
{{/each}}
</div>
{{> footer}}

4
views/layouts/show.handlebars
View file

@ -9,8 +9,8 @@
<link rel="stylesheet" href="/assets/css/componentStyle.css" type="text/css">
<meta property="fb:app_id" content="1371961932852223">
{{#unless fileInfo.nsfw}}
{{{addTwitterCard fileInfo.fileType openGraphInfo.source openGraphInfo.embedUrl openGraphInfo.directFileUrl}}}
{{{addOpenGraph fileInfo.title fileInfo.fileType openGraphInfo.showUrl openGraphInfo.source fileInfo.description}}}
{{{addTwitterCard fileInfo.fileType openGraphInfo.source openGraphInfo.embedUrl openGraphInfo.directFileUrl}}}
{{{addOpenGraph fileInfo.title fileInfo.fileType openGraphInfo.showUrl openGraphInfo.source fileInfo.description fileInfo.thumbnail}}}
{{/unless}}
<!-- google analytics -->
{{ googleAnalytics }}

15
views/partials/contentListItem.handlebars Normal file
View file

@ -0,0 +1,15 @@
<div class='content-list-card'>
<a href="{{this.showUrlLong}}"><span class='content-list-card-link'></span></a>
{{#ifConditional this.contentType '===' 'video/mp4'}}
<img class="content-list-asset" src="{{this.thumbnail}}"/>
{{else}}
<img class="content-list-asset" src="{{this.directUrlLong}}" />
{{/ifConditional}}
<div class="content-list-details">
<ul>
<li class="content-list-title">{{this.title}}</li>
<li><a href="{{this.directUrlShort}}">spee.ch{{this.directUrlShort}}</a></li>
</ul>
</div>
</div>

39
views/partials/trendingAssets.handlebars
View file

@ -1,39 +0,0 @@
<script src="/vendors/masonry/masonry.pkgd.min.js"></script>
<div class="full">
<h2>Trending</h2>
<p><i>The 25 most popular assets on spee.ch</i></p>
<div class="grid" data-masonry='{ "itemSelector": ".grid-item" }'>
{{#each trendingAssets}}
<div class="all-claims-item">
<a href="/{{this.claimId}}/{{this.name}}">
{{#ifConditional this.fileType '===' 'video/mp4'}}
<img class="all-claims-asset" src="/assets/img/content-freedom-large.png"/>
{{else}}
<img class="all-claims-asset" src="/{{this.claimId}}/{{this.name}}.ext" />
{{/ifConditional}}
</a>
<div class="all-claims-details">
<ul style="list-style-type:none">
<li><bold>{{this.name}}</bold></li>
<li><i>Claim Id: {{this.claimId}}</i></li>
<li><strong>{{this.title}}</strong></li>
</ul>
</div>
</div>
{{/each}}
</div>
</div>
<script>
var elem = document.querySelector('.grid');
var msnry = new Masonry( elem, {
itemSelector: '.grid-item'
});
function resetTrendingLayout() {
msnry.layout();
}
</script>

9
views/trending.handlebars
View file

@ -1,4 +1,11 @@
<div class="wrapper">
{{> topBar}}
{{> trendingAssets}}
<div>
<h3>Popular</h3>
<p>Below are the 25 most popular items on spee.ch</p>
{{#each trendingAssets}}
{{> contentListItem}}
{{/each}}
</div>
{{> footer}}
</div>