
BrowserHack: NetHack ported to the web - ivank
http://coolwanglu.github.io/BrowserHack/
======
jewbacca
This is fucking nuts!

 _All_ of the game code is Nethack's original C:
[https://github.com/coolwanglu/BrowserHack/tree/master/src](https://github.com/coolwanglu/BrowserHack/tree/master/src)

Porting is mainly accomplished by defining a windowing system for 'web'
(mostly in C), right next to the definitions for 'X11', 'Qt', etc:
[https://github.com/coolwanglu/BrowserHack/tree/master/win](https://github.com/coolwanglu/BrowserHack/tree/master/win)

And compiling through LLVM via Emscripten, resulting in a browser-runnable JS
target: [https://github.com/coolwanglu/BrowserHack/tree/gh-
pages](https://github.com/coolwanglu/BrowserHack/tree/gh-pages).

Absolutely incredible work all around.

\----

That said, fuck tilesets. ASCII graphics master race.

~~~
azakai
Another interesting technical detail is that the nethack code contains a lot
of synchronous stuff, which is generally hard to port to the web (where events
must be short-lived). To get around that, the port uses Emscripten's
emterpreter-async option to build (as you can see here:
[https://github.com/coolwanglu/BrowserHack/blob/master/build....](https://github.com/coolwanglu/BrowserHack/blob/master/build.sh#L25)
).

That runs the application in a little interpreter designed for Emscripten
output; the interpeter is capable of pausing and resuming code, so synchronous
code isn't a problem.

More details on emterpreter here:
[https://github.com/kripken/emscripten/wiki/Emterpreter](https://github.com/kripken/emscripten/wiki/Emterpreter)

------
schoen
I'm extremely impressed, although as someone who learned NetHack without
tilesets, it's hard for me to imagine wanting to play a multihour game with
tilesets. (Maybe a funny hack would be to create an ASCII tileset that
recreates the appearance of a character-mode display?)

And it's very hard for me to know at a glance what monsters are, but that's
presumably just a matter of experience (I immediately know what particular-
colored versions of particular letters are, but I haven't learned their
equivalents in any tileset by heart).

Also, not being able to see the whole dungeon at once sort of loses
information that NetHack users have traditionally (maybe unfortunately) had
access to in character mode: if you can see the whole dungeon inside an 80x24
screen, you know in which directions it's worthwhile to search for additional
passageways and rooms that you haven't discovered yet (because they have to be
in directions that would fit on screen!). In tileset mode with a partial
screen view, you don't really know where you are relative to the corners of
the dungeon level, so you don't immediately know whether it's worthwhile to
search or dig in a particular direction.

A couple of minor practical problems with the interface for me: it didn't
recognize Esc (for example, when prompted to choose a direction for the /
command), and unambiguous # commands such as #untrap and #pray weren't
autocompleted. It's possible to work around the former problem by pressing any
non-direction key. For reasons that aren't obvious to me, pressing any arrow
key while on top of either an up or down staircase will result in taking the
staircase.

I should say again that getting NetHack to run in the browser is a really
impressive achievement.

~~~
myfonj
Ad funny hack with ASCII tileset: I googled for some `NetHack ASCII tileset`
and found [1], made userstyle [2] that uses this picture and it works
seemingly well [3]. So I suppose there will some "true console-looking"
tileset soon.

[1] [http://geoduck42.deviantart.com/art/Geoduck-NetHack-
Tiles-40...](http://geoduck42.deviantart.com/art/Geoduck-NetHack-
Tiles-40x20-78672541)

[2] [https://userstyles.org/styles/112589/browserhack-
geoduck42-t...](https://userstyles.org/styles/112589/browserhack-
geoduck42-tileset-qnd.css)

[3]
[http://static.userstyles.org/style_screenshots/112589_after....](http://static.userstyles.org/style_screenshots/112589_after.png?r=1428888390)
This certain sprite seems nice in original, but I had to transform it from
20×40 to 32×32, because re-positioning would be overkill (Haven't found any
32×32 alternative) I just wanted to try such proof-of concept…

~~~
coolwanglu
Try typing this in the browser console (might need to reload the game first)

nethack.apply_tileset('[http://cook.web.eschelon.com/pictures/geoduck20x12.bmp'](http://cook.web.eschelon.com/pictures/geoduck20x12.bmp'),
12, 20)

I felt that a complete ASCII port worth a separate project, yet it might not
be that interesting as we've already got NAO.

But if you guys feel that a ASCII tileset is ok, I'm happy to add it. How
about this smaller version?

~~~
myfonj
Pretty neat! And I see you have included that tileset natively. I think that
making "pure ASCII image-less tileset" should be piece of cake as well:

    
    
      .tile:after {
        display: block;
        text-align: center;
        font: bold 30px/30px monospace;
      }
      .tile158:after {
        content: '@';
        color: yellow;
      }

------
beering
For people new to NetHack:

You can play NetHack just by running

    
    
        telnet nethack.alt.org
    

And you can save games and resume them from another computer, as well as watch
other people play!

~~~
kzrdude
Watching complete strangers nethack is weird, because it's a completely
noninteractive medium.

~~~
tadfisher
You can send them messages via the mail daemon :)

~~~
schoen
Yes, just create an account on NAO and press "m" to write to the current
player (who might then reply to you with "#" or "E-"). People often give each
other advice or commiseration.

And there's also a #nethack IRC channel where sometimes players and watchers
will comment on ongoing NAO games.

------
atgreen
Here's a primitive ASCII graphics version of something similar from a while
back...

[http://moxielogic.org/blog/nethack-in-your-
browser.html](http://moxielogic.org/blog/nethack-in-your-browser.html)

The NetHack C code was cross built to moxie-rtems, which was run in a moxie
simulator that was cross built to JS with emscripten.

------
oelmekki
> You are a neutral male human Monk.

No way, I only play wizard and tourist! Please let us roll our character as
standard nethack :)

Very impress beside that, no need to check anymore if my last system has it
installed before going on vacation ^^

------
perturbation
Nethack is how I committed vim keybindings to muscle memory. This is really
cool (though a few things, like Ctrl-D to kick and extended commands seem to
either not work or be clumsy).

~~~
WildUtah
Sometimes when debugging particularly stubborn issues I wish I could kick code
with ^D in vi.

#untrap would be useful, too.

~~~
schoen
The fencepost error jumps, easily evading your clumsy kick.

------
bcg1
It is super fun, but I identify much more with the @ than with the character
in the browser version

Wonderfulness abounds however, great hack from a true hacker

------
ilaksh
How long is 'a while'? Maybe it doesn't work on Android tablets.

------
kristopolous
the help screen with the "?" button is probably (hopefully) not the final
colors you are looking for. Thanks for doint this though!

~~~
coolwanglu
The UI is mostly finished. How does the current version look?

------
mkramlich
I made a web browser playable Rogue-like about 7 years ago.

It was the first incarnation of my Dead By Zombie game. Python and a
completely homegrown engine. I later decided the hack novelty of it didn't
outweigh the negatives of the inferior latency and increased complexity. So I
dropped support for the web UI and rewrote it to have a conventional curses-
based UI for play in a terminal. No regrets.

~~~
cturner
Curses is cool - no bones. But javascript is becoming significant for
roguelikes. There's a library called rot.js that is far easier to get started
with than the other significant frameworks. They've recently made it work in
node.js as well (for the console). Hence, you can easily get a single codebase
presenting to both web and terminal.

~~~
Simsor
There's also libtcod[0], a library to help creating roguelikes. There are
bindings in a lot of languages (Common Lisp, Nimrod, Lua, Go, D...) and it's a
real pleasure to use! I used to work on a Python roguelike, and I can't
recommend this lib enough.

[0]
[http://roguecentral.org/doryen/libtcod/](http://roguecentral.org/doryen/libtcod/)

~~~
cturner
Frustration. I wasn't able to get libtcod to build. Tried to get prep'd for
7drl a few months back on debian (previous stable) and when that failed, a
clean install of windows 7. I've also had trouble with race conditions with
keypresses and the python version, although that was a few years back. I like
the libtcod philosophy of it being a library approach (contrast with t-engine,
which is more of a sandbox model).

