chemicalcrux
/
stroll
1
0
Fork 0
Code Issues 0 Pull Requests 0 Releases 11 Wiki Activity
big steppy
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
650 Commits
1 Branch
1.3 MiB
 
 
 
Branch: master
Branches Tags
${ item.name }
Create branch ${ searchTerm }
from 'master'
${ noResults }
stroll/stroll.html

320 lines
15 KiB
Raw Permalink Blame History 

  1. <!DOCTYPE html>

  2. <html lang="en">

  3. 

  4. <head>

  5.   <meta charset="utf-8">

  6.   <title>Stroll</title>

  7.   <link rel="stylesheet" type="text/css" href="https://csshake.surge.sh/csshake.min.css">

  8.   <link rel="stylesheet" href="style.css">

  9.   <script src="sounds.js"></script>

  10.   <script src="migrations.js"></script>

  11.   <script src="presets.js"></script>

  12.   <script src="units.js"></script>

  13.   <script src="recursive-macro.js"></script>

  14.   <script src="features.js"></script>

  15.   <script src="recursive-desc.js"></script>

  16.   <script src="game.js"></script>

  17.   <meta name="theme-color" content="#000000" />

  18.   <meta name="description" content="An 18+ macro/vore text game" />

  19.   <meta property="og:title" content="Stroll" />

  20.   <meta property="og:description" content="An 18+ macro/vore text game" />

  21.   <meta property="og:image" content="https://crux.sexy/images/stroll.png" />

  22.   <link rel="icon" href="https://crux.sexy/images/stroll.ico">

  23.   <script async defer data-website-id="130bd6a3-9a9f-4e3d-901b-fb35b096c5bd" src="https://umami.crux.best/umami.js" data-domains="stroll.crux.sexy,www.stroll.crux.sexy"></script>

  24. </head>

  25. 

  26. <body class="light">

  27.   <script src="darkmode.js"></script>

  28.   <div class="game-area">

  29.     <div class="sidebar" id="stat-container">

  30.       <div class="stat-header-self" id="stats-self">

  31. 

  32.       <div class="stat-container">

  33.         <button class="stat-button" id="button-look">Look Around</button>

  34.         <button class="stat-button" id="button-stats">Stats</button>

  35.       </div>

  36.         <div class="stat-line" id="height"></div>

  37.         <div class="stat-line" id="mass"></div>

  38.         <div class="stat-line" id="growth-points"></div>

  39.         <div class="stat-line" id="arousal"></div>

  40.         <div class="stat-line" id="edge"></div>

  41. 

  42. 

  43.         <div class="meter" id="arousalMeter">

  44.           <div class="meterLabel">

  45.             AROUSAL

  46.           </div>

  47.           <div class="fill">

  48.             <svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="300px" height="300px" viewBox="0 0 300 300" enable-background="new 0 0 300 300" xml:space="preserve">

  49.               <path fill="#04ACFF" id="waveShape" d="M300,300V2.5c0,0-0.6-0.1-1.1-0.1c0,0-25.5-2.3-40.5-2.4c-15,0-40.6,2.4-40.6,2.4

  50.         	c-12.3,1.1-30.3,1.8-31.9,1.9c-2-0.1-19.7-0.8-32-1.9c0,0-25.8-2.3-40.8-2.4c-15,0-40.8,2.4-40.8,2.4c-12.3,1.1-30.4,1.8-32,1.9

  51.         	c-2-0.1-20-0.8-32.2-1.9c0,0-3.1-0.3-8.1-0.7V300H300z"/>

  52.             </svg>

  53.           </div>

  54.         </div>

  55. 

  56.         <div class="meter" id="orgasmMeter">

  57.           <div class="meterLabel">

  58.             ORGASM

  59.           </div>

  60.           <div class="fill">

  61.             <svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="300px" height="300px" viewBox="0 0 300 300" enable-background="new 0 0 300 300" xml:space="preserve">

  62.               <path fill="#04ACFF" id="waveShape" d="M300,300V2.5c0,0-0.6-0.1-1.1-0.1c0,0-25.5-2.3-40.5-2.4c-15,0-40.6,2.4-40.6,2.4

  63.         	c-12.3,1.1-30.3,1.8-31.9,1.9c-2-0.1-19.7-0.8-32-1.9c0,0-25.8-2.3-40.8-2.4c-15,0-40.8,2.4-40.8,2.4c-12.3,1.1-30.4,1.8-32,1.9

  64.         	c-2-0.1-20-0.8-32.2-1.9c0,0-3.1-0.3-8.1-0.7V300H300z"/>

  65.             </svg>

  66.           </div>

  67.         </div>

  68. 

  69.         <div class="meter" id="edgeMeter">

  70.           <div class="meterLabel">

  71.             EDGING

  72.           </div>

  73.           <div class="fill">

  74.             <svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="300px" height="300px" viewBox="0 0 300 300" enable-background="new 0 0 300 300" xml:space="preserve">

  75.               <path fill="#04ACFF" id="waveShape" d="M300,300V2.5c0,0-0.6-0.1-1.1-0.1c0,0-25.5-2.3-40.5-2.4c-15,0-40.6,2.4-40.6,2.4

  76.         	c-12.3,1.1-30.3,1.8-31.9,1.9c-2-0.1-19.7-0.8-32-1.9c0,0-25.8-2.3-40.8-2.4c-15,0-40.8,2.4-40.8,2.4c-12.3,1.1-30.4,1.8-32,1.9

  77.         	c-2-0.1-20-0.8-32.2-1.9c0,0-3.1-0.3-8.1-0.7V300H300z"/>

  78.             </svg>

  79.           </div>

  80.         </div>

  81. 

  82.         <p></p>

  83.         <!-- external svg is such a pain in the ass -->

  84. 

  85.         <div class="meter" id="cumMeter">

  86.           <div class="meterLabel">

  87.             CUM

  88.           </div>

  89.           <div class="fill">

  90.             <svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="300px" height="300px" viewBox="0 0 300 300" enable-background="new 0 0 300 300" xml:space="preserve">

  91.               <path fill="#04ACFF" id="waveShape" d="M300,300V2.5c0,0-0.6-0.1-1.1-0.1c0,0-25.5-2.3-40.5-2.4c-15,0-40.6,2.4-40.6,2.4

  92.         	c-12.3,1.1-30.3,1.8-31.9,1.9c-2-0.1-19.7-0.8-32-1.9c0,0-25.8-2.3-40.8-2.4c-15,0-40.8,2.4-40.8,2.4c-12.3,1.1-30.4,1.8-32,1.9

  93.         	c-2-0.1-20-0.8-32.2-1.9c0,0-3.1-0.3-8.1-0.7V300H300z"/>

  94.             </svg>

  95.           </div>

  96.         </div>

  97. 

  98.         <div class="meter" id="femcumMeter">

  99.           <div class="meterLabel">

  100.             FEMCUM

  101.           </div>

  102.           <div class="fill">

  103.             <svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="300px" height="300px" viewBox="0 0 300 300" enable-background="new 0 0 300 300" xml:space="preserve">

  104.               <path fill="#04ACFF" id="waveShape" d="M300,300V2.5c0,0-0.6-0.1-1.1-0.1c0,0-25.5-2.3-40.5-2.4c-15,0-40.6,2.4-40.6,2.4

  105.         	c-12.3,1.1-30.3,1.8-31.9,1.9c-2-0.1-19.7-0.8-32-1.9c0,0-25.8-2.3-40.8-2.4c-15,0-40.8,2.4-40.8,2.4c-12.3,1.1-30.4,1.8-32,1.9

  106.         	c-2-0.1-20-0.8-32.2-1.9c0,0-3.1-0.3-8.1-0.7V300H300z"/>

  107.             </svg>

  108.           </div>

  109.         </div>

  110. 

  111.         <div class="meter" id="milkMeter">

  112.           <div class="meterLabel">

  113.             MILK

  114.           </div>

  115.           <div class="fill">

  116.             <svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="300px" height="300px" viewBox="0 0 300 300" enable-background="new 0 0 300 300" xml:space="preserve">

  117.               <path fill="#04ACFF" id="waveShape" d="M300,300V2.5c0,0-0.6-0.1-1.1-0.1c0,0-25.5-2.3-40.5-2.4c-15,0-40.6,2.4-40.6,2.4

  118.         	c-12.3,1.1-30.3,1.8-31.9,1.9c-2-0.1-19.7-0.8-32-1.9c0,0-25.8-2.3-40.8-2.4c-15,0-40.8,2.4-40.8,2.4c-12.3,1.1-30.4,1.8-32,1.9

  119.         	c-2-0.1-20-0.8-32.2-1.9c0,0-3.1-0.3-8.1-0.7V300H300z"/>

  120.             </svg>

  121.           </div>

  122.         </div>

  123. 

  124.         <div class="meter" id="gasMeter">

  125.           <div class="meterLabel">

  126.             GAS

  127.           </div>

  128.           <div class="fill">

  129.             <svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="300px" height="300px" viewBox="0 0 300 300" enable-background="new 0 0 300 300" xml:space="preserve">

  130.               <path fill="#04ACFF" id="waveShape" d="M300,300V2.5c0,0-0.6-0.1-1.1-0.1c0,0-25.5-2.3-40.5-2.4c-15,0-40.6,2.4-40.6,2.4

  131.         	c-12.3,1.1-30.3,1.8-31.9,1.9c-2-0.1-19.7-0.8-32-1.9c0,0-25.8-2.3-40.8-2.4c-15,0-40.8,2.4-40.8,2.4c-12.3,1.1-30.4,1.8-32,1.9

  132.         	c-2-0.1-20-0.8-32.2-1.9c0,0-3.1-0.3-8.1-0.7V300H300z"/>

  133.             </svg>

  134.           </div>

  135.         </div>

  136. 

  137.         <div class="meter" id="pissMeter">

  138.           <div class="meterLabel">

  139.             PISS

  140.           </div>

  141.           <div class="fill">

  142.             <svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="300px" height="300px" viewBox="0 0 300 300" enable-background="new 0 0 300 300" xml:space="preserve">

  143.               <path fill="#04ACFF" id="waveShape" d="M300,300V2.5c0,0-0.6-0.1-1.1-0.1c0,0-25.5-2.3-40.5-2.4c-15,0-40.6,2.4-40.6,2.4

  144.         	c-12.3,1.1-30.3,1.8-31.9,1.9c-2-0.1-19.7-0.8-32-1.9c0,0-25.8-2.3-40.8-2.4c-15,0-40.8,2.4-40.8,2.4c-12.3,1.1-30.4,1.8-32,1.9

  145.         	c-2-0.1-20-0.8-32.2-1.9c0,0-3.1-0.3-8.1-0.7V300H300z"/>

  146.             </svg>

  147.           </div>

  148.         </div>

  149. 

  150.         <div class="meter" id="scatMeter">

  151.           <div class="meterLabel">

  152.             SCAT

  153.           </div>

  154.           <div class="fill">

  155.             <svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="300px" height="300px" viewBox="0 0 300 300" enable-background="new 0 0 300 300" xml:space="preserve">

  156.               <path fill="#04ACFF" id="waveShape" d="M300,300V2.5c0,0-0.6-0.1-1.1-0.1c0,0-25.5-2.3-40.5-2.4c-15,0-40.6,2.4-40.6,2.4

  157.         	c-12.3,1.1-30.3,1.8-31.9,1.9c-2-0.1-19.7-0.8-32-1.9c0,0-25.8-2.3-40.8-2.4c-15,0-40.8,2.4-40.8,2.4c-12.3,1.1-30.4,1.8-32,1.9

  158.         	c-2-0.1-20-0.8-32.2-1.9c0,0-3.1-0.3-8.1-0.7V300H300z"/>

  159.             </svg>

  160.           </div>

  161.         </div>

  162. 

  163.         <div class="stat-line-hidden" id="cum"></div>

  164.         <div class="stat-line-hidden" id="femcum"></div>

  165.         <div class="stat-line-hidden" id="milk"></div>

  166.         <div class="stat-line-hidden" id="gas"></div>

  167.         <div class="stat-line-hidden" id="piss"></div>

  168.         <div class="stat-line-hidden" id="scat"></div>

  169.       </div>

  170. 

  171.       <div class="growth-box">

  172.         <div id="growth-box-left">

  173.           <div class="stat-header-self">Growth</div>

  174.           <select id="growth-part-select">

  175.             <option class="growth-part growth-part-active" id="option-growth-body" value="body">Body</option>

  176.             <option class="growth-part" id="option-growth-paws" value="paws">Paws</option>

  177.             <option class="growth-part" id="option-growth-tail" value="tail">Tail</option>

  178.             <option class="growth-part" id="option-growth-ass" value="ass">Ass</option>

  179.             <option class="growth-part" id="option-growth-dick" value="dick">Cock</option>

  180.             <option class="growth-part" id="option-growth-balls" value="balls">Balls</option>

  181.             <option class="growth-part" id="option-growth-slit" value="slit">Slit</option>

  182.             <option class="growth-part" id="option-growth-womb" value="womb">Womb</option>

  183.             <option class="growth-part" id="option-growth-breasts" value="breasts">Breasts</option>

  184.             <option class="growth-part" id="option-growth-wings" value="wings">Wings</option>

  185.             <option class="growth-part" id="option-growth-musk" value="musk">Musk</option>

  186.             <option class="growth-part" id="option-growth-stench" value="stench">Stench</option>

  187.             <option class="growth-part" id="option-growth-breath" value="breath">Breath</option>

  188.             <option class="growth-part" id="option-growth-magic" value="magic">Magic</option>

  189.           </select>

  190.           <div id="growth-amount-buttons">

  191.             <button class="growth-amount" id="button-growth-1.1">1.1x</button>

  192.             <button class="growth-amount" id="button-growth-1.5">1.5x</button>

  193.             <button class="growth-amount" id="button-growth-2">2x</button>

  194.             <button class="growth-amount" id="button-growth-5">5x</button>

  195.             <button class="growth-amount" id="button-growth-20">20x</button>

  196.             <button class="growth-amount" id="button-growth-100">100x</button>

  197.           </div>

  198.         </div>

  199.       </div>

  200.     </div>

  201.     <div class="log" id="log">

  202.       <div>Welcome to Stroll</div>

  203.       <div>&nbsp;</div>

  204.       <div class="version"></div>

  205.       <div>&nbsp;</div>

  206.       <div><b>This game features 18+ content</b></div>

  207.       <div>&nbsp;</div>

  208.     </div>

  209.     <div class="log" id="react-log">

  210.       <div>It's a nice day for a walk.</div>

  211.       <div>&nbsp;</div>

  212.       <div>This log will show automatic actions.</div>

  213.       <div>&nbsp;</div>

  214.     </div>

  215.     <div class="sidebar" id="action-panel">

  216. 

  217.     </div>

  218.   </div>

  219.   <div class="character-build" id="character-build-area">

  220.     <div class="intro-text">

  221.       <p>Welcome to Stroll</p>

  222.       <p class="version"></p>

  223.       <p><b>This game features 18+ content</b></p>

  224.       

  225.       <p><a href="https://crux.sexy/changelog#stroll">Changelog</a> - <a href="https://discord.gg/7pdcVhD">Discord</a></p>

  226. 

  227.       <p>Stroll is a text-based macro game. Stomp things, eat things, abuse things - then grow larger and do it all over again.</p>

  228. 

  229.       <p>Leave a box empty for a sane default value. Units are metric, but you can preview other unit systems.</p>

  230.       <p>Click on boxed titles to enable and disable features.</p>

  231.       <p class="has-tooltip" title="uwu">Underlined options have tooltips</p>

  232.     </div>

  233. 

  234.     <div id="custom-species">

  235. 

  236. 

  237.       <ul class="flex-outer">

  238. 

  239. 

  240.         <div class="custom-category wide-category">

  241.           <div>

  242.             <button class="option-button" id="button-start">Start Game</button>

  243.           </div>

  244.         </div>

  245. 

  246.         <div class="custom-category">

  247.           <p>Presets let you play as other players' characters. There are a few groups to choose from.</p>

  248.           <div>

  249.             <select id="character-preset-categories">

  250. 

  251.             </select>

  252.             <select id="character-presets">

  253. 

  254.             </select>

  255.           </div>

  256.           <p>

  257.             <button type="button" class="option-button" id="button-load-preset">Load Preset Character</button>

  258.           </p>

  259.         </div>

  260. 

  261.         <div class="custom-category">

  262.           <p>Save/load your own characters here. They will be stored in your browser.</p>

  263.           <div>

  264.             <select id="custom-characters">

  265.               <option>No character to load</option>

  266.             </select>

  267.           </div>

  268.           <p></p>

  269.           <div>

  270.             <button type="button" class="option-button" id="button-load-custom">Load</button>

  271.             <button type="button" class="option-button" id="button-save-custom">Save</button>

  272.             <button type="button" class="option-button" id="button-delete-custom">Delete</button>

  273.           </div>

  274.         </div>

  275. 

  276.         <div class="custom-category">

  277.           <p>Export your current character or import someone else's character.</p>

  278.           <div class>

  279.             <button type="button" class="option-button" id="button-export-clear">Clear</button>

  280.             <button type="button" class="option-button" id="button-export-preset">Export</button>

  281.             <button type="button" class="option-button" id="button-import-preset">Import</button>

  282. 

  283.             <p><input autocomplete="off" type="text" id="export-area" placeholder="Paste character data here..."></p>

  284.           </div>

  285.         </div>

  286. 

  287.         <div class="custom-category">

  288.           <p>Reset the sheet here (saved data isn't affected). You can also load the character you started your most recent game with.</p>

  289. 

  290.           <div>

  291.             <button class="option-button" id="button-reset-custom">Reset</button>

  292.             <button class="option-button" id="button-load-autosave">Load Last</button>

  293.           </div>

  294.         </div>

  295. 

  296.         <div class="custom-category">

  297.           <p>Show/hide whole groups of character features here.</p>

  298.           <div id="group-button-holder">

  299. 

  300.           </div>

  301.         </div>

  302. 

  303.         <div class="custom-category">

  304.           <p>Misc options</p>

  305.           <br>

  306.           <button class="option-button" id="button-dark-mode-options">Toggle Dark Mode</button>

  307.           <button class="option-button" id="button-units-options">Units: Metric</button>

  308.         </div>

  309.       </ul>

  310.       <form id="custom-species-form" name="custom-species-form">

  311.         <ul class="flex-outer" id="character-flex-outer">

  312.           <input class="save-version" id="save-version" name="version" type="number"></input>

  313.         </ul>

  314.       </form>

  315.     </div>

  316.   </div>

  317. </body>

  318. 

  319. </html>