159 lines
7.3 KiB
HTML
159 lines
7.3 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en-US">
|
|
<head>
|
|
<meta charset="UTF-8" />
|
|
<title>Felt</title>
|
|
<meta name="viewport" content="width=device-width" />
|
|
<link rel="shortcut icon" href="./favicon.png"/>
|
|
<link href="./leaflet.css?v=1.9.4" rel="stylesheet" />
|
|
<link href="./style.css?v=0.2.2" rel="stylesheet" />
|
|
</head>
|
|
<body>
|
|
<noscript><div id="noscript_container">
|
|
<img src="./logo.svg" alt="FELT VIRTUAL TABLETOP"/>
|
|
<p><a href="https://hacklab.nilfm.cc/felt">Felt</a> is a virtual tabletop webapp; therefore, the frontend is written in Javascript</p>
|
|
<p>Enable Javascript in your browser to get your game on!</p></div>
|
|
</noscript>
|
|
<div id="map"></div>
|
|
|
|
<div id="err_wrapper" style='display:none'><button id="err_close" onclick="closeErr()">x</button><div id="err_div"></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>
|
|
<button id="table_leave" style="display:none;" onclick="leave()">Leave</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>
|
|
<button id="token_preview_clear" onclick="dismissPreview()" style="display: none;">Dismiss Preview</button>
|
|
<div id="token_preview"></div>
|
|
<input hidden id="token_preview_id"/>
|
|
<ul id="token_select" class="single_btn_list"></ul>
|
|
</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="admin_ui" 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="table_creation_form" style="display:none;">
|
|
<label>Name<input id="new_table_name"/></label><br/>
|
|
<label>Passcode<input id="new_table_pass" type="password"/></label><br/>
|
|
<button type="submit" onclick="createTable()">Create</button>
|
|
<button onclick="setTableCreateFormVisible(false)">Cancel</button>
|
|
</form>
|
|
<div id="table_management"></div>
|
|
</details><br/>
|
|
|
|
<div id="token_management">
|
|
<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="token_creation_form" style="display:none;">
|
|
<label>Sprite<select id="sprite_dropdown" 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" step="1" onchange="previewSprite(this)"/></label><label id="aspect_lock_label" for="token_aspect_lock">w:h locked</label><input type="checkbox" checked id="token_aspect_lock" onchange="toggleAspectLock()"/><br/>
|
|
<label>Height<input type="number" id="token_height" min="1" step="1" max="9999" onchange="previewSprite(this)"/></label><br/>
|
|
<label>cX<input type="number" id="token_cx" min="0" max="9999" step="1" onchange="previewSprite(this)"/></label><br/>
|
|
<label>cY<input type="number" id="token_cy" min="0" max="9999" step="1" onchange="previewSprite(this)"/></label><br/>
|
|
<button type="submit" onclick="createToken()">Create</button>
|
|
<button onclick="setTokenCreateFormVisible(false)">Cancel</button>
|
|
</form>
|
|
<div id="token_admin_preview"></div>
|
|
<ul id="token_list" class="two_btn_list"></ul>
|
|
</details><br/>
|
|
|
|
<details id="admin_sprite_win" class="ui_win admin_win"><summary>sprites</summary>
|
|
<div id="sprite_zone"></div>
|
|
</details>
|
|
</div>
|
|
|
|
</div>
|
|
</section>
|
|
|
|
<details class="ui_win" id="theme_accordion"><summary>theme</summary>
|
|
<form id="theme_cfg" onsubmit="return false">
|
|
<label>bg color<input type="color" id="bg_col_input"/></label>
|
|
<label>bg opacity<input type="range" id="bg_col_opacity" min="0" max="255"/></label>
|
|
<label>fg color<input type="color" id="fg_col_input"/></label>
|
|
<label>fg opacity<input type="range" id="fg_col_opacity" min="0" max="255"/></label>
|
|
<label>main color<input type="color" id="main_col_input"/></label>
|
|
<label>main opacity<input type="range" id="main_col_opacity" min="0" max="255"/></label>
|
|
<label>sub color<input type="color" id="sub_col_input"/></label>
|
|
<label>sub opacity<input type="range" id="sub_col_opacity" min="0" max="255"/></label>
|
|
<label>error color<input type="color" id="err_col_input"/></label>
|
|
<label>error opacity<input type="range" id="err_col_opacity" min="0" max="255"/></label>
|
|
<button onclick="setTheme()">Apply</button><button onclick="resetTheme(defaultTheme)">Reset</button>
|
|
</form>
|
|
</details>
|
|
<div id="lag" style="display:none;">lag...</div>
|
|
<div class="ui_win" id="felt_info"><a href="https://hacklab.nilfm.cc/felt">felt v0.2.5</a> (<a href="https://hacklab.nilfm.cc/felt/raw/main/LICENSE">license</a>) | built with <a href="https://leafletjs.com">leaflet</a> (<a href="https://hacklab.nilfm.cc/felt/raw/main/LEAFLET_LICENSE">license</a>) </div>
|
|
</nav>
|
|
</body>
|
|
<script>L_DISABLE_3D = window.location.hash.toLowerCase() === "#no3d";</script>
|
|
<script src="./leaflet.js?v=1.9.4" type="text/javascript"></script>
|
|
<script src="./util.js?v=0.2.5" type="text/javascript"></script>
|
|
<script src="./map.js?v=0.2.5" type="text/javascript"></script>
|
|
<script src="./socket.js?v=0.2.5" type="text/javascript"></script>
|
|
<script src="./dice.js?v=0.2.5" type="text/javascript"></script>
|
|
<script src="./admin.js?v=0.2.5" type="text/javascript"></script>
|
|
</html>
|