CSSQuake

 (cssquake.com)
1 puntos por GN⁺ 4 시간 전 | 1 comentarios | Compartir por WhatsApp
  • Demo de CSSQuake que ejecuta Quake en el navegador; la página muestra la inicialización de cssQuake v0.230 junto con el estado coming soon!
  • El renderizado está a cargo de PolyCSS renderer v0.2.6, y se pueden ver los registros de carga de manifest, progs, definitions, weapon model y los recursos de id1/pak0.pak
  • El juego incluido es Quake Shareware version 1.06, y se muestra el aviso de copyright Quake (C) 1996 id Software, Inc.
  • La pantalla de multijugador ofrece configuraciones de nombre, color, mapa, fraglimit, timelimit y máximo de jugadores, además de las acciones Create, Join y Copy Link
  • También se muestran las instrucciones de control y los toggles de depuración, por lo que la página actualmente presenta tanto la demo en ejecución como la interfaz de configuración

Demo de Quake inicializada en el navegador

  • El título de la página es cssQuake - Powered by PolyCSS y en el cuerpo se muestran v0.230 y coming soon!
  • En el registro inferior aparece === cssQuake v0.230 initialized ===
  • El estado de carga se muestra en este orden
    • Host_Init
    • Loaded manifest
    • Loaded progs
    • Loaded definitions
    • Weapon model
    • Assets from id1/pak0.pak
  • En el área de rendimiento se muestran 0 FPS y 0 MS
  • Los enlaces relacionados son cssQuake GitHub, id Software Quake GitHub y Layoutit

Configuración de multijugador y controles

  • En el menú Multiplayer se pueden configurar el nombre, color, mapa, fraglimit, timelimit y la cantidad máxima de jugadores
    • El mapa predeterminado que se muestra es E1M1 the Slipgate Complex
    • Los botones de acción son Create, Join, Copy Link
  • En la lista de mapas aparecen los siguientes elementos
    • E1M1 the Slipgate Complex
    • E1M2 Castle of the Damned
    • E1M3 the Necropolis
    • E1M4 the Grisly Grotto
    • E1M5 Gloom Keep
    • E1M6 The Door To Chthon
    • E1M7 The House of Chthon
    • E1M8 Ziggurat Vertigo
  • La guía de controles se divide en Gameplay y Menu
    • Gameplay: movimiento con WASD, vista con Mouse, disparo con Click, salto con Space, correr con Shift, agacharse con Ctrl
    • Menu: navegación con las flechas, selección con Enter, volver con Esc
  • En las configuraciones de Debug y Gameplay se muestran los siguientes toggles
    • Show outlines, Show stats panel, Show FPS panel
    • Ajuste de Crosshair
    • Dynamic lighting, Mute sounds, Show particles, Show enemies
    • Disable damage, Disable movement, Disable attacks, Invert mouse

Lecturas relacionadas

1 comentarios

 
GN⁺ 4 시간 전
Comentarios en Hacker News

  • Es un logro impresionante, pero me inquieta pensar que Quake en una PC Pentium-133 de los 90 corría más fluido que en mi Mac M1 Pro

    • Este motor no está optimizado en rendimiento. Al fin y al cabo, usa CSS
    • Como referencia, en Chrome sobre M2 corre suave como mantequilla, pero en Safari parece trabarse y recortarse bastante
    • En Firefox + Linux no hay ningún problema. En cambio, Gnome Web se entrecorta y se ve raro. Parece un problema del lado de WebKit/Safari
    • Si fuera Quake compilado en C, en el M1 correría rapidísimo incluso a resolución completa 8K
    • Espera, ¿Quake corría en un Pentium-133? Yo usaba un Pentium MMX de 233 MHz y pensé que ni así iba a correr bien, así que ni intenté conseguirlo

  • Está genial. Más difícil de cerrar que vim

    • Si quieres ver el menú, presiona Tab. Para volver al juego, haz clic fuera de los elementos del menú
    • ¿Cómo lo cerraste? Parece que nada responde

  • Impresionante. ¿Esto no es solo un renderizador hecho para usar CSS, sino una reimplementación completa del motor y de toda la lógica del juego? Lo parece porque hay bastantes cosas que se comportan distinto al original
    Por ejemplo, algunos botones se activan disparándoles en vez de tocarlos, y algunas puertas secretas se abren al tocarlas en vez de dispararles

    • ¡Hola! Gracias por reportarlo; los botones ya deberían funcionar correctamente
      Del lado de la lógica del juego, en la etapa de build se ejecuta un pequeño extractor en JS sobre QuakeC/progs.dat para generar JSON con información base como estados, modelos, ataques y sonidos. El runtime en el navegador está en TypeScript y usa esa información para implementar una jugabilidad similar a Quake
    • No, eso aplica solo al renderizador. El juego en sí está en TypeScript

  • Es la primera cosa que veo en internet en mucho tiempo que de verdad me hizo reír
    También revisé https://cssdoom.wtf/ y eso también estuvo buenísimo. Ambos son mucho más ligeros y agradables que las noticias de actualidad estos días \o/

  • Parece que este CSS Quake necesita JS para ejecutarse

    • ¿Tal vez sería posible con https://lyra.horse/x86css/?
    • CSS se encarga del renderizado, y la lógica del juego está en TypeScript

  • Aunque detesto con pasión la proliferación de CSS como hack sobre hack, y en general del stack web CSS/JS/HTML, creo que este es un uso excelente y totalmente legítimo de CSS :)

  • ¿Esto está tomado de https://github.com/NielsLeenheer/cssDOOM?

  • Muy genial. Me da curiosidad saber hasta dónde llegan los límites. Veo un perro al que le dispararon flotando en el aire; ¿eso será por CSS o es algo que se puede arreglar?

    • .dog { display: float; }

  • Es impresionante, pero siento que este tipo de cosas no deberían ser posibles con un lenguaje de estilos declarativo

    • CSS se usa solo para el renderizado, no para la lógica del juego

  • Wow, está realmente genial. Corre muy fluido. Es increíblemente raro que, incluso después de unos 25 años, la memoria muscular siga intacta