CSSQuake

 (cssquake.com)
1 poin oleh GN⁺ 4 jam lalu | 1 komentar | Bagikan ke WhatsApp
  • Demo CSSQuake yang menjalankan Quake di browser, dengan halaman menampilkan inisialisasi cssQuake v0.230 dan status coming soon!
  • Rendering ditangani oleh PolyCSS renderer v0.2.6, dan log pemuatan untuk aset manifest, progs, definitions, weapon model, serta id1/pak0.pak dapat dilihat
  • Game yang disertakan adalah Quake Shareware version 1.06, dengan keterangan hak cipta Quake (C) 1996 id Software, Inc. ditampilkan
  • Layar multipemain menyediakan pengaturan nama, warna, peta, fraglimit, timelimit, pemain maksimum, serta tindakan Create, Join, Copy Link
  • Panduan kontrol hingga toggle debug juga ditampilkan, sehingga halaman saat ini memperlihatkan demo yang berjalan beserta UI pengaturannya

Demo Quake yang diinisialisasi di browser

  • Judul halaman adalah cssQuake - Powered by PolyCSS, dan di isi halaman ditampilkan v0.230 serta coming soon!
  • Pada log bagian bawah muncul === cssQuake v0.230 initialized ===
  • Status pemuatan ditampilkan dalam urutan berikut
    • Host_Init
    • Loaded manifest
    • Loaded progs
    • Loaded definitions
    • Weapon model
    • Assets from id1/pak0.pak
  • Area indikator performa menampilkan 0 FPS dan 0 MS
  • Tautan terkait adalah cssQuake GitHub, id Software Quake GitHub, Layoutit

Multipemain dan pengaturan kontrol

  • Di menu Multiplayer, pengguna dapat mengatur nama, warna, peta, fraglimit, timelimit, dan jumlah pemain maksimum
    • Tampilan peta default adalah E1M1 the Slipgate Complex
    • Tombol tindakannya adalah Create, Join, Copy Link
  • Daftar peta menampilkan item berikut
    • 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
  • Panduan kontrol dibagi menjadi Gameplay dan Menu
    • Gameplay: gerak dengan WASD, pandangan dengan Mouse, tembak dengan Click, lompat dengan Space, lari dengan Shift, jongkok dengan Ctrl
    • Menu: navigasi dengan tombol arah, pilih dengan Enter, kembali dengan Esc
  • Di pengaturan Debug dan Gameplay ditampilkan toggle berikut
    • Show outlines, Show stats panel, Show FPS panel
    • Penyesuaian Crosshair
    • Dynamic lighting, Mute sounds, Show particles, Show enemies
    • Disable damage, Disable movement, Disable attacks, Invert mouse

Bacaan terkait

1 komentar

 
GN⁺ 4 jam lalu
Komentar Hacker News

  • Pencapaian yang luar biasa, tapi agak mengganggu karena rasanya Quake yang jalan di PC Pentium-133 era 90-an dulu lebih mulus daripada di Mac M1 Pro saya

    • Engine ini memang bukan sesuatu yang dioptimalkan untuk performa. Soalnya pada akhirnya tetap memakai CSS
    • Sebagai catatan, di Chrome pada M2 ini berjalan mulus seperti mentega, tapi di Safari terasa tersendat dan banyak terpotong
    • Di Firefox + Linux sama sekali tidak ada masalah. Tapi Gnome Web tersendat dan aneh. Sepertinya ini masalah di sisi WebKit/Safari
    • Kalau ini Quake yang dikompilasi dalam C, di M1 kemungkinan bakal jalan super cepat bahkan pada resolusi penuh 8K
    • Tunggu, Quake memang jalan di Pentium-133? Saya pakai Pentium MMX 233MHz dan mengira itu tidak akan jalan dengan baik, jadi bahkan tidak pernah terpikir untuk mencobanya

  • Keren. Lebih sulit ditutup daripada vim

    • Kalau mau melihat menu, tekan Tab. Untuk kembali ke game, klik di luar item menu
    • Kamu menutupnya bagaimana? Kelihatannya tidak ada yang bereaksi

  • Mengesankan. Benarkah ini bukan cuma renderer yang dibuat memakai CSS, tapi juga seluruh engine dan logika game diimplementasikan ulang? Soalnya ada cukup banyak bagian yang perilakunya berbeda dari versi aslinya
    Misalnya, beberapa tombol harus ditembak alih-alih disentuh agar berfungsi, dan beberapa pintu rahasia terbuka saat disentuh alih-alih ditembak

    • Halo! Terima kasih atas laporannya, dan sekarang tombolnya seharusnya sudah berfungsi dengan benar
      Untuk sisi logika game, pada tahap build saya menjalankan ekstraktor JS kecil di atas QuakeC/progs.dat untuk menghasilkan JSON berisi informasi sumber seperti state, model, serangan, dan suara. Runtime browser-nya memakai TypeScript, dan menggunakan informasi itu untuk mengimplementasikan permainan yang mirip Quake
    • Bukan, yang seperti itu hanya renderernya. Game-nya sendiri ditulis dalam TypeScript

  • Sudah lama sekali saya tidak melihat sesuatu di internet yang benar-benar membuat saya tertawa tulus untuk pertama kalinya
    Saya juga cek https://cssdoom.wtf/ dan itu juga bagus. Keduanya terasa jauh lebih ringan dan menyenangkan daripada berita aktual akhir-akhir ini \o/

  • CSS Quake ini tampaknya butuh JS untuk bisa berjalan

  • Meski saya sangat tidak suka penyebaran lapisan hack di atas hack bernama CSS, dan juga sangat membenci web stack CSS/JS/HTML, saya tetap menganggap ini sebagai contoh penggunaan CSS yang hebat dan sah :)

  • Apakah ini diambil dari https://github.com/NielsLeenheer/cssDOOM?

  • Sangat keren. Saya penasaran batasnya sampai di mana. Saya melihat anjing yang tertembak melayang di udara — apakah ini karena CSS, atau sesuatu yang bisa diperbaiki?

    • .dog { display: float; }

  • Mengesankan, tapi rasanya hal seperti ini seharusnya tidak mungkin dilakukan dengan bahasa gaya deklaratif

    • CSS hanya dipakai untuk rendering, bukan untuk logika game

  • Wow, ini benar-benar keren. Jalannya sangat mulus. Sulit dipercaya bahwa bahkan setelah sekitar 25 tahun, memori otot itu masih tetap ada