Merge pull request #303 from lbryio/281-unfurl-show-links

281 unfurl show links
This commit is contained in:
Bill Bittner 2017-12-15 08:01:22 -08:00 committed by GitHub
commit d281e0fb72
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
16 changed files with 123 additions and 98 deletions

View file

@ -22,4 +22,13 @@ module.exports = {
files: {
uploadDirectory: null, // enter file path to where uploads/publishes should be stored
},
site: {
name: 'Spee.ch',
host: 'https://spee.ch',
},
publishing: {
defaultTitle : 'Spee.ch',
defaultThumbnail : 'https://spee.ch/assets/img/video_thumb_default.png',
defaultDescription: 'Open-source, decentralized image and video sharing.',
},
};

View file

@ -21,7 +21,7 @@ module.exports = {
} else {
message = error.response;
}
// check for spee.ch thrown errors
// check for thrown errors
} else if (error.message) {
status = 400;
message = error.message;

View file

@ -1,13 +1,13 @@
const Handlebars = require('handlebars');
const config = require('../config/speechConfig.js');
const { site, analytics } = require('../config/speechConfig.js');
module.exports = {
placeCommonHeaderTags () {
const headerBoilerplate = `<meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1, user-scalable=no"><meta http-equiv="X-UA-Compatible" content="ie=edge"><title>Spee.ch</title><link rel="stylesheet" href="/assets/css/reset.css" type="text/css"><link rel="stylesheet" href="/assets/css/general.css" type="text/css"><link rel="stylesheet" href="/assets/css/mediaQueries.css" type="text/css">`;
const headerBoilerplate = `<meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1, user-scalable=no"><meta http-equiv="X-UA-Compatible" content="ie=edge"><title>${site.title}</title><link rel="stylesheet" href="/assets/css/reset.css" type="text/css"><link rel="stylesheet" href="/assets/css/general.css" type="text/css"><link rel="stylesheet" href="/assets/css/mediaQueries.css" type="text/css">`;
return new Handlebars.SafeString(headerBoilerplate);
},
googleAnalytics () {
const googleApiKey = config.analytics.googleId;
const googleApiKey = analytics.googleId;
const gaCode = `<script>(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
@ -17,27 +17,27 @@ module.exports = {
return new Handlebars.SafeString(gaCode);
},
addOpenGraph ({ ogTitle, contentType, ogDescription, thumbnail, showUrl, source, ogThumbnailContentType }) {
const ogTitleTag = `<meta property="og:title" content="${ogTitle}" >`;
const ogUrlTag = `<meta property="og:url" content="${showUrl}" >`;
const ogSiteNameTag = `<meta property="og:site_name" content="Spee.ch" >`;
const ogDescriptionTag = `<meta property="og:description" content="${ogDescription}" >`;
const ogImageWidthTag = '<meta property="og:image:width" content="600" >';
const ogImageHeightTag = '<meta property="og:image:height" content="315" >';
const ogTitleTag = `<meta property="og:title" content="${ogTitle}" />`;
const ogUrlTag = `<meta property="og:url" content="${showUrl}" />`;
const ogSiteNameTag = `<meta property="og:site_name" content="${site.title}" />`;
const ogDescriptionTag = `<meta property="og:description" content="${ogDescription}" />`;
const ogImageWidthTag = '<meta property="og:image:width" content="600" />';
const ogImageHeightTag = '<meta property="og:image:height" content="315" />';
const basicTags = `${ogTitleTag} ${ogUrlTag} ${ogSiteNameTag} ${ogDescriptionTag} ${ogImageWidthTag} ${ogImageHeightTag}`;
let ogImageTag = `<meta property="og:image" content="${source}" >`;
let ogImageTypeTag = `<meta property="og:image:type" content="${contentType}" >`;
let ogTypeTag = `<meta property="og:type" content="article" >`;
let ogImageTag = `<meta property="og:image" content="${source}" />`;
let ogImageTypeTag = `<meta property="og:image:type" content="${contentType}" />`;
let ogTypeTag = `<meta property="og:type" content="article" />`;
if (contentType === 'video/mp4') {
const ogVideoTag = `<meta property="og:video" content="${source}" >`;
const ogVideoSecureUrlTag = `<meta property="og:video:secure_url" content="${source}" >`;
const ogVideoTypeTag = `<meta property="og:video:type" content="${contentType}" >`;
ogImageTag = `<meta property="og:image" content="${thumbnail}" >`;
ogImageTypeTag = `<meta property="og:image:type" content="${ogThumbnailContentType}" >`;
ogTypeTag = `<meta property="og:type" content="video" >`;
const ogVideoTag = `<meta property="og:video" content="${source}" />`;
const ogVideoSecureUrlTag = `<meta property="og:video:secure_url" content="${source}" />`;
const ogVideoTypeTag = `<meta property="og:video:type" content="${contentType}" />`;
ogImageTag = `<meta property="og:image" content="${thumbnail}" />`;
ogImageTypeTag = `<meta property="og:image:type" content="${ogThumbnailContentType}" />`;
ogTypeTag = `<meta property="og:type" content="video" />`;
return new Handlebars.SafeString(`${basicTags} ${ogImageTag} ${ogImageTypeTag} ${ogTypeTag} ${ogVideoTag} ${ogVideoSecureUrlTag} ${ogVideoTypeTag}`);
} else {
if (contentType === 'image/gif') {
ogTypeTag = `<meta property="og:type" content="video.other" >`;
ogTypeTag = `<meta property="og:type" content="video.other" />`;
};
return new Handlebars.SafeString(`${basicTags} ${ogImageTag} ${ogImageTypeTag} ${ogTypeTag}`);
}

View file

@ -1,7 +1,7 @@
const logger = require('winston');
const fs = require('fs');
const db = require('../models');
const config = require('../config/speechConfig.js');
const { site, wallet } = require('../config/speechConfig.js');
module.exports = {
validateApiPublishRequest (body, files) {
@ -101,12 +101,12 @@ module.exports = {
metadata : {
description,
title,
author : 'spee.ch',
author : site.title,
language: 'en',
license,
nsfw,
},
claim_address: config.wallet.lbryClaimAddress,
claim_address: wallet.lbryClaimAddress,
};
// add thumbnail to channel if video
if (thumbnail !== null) {
@ -133,12 +133,12 @@ module.exports = {
db.File.findAll({ where: { name } })
.then(result => {
if (result.length >= 1) {
const claimAddress = config.wallet.lbryClaimAddress;
// filter out any results that were not published from spee.ch's wallet address
const claimAddress = wallet.lbryClaimAddress;
// filter out any results that were not published from the site's wallet address
const filteredResult = result.filter((claim) => {
return (claim.address === claimAddress);
});
// return based on whether any non-spee.ch claims were left
// return based on whether any claims were left
if (filteredResult.length >= 1) {
resolve(false);
} else {

View file

@ -2,7 +2,7 @@ const logger = require('winston');
module.exports = {
serveFile ({ filePath, fileType }, claimId, name, res) {
logger.verbose(`serving ${name}#${claimId}`);
logger.verbose(`serving file: ${filePath}`);
// set response options
const headerContentType = fileType || 'image/jpeg';
const options = {
@ -15,9 +15,11 @@ module.exports = {
res.status(200).sendFile(filePath, options);
},
showFile (claimInfo, shortId, res) {
logger.verbose(`showing claim: ${claimInfo.name}#${claimInfo.claimId}`);
res.status(200).render('show', { layout: 'show', claimInfo, shortId });
},
showFileLite (claimInfo, shortId, res) {
logger.verbose(`showlite claim: ${claimInfo.name}#${claimInfo.claimId}`);
res.status(200).render('showLite', { layout: 'showlite', claimInfo, shortId });
},
};

View file

@ -1,14 +1,14 @@
const logger = require('winston');
const { returnShortId } = require('../helpers/sequelizeHelpers.js');
const DEFAULT_THUMBNAIL = 'https://spee.ch/assets/img/video_thumb_default.png';
const DEFAULT_TITLE = 'Spee<ch';
const DEFAULT_DESCRIPTION = 'Decentralized video and content hosting.';
const { publishing, site } = require('../config/speechConfig.js');
const { defaultTitle, defaultThumbnail, defaultDescription } = publishing;
const { host } = site;
function determineFileExtensionFromContentType (contentType) {
switch (contentType) {
case 'image/jpeg':
case 'image/jpg':
return 'jpg';
return 'jpeg';
case 'image/png':
return 'png';
case 'image/gif':
@ -16,8 +16,8 @@ function determineFileExtensionFromContentType (contentType) {
case 'video/mp4':
return 'mp4';
default:
logger.debug('setting unknown file type as file extension jpg');
return 'jpg';
logger.debug('setting unknown file type as file extension jpeg');
return 'jpeg';
}
};
@ -25,7 +25,7 @@ function determineContentTypeFromFileExtension (fileExtension) {
switch (fileExtension) {
case 'jpeg':
case 'jpg':
return 'image/jpg';
return 'image/jpeg';
case 'png':
return 'image/png';
case 'gif':
@ -33,8 +33,8 @@ function determineContentTypeFromFileExtension (fileExtension) {
case 'mp4':
return 'video/mp4';
default:
logger.debug('setting unknown file type as type image/jpg');
return 'image/jpg';
logger.debug('setting unknown file type as type image/jpeg');
return 'image/jpeg';
}
};
@ -67,19 +67,20 @@ function determineOgThumbnailContentType (thumbnail) {
}
function addOpengraphDataToClaim (claim) {
claim['embedUrl'] = `https://spee.ch/embed/${claim.claimId}/${claim.name}`;
claim['showUrl'] = `https://spee.ch/${claim.claimId}/${claim.name}`;
claim['source'] = `https://spee.ch/${claim.claimId}/${claim.name}.${claim.fileExt}`;
claim['directFileUrl'] = `https://spee.ch/${claim.claimId}/${claim.name}.${claim.fileExt}`;
claim['ogTitle'] = determineOgTitle(claim.title, DEFAULT_TITLE);
claim['ogDescription'] = determineOgDescription(claim.description, DEFAULT_DESCRIPTION);
claim['host'] = host;
claim['embedUrl'] = `${host}/${claim.claimId}/${claim.name}`;
claim['showUrl'] = `${host}/${claim.claimId}/${claim.name}`;
claim['source'] = `${host}/${claim.claimId}/${claim.name}.${claim.fileExt}`;
claim['directFileUrl'] = `${host}/${claim.claimId}/${claim.name}.${claim.fileExt}`;
claim['ogTitle'] = determineOgTitle(claim.title, defaultTitle);
claim['ogDescription'] = determineOgDescription(claim.description, defaultDescription);
claim['ogThumbnailContentType'] = determineOgThumbnailContentType(claim.thumbnail);
return claim;
};
function prepareClaimData (claim) {
// logger.debug('preparing claim data based on resolved data:', claim);
claim['thumbnail'] = determineThumbnail(claim.thumbnail, DEFAULT_THUMBNAIL);
claim['thumbnail'] = determineThumbnail(claim.thumbnail, defaultThumbnail);
claim['fileExt'] = determineFileExtensionFromContentType(claim.contentType);
claim = addOpengraphDataToClaim(claim);
return claim;
@ -279,7 +280,7 @@ module.exports = (sequelize, { STRING, BOOLEAN, INTEGER, TEXT, DECIMAL }) => {
default:
channelClaimsArray.forEach(claim => {
claim['fileExt'] = determineFileExtensionFromContentType(claim.contentType);
claim['thumbnail'] = determineThumbnail(claim.thumbnail, DEFAULT_THUMBNAIL);
claim['thumbnail'] = determineThumbnail(claim.thumbnail, defaultThumbnail);
return claim;
});
return resolve(channelClaimsArray);

View file

@ -78,7 +78,7 @@ const Asset = function () {
this.isFileAvailable()
.then(isAvailable => {
if (!isAvailable) {
console.log('file is not yet available on spee.ch');
console.log('file is not yet available');
that.showSearchMessage();
return that.getAssetOnSpeech();
}
@ -136,4 +136,4 @@ const Asset = function () {
xhr.send();
})
};
};
};

View file

@ -50,7 +50,7 @@ function publishNewChannel (event) {
validationFunctions.showError(channelNameErrorDisplayElement, error.message);
} else {
console.log('signup failure:', error);
showChannelCreationError('Unfortunately, Spee.ch encountered an error while creating your channel. Please let us know in slack!');
showChannelCreationError('Unfortunately, we encountered an error while creating your channel. Please let us know in slack!');
}
})
}
}

View file

@ -1,7 +1,7 @@
const logger = require('winston');
const multipart = require('connect-multiparty');
const config = require('../config/speechConfig.js');
const multipartMiddleware = multipart({uploadDir: config.files.uploadDirectory});
const { files, site } = require('../config/speechConfig.js');
const multipartMiddleware = multipart({uploadDir: files.uploadDirectory});
const db = require('../models');
const { publish } = require('../controllers/publishController.js');
const { getClaimList, resolveUri, getClaim } = require('../helpers/lbryApi.js');
@ -83,14 +83,14 @@ module.exports = (app) => {
});
});
// route to check whether spee.ch has published to a claim
// route to check whether this site published to a claim
app.get('/api/claim-is-available/:name', ({ params }, res) => {
checkClaimNameAvailability(params.name)
.then(result => {
if (result === true) {
res.status(200).json(true);
} else {
// logger.debug(`Rejecting '${params.name}' because that name has already been claimed on spee.ch`);
// logger.debug(`Rejecting '${params.name}' because that name has already been claimed by this site`);
res.status(200).json(false);
}
})
@ -98,14 +98,14 @@ module.exports = (app) => {
res.status(500).json(error);
});
});
// route to check whether spee.ch has published to a channel
// route to check whether site has published to a channel
app.get('/api/channel-is-available/:name', ({ params }, res) => {
checkChannelAvailability(params.name)
.then(result => {
if (result === true) {
res.status(200).json(true);
} else {
// logger.debug(`Rejecting '${params.name}' because that channel has already been claimed on spee.ch`);
// logger.debug(`Rejecting '${params.name}' because that channel has already been claimed`);
res.status(200).json(false);
}
})
@ -162,13 +162,13 @@ module.exports = (app) => {
}
channelPassword = body.channelPassword || null;
skipAuth = false;
// case 1: publish from spee.ch, client logged in
// case 1: publish from client, client logged in
if (user) {
skipAuth = true;
if (anonymous) {
channelName = null;
}
// case 2: publish from api or spee.ch, client not logged in
// case 2: publish from api or client, client not logged in
} else {
if (anonymous) {
skipAuth = true;
@ -188,7 +188,7 @@ module.exports = (app) => {
})
.then(result => {
if (!result) {
throw new Error('That name is already in use by spee.ch.');
throw new Error('That name is already claimed by another user.');
}
// create publish parameters object
return createPublishParams(filePath, name, title, description, license, nsfw, thumbnail, channelName);
@ -203,7 +203,7 @@ module.exports = (app) => {
success: true,
message: {
name,
url : `spee.ch/${result.claim_id}/${name}`,
url : `${site.host}/${result.claim_id}/${name}`,
lbryTx: result,
},
});

View file

@ -1,5 +1,6 @@
const errorHandlers = require('../helpers/errorHandlers.js');
const { getTrendingClaims, getRecentClaims } = require('../controllers/statsController.js');
const { site } = require('../config/speechConfig.js');
module.exports = (app) => {
// route to log out
@ -15,7 +16,7 @@ module.exports = (app) => {
res.status(200).render('login');
}
});
// route to show 'about' page for spee.ch
// route to show 'about' page
app.get('/about', (req, res) => {
// get and render the content
res.status(200).render('about');
@ -52,8 +53,9 @@ module.exports = (app) => {
app.get('/embed/:claimId/:name', ({ params }, res) => {
const claimId = params.claimId;
const name = params.name;
const host = site.host;
// get and render the content
res.status(200).render('embed', { layout: 'embed', claimId, name });
res.status(200).render('embed', { layout: 'embed', host, claimId, name });
});
// route to display all free public claims at a given name
app.get('/:name/all', (req, res) => {

View file

@ -44,8 +44,18 @@ function showChannelPageToClient (channelName, channelClaimId, originalUrl, ip,
});
}
function clientAcceptsHtml (headers) {
return headers['accept'] && headers['accept'].split(',').includes('text/html');
function clientAcceptsHtml ({accept}) {
return accept && accept.match(/text\/html/);
}
function requestIsFromBrowser (headers) {
return headers['user-agent'] && headers['user-agent'].match(/Mozilla/);
};
function clientWantsAsset ({accept, range}) {
const imageIsWanted = accept && accept.match(/image\/.*/) && !accept.match(/text\/html/) && !accept.match(/text\/\*/);
const videoIsWanted = accept && range;
return imageIsWanted || videoIsWanted;
}
function determineResponseType (isServeRequest, headers) {
@ -57,7 +67,8 @@ function determineResponseType (isServeRequest, headers) {
}
} else {
responseType = SHOW;
if (!clientAcceptsHtml(headers)) { // this is in case someone embeds a show url
if (clientWantsAsset(headers) && requestIsFromBrowser(headers)) { // this is in case someone embeds a show url
logger.debug('Show request came from browser and wants an image/video; changing response to serve.');
responseType = SERVE;
}
}
@ -68,8 +79,8 @@ function showAssetToClient (claimId, name, res) {
return Promise
.all([db.Claim.resolveClaim(name, claimId), db.Claim.getShortClaimIdFromLongClaimId(claimId, name)])
.then(([claimInfo, shortClaimId]) => {
logger.debug('claimInfo:', claimInfo);
logger.debug('shortClaimId:', shortClaimId);
// logger.debug('claimInfo:', claimInfo);
// logger.debug('shortClaimId:', shortClaimId);
return serveHelpers.showFile(claimInfo, shortClaimId, res);
})
.catch(error => {
@ -81,8 +92,8 @@ function showLiteAssetToClient (claimId, name, res) {
return Promise
.all([db.Claim.resolveClaim(name, claimId), db.Claim.getShortClaimIdFromLongClaimId(claimId, name)])
.then(([claimInfo, shortClaimId]) => {
logger.debug('claimInfo:', claimInfo);
logger.debug('shortClaimId:', shortClaimId);
// logger.debug('claimInfo:', claimInfo);
// logger.debug('shortClaimId:', shortClaimId);
return serveHelpers.showFileLite(claimInfo, shortClaimId, res);
})
.catch(error => {
@ -93,7 +104,7 @@ function showLiteAssetToClient (claimId, name, res) {
function serveAssetToClient (claimId, name, res) {
return getLocalFileRecord(claimId, name)
.then(fileInfo => {
logger.debug('fileInfo:', fileInfo);
// logger.debug('fileInfo:', fileInfo);
if (fileInfo === NO_FILE) {
return res.status(307).redirect(`/api/claim-get/${name}/${claimId}`);
}
@ -118,7 +129,7 @@ function showOrServeAsset (responseType, claimId, claimName, res) {
}
function flipClaimNameAndIdForBackwardsCompatibility (identifier, name) {
// this is a patch for backwards compatability with 'spee.ch/name/claim_id' url format
// this is a patch for backwards compatability with '/name/claim_id' url format
if (isValidShortIdOrClaimId(name) && !isValidShortIdOrClaimId(identifier)) {
const tempName = name;
name = identifier;

View file

@ -5,13 +5,13 @@
<title>Test Page</title>
</head>
<body>
<img src="https://staging.spee.ch/zackmath"/>
<img src="https://staging.spee.ch/8/zackmath"/>
<img src="https://staging.spee.ch/zackmath.ext"/>
<img src="https://staging.spee.ch/8/zackmath.ext"/>
<video width="50%" controls poster="https://spee.ch/assets/img/video_thumb_default.png" src="https://staging.spee.ch/LBRY-Hype"></video>
<video width="50%" controls poster="https://spee.ch/assets/img/video_thumb_default.png" src="https://staging.spee.ch/a/LBRY-Hype"></video>
<video width="50%" controls poster="https://spee.ch/assets/img/video_thumb_default.png" src="https://staging.spee.ch/LBRY-Hype.test"></video>
<video width="50%" controls poster="https://spee.ch/assets/img/video_thumb_default.png" src="https://staging.spee.ch/a/LBRY-Hype.test"></video>
<img src="https://dev1.spee.ch/zackmath"/>
<!--<img src="https://dev1.spee.ch/8/zackmath"/>-->
<!--<img src="https://dev1.spee.ch/zackmath.ext"/>-->
<!--<img src="https://dev1.spee.ch/8/zackmath.ext"/>-->
<video width="50%" controls poster="https://dev1.spee.ch/assets/img/video_thumb_default.png" src="https://dev1.spee.ch/LBRY-Hype"></video>
<!--<video width="50%" controls poster="https://dev1.spee.ch/assets/img/video_thumb_default.png" src="https://staging.spee.ch/a/LBRY-Hype"></video>-->
<!--<video width="50%" controls poster="https://dev1.spee.ch/assets/img/video_thumb_default.png" src="https://staging.spee.ch/LBRY-Hype.test"></video>-->
<!--<video width="50%" controls poster="https://dev1.spee.ch/assets/img/video_thumb_default.png" src="https://staging.spee.ch/a/LBRY-Hype.test"></video>-->
</body>
</html>
</html>

View file

@ -1 +1 @@
<video width="100%" controls src="https://spee.ch/{{claimId}}/{{name}}.mp4" type="video/mp4"></video>
<video width="100%" controls src="{{host}}/{{claimId}}/{{name}}.mp4" type="video/mp4"></video>

View file

@ -4,12 +4,12 @@
{{ placeCommonHeaderTags }}
<meta name="twitter:card" content="summary" />
<meta name="twitter:site" content="@spee_ch" />
<meta property="og:title" content="{{this.channelName}} on Spee.ch">
<meta property="og:site_name" content="Spee.ch">
<meta property="og:type" content="website">
<meta property="og:image" content="https://spee.ch/assets/img/Speech_Logo_Main@OG-02.jpg">
<meta property="og:url" content="http://spee.ch/{{this.channelName}}:{{this.longChannelId}}">
<meta property="og:description" content="View images and videos from {{this.channelName}}">
<meta property="og:title" content="{{this.channelName}} on Spee.ch" />
<meta property="og:site_name" content="Spee.ch" />
<meta property="og:type" content="website" />
<meta property="og:image" content="https://spee.ch/assets/img/Speech_Logo_Main@OG-02.jpg" />
<meta property="og:url" content="http://spee.ch/{{this.channelName}}:{{this.longChannelId}}" />
<meta property="og:description" content="View images and videos from {{this.channelName}}" />
<!--google font-->
<link href="https://fonts.googleapis.com/css?family=Roboto:300" rel="stylesheet">
<!-- google analytics -->

View file

@ -4,12 +4,12 @@
{{ placeCommonHeaderTags }}
<meta name="twitter:card" content="summary" />
<meta name="twitter:site" content="@spee_ch" />
<meta property="og:title" content="Spee.ch">
<meta property="og:site_name" content="Spee.ch">
<meta property="og:type" content="website">
<meta property="og:image" content="https://spee.ch/assets/img/Speech_Logo_Main@OG-02.jpg">
<meta property="og:url" content="http://spee.ch/">
<meta property="og:description" content="Open-source, decentralized image and video sharing.">
<meta property="og:title" content="Spee.ch" />
<meta property="og:site_name" content="Spee.ch" />
<meta property="og:type" content="website" />
<meta property="og:image" content="https://spee.ch/assets/img/Speech_Logo_Main@OG-02.jpg" />
<meta property="og:url" content="http://spee.ch/" />
<meta property="og:description" content="Open-source, decentralized image and video sharing." />
<!--google font-->
<link href="https://fonts.googleapis.com/css?family=Roboto:300" rel="stylesheet">
<!-- google analytics -->

View file

@ -22,7 +22,7 @@
<div class="row row--short row--wide">
<div class="column column--7">
<div class="input-error" id="input-error-copy-short-link" hidden="true"></div>
<input type="text" id="short-link" class="input-disabled input-text--full-width" readonly spellcheck="false" value="https://spee.ch/{{shortId}}/{{claimInfo.name}}.{{claimInfo.fileExt}}" onclick="select()"/>
<input type="text" id="short-link" class="input-disabled input-text--full-width" readonly spellcheck="false" value="{{claimInfo.host}}/{{shortId}}/{{claimInfo.name}}.{{claimInfo.fileExt}}" onclick="select()"/>
</div><div class="column column--1"></div><div class="column column--2">
<button class="button--primary" data-elementtocopy="short-link" onclick="copyToClipboard(event)">copy</button>
</div>
@ -37,9 +37,9 @@
<div class="column column--7">
<div class="input-error" id="input-error-copy-embed-text" hidden="true"></div>
{{#ifConditional claimInfo.contentType '===' 'video/mp4'}}
<input type="text" id="embed-text" class="input-disabled input-text--full-width" readonly onclick="select()" spellcheck="false" value='&lt;video width="100%" controls poster="{{claimInfo.thumbnail}}" src="https://spee.ch/{{claimInfo.claimId}}/{{claimInfo.name}}.{{claimInfo.fileExt}}"/>&lt;/video>'/>
<input type="text" id="embed-text" class="input-disabled input-text--full-width" readonly onclick="select()" spellcheck="false" value='&lt;video width="100%" controls poster="{{claimInfo.thumbnail}}" src="{{claimInfo.host}}/{{claimInfo.claimId}}/{{claimInfo.name}}.{{claimInfo.fileExt}}"/>&lt;/video>'/>
{{else}}
<input type="text" id="embed-text" class="input-disabled input-text--full-width" readonly onclick="select()" spellcheck="false" value='&lt;img src="https://spee.ch/{{claimInfo.claimId}}/{{claimInfo.name}}.{{claimInfo.fileExt}}"/>'/>
<input type="text" id="embed-text" class="input-disabled input-text--full-width" readonly onclick="select()" spellcheck="false" value='&lt;img src="{{claimInfo.host}}/{{claimInfo.claimId}}/{{claimInfo.name}}.{{claimInfo.fileExt}}"/>'/>
{{/ifConditional}}
</div><div class="column column--1"></div><div class="column column--2">
<button class="button--primary" data-elementtocopy="embed-text" onclick="copyToClipboard(event)">copy</button>
@ -55,10 +55,10 @@
<span class="text">Share:</span>
</div><div class="column column--7 column--med-10">
<div class="row row--short row--wide flex-container--row flex-container--space-between-bottom flex-container--wrap">
<a class="link--primary" target="_blank" href="https://twitter.com/intent/tweet?text=https://spee.ch/{{shortId}}/{{claimInfo.name}}">twitter</a>
<a class="link--primary" target="_blank" href="https://www.facebook.com/sharer/sharer.php?u=https://spee.ch/{{shortId}}/{{claimInfo.name}}">facebook</a>
<a class="link--primary" target="_blank" href="http://tumblr.com/widgets/share/tool?canonicalUrl=https://spee.ch/{{shortId}}/{{claimInfo.name}}">tumblr</a>
<a class="link--primary" target="_blank" href="https://www.reddit.com/submit?url=https://spee.ch/{{shortId}}/{{claimInfo.name}}&title={{claimInfo.name}}">reddit</a>
<a class="link--primary" target="_blank" href="https://twitter.com/intent/tweet?text={{claimInfo.host}}/{{shortId}}/{{claimInfo.name}}">twitter</a>
<a class="link--primary" target="_blank" href="https://www.facebook.com/sharer/sharer.php?u={{claimInfo.host}}/{{shortId}}/{{claimInfo.name}}">facebook</a>
<a class="link--primary" target="_blank" href="http://tumblr.com/widgets/share/tool?canonicalUrl={{claimInfo.host}}/{{shortId}}/{{claimInfo.name}}">tumblr</a>
<a class="link--primary" target="_blank" href="https://www.reddit.com/submit?url={{claimInfo.host}}/{{shortId}}/{{claimInfo.name}}&title={{claimInfo.name}}">reddit</a>
</div>
</div>
</div>