diff --git a/packages/client/public/sprite.symbol.svg b/packages/client/public/sprite.symbol.svg index e1635f5..cecf697 100644 --- a/packages/client/public/sprite.symbol.svg +++ b/packages/client/public/sprite.symbol.svg @@ -88,5 +88,7 @@ - + + + \ No newline at end of file diff --git a/packages/client/src/assets/images/svg/pause-help-fullscreen-controll-bg.svg b/packages/client/src/assets/images/svg/pause-help-fullscreen-controll-bg.svg new file mode 100644 index 0000000..667c9f4 --- /dev/null +++ b/packages/client/src/assets/images/svg/pause-help-fullscreen-controll-bg.svg @@ -0,0 +1,200 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/packages/client/src/pages/Game/Game.tsx b/packages/client/src/pages/Game/Game.tsx index 5b7b940..1fc7b0e 100644 --- a/packages/client/src/pages/Game/Game.tsx +++ b/packages/client/src/pages/Game/Game.tsx @@ -1,13 +1,13 @@ import GameInfo from '@/assets/images/game-info.jpg' -import { Game as GamePrototype } from '@/components/Game/Game' import { Modal } from '@/components/common/Modal/Modal' +import { Game as GamePrototype } from '@/components/Game/Game' import { Button } from '@/components/ui/Button/Button' import { CustomPageTitle } from '@/components/ui/CustomPageTitle/CustomPageTitle' import { useEffect, useState } from 'react' import { Arrows } from './components/Arrows/Arrows' import { FireControll } from './components/FireControll/FireControll' import { KillsCounter } from './components/KillsCounter/KillsCounter' -import { PauseHelp } from './components/PauseHelp/PauseHelp' +import { PauseHelpFullscreen } from './components/PauseHelp/PauseHelpFullscreen' import './Game.scss' export const Game = () => { @@ -113,7 +113,7 @@ export const Game = () => { tagName="span" /> - void } -export const PauseHelp = (props: PauseHelpPropsType) => { +export const PauseHelpFullscreen = (props: PauseHelpPropsType) => { const { pauseHandler, helpHandler, className = '' } = props + const toggleFullscreen = () => { + const isFullscreenMode = document.fullscreenElement + + if (isFullscreenMode) { + document.exitFullscreen() + } else { + document.documentElement.requestFullscreen() + } + } + return (
@@ -25,6 +35,12 @@ export const PauseHelp = (props: PauseHelpPropsType) => { onClick={pauseHandler}> + + + +
)