Improve video UX
This commit is contained in:
parent
08feeb6bfc
commit
f3c8453782
13 changed files with 101 additions and 69 deletions
|
|
@ -1,16 +1,15 @@
|
|||
import adAstraPoster from '../static/media/ad_astra.jpg?format=jpg';
|
||||
import adAstraMp4 from '../static/media/ad_astra_720.mp4';
|
||||
import adAstraWebM from '../static/media/ad_astra_720.webm';
|
||||
import adAstraMp4 from '../static/media/mp4/ad_astra.mp4';
|
||||
import adAstraWebM from '../static/media/webm/ad_astra.webm';
|
||||
|
||||
import { GitHub } from './shared';
|
||||
import { last } from '../helper/last';
|
||||
import { Video } from '../page/basics/video/video';
|
||||
|
||||
export const adAstraTimelineElement = {
|
||||
title: `Gaming on an ATtiny85`,
|
||||
date: `2020 Spring`,
|
||||
figure: new Video({
|
||||
poster: last(adAstraPoster.images)!.path,
|
||||
poster: adAstraPoster,
|
||||
mp4: adAstraMp4,
|
||||
webm: adAstraWebM,
|
||||
}),
|
||||
|
|
|
|||
|
|
@ -1,15 +1,14 @@
|
|||
import citySimulationPoster from '../static/media/simulation.jpg?format=jpg';
|
||||
import citySimulationWebM from '../static/media/simulation.webm';
|
||||
import citySimulationMp4 from '../static/media/simulation.mp4';
|
||||
import citySimulationMp4 from '../static/media/mp4/simulation.mp4';
|
||||
import citySimulationWebM from '../static/media/webm/simulation.webm';
|
||||
|
||||
import { Video } from '../page/basics/video/video';
|
||||
import { last } from '../helper/last';
|
||||
|
||||
export const citySimulationTimelineElement = {
|
||||
date: `2018 July - August`,
|
||||
title: `City simulation`,
|
||||
figure: new Video({
|
||||
poster: last(citySimulationPoster.images)!.path,
|
||||
poster: citySimulationPoster,
|
||||
mp4: citySimulationMp4,
|
||||
webm: citySimulationWebM,
|
||||
}),
|
||||
|
|
|
|||
|
|
@ -1,14 +1,17 @@
|
|||
import forexMp4 from '../static/media/forex.mp4';
|
||||
import forexWebM from '../static/media/forex.webm';
|
||||
import forexMp4 from '../static/media/mp4/forex.mp4';
|
||||
import forexWebM from '../static/media/webm/forex.webm';
|
||||
import forexPoster from '../static/media/forex.jpg';
|
||||
|
||||
import { Video } from '../page/basics/video/video';
|
||||
|
||||
export const forexTimelineElement = {
|
||||
title: `Predicting foreign exchange rates`,
|
||||
date: `2019 Autumn`,
|
||||
figure: new Video({
|
||||
poster: forexPoster,
|
||||
mp4: forexMp4,
|
||||
webm: forexWebM,
|
||||
shouldActLikeGif: true,
|
||||
invertButton: true,
|
||||
}),
|
||||
description: `
|
||||
From the animation, we can see that my implementation does a somewhat acceptable job at
|
||||
|
|
|
|||
|
|
@ -1,15 +1,14 @@
|
|||
import ledPoster from '../static/media/led.jpg?format=jpg';
|
||||
import ledMp4 from '../static/media/led.mp4';
|
||||
import ledWebM from '../static/media/led.webm';
|
||||
import ledMp4 from '../static/media/mp4/led.mp4';
|
||||
import ledWebM from '../static/media/webm/led.webm';
|
||||
|
||||
import { last } from '../helper/last';
|
||||
import { Video } from '../page/basics/video/video';
|
||||
|
||||
export const ledsTimelineElement = {
|
||||
date: `2016 spring`,
|
||||
title: `Lights synchronised to music`,
|
||||
figure: new Video({
|
||||
poster: last(ledPoster.images)!.path,
|
||||
poster: ledPoster,
|
||||
mp4: ledMp4,
|
||||
webm: ledWebM,
|
||||
}),
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue