Refactor components to simplify them

This commit is contained in:
Andras Schmelczer 2022-09-21 14:40:44 +02:00
parent 3cf5b14913
commit 077ed9d3bf
No known key found for this signature in database
GPG key ID: 0EA1BC97D0AB076E
36 changed files with 202 additions and 216 deletions

View file

@ -1,78 +1,76 @@
import { PageBackground } from '../page/background/background';
import { Image } from '../page/basics/image/image';
import { PageFooter } from '../page/footer/footer';
import { PageHeader } from '../page/header/header';
import { PageImageViewer } from '../page/image-viewer/image-viewer';
import { Main } from '../page/main/main';
import { PageElement } from '../page/page-element';
import { PageTimeline } from '../page/timeline/timeline';
import cvEnglish from './media/cv-andras-schmelczer.pdf';
import meJpeg from './media/me.jpg?format=jpg';
import meWebP from './media/me.jpg?format=webp';
import cvEnglish from './media/cv-andras-schmelczer.pdf';
import { PageFooter } from '../page/footer/footer';
import { Image } from '../page/basics/image/image';
import { PageHeader } from '../page/header/header';
import { PageTimeline } from '../page/timeline/timeline';
import { PageImageViewer } from '../page/image-viewer/image-viewer';
import { PageBackground } from '../page/background/background';
import { Main } from '../page/main/main';
import { Body } from '../page/body/body';
import { declaredTimelineElement } from './projects/declared';
import { sdf2dTimelineElement } from './projects/sdf2d';
import { adAstraTimelineElement } from './projects/ad-astra';
import { citySimulationTimelineElement } from './projects/city-simulation';
import { declaredTimelineElement } from './projects/declared';
import { forexTimelineElement } from './projects/forex';
import { greatAiTimelineElement } from './projects/great-ai';
import { ledsTimelineElement } from './projects/leds';
import { myNotesTimelineElement } from './projects/my-notes';
import { nuclearTimelineElement } from './projects/nuclear';
import { nuclearEditorTimelineElement } from './projects/nuclear-editor';
import { citySimulationTimelineElement } from './projects/city-simulation';
import { platformGameTimelineElement } from './projects/platform-game';
import { photosTimelineElement } from './projects/photos';
import { ledsTimelineElement } from './projects/leds';
import { platformGameTimelineElement } from './projects/platform-game';
import { sdf2dTimelineElement } from './projects/sdf2d';
import { towersTimelineElement } from './projects/towers';
import { greatAiTimelineElement } from './projects/great-ai';
export const create = () =>
new Body(
new Main(
new PageBackground(1, 1),
new PageHeader({
name: `András Schmelczer`,
photo: new Image(meWebP, meJpeg, `a picture of me`, false),
about: [
`
export const create = (): Array<PageElement> => [
new Main(
new PageBackground(1, 1),
new PageHeader({
name: `András Schmelczer`,
photo: new Image(meWebP, meJpeg, `a picture of me`, false),
about: [
`
I have always been fascinated by the engineering feats that surround us and pervade every aspect
of our lives. When I realised I might someday be able to contribute to this field, I knew that
this would become my life's ambition.
As I am starting my third semester at Leiden University,
I feel I am getting closer to my ambition every day.
`,
`
`
Discover some of my more interesting projects. They are all listed below.
Further information about me can be found at the bottom of the page.
`,
],
}),
new PageTimeline({
showMoreText: `Show details`,
showLessText: `Show less`,
elements: [
greatAiTimelineElement,
declaredTimelineElement,
sdf2dTimelineElement,
adAstraTimelineElement,
forexTimelineElement,
myNotesTimelineElement,
towersTimelineElement,
nuclearTimelineElement,
nuclearEditorTimelineElement,
citySimulationTimelineElement,
platformGameTimelineElement,
photosTimelineElement,
ledsTimelineElement,
],
}),
new PageFooter({
title: `Learn more`,
curriculaVitae: [{ name: `Curriculum vitae`, url: cvEnglish }],
email: `andras@schmelczer.dev`,
linkedin: `https://www.linkedin.com/in/andras-schmelczer-35487017b`,
lastEditText: `Last modified on `,
// @ts-ignore: injected by webpack
lastEdit: new Date(__CURRENT_DATE__),
})
),
new PageImageViewer()
);
],
}),
new PageTimeline({
showMoreText: `Show details`,
showLessText: `Show less`,
elements: [
greatAiTimelineElement,
declaredTimelineElement,
sdf2dTimelineElement,
adAstraTimelineElement,
forexTimelineElement,
myNotesTimelineElement,
towersTimelineElement,
nuclearTimelineElement,
nuclearEditorTimelineElement,
citySimulationTimelineElement,
platformGameTimelineElement,
photosTimelineElement,
ledsTimelineElement,
],
}),
new PageFooter({
title: `Learn more`,
curriculaVitae: [{ name: `Curriculum vitae`, url: cvEnglish }],
email: `andras@schmelczer.dev`,
linkedin: `https://www.linkedin.com/in/andras-schmelczer-35487017b`,
lastEditText: `Last modified on `,
// @ts-ignore: injected by webpack
lastEdit: new Date(__CURRENT_DATE__),
})
),
new PageImageViewer(),
];

View file

@ -1,5 +1,5 @@
import { Video } from '../../page/basics/video/video';
import { TimelineElementParameters } from '../../page/timeline/timeline-element/timeline-element';
import { TimelineElementParameters } from '../../page/timeline/timeline-element/timeline-element-parameters';
import adAstraJpeg from '../media/ad_astra.jpg?format=jpg';
import adAstraWebP from '../media/ad_astra.jpg?format=webp';
import adAstraMp4 from '../media/mp4/ad_astra.mp4';
@ -38,5 +38,5 @@ export const adAstraTimelineElement: TimelineElementParameters = {
This can also be found on GitHub along with the entire project.
`,
],
links: [new GitHub('https://github.com/schmelczerandras/ad_astra')],
links: [GitHub('https://github.com/schmelczerandras/ad_astra')],
};

View file

@ -1,5 +1,5 @@
import { Video } from '../../page/basics/video/video';
import { TimelineElementParameters } from '../../page/timeline/timeline-element/timeline-element';
import { TimelineElementParameters } from '../../page/timeline/timeline-element/timeline-element-parameters';
import citySimulationMp4 from '../media/mp4/simulation.mp4';
import citySimulationPosterJpeg from '../media/simulation.jpg?format=jpg';
import citySimulationPosterWebP from '../media/simulation.jpg?format=webp';

View file

@ -1,5 +1,5 @@
import { Image } from '../../page/basics/image/image';
import { TimelineElementParameters } from '../../page/timeline/timeline-element/timeline-element';
import { TimelineElementParameters } from '../../page/timeline/timeline-element/timeline-element-parameters';
import colourJpeg from '../media/color.jpg?format=jpg';
import colourWebP from '../media/color.jpg?format=webp';

View file

@ -1,10 +1,9 @@
import { Preview } from '../../page/basics/preview/preview';
import { TimelineElementParameters } from '../../page/timeline/timeline-element/timeline-element-parameters';
import declaredJpeg from '../media/decla-red.png?format=jpg';
import declaredWebP from '../media/decla-red.png?format=webp';
import thesis from '../media/thesis-andras-schmelczer.pdf';
import { Preview } from '../../page/basics/preview/preview';
import { GitHub, Thesis, Open } from '../shared';
import { TimelineElementParameters } from '../../page/timeline/timeline-element/timeline-element';
import bscThesis from '../media/sdf2d-andras-schmelczer.pdf';
import { GitHub, Open, Thesis } from '../shared';
export const declaredTimelineElement: TimelineElementParameters = {
title: `Multiplayer game`,
@ -34,8 +33,8 @@ export const declaredTimelineElement: TimelineElementParameters = {
`,
],
links: [
new GitHub('https://github.com/schmelczerandras/decla.red'),
new Thesis(thesis),
new Open('https://decla.red'),
GitHub('https://github.com/schmelczerandras/decla.red'),
Thesis(bscThesis),
Open('https://decla.red'),
],
};

View file

@ -1,5 +1,5 @@
import { Video } from '../../page/basics/video/video';
import { TimelineElementParameters } from '../../page/timeline/timeline-element/timeline-element';
import { TimelineElementParameters } from '../../page/timeline/timeline-element/timeline-element-parameters';
import forexPosterJpeg from '../media/forex.jpg?format=jpg';
import forexPosterWebP from '../media/forex.jpg?format=webp';
import forexMp4 from '../media/mp4/forex.mp4';

View file

@ -1,5 +1,5 @@
import { Video } from '../../page/basics/video/video';
import { TimelineElementParameters } from '../../page/timeline/timeline-element/timeline-element';
import { TimelineElementParameters } from '../../page/timeline/timeline-element/timeline-element-parameters';
import ledPosterJpeg from '../media/led.jpg?format=jpg';
import ledPosterWebP from '../media/led.jpg?format=webp';
import ledMp4 from '../media/mp4/led.mp4';

View file

@ -1,5 +1,5 @@
import { Image } from '../../page/basics/image/image';
import { TimelineElementParameters } from '../../page/timeline/timeline-element/timeline-element';
import { TimelineElementParameters } from '../../page/timeline/timeline-element/timeline-element-parameters';
import myNotesJpeg from '../media/my-notes.png?format=jpg';
import myNotesWebP from '../media/my-notes.png?format=webp';
import { GitHub } from '../shared';
@ -20,5 +20,5 @@ export const myNotesTimelineElement: TimelineElementParameters = {
adventure.
`,
],
links: [new GitHub('https://github.com/schmelczerandras/my-notes')],
links: [GitHub('https://github.com/schmelczerandras/my-notes')],
};

View file

@ -1,5 +1,5 @@
import { Image } from '../../page/basics/image/image';
import { TimelineElementParameters } from '../../page/timeline/timeline-element/timeline-element';
import { TimelineElementParameters } from '../../page/timeline/timeline-element/timeline-element-parameters';
import processSimulatorInputJpeg from '../media/process-simulator-input.jpg?format=jpg';
import processSimulatorInputWebP from '../media/process-simulator-input.jpg?format=webp';

View file

@ -1,5 +1,5 @@
import { Image } from '../../page/basics/image/image';
import { TimelineElementParameters } from '../../page/timeline/timeline-element/timeline-element';
import { TimelineElementParameters } from '../../page/timeline/timeline-element/timeline-element-parameters';
import processSimulatorJpeg from '../media/process-simulator.jpg?format=jpg';
import processSimulatorWebP from '../media/process-simulator.jpg?format=webp';

View file

@ -1,5 +1,5 @@
import { Image } from '../../page/basics/image/image';
import { TimelineElementParameters } from '../../page/timeline/timeline-element/timeline-element';
import { TimelineElementParameters } from '../../page/timeline/timeline-element/timeline-element-parameters';
import photosJpeg from '../media/photos.jpg?format=jpg';
import photosWebP from '../media/photos.jpg?format=webp';
import { Open } from '../shared';
@ -20,5 +20,5 @@ export const photosTimelineElement: TimelineElementParameters = {
automatic resizing to multiple quality settings is also part of the pipeline.
`,
],
links: [new Open('https://photo.schmelczer.dev')],
links: [Open('https://photo.schmelczer.dev')],
};

View file

@ -1,5 +1,5 @@
import { Video } from '../../page/basics/video/video';
import { TimelineElementParameters } from '../../page/timeline/timeline-element/timeline-element';
import { TimelineElementParameters } from '../../page/timeline/timeline-element/timeline-element-parameters';
import platformMp4 from '../media/mp4/platform.mp4';
import platformPosterJpeg from '../media/platform.png?format=jpg';
import platformPosterWebP from '../media/platform.png?format=webp';

View file

@ -1,5 +1,5 @@
import { Preview } from '../../page/basics/preview/preview';
import { TimelineElementParameters } from '../../page/timeline/timeline-element/timeline-element';
import { TimelineElementParameters } from '../../page/timeline/timeline-element/timeline-element-parameters';
import sdf2dJpeg from '../media/sdf2d.png?format=jpg';
import sdf2dWebP from '../media/sdf2d.png?format=webp';
import { NPM, Open, Youtube } from '../shared';
@ -34,8 +34,8 @@ export const sdf2dTimelineElement: TimelineElementParameters = {
`,
],
links: [
new NPM('https://www.npmjs.com/package/sdf-2d'),
new Youtube('https://www.youtube.com/watch?v=K3cEtnZUNR0'),
new Open('https://sdf2d.schmelczer.dev'),
NPM('https://www.npmjs.com/package/sdf-2d'),
Youtube('https://www.youtube.com/watch?v=K3cEtnZUNR0'),
Open('https://sdf2d.schmelczer.dev'),
],
};

View file

@ -1,5 +1,5 @@
import { Image } from '../../page/basics/image/image';
import { TimelineElementParameters } from '../../page/timeline/timeline-element/timeline-element';
import { TimelineElementParameters } from '../../page/timeline/timeline-element/timeline-element-parameters';
import towersJpeg from '../media/towers.png?format=jpg';
import towersWebP from '../media/towers.png?format=webp';
import { GitHub, Open } from '../shared';
@ -22,7 +22,7 @@ export const towersTimelineElement: TimelineElementParameters = {
`,
],
links: [
new GitHub('https://github.com/schmelczerandras/life-towers/'),
new Open('https://towers.schmelczer.dev'),
GitHub('https://github.com/schmelczerandras/life-towers/'),
Open('https://towers.schmelczer.dev'),
],
};

View file

@ -1,13 +1,16 @@
import { ImageAnchorFactory } from '../page/basics/image-anchor/image-anchor';
import cvIcon from '../../static/icons/cv.svg';
import githubIcon from '../../static/icons/github.svg';
import openIcon from '../../static/icons/open.svg';
import cvIcon from '../../static/icons/cv.svg';
import packageIcon from '../../static/icons/package.svg';
import pythonIcon from '../../static/icons/python.svg';
import youtubeIcon from '../../static/icons/youtube.svg';
import { ImageAnchorFactory } from '../page/basics/image-anchor/image-anchor';
export const GitHub = ImageAnchorFactory(githubIcon, 'Open on GitHub');
export const NPM = ImageAnchorFactory(packageIcon, 'Open on npm');
export const PyPi = ImageAnchorFactory(pythonIcon, 'Open on PyPi');
export const Open = ImageAnchorFactory(openIcon, 'Open in new tab');
export const Thesis = ImageAnchorFactory(cvIcon, 'Download thesis');
export const Thesis = ImageAnchorFactory(cvIcon, 'Download thesis', {
shouldDownload: true,
});
export const Youtube = ImageAnchorFactory(youtubeIcon, 'Open on YouTube');