From ef9beb0814c36cda979a4ed7e9175e72e69540ac Mon Sep 17 00:00:00 2001
From: Sébastien Dailly <sebastien@dailly.me>
Date: Sat, 24 Feb 2024 11:31:28 +0100
Subject: New application: build upgrade helper for aoo
---
calculette_aoo/index.html | 180 ++++++++++++++++++++++++++++++++++++++++++++++
1 file changed, 180 insertions(+)
create mode 100644 calculette_aoo/index.html
(limited to 'calculette_aoo/index.html')
diff --git a/calculette_aoo/index.html b/calculette_aoo/index.html
new file mode 100644
index 0000000..6dd2955
--- /dev/null
+++ b/calculette_aoo/index.html
@@ -0,0 +1,180 @@
+<!DOCTYPE html>
+<html>
+<head>
+<title>AOO PC Builder</title>
+<meta charset="UTF-8">
+<meta name="viewport" content="width=device-width, initial-scale=1">
+
+<link rel="stylesheet" type="text/css" href="/theme/font-awesome/css/fontawesome.css">
+<link rel="stylesheet" type="text/css" href="/theme/font-awesome/css/brands.css">
+<link rel="stylesheet" type="text/css" href="/theme/font-awesome/css/solid.css">
+
+
+<style>
+* {
+ box-sizing: border-box;
+}
+
+/* Style the body */
+body {
+ font-family: Arial;
+ margin: 0;
+}
+
+/* Header/logo Title */
+.header {
+ padding: 50px;
+ text-align: center;
+ color: white;
+ background-color: #333;
+}
+
+/* Column container */
+.row {
+ display: grid;
+ grid-auto-flow: column;
+}
+
+.side {
+ flex: 30%;
+ padding: 20px;
+}
+
+/* Main column */
+.main {
+ flex: 70%;
+ background-color: white;
+ padding: 20px;
+}
+
+input[type='text'] { font-size: 24px; }
+
+fieldset {
+ display: table;
+}
+fieldset div {
+ display: table-row;
+}
+
+fieldset label {
+ display: table-cell;
+ padding-right: 20px;
+ vertical-align: middle;
+}
+
+textarea {
+ width: 100%;
+ height: 300px;
+}
+
+table tr td input { width: 2em; text-align: center}
+table tr td input.wellplaced { background-color: lightgreen;}
+table tr td input.misplaced { background-color: gold;}
+tr:first-child { outline: thin solid; }
+
+/* Responsive layout - when the screen is less than 700px wide, make the two columns stack on top of each other instead of next to each other */
+@media screen and (max-width: 700px) {
+ .row, .navbar {
+ flex-direction: column;
+ }
+}
+</style>
+</head>
+<body>
+
+<!-- Header -->
+<div class="header">
+ <h1>AOO PC Builder</h1>
+</div>
+
+<!-- The flexible grid (content) -->
+<div class="main">
+ <div>
+ <noscript>Sorry, you need to enable JavaScript to see this page.</noscript>
+ <script id="lib" type="text/javascript" defer="defer" src="js/aoo.js"></script>
+ <script>
+ var script = document.getElementById('lib');
+ script.addEventListener('load', function() {
+ lib.run();
+ });
+ </script>
+ </div>
+ <form id="form" >
+ <div class="row">
+ <fieldset>
+ <div>
+ <label for="a">A</label>
+ <input type="number" id="a" name="a" value="2"/>
+ </div>
+ <div>
+ <label for="m">M</label>
+ <input type="number" id="m" name="m" value="5"/>
+ </div>
+ <div>
+ <label for="fm">FM</label>
+ <input type="number" id="fm" name="fm" value="9"/>
+ </div>
+ <div>
+ <label for="rm">RM</label>
+ <input type="number" id="rm" name="rm" value="7"/>
+ </div>
+ <div>
+ <label for="pm">PM</label>
+ <input type="number" id="pm" name="pm" value="40"/>
+ </div>
+ </fieldset>
+ <fieldset>
+ <div>
+ <label for="a">Upgrade A</label>
+ <input type="number" id="a_bonus" name="a" value="0"/>
+ </div>
+ <div>
+ <label for="m">Upgrade M</label>
+ <input type="number" id="m_bonus" name="m" value="0"/>
+ </div>
+ <div>
+ <label for="fm">Upgrade FM</label>
+ <input type="number" id="fm_bonus" name="fm" value="0"/>
+ </div>
+ <div>
+ <label for="rm">Upgrade RM</label>
+ <input type="number" id="rm_bonus" name="rm" value="0"/>
+ </div>
+ <div>
+ <label for="pm">Upgrade PM</label>
+ <input type="number" id="pm_bonus" name="pm" value="0"/>
+ </div>
+ </fieldset>
+ </div>
+ <div class="row">
+ <fieldset>
+ <div>
+ <label for="xp">XP à dépenser</label>
+ <input type="number" id="xp" name="xp" value="1000"/>
+ </div>
+ <div>
+ <label for="tours">Tour de combats</label>
+ <input type="number" id="tours" name="tours" value="5"/>
+ </div>
+ <div>
+ <label for="cost">Couts du sort</label>
+ <input type="number" id="cost" name="cost" value="8"/>
+ </div>
+ <div>
+ <label for="dammage">Dégats du sort</label>
+ <input type="number" id="dammage" name="dammage" value="6"/>
+ </div>
+ <div>
+ <label for="fm_oponent">FM de l’adversaire</label>
+ <input type="number" id="fm_oponent" name="fm_oponent" value="10"/>
+ </div>
+ </fieldset>
+ </div>
+ <input id="send" type="submit" value="Charger"/>
+ </form>
+ <h2>Résultats</h2>
+ <textarea id="result" >
+ </textarea>
+</div>
+</body>
+</html>
--
cgit v1.2.3