170 lines
6.8 KiB
HTML
Executable File
170 lines
6.8 KiB
HTML
Executable File
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<meta charset="UTF-8">
|
|
<title data-i18n="title">Role Playing Game Dices</title>
|
|
<meta name="application-name" content="Role Playing Game Dices">
|
|
<meta name="application-version" content="v0.2.2">
|
|
|
|
<meta name="viewport" content="width=device-width,initial-scale=1">
|
|
|
|
<meta name="theme-color" content="#ffffff" />
|
|
<meta name="apple-mobile-web-app-status-bar" content="#ffffff" />
|
|
|
|
<link rel="icon" type="image/x-icon" href="assets/icons/icon.svg">
|
|
<link rel="apple-touch-icon" href="assets/icons/icon-72x72.png" />
|
|
<link rel="apple-touch-icon" href="assets/icons/icon-96x96.png" />
|
|
<link rel="apple-touch-icon" href="assets/icons/icon-128x128.png" />
|
|
<link rel="apple-touch-icon" href="assets/icons/icon-144x144.png" />
|
|
<link rel="apple-touch-icon" href="assets/icons/icon-152x152.png" />
|
|
<link rel="apple-touch-icon" href="assets/icons/icon-192x192.png" />
|
|
<link rel="apple-touch-icon" href="assets/icons/icon-384x384.png" />
|
|
<link rel="apple-touch-icon" href="assets/icons/icon-512x512.png" />
|
|
|
|
<link rel="manifest" href="manifest.json" />
|
|
|
|
<link rel="stylesheet" href="style.css">
|
|
|
|
<script src="js/libs/moment.js"></script>
|
|
|
|
<script src="js/libs/sidebar/sidebar.js"></script>
|
|
<link href="js/libs/sidebar/sidebar.css" type="text/css" rel="stylesheet" />
|
|
|
|
|
|
<body>
|
|
<label id="sidebar-toggle" class="sidebar-toggle" for="sidebar-toggle-input"><img src="./assets/menu.svg"></label>
|
|
<input id="sidebar-toggle-input" type="checkbox" role="button">
|
|
<div id="sidebar">
|
|
<label id="sidebar-toggle-close" class="sidebar-toggle text-fresh float-right" for="sidebar-toggle-input"><img
|
|
src="./assets/close.svg"></label>
|
|
<ul class="menu">
|
|
<li onclick="resetDices()">
|
|
<img src="./assets/dices.svg">
|
|
<span data-i18n="reset-dices">Reset Dices</span>
|
|
</li>
|
|
<li onclick="clearHistory()">
|
|
<img src="./assets/history.svg">
|
|
<span data-i18n="clear-history">Clear History</span>
|
|
</li>
|
|
<li onclick="exportData()">
|
|
<img src="./assets/export.svg">
|
|
<span data-i18n="export-data">Export Data</span>
|
|
</li>
|
|
<li>
|
|
<label>
|
|
<img src="./assets/import.svg">
|
|
<span data-i18n="import-data">Import Data</span>
|
|
<input id="importFile" type="file" accept="application/json" />
|
|
</label>
|
|
</li>
|
|
</ul>
|
|
<ul class="menu">
|
|
<li onclick="toggleDarkMode()">
|
|
<img id="dark-mode-icon" src="./assets/dark.svg">
|
|
<span id="dark-mode-text">Dark Mode</span>
|
|
</li>
|
|
</ul>
|
|
<ul class="menu">
|
|
<li onclick="setLocale('en')">
|
|
<span>English</span>
|
|
</li>
|
|
<li onclick="setLocale('de')">
|
|
<span>Deutsch</span>
|
|
</li>
|
|
</ul>
|
|
<ul class="menu">
|
|
<li onclick="clearAndRefresh()">
|
|
<img id="dark-mode-icon" src="./assets/update.svg">
|
|
<span data-i18n="update">Try to Update</span>
|
|
</li>
|
|
</ul>
|
|
<script>
|
|
Sidebar();
|
|
</script>
|
|
</div>
|
|
<div class="container">
|
|
<div class="dices-container">
|
|
<div class="dices" id="dices"></div>
|
|
|
|
<div class="form-container">
|
|
<div class="actions">
|
|
<button id="roll-add-button" onclick="addSelected()">
|
|
<img src="./assets/add.svg">
|
|
<span data-i18n="add-selected">Add Selected</span>
|
|
</button>
|
|
<button id="roll-button" onclick="rollSelected()">
|
|
<img src="./assets/roll.svg">
|
|
<span data-i18n="roll-selected">Roll Selected</span>
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="history-container">
|
|
|
|
<div class="actions">
|
|
<button id="history-undo-button" onclick="undo()">
|
|
<img src="./assets/undo.svg">
|
|
</button>
|
|
<button id="history-button" onclick="clearHistory()">
|
|
<img src="./assets/history.svg">
|
|
<span data-i18n="clear-history">Clear History</span>
|
|
</button>
|
|
<button id="history-redo-button" onclick="redo()">
|
|
<img src="./assets/redo.svg">
|
|
</button>
|
|
</div>
|
|
|
|
<div class="history" id="history"></div>
|
|
|
|
<div class="form-container">
|
|
<div class="form">
|
|
<input type="text" id="inputText" placeholder="1D6+1 + 2D4" data-i18n-placeholder="regex-placeholder">
|
|
</div>
|
|
<div class="actions">
|
|
<button onclick="addDicesText()">
|
|
<img src="./assets/plus.svg">
|
|
<span data-i18n="new-dices">New Dices</span>
|
|
</button>
|
|
<button onclick="rollText()">
|
|
<img src="./assets/roll.svg">
|
|
<span data-i18n="roll">Roll</span>
|
|
</button>
|
|
</div>
|
|
|
|
<div class="form">
|
|
<input min="1" value="1" type="number" id="inputCount">
|
|
<span data-i18n="D">D</span>
|
|
<select value="6" id="inputSides" onchange="updateCustom()">
|
|
<option value="4">4</option>
|
|
<option value="6">6</option>
|
|
<option value="8">8</option>
|
|
<option value="10">10</option>
|
|
<option value="12">12</option>
|
|
<option value="20">20</option>
|
|
<option value="100">100</option>
|
|
<option value="" data-i18n="custom">custom</option>
|
|
</select>
|
|
<input class="hidden" min="2" value="2" type="number" id="inputCustom">
|
|
+
|
|
<input value="0" type="number" id="inputAddition">
|
|
|
|
<input type="color" id="inputColor">
|
|
</div>
|
|
<div class="actions">
|
|
<button onclick="addDiceForm()">
|
|
<img src="./assets/plus.svg">
|
|
<span data-i18n="new-dice">New Dice</span>
|
|
</button>
|
|
<button onclick="rollForm()">
|
|
<img src="./assets/roll.svg">
|
|
<span data-i18n="roll">Roll</span>
|
|
</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<script src="script.js"></script>
|
|
</body>
|
|
|
|
</html> |