all repos — felt @ faccff3fb22052b9048f7960127048a0914ce0fe

virtual tabletop for dungeons and dragons (and similar) using Go, MongoDB, and websockets

static/index.html (raw)

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
 
<!DOCTYPE html>
<html lang="en-US">
  <head>
    <meta charset="UTF-8" />
    <title>Felt</title>
    <meta name="viewport" content="width=device-width" />
    <link href="./leaflet.css" rel="stylesheet" />
    <link href="./style.css" rel="stylesheet" />
  </head>
  <body>
  <div id="map"></div>
  
  <div id="errWrapper" style='display:none'><button id="closeErr" onclick="closeErr()">x</button><div id="errDiv"></div></div>
  
  <nav>
  <section id="user_section">
  <details class="ui_win" open><summary>identity</summary>
    <label for="name_entry">username</label>
    <input id="name_entry" onblur="saveName()">
  </details><br/>
  
  <details class="ui_win"><summary>goto</summary>
  <form id="table_modal" onsubmit="return false">
    <label>table.name<br><input id="input_table_name"></label><br>
    <label>table.passcode<br><input id="input_table_pass"></label><br>
    <button type="submit" id="table_join" onclick="dial();">Join</button>
  </form>
  </details><br/>

  <div id="tabletop" style="display:none;">
  <details id="dice_win" class="ui_win"><summary>dice</summary>
    <select id="num_dice">
      <option>1</option>
      <option>2</option>
      <option>3</option>
      <option>4</option>
      <option>5</option>
      <option>6</option>
      <option>7</option>
      <option>8</option>
      <option>9</option>
      <option>10</option>
      <option>11</option>
      <option>12</option>
      <option>13</option>
      <option>14</option>
      <option>15</option>
      <option>16</option>
      <option>17</option>
      <option>18</option>
      <option>19</option>
      <option>20</option>
    </select>
    <label for="dice_faces">d</label>
    <select id="dice_faces">
      <option>4</option>
      <option selected>6</option>
      <option>8</option>
      <option>10</option>
      <option>12</option>
      <option>20</option>
    </select>
    <input id="dice_note"><button id="dice_submit" onclick="rollDice()">Roll</button>
    <div id="dice_log"></div>
  </details><br/>
  
  <details class="ui_win"><summary>status</summary><pre id="aux"></pre></details><br/>
  
  <details class="ui_win"><summary>token select</summary>
    <div id="token_select"></div>
  </details><br/>
  </div>

  </section>
  
  <section id="admin_section">
    <details class="ui_win admin_win"><summary>admin</summary>
  <form id="admin_modal" onsubmit="return false">
    <label>pass<input type="password" id="input_admin_pass"></label>
    <button type="submit" id="admin_login" onclick="doLogin();">Login</button>
  </form>
  </details>
  <br/>
  
  <div id="adminWrapper" style="display:none;">
    <details id="admin_table_win" class="ui_win admin_win"><summary>table</summary>
      <button onclick="setTableCreateFormVisible(true)">New Table</button>
      <form onsubmit="return false" id="createTableForm" style="display:none;">
        <label>Name<input id="newTableName"/></label><br/>
        <label>Passcode<input id="newTablePass" type="password"/></label><br/>
        <button type="submit" onclick="createTable()">Create</button>
        <button onclick="setTableCreateFormVisible(false)">Cancel</button>
      </form>
      <div id="adminZone"></div>
    </details><br/>
    <div id="adminWrapper_tokens">
    <details id="admin_token_win" class="ui_win admin_win"><summary>tokens</summary>
      <button onclick="setTokenCreateFormVisible(true)">New Token</button>
      <form onsubmit="return false" id="createTokenForm" style="display:none;">
        <label>Sprite<select id="token_combobox" onchange="previewSprite(this)"></select></label><br/>
        <label>Name<input id="token_name"/></label><br/>

        <label>Width<input type="number" id="token_width" min="1" max="9999" onchange="previewSprite(this)"/></label><label id="aspectLockLabel" for="tokenKeepAspect">&#128274;</label><input type="checkbox" checked id="tokenKeepAspect" onchange="toggleAspectLock()"/><br/>
        <label>Height<input type="number" id="token_height" min="1" max="9999" onchange="previewSprite(this)"/></label><br/>
        <label>cX<input type="number" id="token_cx" min="0" max="9999" onchange="previewSprite(this)"/></label><br/>
        <label>cY<input type="number" id="token_cy" min="0" max="9999" onchange="previewSprite(this)"/></label><br/>
        <button type="submit" onclick="createToken()">Create</button>
        <button onclick="setTokenCreateFormVisible(false)">Cancel</button>
      </form>
      <div id="tokenPreview_zone"></div>
      <div id="tokenZone"></div>
    </details><br/>
    <details id="admin_sprite_win" class="ui_win admin_win"><summary>sprites</summary>
      <div id="spriteZone"></div>
    </details>
    </div>
  </div>
  </section>
</nav>
</body>
    <script src="./leaflet.js" type="text/javascript"></script>
    <script src="./util.js" type="text/javascript"></script>
    <script src="./map.js" type="text/javascript"></script>
    <script src="./socket.js" type="text/javascript"></script>
    <script src="./dice.js" type="text/javascript"></script>
    <script src="./admin.js" type="text/javascript"></script>
</html>