Add avoid
This commit is contained in:
parent
d3927cc13c
commit
f41bab1156
5 changed files with 38 additions and 3 deletions
BIN
src/data/media/avoid.png
Normal file
BIN
src/data/media/avoid.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 136 KiB |
|
|
@ -10,6 +10,7 @@ import { UpArrowButton } from '../page/up-arrow-button/up-arrow-button';
|
||||||
import cvEnglish from './media/cv-andras-schmelczer.pdf';
|
import cvEnglish from './media/cv-andras-schmelczer.pdf';
|
||||||
import me from './media/me.jpg';
|
import me from './media/me.jpg';
|
||||||
import { adAstra } from './projects/ad-astra';
|
import { adAstra } from './projects/ad-astra';
|
||||||
|
import { avoid } from './projects/avoid';
|
||||||
import { citySimulation } from './projects/city-simulation';
|
import { citySimulation } from './projects/city-simulation';
|
||||||
import { declared } from './projects/declared';
|
import { declared } from './projects/declared';
|
||||||
import { forex } from './projects/forex';
|
import { forex } from './projects/forex';
|
||||||
|
|
@ -53,6 +54,7 @@ const main = new Main(
|
||||||
nuclear,
|
nuclear,
|
||||||
nuclearEditor,
|
nuclearEditor,
|
||||||
citySimulation,
|
citySimulation,
|
||||||
|
avoid,
|
||||||
platformGame,
|
platformGame,
|
||||||
photos,
|
photos,
|
||||||
leds,
|
leds,
|
||||||
|
|
|
||||||
18
src/data/projects/avoid.ts
Normal file
18
src/data/projects/avoid.ts
Normal file
|
|
@ -0,0 +1,18 @@
|
||||||
|
import { Preview } from '../../page/preview/preview';
|
||||||
|
import { TimelineElementParameters } from '../../page/timeline-element/timeline-element-parameters';
|
||||||
|
import avoidPoster from '../media/avoid.png';
|
||||||
|
import { Open } from '../shared';
|
||||||
|
|
||||||
|
export const avoid: TimelineElementParameters = {
|
||||||
|
title: 'Avoid',
|
||||||
|
date: '2018 January',
|
||||||
|
figure: new Preview(
|
||||||
|
avoidPoster,
|
||||||
|
'https://schmelczer.dev/avoid',
|
||||||
|
'A webpage showcasing the SDF-2D project.'
|
||||||
|
),
|
||||||
|
description:
|
||||||
|
"I recently found my first-ever web game. It's incredibly simple but I killed some time with it, so feel free to try it out but don't judge too harshly.",
|
||||||
|
|
||||||
|
links: [Open('https://schmelczer.dev/avoid')],
|
||||||
|
};
|
||||||
|
|
@ -7,6 +7,6 @@ export interface TimelineElementParameters {
|
||||||
figure: html | Video | Preview;
|
figure: html | Video | Preview;
|
||||||
title: string;
|
title: string;
|
||||||
description: string;
|
description: string;
|
||||||
more: Array<string>;
|
more?: Array<html>;
|
||||||
links: Array<html>;
|
links: Array<html>;
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -5,7 +5,7 @@ import { generate } from './timeline-element.html';
|
||||||
|
|
||||||
export class TimelineElement extends PageElement {
|
export class TimelineElement extends PageElement {
|
||||||
private isOpen = false;
|
private isOpen = false;
|
||||||
private more: HTMLElement;
|
private readonly more?: HTMLElement;
|
||||||
|
|
||||||
public constructor(
|
public constructor(
|
||||||
private timelineElement: TimelineElementParameters,
|
private timelineElement: TimelineElementParameters,
|
||||||
|
|
@ -14,9 +14,12 @@ export class TimelineElement extends PageElement {
|
||||||
) {
|
) {
|
||||||
super(generate(timelineElement, showMore));
|
super(generate(timelineElement, showMore));
|
||||||
this.more = this.query('.more');
|
this.more = this.query('.more');
|
||||||
|
|
||||||
addEventListener('resize', this.handleResize.bind(this));
|
addEventListener('resize', this.handleResize.bind(this));
|
||||||
|
|
||||||
this.query('.info-button').addEventListener('click', this.toggleOpen.bind(this));
|
if (this.more) {
|
||||||
|
this.query('.info-button').addEventListener('click', this.toggleOpen.bind(this));
|
||||||
|
}
|
||||||
|
|
||||||
this.attachElementByReplacing(
|
this.attachElementByReplacing(
|
||||||
'.figure',
|
'.figure',
|
||||||
|
|
@ -43,6 +46,10 @@ export class TimelineElement extends PageElement {
|
||||||
}
|
}
|
||||||
|
|
||||||
private openMore() {
|
private openMore() {
|
||||||
|
if (!this.more) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
this.isOpen = true;
|
this.isOpen = true;
|
||||||
|
|
||||||
this.query('.info-button > p').innerText = this.showLess;
|
this.query('.info-button > p').innerText = this.showLess;
|
||||||
|
|
@ -52,6 +59,10 @@ export class TimelineElement extends PageElement {
|
||||||
}
|
}
|
||||||
|
|
||||||
private closeMore() {
|
private closeMore() {
|
||||||
|
if (!this.more) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
this.isOpen = false;
|
this.isOpen = false;
|
||||||
|
|
||||||
this.query('.info-button > p').innerText = this.showMore;
|
this.query('.info-button > p').innerText = this.showMore;
|
||||||
|
|
@ -60,6 +71,10 @@ export class TimelineElement extends PageElement {
|
||||||
}
|
}
|
||||||
|
|
||||||
private handleResize() {
|
private handleResize() {
|
||||||
|
if (!this.more) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
if (this.isOpen) {
|
if (this.isOpen) {
|
||||||
this.more.style.height = 'auto';
|
this.more.style.height = 'auto';
|
||||||
setTimeout(this.openMore.bind(this), 100);
|
setTimeout(this.openMore.bind(this), 100);
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue