empires-html
2 years agoFix the gear toggle to work the first time it is clicked master
Carl Worth [Tue, 12 May 2020 01:22:04 +0000 (18:22 -0700)]
Fix the gear toggle to work the first time it is clicked

Apparently, the first time this condition is executed, the
host_tools.style.display attribute is not "none" but is instead some
sort of empty value. With the old code, this made a first click on the
gear do nothing, (setting it to "none" but not toggling visibility)
and then a second click would make the host tools appear.

With this change to reverse the logic to look for an explicit value of
"block" (which is set only after the first click) the gear button
works reliably on every click including the first.

2 years agoImplement a very simple toolbar for the host to use
Carl Worth [Mon, 11 May 2020 23:48:04 +0000 (16:48 -0700)]
Implement a very simple toolbar for the host to use

This is a small clickable gear at the upper-right, that when clicked
will toggle the display of some buttons for controlling the game
state.

This is not as clever as it could be. For example, only one of REVEAL
and START buttons need to be displayed at any given time, (depending
on the game state).

But this should work for everything the game host needs (other than
hiding players that have been captured).

2 years agoAdd viewport tag
Carl Worth [Mon, 11 May 2020 23:25:52 +0000 (16:25 -0700)]
Add viewport tag

Telling browsers that we know we are a mobile-friendly site and we
don't want any of that scrolling/zooming nonsense.

2 years agoExplicitly declare UTF-8 encoding
Carl Worth [Mon, 11 May 2020 23:16:00 +0000 (16:16 -0700)]
Explicitly declare UTF-8 encoding

To silence a browser-console warning, (and because, duh, why would I
use any encoding _but_ UTF-8?!).

2 years agoStyle the revealed character names extra large
Carl Worth [Mon, 11 May 2020 23:11:49 +0000 (16:11 -0700)]
Style the revealed character names extra large

These are an essential element of the game. They should basically fill
the content area of the screen.

(I think ideally, the game would size the text so the largest name
_does_ fill the screen and then use a consistent font size for all of
them, but this will do for now.)

2 years agoDrop the message-area notifications for new players joining
Carl Worth [Mon, 11 May 2020 23:06:53 +0000 (16:06 -0700)]
Drop the message-area notifications for new players joining

The names are consistently added to the players list below, so we
don't really need messages here, (plus, the messages got distracting
in later phases of the game such as "reveal" unless the player
manually cleared them away).

2 years agoUse a white background on the body element for a narrow screen
Carl Worth [Mon, 11 May 2020 23:06:01 +0000 (16:06 -0700)]
Use a white background on the body element for a narrow screen

This avoids some ugly-looking dark area at the bottom of the screen,
(since our page content doesn't always fill the screen). So things
look better like this.

2 years agoAdd some mobile-first styling
Carl Worth [Mon, 11 May 2020 22:46:59 +0000 (15:46 -0700)]
Add some mobile-first styling

Some of the changes here include:

  * Adding a reset.css for good control of all styling

  * Using only the center portion of the window for a very wide window

  * Dropping wasteful margins around page content for a narrow window

  * Forcing input fields onto their own rows

  * Use grid display for form for consistent input width

  * Use 2-column for on wide windows and single-column for narrow

  * Use more modern flat styling for the submit button

  * Drop the ugly dashed outline for button focus

2 years agoDon't show the "Players in the game" header when there are no players
Carl Worth [Mon, 11 May 2020 22:45:22 +0000 (15:45 -0700)]
Don't show the "Players in the game" header when there are no players

It looks really broken to see this header with nothing below it. So we
still it as not displayed at first, and then only display it once a
player is added.

2 years agoImplement support for the "game-state" and "character-reveal" events
Carl Worth [Sun, 10 May 2020 22:51:59 +0000 (15:51 -0700)]
Implement support for the "game-state" and "character-reveal" events

We had classes here named show-state-<STATE> and hide-state-<STATE>
for elements that should be shown only in a specific state
(show-state-<STATE>) or that should be hidden in a specific state
(hide-state-<STATE>).

For example, the new loading screen saying "contacting server" is only
shown in the "none" state (show-state-none), before getting any events
back from the server. Similarly the list of players is hidden during
the reveal state (hide-state-reveal) so that it is visible in all
other states.

In response to the game-state event, the code finds all relevant
elements with appropriate classed from both the old and new states of
the transition and hides or shows them as appropriate.

Also, we now support the "character-reveal" event by inserting the
revealed character name into an element where it can be seen.

2 years agoMove the message area outside of the pre-game div
Carl Worth [Sun, 10 May 2020 22:50:11 +0000 (15:50 -0700)]
Move the message area outside of the pre-game div

The message area information is intended to be available regardleess
of the game state, (while the pre-game content is only intended to be
displayed while players are joining the game).

2 years agoAdd messages to message area when a player joins or leaves the game
Carl Worth [Sun, 10 May 2020 17:06:07 +0000 (10:06 -0700)]
Add messages to message area when a player joins or leaves the game

This replaces code we had previously for adding a message to the
message area when we completed sending a register request. The new
code is more reliable in the sense that a message is added _only_
after the server reports the event for a new player. (Previously, if
the server was offline, a message would still appear saying "Player is
now in the game!" which would be false and confusing if there was no
server responding to the register request at all.)

2 years agoRename player-register/player-deregister to player-join/player-leave
Carl Worth [Sun, 10 May 2020 16:55:43 +0000 (09:55 -0700)]
Rename player-register/player-deregister to player-join/player-leave

This brings the client into conformance with protocol version 0.3.

2 years agoAdd a message when the connection to the server is lost
Carl Worth [Sun, 10 May 2020 15:45:02 +0000 (08:45 -0700)]
Add a message when the connection to the server is lost

Making it clear to the user that something has gone wrong.

2 years agoDisable autocomplete on the character field
Carl Worth [Sun, 10 May 2020 15:43:59 +0000 (08:43 -0700)]
Disable autocomplete on the character field

This is intended to prevent multiple players (using a single browser)
from accidentally seeing a name that a previous player entered when
the browser offers it up for autocompletion.

2 years agoTrack removal of players (by either deregister or by capture)
Carl Worth [Mon, 4 May 2020 00:42:10 +0000 (17:42 -0700)]
Track removal of players (by either deregister or by capture)

Currently the capture UI is rather spartan, (the captured name just
disappears—it doesn't appear as a capture next to the capturing
player).

2 years agoAdd event listening to the HTML client
Carl Worth [Mon, 4 May 2020 00:18:21 +0000 (17:18 -0700)]
Add event listening to the HTML client

Specifically, displaying a list of all players. This captures both the
existing players at the time the client connects, as well as adding
any additional players that register.

2 years agoAdd another missing const
Carl Worth [Mon, 4 May 2020 00:17:51 +0000 (17:17 -0700)]
Add another missing const

(Someday I'll fix things so that I can't commit non-lint-clean code.)

2 years agoAdd a simple "make deploy" target
Carl Worth [Sun, 3 May 2020 18:01:26 +0000 (11:01 -0700)]
Add a simple "make deploy" target

To simplify the deployment which I'd previously been doing manually.

This will deploy only the state of committed code.

2 years agoUse an actual "submit" input element instead of a "button"
Carl Worth [Sun, 3 May 2020 17:54:57 +0000 (10:54 -0700)]
Use an actual "submit" input element instead of a "button"

This has the advantage of allowing the user to just press the Enter
key on any field of the form in order to submit it. For this we move
the invocation of our javascript handler for the form submission from
onclick() of the button to onsubmit() of the form itself. Finally, we
have to reutnr false from our new onsubmit() handler so that the
browser doesn't reload the page (which would clear the message that
results from a new player being added).

2 years agoCorrect a couple of typos in the welcome paragraph
Carl Worth [Sun, 3 May 2020 17:27:22 +0000 (10:27 -0700)]
Correct a couple of typos in the welcome paragraph

What embarrassing misspellings!

2 years agoMove API endppoint to have an /api suffix
Carl Worth [Sun, 3 May 2020 17:14:19 +0000 (10:14 -0700)]
Move API endppoint to have an /api suffix

We moved this on the server to create room for some non-API content
to be served from /.

2 years agoInitial implementation of a web client for the Empires game
Carl Worth [Sun, 3 May 2020 17:07:15 +0000 (10:07 -0700)]
Initial implementation of a web client for the Empires game

This implements only the ability to register a player in the game.