diff --git a/src/components/windows/WindowView.jsx b/src/components/windows/WindowView.jsx index 8ad7086..5e6fdae 100644 --- a/src/components/windows/WindowView.jsx +++ b/src/components/windows/WindowView.jsx @@ -16,6 +16,8 @@ import AppsManager from "../../features/apps/appsManager.js"; import { ClickAction } from "../actions/actions/ClickAction.jsx"; import { Actions } from "../actions/Actions.jsx"; import { useScreenDimensions } from "../../hooks/utils/screen.js"; +import { NAME } from "../../config/branding.config.js"; +import { setViewportIcon, setViewportTitle } from "../../features/utils/browser.utils.js"; /** * @typedef {object} windowProps @@ -83,6 +85,13 @@ export const WindowView = memo(({ id, app, size, position, onInteract, options, } }, [position, size, screenHeight, screenWidth]); + useEffect(() => { + if (active) { + setViewportTitle(`${title} | ${NAME}`); + setViewportIcon(iconUrl); + } + }, [active, iconUrl, title]); + const close = (event) => { event?.preventDefault(); windowsManager.close(id); diff --git a/src/components/windows/WindowsView.jsx b/src/components/windows/WindowsView.jsx index 6a1b277..ad379f9 100644 --- a/src/components/windows/WindowsView.jsx +++ b/src/components/windows/WindowsView.jsx @@ -4,6 +4,8 @@ import { memo, useEffect, useState } from "react"; import { WindowView } from "./WindowView.jsx"; import { useSettingsManager } from "../../hooks/settings/settingsManagerContext.js"; import { SettingsManager } from "../../features/settings/settingsManager.js"; +import { NAME, TAG_LINE } from "../../config/branding.config.js"; +import { setViewportIcon, setViewportTitle } from "../../features/utils/browser.utils.js"; export const WindowsView = memo(() => { const settingsManager = useSettingsManager(); @@ -16,6 +18,11 @@ export const WindowsView = memo(() => { setSortedWindows([...windows].sort((windowA, windowB) => windowA.lastInteraction - windowB.lastInteraction )); + + if (windows.length === 0) { + setViewportTitle(`${NAME} | ${TAG_LINE}`); + setViewportIcon(`${process.env.PUBLIC_URL}/favicon.ico`); + } }, [windows]); // Launch startup apps @@ -34,7 +41,7 @@ export const WindowsView = memo(() => { { windowsManager.focus(id); }} - active={index === 0} + active={index === sortedWindows.length - 1} id={id} app={app} size={size} diff --git a/src/config/branding.config.js b/src/config/branding.config.js index f8178be..6f5587f 100644 --- a/src/config/branding.config.js +++ b/src/config/branding.config.js @@ -1,6 +1,7 @@ import { ANSI } from "./apps/terminal.config.js"; export const NAME = "Prozilla OS"; +export const TAG_LINE = "Web-based Operating System"; export const ASCII_LOGO = ` :. diff --git a/src/features/utils/browser.utils.js b/src/features/utils/browser.utils.js index 7b1c788..8de67f5 100644 --- a/src/features/utils/browser.utils.js +++ b/src/features/utils/browser.utils.js @@ -31,4 +31,24 @@ export function isValidUrl(string) { } catch (err) { return false; } +} + +/** + * @param {string} title + */ +export function setViewportTitle(title) { + document.title = title; +} + +/** + * @param {string} url + */ +export function setViewportIcon(url) { + let link = document.querySelector("link[rel~='icon']"); + if (!link) { + link = document.createElement("link"); + link.rel = "icon"; + document.head.appendChild(link); + } + link.href = url; } \ No newline at end of file