serve static assets on urls with file extension #538

Merged
bones7242 merged 19 commits from 515-showlite-serves-asset into master 2018-07-20 18:57:12 +02:00
10 changed files with 103 additions and 28 deletions
Showing only changes of commit 3dd6940f5a - Show all commits

View file

@ -9,22 +9,26 @@ var _react = _interopRequireDefault(require("react"));
var _FormFeedbackDisplay = _interopRequireDefault(require("@components/FormFeedbackDisplay"));
var _Row = _interopRequireDefault(require("@components/Row"));
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
var DropzoneInstructionsDisplay = function DropzoneInstructionsDisplay(_ref) {
var fileError = _ref.fileError;
return _react.default.createElement("div", {
className: 'dropzone-instructions-display'
}, _react.default.createElement("p", {
}, _react.default.createElement(_Row.default, null, _react.default.createElement("p", {
className: 'text--large'
}, "Drag & drop image or video here to publish"), _react.default.createElement("p", {
}, "Drag & drop image or video here to publish")), _react.default.createElement(_Row.default, null, _react.default.createElement("p", {
className: 'text--small'
}, "OR"), _react.default.createElement("p", {
}, "OR")), fileError ? _react.default.createElement("div", null, _react.default.createElement(_Row.default, null, _react.default.createElement("p", {
className: 'text--large text--underline'
}, "CHOOSE FILE"), _react.default.createElement(_FormFeedbackDisplay.default, {
}, "CHOOSE FILE")), _react.default.createElement(_FormFeedbackDisplay.default, {
errorMessage: fileError,
defaultMessage: false
}));
})) : _react.default.createElement("p", {
className: 'text--large text--underline'
}, "CHOOSE FILE"));
};
var _default = DropzoneInstructionsDisplay;

View file

@ -8,6 +8,7 @@ $failure-color: red;
$primary-padding: 3em;
$secondary-padding: 2em;
$tertiary-padding: 1em;
$thin-padding: 0.3em;
$full-width-thin-padding: calc(100% - 0.6em);

View file

@ -8,7 +8,7 @@
}
.nav-bar-link {
padding: $secondary-padding;
padding: calc(1em - 2px);
display: inline-block;
}

View file

@ -1,16 +1,29 @@
import React from 'react';
import FormFeedbackDisplay from '@components/FormFeedbackDisplay';
import Row from '@components/Row';
const DropzoneInstructionsDisplay = ({fileError}) => {
return (
<div className={'dropzone-instructions-display'}>
<p className={'text--large'}>Drag & drop image or video here to publish</p>
<p className={'text--small'}>OR</p>
<p className={'text--large text--underline'}>CHOOSE FILE</p>
<FormFeedbackDisplay
errorMessage={fileError}
defaultMessage={false}
/>
<Row>
<p className={'text--large'}>Drag & drop image or video here to publish</p>
</Row>
<Row>
<p className={'text--small'}>OR</p>
</Row>
{ fileError ? (
<div>
<Row>
<p className={'text--large text--underline'}>CHOOSE FILE</p>
</Row>
<FormFeedbackDisplay
errorMessage={fileError}
defaultMessage={false}
/>
</div>
) : (
<p className={'text--large text--underline'}>CHOOSE FILE</p>
)}
</div>
);
};

View file

@ -16,7 +16,6 @@ checkForConfig('siteConfig');
const express = require('express');
const bodyParser = require('body-parser');
const expressHandlebars = require('express-handlebars');
const Handlebars = require('handlebars');
const helmet = require('helmet');
const cookieSession = require('cookie-session');
const http = require('http');
@ -81,11 +80,15 @@ function Server () {
app.use(speechPassport.session());
// configure handlebars & register it with express app
const hbs = expressHandlebars.create({
const viewsPath = Path.resolve(process.cwd(), 'node_modules/spee.ch/server/views');
app.engine('handlebars', expressHandlebars({
async: false,
dataType: 'text',
defaultLayout: 'embed',
handlebars : Handlebars,
});
app.engine('handlebars', hbs.engine);
partialsDir: Path.join(viewsPath, '/partials'),
layoutsDir: Path.join(viewsPath, '/layouts')
}));
app.set('views', viewsPath);
app.set('view engine', 'handlebars');
// set the routes on the app

View file

@ -3,8 +3,11 @@ const { details: { host } } = require('@config/siteConfig');
const sendVideoEmbedPage = ({ params }, res) => {
const claimId = params.claimId;
const name = params.name;
// test setting response headers
console.log('removing x-frame-options');
res.removeHeader('X-Frame-Options');
// get and render the content
res.status(200).render('embed', { layout: 'embed', host, claimId, name });
res.status(200).render('embed', { host, claimId, name });
};
module.exports = sendVideoEmbedPage;

View file

@ -1 +1,4 @@
<video width="100%" controls src="{{host}}/{{claimId}}/{{name}}.mp4" type="video/mp4"></video>
<video controls>
<source src="{{host}}/{{claimId}}/{{name}}.mp4" type="video/mp4">
Your browser does not support video
</video>

View file

@ -1,16 +1,16 @@
<!DOCTYPE html>
<html>
<body id="embed-video-player">
<body>
<style type="text/css">
video {
width:100%;
max-width:600px;
height:auto;
}
video {
width:100%;
max-width:600px;
height:auto;
}
</style>
{{{body}}}
{{{ body }}}
</body>
</html>
</html>

View file

@ -9,12 +9,16 @@
</head>
<body>
<img src="https://media.giphy.com/media/vwEHGjx71HSytx5mY8/giphy-facebook_s.jpg" alt="test embed"/>
<p>no identifier, no ending</p>
<img src="https://dev1.spee.ch/typingcat" alt="no identifier, no ending"/>
<p>no identifier, yes ending</p>
<img src="https://dev1.spee.ch/typingcat.gif" alt="no identifier, yes ending"/>
<p>yes identifier, no ending</p>
<img src="https://dev1.spee.ch/8/typingcat" alt="yes identifier, no ending"/>
<p>yes identifier, yes ending</p>
<img src="https://dev1.spee.ch/8/typingcat.gif" alt="yes identifier, yes ending"/>
</body>

44
test/test-iframe.html Normal file
View file

@ -0,0 +1,44 @@
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport"
content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
<style>
iframe {
width: 100%;
}
</style>
</head>
<body>
<p>i frame: weather.gov</p>
<iframe src="http://www.weather.gov/"></iframe>
<p>i frame: dev1.spee.ch video direct embed page</p>
<iframe src="https://dev1.spee.ch/video-embed/sn123ow-1/c3cadc36688ca37c7526536cfed4448e31bacf56">
iframe not supported
</iframe>
<p>i frame: dev1.spee.ch image direct asset</p>
<iframe src="https://dev1.spee.ch/asset/donut-pla2tter/d8d93f3818f4cb8398637706fb20cc57c441261f">
iframe not supported
</iframe>
<p>i frame: image from internet</p>
<iframe src="https://c.static-nike.com/a/images/t_PDP_1280_v1/f_auto/kod3bxfy7vx99bca26cb/elite-competition-8p-basketball-721MyM.jpg">
iframe not supported
</iframe>
<p>i frame: giphy </p>
<iframe src="https://media.giphy.com/media/vwEHGjx71HSytx5mY8/giphy-facebook_s.jpg">
iframe not supported
</iframe>
<p>i frame: giphy 2</p>
<iframe src="https://media.giphy.com/media/vwEHGjx71HSytx5mY8/giphy-facebook_s">
iframe not supported
</iframe>
</body>
</html>