andras/fleeting-garden
andras/fleeting-garden
Watch
1
0
Fork
You've already forked fleeting-garden
 0
Code Issues Pull requests 10 Projects Releases Packages Wiki Activity Actions

Improve full-screen mode

Browse source
This commit is contained in:
Andras Schmelczer 2023-04-30 16:15:35 +01:00
commit fa103bcdf6
No known key found for this signature in database
GPG key ID: FC8F2C3D3D1A718C
5 changed files with 68 additions and 54 deletions
Download patch file Download diff file Expand all files Collapse all files

24
src/index.ts
View file

@ -2,8 +2,8 @@ import '../assets/icons/info.svg';
import GameLoop from './game-loop/game-loop';
import './index.scss';
import { applyArrayPlugins } from './utils/array';
import { FullScreenHandler } from './utils/full-screen-handler';
import { initializeGPU } from './utils/graphics/initialize-gpu';
import { handleFullScreen } from './utils/handle-full-screen';
declare global {
interface Array<T> {
@ -23,6 +23,7 @@ declare global {
}
const getElements = () => ({
aside: document.querySelector('aside') as HTMLDivElement,
infoButton: document.querySelector('button.info') as HTMLButtonElement,
minimizeFullScreenButton: document.querySelector(
'button.minimize-full-screen'
@ -40,11 +41,22 @@ const main = async () => {
applyArrayPlugins();
const elements = getElements();
handleFullScreen({
minimizeButton: elements.minimizeFullScreenButton,
maximizeButton: elements.maximizeFullScreenButton,
target: elements.canvasContainer,
});
const defaultTimeToLive = 3500;
const interval = 50;
let timeToLive = defaultTimeToLive;
setInterval(() => {
timeToLive = Math.max(0, timeToLive - interval);
elements.aside.style.opacity =
timeToLive == 0 && FullScreenHandler.isInFullScreenMode() ? '0' : '1';
}, interval);
elements.aside.addEventListener('mouseover', () => (timeToLive = defaultTimeToLive));
new FullScreenHandler(
elements.minimizeFullScreenButton,
elements.maximizeFullScreenButton,
document.body
);
const gpu = await initializeGPU();