-
-
Notifications
You must be signed in to change notification settings - Fork 1
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
feat: Création de la page de speaker (#21)
* feat: Page de speaker * feat: Gestion de la page de speaker * feat: Ajout de la photo des speakers * test: Test sur les pages * refactor: Renommage de la vue speakers en speakerList
- Loading branch information
1 parent
98f0d21
commit 4f3e90c
Showing
17 changed files
with
9,332 additions
and
475 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,100 @@ | ||
| import { Actionable, Container, Flex, Flexible, Image, Text, Wrap, colors } from "@lenra/components"; | ||
| import { sessions, speakers } from "../../camping-data.js"; | ||
| import { buildContentChildren } from "../../utils/contentDescriber.js"; | ||
|
|
||
| export default function (_data, /* _props, */{ context: { pathParams } }) { | ||
| const speaker = speakers[pathParams.key]; | ||
| return Flex([ | ||
| header(speaker), | ||
| ...body(speaker), | ||
| ...sessionList(speaker), | ||
| ]) | ||
| .direction("vertical") | ||
| .spacing(16) | ||
| .crossAxisAlignment("stretch") | ||
| } | ||
|
|
||
| /** | ||
| * @param {Speaker} speaker | ||
| * @returns | ||
| */ | ||
| function header(speaker) { | ||
| const children = [ | ||
| Text(speaker.attributes.name) | ||
| .style({ | ||
| fontSize: 24, | ||
| fontWeight: "bold", | ||
| }) | ||
| ]; | ||
| if (speaker.attributes.company) { | ||
| children.push(Text(speaker.attributes.company) | ||
| .style({ | ||
| fontSize: 20, | ||
| fontWeight: "bold", | ||
| })); | ||
| } | ||
| const flex = Flex(children) | ||
| .direction("vertical") | ||
| if (speaker.attributes.photoURL) { | ||
| return Wrap([ | ||
| Image(speaker.attributes.photoURL) | ||
| .width(100) | ||
| .height(100), | ||
| flex | ||
| ]) | ||
| .spacing(16) | ||
| .alignment("center") | ||
| .crossAxisAlignment("center") | ||
| .runAlignment("center") | ||
| .runSpacing(16); | ||
| } | ||
| return flex; | ||
| } | ||
|
|
||
| /** | ||
| * @param {Speaker} speaker | ||
| * @returns | ||
| */ | ||
| function body(speaker) { | ||
| const children = buildContentChildren(speaker.children); | ||
| if (children.length > 1) | ||
| return [Flex(children).direction("vertical").spacing(8)]; | ||
| return children; | ||
| } | ||
|
|
||
| /** | ||
| * @param {Speaker} speaker | ||
| * @returns | ||
| */ | ||
| function sessionList(speaker) { | ||
| const elements = Object.values(sessions) | ||
| .filter(session => session.attributes.speakers.includes(speaker.attributes.key)) | ||
| .sort((a, b) => a.attributes.day - b.attributes.day || a.attributes.time.localeCompare(b.attributes.time)) | ||
| .map(session => | ||
| Actionable( | ||
| Flex([ | ||
| Text("•"), | ||
| Flexible(Text(session.attributes.title)), | ||
| ]) | ||
| .spacing(8) | ||
| .crossAxisAlignment("center") | ||
| ) | ||
| .onPressed("@lenra:navTo", { path: `/sessions/${session.attributes.key}` }) | ||
| ); | ||
| if (elements.length === 0) return []; | ||
| return [ | ||
| Container( | ||
| Text("") | ||
| ) | ||
| .color(colors.Colors.black) | ||
| .height(1), | ||
| Text("Séances") | ||
| .style({ | ||
| fontSize: 20, | ||
| fontWeight: "bold", | ||
| }), | ||
| Flex(elements) | ||
| .spacing(16) | ||
| .direction("vertical") | ||
| ]; | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,69 @@ | ||
| import { Actionable, Container, Flex, Image, Text, Wrap, borderRadius } from "@lenra/components"; | ||
| import { speakers } from "../../camping-data.js"; | ||
|
|
||
| export default function (_data, _props) { | ||
| const sortedSpeakers = Object.values(speakers).sort((a, b) => a.attributes.name.localeCompare(b.attributes.name)); | ||
| return Wrap( | ||
| sortedSpeakers.map(speaker => | ||
| Actionable( | ||
| Container.card( | ||
| Flex([ | ||
| Flex([ | ||
| Text(speaker.attributes.name) | ||
| .style({ | ||
| fontSize: 20, | ||
| fontWeight: "bold", | ||
| }), | ||
| Text(speaker.attributes.company ?? ""), | ||
| ]) | ||
| .direction("vertical") | ||
| .crossAxisAlignment("stretch"), | ||
| Container( | ||
| Image(speaker.attributes.photoURL ?? "") | ||
| .width(150) | ||
| .height(150) | ||
| .fit("cover") | ||
| .filterQuality("high") | ||
| .loadingPlaceholder(Text("Loading image...")) | ||
| .errorPlaceholder(Text("Failed to load image")), | ||
| ) | ||
| .width(150) | ||
| .height(150) | ||
| .borderRadius(borderRadius.all(75)) | ||
| // TODO: manage clip Behaviour, see https://github.com/lenra-io/lenra_cli/issues/270 | ||
| .alignment("center"), | ||
| Container( | ||
| // Manage socials | ||
| Flex( | ||
| speaker.attributes.socials?.map(social => | ||
| // TODO: manage link | ||
| Actionable( | ||
| Image(`socials/${social.icon}.png`) | ||
| .width(24) | ||
| .height(24) | ||
| .filterQuality("high") | ||
| ) | ||
| .onPressed("@lenra:navTo", { path: social.link }) | ||
| ) | ||
| ) | ||
| .spacing(16) | ||
| ) | ||
| .height(24) | ||
| .alignment("center"), | ||
| ]) | ||
| .direction("vertical") | ||
| .mainAxisAlignment("spaceBetween") | ||
| .crossAxisAlignment("center") | ||
| .fillParent(true) | ||
| ) | ||
| .width(276) | ||
| .height(276) | ||
| ) | ||
| .onPressed("@lenra:navTo", { path: `/speakers/${speaker.attributes.key}` }) | ||
| ) | ||
| ) | ||
| .runAlignment("spaceAround") | ||
| .spacing(32) | ||
| .runSpacing(32) | ||
| } | ||
|
|
Oops, something went wrong.