diff options
Diffstat (limited to 'index.html')
| -rw-r--r-- | index.html | 360 |
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> |