Web OS

Prompt

Actúa como un Desarrollador Frontend Senior experto en interfaces web interactivas, sistemas operativos simulados y JavaScript moderno (Vanilla JS). Tu objetivo es crear un simulador de sistema operativo web (WebOS / Windows Simulator) desde cero utilizando HTML5, CSS3 y JavaScript puro (en un diseño modular, limpio y sin errores). El sistema operativo debe incluir estrictamente las siguientes características y funcionalidades: 1. Interfaz de Escritorio y Barra de Tareas: - Diseño moderno, limpio y fluido estilo Windows/WebOS. - Uso de iconos SVG personalizados para las aplicaciones del sistema. - Ventanas flotantes interactivas que se puedan arrastrar, minimizar, maximizar y cerrar. - Animaciones suaves en la interfaz (por ejemplo, efectos al pasar el cursor o presionar los iconos). 2. Navegador Web Integrado y Gestor de Cookies: - Una aplicación de "Navegador" dentro del simulador con barra de direcciones simulada. - Un Administrador de Cookies accesible desde el navegador o ajustes, que permita ver, listar y eliminar las cookies almacenadas (usando localStorage o sessionStorage por debajo). 3. Aplicación de Ajustes (Settings): - Una app de configuración que incluya un control deslizante (slider) para ajustar el brillo de la pantalla. - Este control debe modificar en tiempo real la opacidad o un filtro oscuro superpuesto en todo el simulador para simular el cambio de brillo de manera realista. 4. Sistema de Instalación de Apps mediante Etiquetas de Texto: - Una aplicación llamada "Instalador" que contenga un área de texto (textarea) donde el usuario pueda pegar un texto con metadatos personalizados. - El sistema debe parsear (analizar) automáticamente el texto buscando las siguientes etiquetas: * Para el nombre de la app: <install app name>NombreDeLaApp</install app name> * Para el icono: <icon app link="URL_DEL_SVG_O_IMAGEN"></icon> (o el atributo correspondiente). - Al hacer clic en un botón de "Instalar", el sistema debe procesar estas etiquetas, crear la app de forma dinámica y generar un acceso directo exclusivamente en el escritorio con el icono SVG/imagen indicado. Al hacer clic en ese acceso directo en el escritorio, debe abrirse una ventana funcional para esa nueva app. Requisitos técnicos obligatorios: - Código estructurado, limpio, comentado y optimizado. - Estilos CSS modernos (uso de Flexbox/Grid, variables CSS para temas y transiciones fluidas). - JavaScript modular y libre de errores de consola (manejo correcto del DOM y eventos). - Entrega todo el código dividido o integrado de forma clara (HTML, CSS, JS) listo para funcionar en el navegador.

A system prompt was added to support web rendering