diff --git a/package-lock.json b/package-lock.json index 071b230..337b63a 100644 --- a/package-lock.json +++ b/package-lock.json @@ -14,9 +14,11 @@ "@mui/icons-material": "^6.0.1", "@mui/material": "^6.0.1", "@tanstack/react-query": "^5.53.1", + "@types/howler": "^2.2.11", "apollo3-cache-persist": "^0.15.0", "date-fns": "^3.6.0", "graphql": "^16.9.0", + "howler": "^2.2.4", "react": "^18.3.1", "react-dom": "^18.3.1", "react-icons": "^5.3.0", @@ -2355,6 +2357,11 @@ "integrity": "sha512-/kYRxGDLWzHOB7q+wtSUQlFrtcdUccpfy+X+9iMBpHK8QLLhx2wIPYuS5DYtR9Wa/YlZAbIovy7qVdB1Aq6Lyw==", "dev": true }, + "node_modules/@types/howler": { + "version": "2.2.11", + "resolved": "https://registry.npmjs.org/@types/howler/-/howler-2.2.11.tgz", + "integrity": "sha512-7aBoUL6RbSIrqKnpEgfa1wSNUBK06mn08siP2QI0zYk7MXfEJAaORc4tohamQYqCqVESoDyRWSdQn2BOKWj2Qw==" + }, "node_modules/@types/json-schema": { "version": "7.0.12", "resolved": "https://registry.npmjs.org/@types/json-schema/-/json-schema-7.0.12.tgz", @@ -3491,6 +3498,11 @@ "react-is": "^16.7.0" } }, + "node_modules/howler": { + "version": "2.2.4", + "resolved": "https://registry.npmjs.org/howler/-/howler-2.2.4.tgz", + "integrity": "sha512-iARIBPgcQrwtEr+tALF+rapJ8qSc+Set2GJQl7xT1MQzWaVkFebdJhR3alVlSiUf5U7nAANKuj3aWpwerocD5w==" + }, "node_modules/human-signals": { "version": "2.1.0", "resolved": "https://registry.npmjs.org/human-signals/-/human-signals-2.1.0.tgz", diff --git a/package.json b/package.json index 23ca4dc..09717cc 100644 --- a/package.json +++ b/package.json @@ -18,9 +18,11 @@ "@mui/icons-material": "^6.0.1", "@mui/material": "^6.0.1", "@tanstack/react-query": "^5.53.1", + "@types/howler": "^2.2.11", "apollo3-cache-persist": "^0.15.0", "date-fns": "^3.6.0", "graphql": "^16.9.0", + "howler": "^2.2.4", "react": "^18.3.1", "react-dom": "^18.3.1", "react-icons": "^5.3.0", diff --git a/public/scary-elevator-short.mp3 b/public/scary-elevator-short.mp3 new file mode 100644 index 0000000..a55c942 Binary files /dev/null and b/public/scary-elevator-short.mp3 differ diff --git a/src/components/composant-ecran.tsx b/src/components/composant-ecran.tsx index 8ac7fd6..cc83062 100644 --- a/src/components/composant-ecran.tsx +++ b/src/components/composant-ecran.tsx @@ -5,6 +5,7 @@ import {format} from "date-fns"; import {ConfigEcran, Talk} from "src/types.ts"; import {AFFICHES_ZONE} from "src/data/configsAffichagesZones.ts"; import { + ASCENSEUR_EFFRAYANT, ECRAN_ESCALIER_TITAN, ECRANS_ASCENSEUR_SPEAKER, ECRANS_COULOIR_GRANDE_HALL, @@ -17,6 +18,7 @@ import {DefaultRemotion} from "src/remotion/components/default-remotion.tsx"; import {GrandEcranTitanRemotion} from "src/remotion/components/grand-ecran-titan-remotion.tsx"; import {EcranPlatGrandeGalerieRemotion} from "src/remotion/components/ecran-plat-grande-galerie-remotion.tsx"; import {AffichageZoneRemotion} from "src/remotion/components/affichage-zone-remotion.tsx"; +import {ScaryElevatorRemotion} from "src/remotion/components/scary-elevator-remotion.tsx"; export const ComposantEcran: React.FC<{ planning?: Talk[] } & ConfigEcran> = ({planning, ...configEcran}) => { @@ -46,6 +48,9 @@ export const ComposantEcran: React.FC<{ planning?: Talk[] } & ConfigEcran> = ({p if (estParmisEcrans(configEcran.id, ECRANS_ASCENSEUR_SPEAKER)) { return } + if (configEcran.id == ASCENSEUR_EFFRAYANT.id) { + return + } if (configEcran.directions) { return } diff --git a/src/components/superviseur.tsx b/src/components/superviseur.tsx index 0d4fc9e..6a670d6 100644 --- a/src/components/superviseur.tsx +++ b/src/components/superviseur.tsx @@ -1,4 +1,12 @@ -import {ECRANS, ECRANS_AUTRES, ECRANS_DIRECTION, ECRANS_SALLES} from "src/data/Ecrans.ts"; +import { + ECRANS, + ECRANS_ASCENSEUR, + ECRANS_AUTRES, + ECRANS_BARS, + ECRANS_DIRECTION, + ECRANS_SALLES, + ECRANS_VESTIAIRE +} from "src/data/Ecrans.ts"; import React from "react"; import {ConfigEcran} from "src/types.ts"; import {useSearchParams} from "react-router-dom"; @@ -21,24 +29,34 @@ export function Superviseur() { style={{marginRight: '10px'}}>[{ecran.id}] {ecran.nom} }) } -

Salles

-
- {ECRANS_SALLES.map((ecran) => { - return ; - })} -
-

Directions

-
- {ECRANS_DIRECTION.map((ecran) => { - return ; - })} -
-

Autres

-
- {ECRANS_AUTRES.map((ecran) => { - return ; - })} -
+ {[{ + title: "Salles", + ecrans: ECRANS_SALLES + }, { + title: "Directions", + ecrans: ECRANS_DIRECTION + }, { + title: "Autres", + ecrans: ECRANS_AUTRES + }, { + title: "Ascenseurs", + ecrans: ECRANS_ASCENSEUR + }, { + title: "Bars", + ecrans: ECRANS_BARS + }, { + title: "Vestiaire", + ecrans: ECRANS_VESTIAIRE + }].map(({title, ecrans}) => ( + <> +

{title}

+
+ {ecrans.map((ecran) => { + return ; + })} +
+ + ))} ; } diff --git a/src/data/Ecrans.ts b/src/data/Ecrans.ts index f410096..e4d8038 100644 --- a/src/data/Ecrans.ts +++ b/src/data/Ecrans.ts @@ -413,16 +413,17 @@ export const ECRANS_ASCENSEUR_SPEAKER: ConfigEcran[] = [ tags: ['ascenseur'], } ] +export const ASCENSEUR_EFFRAYANT: ConfigEcran = { + id: 'ASC3', + nom: 'Ascenseur', + ratio: '16_9', + resolution: '1920x1080', + orientation: 'landscape', + tags: ['ascenseur'], +}; export const ECRANS_ASCENSEUR: ConfigEcran[] = [ ...ECRANS_ASCENSEUR_SPEAKER, - { - id: 'ASC3', - nom: 'Ascenseur', - ratio: '16_9', - resolution: '1920x1080', - orientation: 'landscape', - tags: ['ascenseur'], - } + ASCENSEUR_EFFRAYANT ] export const ECRANS_VESTIAIRE: ConfigEcran[] = [ diff --git a/src/main.tsx b/src/main.tsx index fcadeb4..c72cbcb 100644 --- a/src/main.tsx +++ b/src/main.tsx @@ -12,11 +12,9 @@ import {Superviseur} from "src/components/superviseur.tsx"; let buildTime: string ReactDOM.createRoot(document.getElementById('root')!).render( - - - - - , + + + ) function App() { diff --git a/src/remotion/components/default-remotion.tsx b/src/remotion/components/default-remotion.tsx index cc0c068..f76c187 100644 --- a/src/remotion/components/default-remotion.tsx +++ b/src/remotion/components/default-remotion.tsx @@ -5,6 +5,7 @@ import { import {DevfestNantesDefault} from "src/remotion/compositions/showcases/devfestNantes/DevfestNantesDefault.tsx"; import {Player} from "@remotion/player"; + export const DefaultRemotion: React.FC<{ portrait?: boolean }> = ({portrait}) => { const currentTemplate = portrait ? { compositionName: 'DevfestNantesDefaultTotem', diff --git a/src/remotion/components/scary-elevator-remotion.tsx b/src/remotion/components/scary-elevator-remotion.tsx new file mode 100644 index 0000000..983969d --- /dev/null +++ b/src/remotion/components/scary-elevator-remotion.tsx @@ -0,0 +1,26 @@ +import React from "react"; +import {Howl} from 'howler'; +import {DefaultRemotion} from "src/remotion/components/default-remotion.tsx"; + + +export const ScaryElevatorRemotion: typeof DefaultRemotion = (props) => { + + const sound = React.useMemo(() => new Howl({ + src: ['scary-elevator-short.mp3'], + volume: 0.1 + }), []) + + React.useEffect(() => { + const interval = setInterval(() => { + sound.play() + }, 60000) + return () => { + sound.stop() + clearInterval(interval) + } + }, []) + return <> +
sound.play()}>
+ + +} \ No newline at end of file