summaryrefslogtreecommitdiff
path: root/index.html
diff options
context:
space:
mode:
authorcyfraeviolae <cyfraeviolae>2021-07-04 21:15:52 -0400
committercyfraeviolae <cyfraeviolae>2021-07-04 21:15:52 -0400
commit1c9daafa826f96d6690a6afbfb244ad8340308dc (patch)
tree35d769665eb2e794099e1a61f55e0d41baf07199 /index.html
parent96331a5f0f7992e865a07d9a245d4e7e4a073c80 (diff)
js
Diffstat (limited to 'index.html')
-rw-r--r--index.html360
1 files changed, 360 insertions, 0 deletions
diff --git a/index.html b/index.html
new file mode 100644
index 0000000..e19bb22
--- /dev/null
+++ b/index.html
@@ -0,0 +1,360 @@
+<!DOCTYPE html>
+<html>
+ <head>
+ <title>Well-Ordered</title>
+ <meta charset="utf-8">
+ <style>
+body {
+ background: #fdf3f3;
+ color: DarkSlateGrey;
+ font-family: EBGaramond, serif;
+ font-size: large;
+}
+
+a {
+ color: #1a97bf;
+}
+
+a:hover {
+ color: #075d77;
+}
+
+.container {
+ margin: 1em;
+ max-width: 40em;
+}
+
+.row {
+ margin-bottom: 1em;
+}
+
+.title {
+ letter-spacing: -0.5px;
+}
+
+div {
+ margin-bottom: 10px;
+}
+
+
+form {
+ border: 1px DarkSlateGrey solid;
+ padding: 10px;
+ padding-left: 25px;
+}
+
+.sep {
+ margin-left: 6px;
+ margin-right: 6px;
+}
+
+.nonbreaking {
+ white-space: nowrap;
+}
+ .ingredient {
+ display: inline-block;
+ margin-right: 5px;
+ margin-bottom: 5px;
+ }
+ button {
+ margin-right: 10px;
+ }
+ </style>
+ </head>
+ <body>
+ <div class="container">
+ <h3>Well-Ordered</h3>
+ <noscript>Sorry, JavaScript is required to run Well-Ordered.</noscript>
+ <div id="form">
+ <form action="/" method="none">
+ <p>
+ Select any ingredients already owned or of negligible cost.
+ </p>
+ <div id="checkboxes">
+ <div class="ingredient">
+ <input type="checkbox" id="ingredient0" x-ingredient="0">
+ <label for="ingredient0">Absinthe</label>
+ </div>
+ <div class="ingredient">
+ <input type="checkbox" id="ingredient1" x-ingredient="1">
+ <label for="ingredient1">Angostura bitters</label>
+ </div>
+ <div class="ingredient">
+ <input type="checkbox" id="ingredient2" x-ingredient="2">
+ <label for="ingredient2">Aperol</label>
+ </div>
+ <div class="ingredient">
+ <input type="checkbox" id="ingredient3" x-ingredient="3">
+ <label for="ingredient3">Apricot brandy</label>
+ </div>
+ <div class="ingredient">
+ <input type="checkbox" id="ingredient4" x-ingredient="4">
+ <label for="ingredient4">Blackberry liqueur</label>
+ </div>
+ <div class="ingredient">
+ <input type="checkbox" id="ingredient5" x-ingredient="5">
+ <label for="ingredient5">Bourbon</label>
+ </div>
+ <div class="ingredient">
+ <input type="checkbox" id="ingredient6" x-ingredient="6">
+ <label for="ingredient6">Cachaca</label>
+ </div>
+ <div class="ingredient">
+ <input type="checkbox" id="ingredient7" x-ingredient="7">
+ <label for="ingredient7">Calvados</label>
+ </div>
+ <div class="ingredient">
+ <input type="checkbox" id="ingredient8" x-ingredient="8">
+ <label for="ingredient8">Campari</label>
+ </div>
+ <div class="ingredient">
+ <input type="checkbox" id="ingredient9" x-ingredient="9">
+ <label for="ingredient9">Champagne</label>
+ </div>
+ <div class="ingredient">
+ <input type="checkbox" id="ingredient10" x-ingredient="10">
+ <label for="ingredient10">Cherry liqueur</label>
+ </div>
+ <div class="ingredient">
+ <input type="checkbox" id="ingredient11" x-ingredient="11" checked>
+ <label for="ingredient11">Coconut milk</label>
+ </div>
+ <div class="ingredient">
+ <input type="checkbox" id="ingredient12" x-ingredient="12">
+ <label for="ingredient12">Coffee liqueur</label>
+ </div>
+ <div class="ingredient">
+ <input type="checkbox" id="ingredient13" x-ingredient="13">
+ <label for="ingredient13">Cognac</label>
+ </div>
+ <div class="ingredient">
+ <input type="checkbox" id="ingredient14" x-ingredient="14" checked>
+ <label for="ingredient14">Cola</label>
+ </div>
+ <div class="ingredient">
+ <input type="checkbox" id="ingredient15" x-ingredient="15" checked>
+ <label for="ingredient15">Cranberry juice</label>
+ </div>
+ <div class="ingredient">
+ <input type="checkbox" id="ingredient16" x-ingredient="16" checked>
+ <label for="ingredient16">Cream</label>
+ </div>
+ <div class="ingredient">
+ <input type="checkbox" id="ingredient17" x-ingredient="17">
+ <label for="ingredient17">Cream liqueur</label>
+ </div>
+ <div class="ingredient">
+ <input type="checkbox" id="ingredient18" x-ingredient="18">
+ <label for="ingredient18">Créme de Cacao</label>
+ </div>
+ <div class="ingredient">
+ <input type="checkbox" id="ingredient19" x-ingredient="19">
+ <label for="ingredient19">Créme de Cassis</label>
+ </div>
+ <div class="ingredient">
+ <input type="checkbox" id="ingredient20" x-ingredient="20">
+ <label for="ingredient20">Créme de Menthe</label>
+ </div>
+ <div class="ingredient">
+ <input type="checkbox" id="ingredient21" x-ingredient="21">
+ <label for="ingredient21">DOM Bénédictine</label>
+ </div>
+ <div class="ingredient">
+ <input type="checkbox" id="ingredient22" x-ingredient="22">
+ <label for="ingredient22">Dark rum</label>
+ </div>
+ <div class="ingredient">
+ <input type="checkbox" id="ingredient23" x-ingredient="23">
+ <label for="ingredient23">DiSaronno</label>
+ </div>
+ <div class="ingredient">
+ <input type="checkbox" id="ingredient24" x-ingredient="24">
+ <label for="ingredient24">Drambuie</label>
+ </div>
+ <div class="ingredient">
+ <input type="checkbox" id="ingredient25" x-ingredient="25">
+ <label for="ingredient25">Dry vermouth</label>
+ </div>
+ <div class="ingredient">
+ <input type="checkbox" id="ingredient26" x-ingredient="26">
+ <label for="ingredient26">Dry white wine</label>
+ </div>
+ <div class="ingredient">
+ <input type="checkbox" id="ingredient27" x-ingredient="27" checked>
+ <label for="ingredient27">Egg yolk</label>
+ </div>
+ <div class="ingredient">
+ <input type="checkbox" id="ingredient28" x-ingredient="28">
+ <label for="ingredient28">Galliano</label>
+ </div>
+ <div class="ingredient">
+ <input type="checkbox" id="ingredient29" x-ingredient="29">
+ <label for="ingredient29">Gin</label>
+ </div>
+ <div class="ingredient">
+ <input type="checkbox" id="ingredient30" x-ingredient="30" checked>
+ <label for="ingredient30">Ginger ale</label>
+ </div>
+ <div class="ingredient">
+ <input type="checkbox" id="ingredient31" x-ingredient="31" checked>
+ <label for="ingredient31">Ginger beer</label>
+ </div>
+ <div class="ingredient">
+ <input type="checkbox" id="ingredient32" x-ingredient="32" checked>
+ <label for="ingredient32">Grapefruit juice</label>
+ </div>
+ <div class="ingredient">
+ <input type="checkbox" id="ingredient33" x-ingredient="33">
+ <label for="ingredient33">Grenadine</label>
+ </div>
+ <div class="ingredient">
+ <input type="checkbox" id="ingredient34" x-ingredient="34" checked>
+ <label for="ingredient34">Hot coffee</label>
+ </div>
+ <div class="ingredient">
+ <input type="checkbox" id="ingredient35" x-ingredient="35">
+ <label for="ingredient35">Irish whiskey</label>
+ </div>
+ <div class="ingredient">
+ <input type="checkbox" id="ingredient36" x-ingredient="36">
+ <label for="ingredient36">Kirsch</label>
+ </div>
+ <div class="ingredient">
+ <input type="checkbox" id="ingredient37" x-ingredient="37" checked>
+ <label for="ingredient37">Lemon juice</label>
+ </div>
+ <div class="ingredient">
+ <input type="checkbox" id="ingredient38" x-ingredient="38">
+ <label for="ingredient38">Lillet Blonde</label>
+ </div>
+ <div class="ingredient">
+ <input type="checkbox" id="ingredient39" x-ingredient="39" checked>
+ <label for="ingredient39">Lime juice</label>
+ </div>
+ <div class="ingredient">
+ <input type="checkbox" id="ingredient40" x-ingredient="40">
+ <label for="ingredient40">Maraschino</label>
+ </div>
+ <div class="ingredient">
+ <input type="checkbox" id="ingredient41" x-ingredient="41" checked>
+ <label for="ingredient41">Olive juice</label>
+ </div>
+ <div class="ingredient">
+ <input type="checkbox" id="ingredient42" x-ingredient="42">
+ <label for="ingredient42">Orange bitters</label>
+ </div>
+ <div class="ingredient">
+ <input type="checkbox" id="ingredient43" x-ingredient="43">
+ <label for="ingredient43">Orange flower water</label>
+ </div>
+ <div class="ingredient">
+ <input type="checkbox" id="ingredient44" x-ingredient="44" checked>
+ <label for="ingredient44">Orange juice</label>
+ </div>
+ <div class="ingredient">
+ <input type="checkbox" id="ingredient45" x-ingredient="45">
+ <label for="ingredient45">Orgeat</label>
+ </div>
+ <div class="ingredient">
+ <input type="checkbox" id="ingredient46" x-ingredient="46">
+ <label for="ingredient46">Peach bitters</label>
+ </div>
+ <div class="ingredient">
+ <input type="checkbox" id="ingredient47" x-ingredient="47">
+ <label for="ingredient47">Peach puree</label>
+ </div>
+ <div class="ingredient">
+ <input type="checkbox" id="ingredient48" x-ingredient="48">
+ <label for="ingredient48">Peach schnapps</label>
+ </div>
+ <div class="ingredient">
+ <input type="checkbox" id="ingredient49" x-ingredient="49">
+ <label for="ingredient49">Peychaud's bitters</label>
+ </div>
+ <div class="ingredient">
+ <input type="checkbox" id="ingredient50" x-ingredient="50" checked>
+ <label for="ingredient50">Pineapple juice</label>
+ </div>
+ <div class="ingredient">
+ <input type="checkbox" id="ingredient51" x-ingredient="51">
+ <label for="ingredient51">Pisco</label>
+ </div>
+ <div class="ingredient">
+ <input type="checkbox" id="ingredient52" x-ingredient="52">
+ <label for="ingredient52">Prosecco</label>
+ </div>
+ <div class="ingredient">
+ <input type="checkbox" id="ingredient53" x-ingredient="53">
+ <label for="ingredient53">Raspberry liqueur</label>
+ </div>
+ <div class="ingredient">
+ <input type="checkbox" id="ingredient54" x-ingredient="54">
+ <label for="ingredient54">Raspberry syrup</label>
+ </div>
+ <div class="ingredient">
+ <input type="checkbox" id="ingredient55" x-ingredient="55">
+ <label for="ingredient55">Red Port</label>
+ </div>
+ <div class="ingredient">
+ <input type="checkbox" id="ingredient56" x-ingredient="56">
+ <label for="ingredient56">Rye</label>
+ </div>
+ <div class="ingredient">
+ <input type="checkbox" id="ingredient57" x-ingredient="57">
+ <label for="ingredient57">Scotch</label>
+ </div>
+ <div class="ingredient">
+ <input type="checkbox" id="ingredient58" x-ingredient="58" checked>
+ <label for="ingredient58">Soda water</label>
+ </div>
+ <div class="ingredient">
+ <input type="checkbox" id="ingredient59" x-ingredient="59">
+ <label for="ingredient59">Strawberry syrup</label>
+ </div>
+ <div class="ingredient">
+ <input type="checkbox" id="ingredient60" x-ingredient="60">
+ <label for="ingredient60">Sweet vermouth</label>
+ </div>
+ <div class="ingredient">
+ <input type="checkbox" id="ingredient61" x-ingredient="61" checked>
+ <label for="ingredient61">Syrup</label>
+ </div>
+ <div class="ingredient">
+ <input type="checkbox" id="ingredient62" x-ingredient="62">
+ <label for="ingredient62">Tequila</label>
+ </div>
+ <div class="ingredient">
+ <input type="checkbox" id="ingredient63" x-ingredient="63" checked>
+ <label for="ingredient63">Tomato juice</label>
+ </div>
+ <div class="ingredient">
+ <input type="checkbox" id="ingredient64" x-ingredient="64">
+ <label for="ingredient64">Triple Sec</label>
+ </div>
+ <div class="ingredient">
+ <input type="checkbox" id="ingredient65" x-ingredient="65">
+ <label for="ingredient65">Vodka</label>
+ </div>
+ <div class="ingredient">
+ <input type="checkbox" id="ingredient66" x-ingredient="66">
+ <label for="ingredient66">White rum</label>
+ </div>
+ </div>
+ <div>
+ <label for="limit">Time limit in seconds:</label>
+ <input id="limit" name="limit" type="number" value="120" min="10"></input>
+ </div>
+ <div>
+ <button type="submit" id="optimal">Compute optimal (slow)</button>
+ <button type="button" id="greedy">Compute greedy (fast)</button>
+ </div>
+ </form>
+ </div>
+ <div id="waiting"></div>
+ <div id="solution"></div>
+ </div>
+ <script src="./node_modules/glpk.js/glpk.js"></script>
+ <script src="./recipes.js"></script>
+ <script src="./script.js"></script>
+ </body>
+</html>