32 lines
1.1 KiB
TypeScript
32 lines
1.1 KiB
TypeScript
import React, { useCallback } from "react"
|
|
import styles from '../styles/Background.module.css';
|
|
import Tower from "./Tower";
|
|
import Army from "./Army";
|
|
import MarchingBand from "./MarchingBand";
|
|
import MusicPlayer from "./MusicPlayer";
|
|
import { usePlayer } from "../providers/PlayerProvider";
|
|
|
|
const Scene = () => {
|
|
const { isRegistered } = usePlayer();
|
|
const handleMusicReady = useCallback((unmute: () => void) => {
|
|
if (isRegistered) {
|
|
unmute();
|
|
}
|
|
}, [isRegistered]);
|
|
|
|
return <div className={styles.frame}>
|
|
<div className={`${styles.air} ${styles.background_asset}`} />
|
|
<div className={`${styles.clouds_small} ${styles.background_asset}`} />
|
|
<div className={`${styles.clouds_large} ${styles.background_asset}`} />
|
|
<Tower />
|
|
<div className={`${styles.mountains} ${styles.background_asset}`} />
|
|
<div className={`${styles.village} ${styles.background_asset}`} />
|
|
<MarchingBand />
|
|
<div className={`${styles.bonfire} ${styles.background_asset}`} />
|
|
<Army />
|
|
<MusicPlayer onReady={handleMusicReady} />
|
|
</div>
|
|
}
|
|
|
|
export default Scene
|