diff --git a/vocodes/public/full/christopher-lee-full.png b/vocodes/public/full/christopher-lee-full.png new file mode 100644 index 0000000000..63c68fee6e Binary files /dev/null and b/vocodes/public/full/christopher-lee-full.png differ diff --git a/vocodes/public/full/danny-devito-full.png b/vocodes/public/full/danny-devito-full.png new file mode 100644 index 0000000000..87ca2a8e72 Binary files /dev/null and b/vocodes/public/full/danny-devito-full.png differ diff --git a/vocodes/src/App.scss b/vocodes/src/App.scss index eec8bd2f97..0a41a24401 100644 --- a/vocodes/src/App.scss +++ b/vocodes/src/App.scss @@ -199,6 +199,11 @@ form { } .speaker_info_component { + .full_image { + img { + max-width: 800px; + } + } .speaker_avatar { float: left; img { @@ -402,6 +407,14 @@ form { width: $page-width; } } + + .speaker_info_component { + .full_image { + img { + max-width: $page-width; + } + } + } } @media screen and (min-width: 800px) { @@ -426,6 +439,14 @@ form { width: $page-width; } } + + .speaker_info_component { + .full_image { + img { + max-width: $page-width; + } + } + } } @media screen and (min-width: 1000px) { diff --git a/vocodes/src/model/Speakers.ts b/vocodes/src/model/Speakers.ts index bfa9d6e8c9..c62ee45c70 100644 --- a/vocodes/src/model/Speakers.ts +++ b/vocodes/src/model/Speakers.ts @@ -4,16 +4,18 @@ class Speaker { slug: string; description: string; avatarUrl?: string; + fullUrl?: string; - constructor(name: string, slug: string, description: string, avatarUrl?: string) { + constructor(name: string, slug: string, description: string, avatarUrl?: string, fullUrl?: string) { this.name = name; this.slug = slug; this.description = description; this.avatarUrl = avatarUrl; + this.fullUrl = fullUrl; } static fromJson(json: any) : Speaker { - return new Speaker(json.name, json.slug, json.description, json.avatarUrl); + return new Speaker(json.name, json.slug, json.description, json.avatarUrl, json.fullUrl); } getName() : string { @@ -35,6 +37,14 @@ class Speaker { getAvatar() : string | undefined { return this.avatarUrl; } + + hasFull() : boolean { + return this.fullUrl !== undefined; + } + + getFull() : string | undefined { + return this.fullUrl; + } } const SPEAKERS : Speaker[] = [ @@ -43,12 +53,14 @@ const SPEAKERS : Speaker[] = [ slug: "christopher-lee", description: "An actor well known for playing Count Dooku and Saruman.", avatarUrl: "christopher-lee.jpg", + fullUrl: "christopher-lee-full.png", }), Speaker.fromJson({ name: "Danny Devito", slug: "danny-devito", description: "Always delightful.", avatarUrl: "danny-devito.jpg", + fullUrl: "danny-devito-full.png", }), Speaker.fromJson({ name: "Gilbert Gottfried", diff --git a/vocodes/src/modes/speak/extras/SpeakerInfo.tsx b/vocodes/src/modes/speak/extras/SpeakerInfo.tsx index 0c5fd60167..c298007f14 100644 --- a/vocodes/src/modes/speak/extras/SpeakerInfo.tsx +++ b/vocodes/src/modes/speak/extras/SpeakerInfo.tsx @@ -17,6 +17,16 @@ class SpeakerInfo extends React.Component { } public render() { + if (this.props.currentSpeaker.hasFull()) { + let source = `/full/${this.props.currentSpeaker.fullUrl!}`; + return ( +
+
+ +
+
+ ) + } return (