summaryrefslogtreecommitdiff
path: root/play.html
diff options
context:
space:
mode:
Diffstat (limited to 'play.html')
-rw-r--r--play.html115
1 files changed, 57 insertions, 58 deletions
diff --git a/play.html b/play.html
index 8d4451f..d7ac9b8 100644
--- a/play.html
+++ b/play.html
@@ -1,15 +1,16 @@
<!DOCTYPE html>
<html lang="en">
<head>
-<meta name="viewport" content="width=device-width, height=device-height, initial-scale=1">
+<meta name="viewport" content="width=device-width, height=device-height, user-scalable=no, interactive-widget=resizes-content, viewport-fit=content, viewport-fit=cover">
+<meta name="theme-color" content="#444">
<meta charset="utf-8">
<title>WILDERNESS WAR</title>
<link rel="icon" href="logo.png">
<link rel="stylesheet" href="/fonts/fonts.css">
-<link rel="stylesheet" href="/common/play.css">
+<link rel="stylesheet" href="/common/client.css">
<link rel="stylesheet" href="play.css">
<link rel="stylesheet" href="images.css">
-<script defer src="/common/play.js"></script>
+<script defer src="/common/client.js"></script>
<script defer src="data.js"></script>
<script defer src="play.js"></script>
</head>
@@ -17,14 +18,16 @@
<div id="tooltip"></div>
-<div id="popup" onmouseleave="hide_popup_menu()">
-<div id="menu_play_event" class="always" onclick="on_play_event()">Play Event</div>
-<div id="menu_activate_force" class="always" onclick="on_activate_force()">Activate force</div>
-<div id="menu_activate_individually" class="always" onclick="on_activate_individually()">Activate individually</div>
-<div id="menu_construct_stockades" class="always" onclick="on_construct_stockades()">Construct stockades</div>
-<div id="menu_construct_forts" class="always" onclick="on_construct_forts()">Construct forts</div>
-<div id="menu_discard" onclick="on_discard()">Discard</div>
-</div>
+<menu id="popup">
+ <li class="title">CARD
+ <li class="separator">
+ <li data-action="play_event"> &#x1f3b4; &nbsp; Play Event
+ <li data-action="activate_force"> &#x1f464; &nbsp; Activate force
+ <li data-action="activate_individually"> &#x1f465; &nbsp; Activate individually
+ <li data-action="construct_stockades"> &#x1f528; &nbsp; Construct stockades
+ <li data-action="construct_forts"> &#x1f528; &nbsp; Construct forts
+ <li data-action="discard"> &#x1f6ab; &nbsp; Discard
+</menu>
<div id="removed" class="card_list_dialog hide">
<div id="removed_x" class="card_list_x" onclick="hide_card_list('removed')">&#x274c;</div>
@@ -40,53 +43,49 @@
<header>
<div id="toolbar">
- <div class="menu">
- <div class="menu_title"><img src="/images/cog.svg"></div>
- <div class="menu_popup">
- <a class="menu_item" href="info/rulebook.html" target="_blank">Rulebook</a>
- <a class="menu_item" href="info/playbook.html" target="_blank">Playbook</a>
- <a class="menu_item" href="info/charts.html" target="_blank">Charts &amp; Tables</a>
- <a class="menu_item" href="info/cards.html" target="_blank">Cards</a>
- <a class="menu_item" href="info/pieces.html" target="_blank">Leaders &amp; Units</a>
- <div class="resign menu_separator"></div>
- <div class="resign menu_item" onclick="confirm_resign()">Resign</div>
- </div>
- </div>
- <div class="menu">
- <div class="menu_title"><img src="/images/stack.svg"></div>
- <div class="menu_popup">
- <div id="stack_v" class="menu_item unchecked" onclick="set_layout(0)">Vertical</div>
- <div id="stack_h" class="menu_item unchecked" onclick="set_layout(1)">Horizontal</div>
- <div id="stack_d" class="menu_item unchecked" onclick="set_layout(2)">Diagonal</div>
- <div class="menu_separator"></div>
- <div id="mouse_focus" class="menu_item unchecked" onclick="set_mouse_focus()">Mouse-focus</div>
- <div class="menu_separator"></div>
- <div id="style_bevel" class="menu_item unchecked" onclick="set_style('bevel')">Beveled</div>
- <div id="style_flat" class="menu_item unchecked" onclick="set_style('flat')">Flat</div>
- </div>
- </div>
- <div class="menu">
- <div class="menu_title"><img src="/images/wooden-sign.svg"></div>
- <div class="menu_popup">
- <div class="menu_item" onclick="send_query('supply')">Supply lines</div>
- <div class="menu_item" onclick="send_query('removed')">Removed</div>
- <div class="menu_item" onclick="send_query('discard')">Discard</div>
- </div>
- </div>
- <div class="icon_button" onclick="toggle_counters()"><img src="/images/earth-america.svg"></div>
- <div class="icon_button" onclick="toggle_zoom()"><img src="/images/magnifying-glass.svg"></div>
- <div class="icon_button" onclick="toggle_log()"><img src="/images/scroll-quill.svg"></div>
- <div id="demolish_menu" class="menu hide">
- <div class="menu_title"><img src="/images/dig-dug.svg"></div>
- <div class="menu_popup">
- <div id="demolish_fort" class="menu_item" onclick="send_action('demolish_fort')">Demolish fort</div>
- <div id="demolish_stockade" class="menu_item" onclick="send_action('demolish_stockade')">Demolish stockade</div>
- <div id="demolish_fieldworks" class="menu_item" onclick="send_action('demolish_fieldworks')">Demolish fieldworks</div>
- </div>
- </div>
+ <details>
+ <summary><img src="/images/cog.svg"></summary>
+ <menu>
+ <li><a href="info/rulebook.html" target="_blank">Rulebook</a>
+ <li><a href="info/playbook.html" target="_blank">Playbook</a>
+ <li><a href="info/charts.html" target="_blank">Charts &amp; Tables</a>
+ <li><a href="info/cards.html" target="_blank">Cards</a>
+ <li><a href="info/pieces.html" target="_blank">Leaders &amp; Units</a>
+ <li class="resign separator">
+ <li class="resign" onclick="confirm_resign()">Resign
+ </menu>
+ </details>
+ <details id="stack_menu">
+ <summary><img src="/images/stack.svg"></summary>
+ <menu>
+ <li class="unchecked" id="stack_v" onclick="set_layout(0)"> Vertical
+ <li class="unchecked" id="stack_h" onclick="set_layout(1)"> Horizontal
+ <li class="unchecked" id="stack_d" onclick="set_layout(2)"> Diagonal
+ <li class="separator">
+ <li class="unchecked" id="mouse_focus" onclick="set_mouse_focus()"> Mouse-focus
+ <li class="separator">
+ <li class="unchecked" id="style_bevel" onclick="set_style('bevel')"> Beveled
+ <li class="unchecked" id="style_flat" onclick="set_style('flat')"> Flat
+ </menu>
+ </details>
+ <details id="info_menu">
+ <summary><img src="/images/wooden-sign.svg"></summary>
+ <menu>
+ <li onclick="send_query('supply')"> Supply lines
+ <li onclick="send_query('removed')"> Removed
+ <li onclick="send_query('discard')"> Discard
+ </menu>
+ </details>
+ <button id="piece_button" onclick="toggle_counters()"><img src="/images/earth-america.svg"></button>
+ <details id="demolish_menu" class="hide">
+ <summary><img src="/images/dig-dug.svg"></summary>
+ <menu>
+ <li id="demolish_fort" onclick="send_action('demolish_fort')"> Demolish fort
+ <li id="demolish_stockade" onclick="send_action('demolish_stockade')"> Demolish stockade
+ <li id="demolish_fieldworks" onclick="send_action('demolish_fieldworks')"> Demolish fieldworks
+ </menu>
+ </details>
</div>
- <div id="prompt"></div>
- <div id="actions"></div>
</header>
<aside>
@@ -110,7 +109,7 @@
<div id="log"></div>
</aside>
-<main>
+<main data-max-zoom="2" onclick="hide_popup_menu()">
<div id="mapwrap">
<div id="map">
<div id="events">