Initial commit.
commit
67de7964a8
GPG Key ID:
1573F6D8EFE4D0CF
|
|
@ -0,0 +1,4 @@
|
||||||
|
last 2 major versions
|
||||||
|
last 2 years
|
||||||
|
>= 1%
|
||||||
|
not dead
|
||||||
|
|
@ -0,0 +1,31 @@
|
||||||
|
# Logs
|
||||||
|
logs
|
||||||
|
*.log
|
||||||
|
|
||||||
|
# Runtime data
|
||||||
|
pids
|
||||||
|
*.pid
|
||||||
|
*.seed
|
||||||
|
|
||||||
|
# Directory for instrumented libs generated by jscoverage/JSCover
|
||||||
|
lib-cov
|
||||||
|
|
||||||
|
# Coverage directory used by tools like istanbul
|
||||||
|
coverage
|
||||||
|
|
||||||
|
# Grunt intermediate storage (http://gruntjs.com/creating-plugins#storing-task-files)
|
||||||
|
.grunt
|
||||||
|
|
||||||
|
# Compiled binary addons (http://nodejs.org/api/addons.html)
|
||||||
|
build/Release
|
||||||
|
|
||||||
|
# Dependency directory
|
||||||
|
# Deployed apps should consider commenting this line out:
|
||||||
|
# see https://npmjs.org/doc/faq.html#Should-I-check-my-node_modules-folder-into-git
|
||||||
|
node_modules
|
||||||
|
|
||||||
|
###
|
||||||
|
|
||||||
|
docker-compose*
|
||||||
|
*Dockerfile*
|
||||||
|
.git*
|
||||||
|
|
@ -0,0 +1,6 @@
|
||||||
|
{
|
||||||
|
"extends": "airbnb-base",
|
||||||
|
"env": {
|
||||||
|
"browser": true
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
@ -0,0 +1,28 @@
|
||||||
|
# Logs
|
||||||
|
logs
|
||||||
|
*.log
|
||||||
|
|
||||||
|
# Runtime data
|
||||||
|
pids
|
||||||
|
*.pid
|
||||||
|
*.seed
|
||||||
|
|
||||||
|
# Directory for instrumented libs generated by jscoverage/JSCover
|
||||||
|
lib-cov
|
||||||
|
|
||||||
|
# Coverage directory used by tools like istanbul
|
||||||
|
coverage
|
||||||
|
|
||||||
|
# Grunt intermediate storage (http://gruntjs.com/creating-plugins#storing-task-files)
|
||||||
|
.grunt
|
||||||
|
|
||||||
|
# Compiled binary addons (http://nodejs.org/api/addons.html)
|
||||||
|
build/Release
|
||||||
|
|
||||||
|
# Dependency directory
|
||||||
|
# Deployed apps should consider commenting this line out:
|
||||||
|
# see https://npmjs.org/doc/faq.html#Should-I-check-my-node_modules-folder-into-git
|
||||||
|
node_modules
|
||||||
|
|
||||||
|
# Built files
|
||||||
|
dist/
|
||||||
|
|
@ -0,0 +1,22 @@
|
||||||
|
FROM alpine:3.7 AS video
|
||||||
|
|
||||||
|
RUN apk add --no-cache ffmpeg
|
||||||
|
|
||||||
|
COPY video/big.mp4 big.mp4
|
||||||
|
|
||||||
|
RUN mkdir /out
|
||||||
|
RUN ffmpeg \
|
||||||
|
-i big.mp4 \
|
||||||
|
-c copy \
|
||||||
|
-use_timeline 1 \
|
||||||
|
-use_template 1 \
|
||||||
|
-single_file 1 \
|
||||||
|
-hls_playlist 1 \
|
||||||
|
-f dash \
|
||||||
|
/out/clock.mpd
|
||||||
|
|
||||||
|
###
|
||||||
|
|
||||||
|
FROM icedream/caddy
|
||||||
|
|
||||||
|
COPY --from=video /out /htdocs/video
|
||||||
|
|
@ -0,0 +1,4 @@
|
||||||
|
FROM node:8
|
||||||
|
|
||||||
|
COPY entrypoint.sh /usr/local/bin/dev-entrypoint
|
||||||
|
ENTRYPOINT ["dev-entrypoint"]
|
||||||
|
|
@ -0,0 +1,5 @@
|
||||||
|
#!/bin/sh -e
|
||||||
|
|
||||||
|
NODE_ENV=development yarn
|
||||||
|
yarn video
|
||||||
|
exec yarn start
|
||||||
|
|
@ -0,0 +1,14 @@
|
||||||
|
# Development stack
|
||||||
|
|
||||||
|
version: "3.6"
|
||||||
|
|
||||||
|
services:
|
||||||
|
|
||||||
|
player:
|
||||||
|
build: deployment/docker/player
|
||||||
|
ports:
|
||||||
|
- "4545:4545"
|
||||||
|
volumes:
|
||||||
|
- .:/src
|
||||||
|
stop_signal: TERM
|
||||||
|
working_dir: /src
|
||||||
|
|
@ -0,0 +1,37 @@
|
||||||
|
{
|
||||||
|
"name": "@icedream/wooden-clock",
|
||||||
|
"version": "1.0.0",
|
||||||
|
"main": "index.js",
|
||||||
|
"author": "Carl Kittelberger <icedream@icedream.pw>",
|
||||||
|
"license": "MIT",
|
||||||
|
"devDependencies": {
|
||||||
|
"@babel/core": "^7.0.0-rc.2",
|
||||||
|
"@babel/node": "^7.0.0-rc.2",
|
||||||
|
"@babel/preset-env": "^7.0.0-rc.2",
|
||||||
|
"babel-loader": "^8.0.0-beta.6",
|
||||||
|
"csp-html-webpack-plugin": "^2.3.0",
|
||||||
|
"css-loader": "^1.0.0",
|
||||||
|
"eslint": "^5.4.0",
|
||||||
|
"eslint-config-airbnb-base": "^13.1.0",
|
||||||
|
"eslint-plugin-import": "^2.14.0",
|
||||||
|
"file-loader": "^2.0.0",
|
||||||
|
"html-webpack-plugin": "^3.2.0",
|
||||||
|
"mkdirp": "^0.5.1",
|
||||||
|
"resolve-url-loader": "^2.3.0",
|
||||||
|
"script-ext-html-webpack-plugin": "^2.0.1",
|
||||||
|
"style-loader": "^0.22.1",
|
||||||
|
"stylus": "^0.54.5",
|
||||||
|
"stylus-loader": "^3.0.2",
|
||||||
|
"url-loader": "^1.1.1",
|
||||||
|
"webpack": "^4.17.1",
|
||||||
|
"webpack-cli": "^3.1.0"
|
||||||
|
},
|
||||||
|
"dependencies": {
|
||||||
|
"dashjs": "^2.9.0"
|
||||||
|
},
|
||||||
|
"scripts": {
|
||||||
|
"build": "webpack",
|
||||||
|
"start": "webpack-dev-server --mode development --content-base dist/ --host 0.0.0.0 --port 4545",
|
||||||
|
"video": "mkdirp dist/video; ffmpeg -loglevel warning -stats -i video/big.mp4 -c copy -use_timeline 1 -use_template 1 -single_file 1 -hls_playlist 1 -f dash -y dist/video/clock.mpd"
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
@ -0,0 +1,10 @@
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="en" dir="ltr">
|
||||||
|
<head>
|
||||||
|
<meta charset="utf-8">
|
||||||
|
<title>The constructed wooden clock</title>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<noscript>You definitely need JavaScript for this, sorry!</noscript>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
|
|
@ -0,0 +1,29 @@
|
||||||
|
import dashjs from 'dashjs';
|
||||||
|
import style from './player.styl';
|
||||||
|
|
||||||
|
// Nonce used by Webpack for CSP
|
||||||
|
// eslint-disable-next-line
|
||||||
|
const __webpack_nonce__ = 'uGo4I9ydb2hP393boc/24Vu7diUk/Mf84w9khcZkynk=';
|
||||||
|
|
||||||
|
window.addEventListener('load', () => {
|
||||||
|
const playerContainer = document.createElement('video');
|
||||||
|
playerContainer.classList.add(style.video);
|
||||||
|
|
||||||
|
// calculate start time
|
||||||
|
const date = new Date();
|
||||||
|
console.debug('Date:', date);
|
||||||
|
console.debug('UTC time:', date.getTime());
|
||||||
|
const localTime = date.getTime() - (1000 * 60 * date.getTimezoneOffset());
|
||||||
|
console.debug('Local time:', localTime);
|
||||||
|
const secondsOfDay = (localTime % (1000 * 60 * 60 * 24)) / 1000;
|
||||||
|
console.debug('Seconds of day:', secondsOfDay);
|
||||||
|
|
||||||
|
// initialize video
|
||||||
|
const player = dashjs.MediaPlayer().create();
|
||||||
|
const url = `video/clock.mpd#s=${secondsOfDay}`;
|
||||||
|
console.log('URL:', url);
|
||||||
|
const autoplay = true;
|
||||||
|
player.initialize(playerContainer, url, autoplay);
|
||||||
|
|
||||||
|
document.body.appendChild(playerContainer);
|
||||||
|
});
|
||||||
|
|
@ -0,0 +1,16 @@
|
||||||
|
html, body
|
||||||
|
background: #000
|
||||||
|
padding: 0
|
||||||
|
margin: 0
|
||||||
|
height: 100%
|
||||||
|
min-height: 100%
|
||||||
|
|
||||||
|
body
|
||||||
|
text-align: center
|
||||||
|
|
||||||
|
.video
|
||||||
|
position: fixed
|
||||||
|
top: 0
|
||||||
|
left: 0
|
||||||
|
width: 100%
|
||||||
|
height: 100%
|
||||||
|
|
@ -0,0 +1,105 @@
|
||||||
|
import HtmlWebpackPlugin from 'html-webpack-plugin';
|
||||||
|
import CspHtmlWebpackPlugin from 'csp-html-webpack-plugin';
|
||||||
|
import ScriptExtHtmlWebpackPlugin from 'script-ext-html-webpack-plugin';
|
||||||
|
|
||||||
|
import path from 'path';
|
||||||
|
|
||||||
|
const sourceDirectory = path.resolve(__dirname, 'src');
|
||||||
|
|
||||||
|
export default (env, { mode }) => {
|
||||||
|
const development = mode === 'development';
|
||||||
|
const production = !development;
|
||||||
|
|
||||||
|
return ({
|
||||||
|
optimization: {
|
||||||
|
runtimeChunk: {
|
||||||
|
name: 'wp',
|
||||||
|
},
|
||||||
|
},
|
||||||
|
|
||||||
|
plugins: [
|
||||||
|
new HtmlWebpackPlugin({
|
||||||
|
template: './src/index.html',
|
||||||
|
inject: 'head',
|
||||||
|
viewport: 'width=device-width, initial-scale=1, shrink-to-fit=no',
|
||||||
|
minify: production,
|
||||||
|
xhtml: true,
|
||||||
|
}),
|
||||||
|
production && new CspHtmlWebpackPlugin({
|
||||||
|
'base-uri': "'self'",
|
||||||
|
'object-src': "'none'",
|
||||||
|
'script-src': ["'self'", 'nonce-uGo4I9ydb2hP393boc/24Vu7diUk/Mf84w9khcZkynk='],
|
||||||
|
'style-src': ["'self'"],
|
||||||
|
}),
|
||||||
|
production && new ScriptExtHtmlWebpackPlugin({
|
||||||
|
defaultAttribute: 'defer',
|
||||||
|
custom: [
|
||||||
|
{
|
||||||
|
test: /./,
|
||||||
|
attribute: 'nonce',
|
||||||
|
value: 'uGo4I9ydb2hP393boc/24Vu7diUk/Mf84w9khcZkynk=',
|
||||||
|
},
|
||||||
|
],
|
||||||
|
}),
|
||||||
|
].filter(v => v),
|
||||||
|
|
||||||
|
module: {
|
||||||
|
rules: [
|
||||||
|
{
|
||||||
|
test: /\.js$/i,
|
||||||
|
include: sourceDirectory,
|
||||||
|
use: [
|
||||||
|
{
|
||||||
|
loader: 'babel-loader',
|
||||||
|
options: {
|
||||||
|
presets: [
|
||||||
|
['@babel/env', {
|
||||||
|
targets: {
|
||||||
|
},
|
||||||
|
}],
|
||||||
|
],
|
||||||
|
},
|
||||||
|
},
|
||||||
|
],
|
||||||
|
},
|
||||||
|
|
||||||
|
{
|
||||||
|
test: /\.css$/i,
|
||||||
|
use: [
|
||||||
|
'style-loader',
|
||||||
|
{
|
||||||
|
loader: 'css-loader',
|
||||||
|
options: {
|
||||||
|
modules: true,
|
||||||
|
camelCase: true,
|
||||||
|
},
|
||||||
|
},
|
||||||
|
],
|
||||||
|
},
|
||||||
|
|
||||||
|
|
||||||
|
{
|
||||||
|
test: /\.styl$/i,
|
||||||
|
use: [
|
||||||
|
'style-loader',
|
||||||
|
{
|
||||||
|
loader: 'css-loader',
|
||||||
|
options: {
|
||||||
|
modules: true,
|
||||||
|
camelCase: true,
|
||||||
|
importLoaders: 2,
|
||||||
|
},
|
||||||
|
},
|
||||||
|
'resolve-url-loader',
|
||||||
|
{
|
||||||
|
loader: 'stylus-loader',
|
||||||
|
options: {
|
||||||
|
sourceMap: true,
|
||||||
|
},
|
||||||
|
},
|
||||||
|
],
|
||||||
|
},
|
||||||
|
],
|
||||||
|
},
|
||||||
|
});
|
||||||
|
};
|
||||||
Loading…
Reference in New Issue