Redid the action selector.

7 年前 · c2d292ae15
--- a/game.js
+++ b/game.js
@@ -1896,6 +1896,7 @@ function startGame(e) {
      document.getElementById("button-tail_vore").style.display = 'none';
    }
  } else {
    document.getElementById("action-part-tails").style.display = 'none';
    document.getElementById("button-tail_slap").style.display = 'none';
    document.getElementById("button-tail_vore").style.display = 'none';
  }
@@ -1903,6 +1904,7 @@ function startGame(e) {
  if (macro.maleParts) {
    victimTypes = victimTypes.concat(["cock","balls"]);
  } else {
    document.getElementById("action-part-dick").style.display = 'none';
    document.getElementById("button-cockslap").style.display = 'none';
    document.getElementById("button-cock_vore").style.display = 'none';
    document.getElementById("button-ball_smother").style.display = 'none';
@@ -1915,6 +1917,7 @@ function startGame(e) {
  if (macro.femaleParts) {
    victimTypes = victimTypes.concat(["womb"]);
  } else {
    document.getElementById("action-part-vagina").style.display = 'none';
    document.getElementById("button-unbirth").style.display = 'none';
    document.getElementById("femcum").style.display = 'none';
    document.getElementById("femcumPercent").style.display = 'none';
@@ -1936,6 +1939,7 @@ function startGame(e) {
      document.getElementById("button-breast_vore").style.display = 'none';
    }
  } else {
    document.getElementById("action-part-breasts").style.display = 'none';
    document.getElementById("button-breast_vore").style.display = 'none';
    document.getElementById("button-breast_milk").style.display = 'none';
    document.getElementById("milk").style.display = 'none';
@@ -2004,9 +2008,26 @@ function startGame(e) {

  update();

  document.getElementById("actions-body").style.display = 'flex';
  document.getElementById("stat-container").style.display = 'flex';
 }

 function actionTab(e) {
  var name = e.target.id;

  var target = "actions-" + name.replace(/action-part-/,"");

  document.querySelectorAll(".action-part-button.active").forEach(function (element) {
    element.classList.remove("active");
  })
  document.querySelectorAll(".action-tab").forEach(function (element) {
    element.style.display = "none";
  });

  e.target.classList.add("active")
  document.getElementById(target).style.display = "flex";
 }

 window.addEventListener('load', function(event) {

  victims["stomped"] = initVictims();
@@ -2025,6 +2046,10 @@ window.addEventListener('load', function(event) {
  victims["splooged"] = initVictims();
  victims["ground"] = initVictims();

  document.querySelectorAll(".action-part-button").forEach(function (element) {
    element.addEventListener("click",actionTab);
  });

  document.getElementById("button-look").addEventListener("click",look);
  document.getElementById("button-feed").addEventListener("click",feed);
  document.getElementById("button-chew").addEventListener("click",chew);
--- a/stroll.html
+++ b/stroll.html
@@ -11,7 +11,7 @@
  </head>
  <body>
    <div class=game-area>
      <div class=stat-container id=stat-container>
      <div class=sidebar id=stat-container>
        <div class=stat-header-self id=stats-self>
          <p>Stats</p>
          <div class=stat-line id=height></div>
@@ -59,44 +59,64 @@
            <th><button class=growth-amount id="button-amount-100">100x</button></th>
          </tr>
        </table>
        <div class=button-container>
          <button class=stat-button id=button-look>Look</button>
          <button class=stat-button id=button-arousal>Arousal On</button>
          <button class=stat-button id=button-stroll>Status: Standing</button>
          <button class=stat-button id=button-location>Location: Suburb</button>
          <button class=stat-button id=button-numbers>Numbers: Full</button>
          <button class=stat-button id=button-units>Units: Metric</button>
          <button class=stat-button id=button-verbose>Verbose</button>
          <button class=stat-button id=button-grow-lots>SUPER BIG</button>
        </div>
      </div>
      <div id=log-area>
        <div id=log>
          <div>Welcome to Stroll 0.4.5</div>
          <div>Welcome to Stroll 0.4.6</div>
          <div><b>This game features 18+ content</b></div>
          <div><a href="https://chemicalcrux.org/stroll">Changelog</a></div>
          <div>It's a nice day for a walk</div>
          <div>&nbsp;</div>
        </div>
      </div>
      <div class=button-container id=action-panel>
        <button class=action-button id=button-look>Look</button>
        <button class=action-button id=button-feed>Eat</button>
        <button class=action-button id=button-chew>Chew</button>
        <button class=action-button id=button-stomp>Stomp</button>
        <button class=action-button id=button-sit>Sit</button>
        <button class=action-button id=button-tail_slap>Tail Slap</button>
        <button class=action-button id=button-tail_vore>Tail Vore</button>
        <button class=action-button id=button-grind>Grind</button>
        <button class=action-button id=button-breast_crush>Breast Crush</button>
        <button class=action-button id=button-breast_vore>Breast Vore</button>
        <button class=action-button id=button-breast_milk>Milk Breasts</button>
        <button class=action-button id=button-unbirth>Unbirth</button>
        <button class=action-button id=button-cockslap>Cockslap</button>
        <button class=action-button id=button-cock_vore>Cock Vore</button>
        <button class=action-button id=button-ball_smother>Ball Smother</button>
        <button class=action-button id=button-arousal>Arousal On</button>
        <button class=action-button id=button-stroll>Status: Standing</button>
        <button class=action-button id=button-location>Location: Suburb</button>
        <button class=action-button class=action-button id=button-numbers>Numbers: Full</button>
        <button class=action-button class=action-button id=button-units>Units: Metric</button>
        <button class=action-button id=button-verbose>Verbose</button>
        <button class=action-button id=button-grow-lots>SUPER BIG</button>
      <div class=sidebar id=action-panel>
        <div class=action-part-container>
          <button class="active action-part-button" id=action-part-body>Body</button>
          <button class=action-part-button id=action-part-dick>Cock</button>
          <button class=action-part-button id=action-part-vagina>Slit</button>
          <button class=action-part-button id=action-part-breasts>Breasts</button>
          <button class=action-part-button id=action-part-tails>Tails</button>
        </div>

        <div class=action-tab id=actions-body>
          <button class=action-button id=button-feed>Eat</button>
          <button class=action-button id=button-chew>Chew</button>
          <button class=action-button id=button-stomp>Stomp</button>
          <button class=action-button id=button-sit>Sit</button>
          <button class=action-button id=button-grind>Grind</button>
        </div>
        <div class=action-tab id=actions-tails>
          <button class=action-button id=button-tail_slap>Tail Slap</button>
          <button class=action-button id=button-tail_vore>Tail Vore</button>
        </div>
        <div class=action-tab id=actions-breasts>
          <button class=action-button id=button-breast_crush>Breast Crush</button>
          <button class=action-button id=button-breast_vore>Breast Vore</button>
          <button class=action-button id=button-breast_milk>Milk Breasts</button>
        </div>
        <div class=action-tab id=actions-vagina>
          <button class=action-button id=button-unbirth>Unbirth</button>
        </div>
        <div class=action-tab id=actions-dick>
          <button class=action-button id=button-cockslap>Cockslap</button>
          <button class=action-button id=button-cock_vore>Cock Vore</button>
          <button class=action-button id=button-ball_smother>Ball Smother</button>
        </div>
      </div>


      <div class=option-container id=option-panel>
        <p>Welcome to Stroll 0.4.5</p>
        <p>Welcome to Stroll 0.4.6</p>
        <p><b>This game features 18+ content</b></p>
        <a href="https://chemicalcrux.org/stroll">Changelog</a>
        <br>
--- a/style.css
+++ b/style.css
@@ -9,13 +9,13 @@ body {
  margin: auto;
 }

@media (max-aspect-ratio: 1.2){
@media (max-aspect-ratio: 1/1){
  .game-area {
    width: 100%
  }
 }

@media (min-aspect-ratio: 16/9){
@media (min-aspect-ratio: 1/1){
  .game-area {
    width: 75%
  }
@@ -49,11 +49,12 @@ body {
  font-size: 12pt;
 }

 .stat-container {
 .sidebar {
  display: none;
  flex-wrap: wrap;
  flex-direction: column;
  text-align: right;
  min-width: 250px;
  flex: 1;
 }

@@ -67,9 +68,14 @@ body {

 .button-container {
  flex-wrap: wrap;
  max-width: 300px;
  height: 400px;
  flex: 2;
  flex-direction: column;
  flex: 1;
 }

 .action-part-container {
  max-height: 300px;
  display: flex;
  flex-wrap: wrap;
 }

 #action-panel {
@@ -82,26 +88,22 @@ body {
  height: 75px;
 }

 .stat-button {
  font-size: 20px;
  width: 120px;
  height: 75px;
 }

 .option-form {
  font-size: 16px;
  width: 300px;
  height: 100px;
 }

@media (max-aspect-ratio: 16/9){
  .action-button {
    font-size: 18px;
    width: 100px;
    height: 75px;
  }
 }

@media (min-aspect-ratio: 16/9){
  .action-button {
    font-size: 24px;
    width: 150px;
    height: 75px;
  }
 .action-button {
  font-size: 18px;
  width: 50%;
  height: 75px;
 }

 #victim-table {
@@ -194,3 +196,24 @@ input[type="radio"]:checked+
 ul {
  list-style: none;
 }

 .action-tab {
  flex-wrap: wrap;
  display: none;
  width: 100%;
 }

 .action-part-button {
  border: 1px;
  font-size: 30px;
  width: 50%;
  height: 100px;
 }

 .action-part-button.active {
  border: 1px;
  font-size: 30px;
  width: 50%;
  height: 100px;
  background: #555;
 }