Add more reps

.gitignore

@@ -1,3 +1,3 @@
 tweego
 output.html
-twine_src/.DS_Store
+.DS_Store

twine_src/main.twee

@@ -8,9 +8,7 @@
 :: StoryTitle
 Jammy Jam
 
-:: Start-Old  [alfa bravo charlie]
-<% console.log(setup.game) %>
-<% console.log(s) %>
+:: Start-Old 
 
 ## What are your pronouns?
 
@@ -45,13 +43,16 @@ What's your planet name?
 
 
 :: Start [scripted]
+
+<% console.log(setup.game) %>
+<% console.log(s) %>
 <!-- <div style="position: absolute; top: 0; left: 0; padding: 20px; color: white; z-index: 200">hello <%= s.playerName %>! Your planet is called <%= s.planetName %>.</div> -->
 
     <div id="mapScreen"></div>
     <div id="hud">
 
         <div id="planet-info">
-            <div id="rep"></div>
+            <div id="rep" class="rep flex flex-col self-end"></div>
             <div id="passageContainer"></div>
         </div>
 
@@ -86,15 +87,24 @@ What's your planet name?
 [[Back to Map|MapScreen]] -->
 
 :: Melodic Quest
-The Intergalactic Orchestra has lost its melody, scattering notes across the cosmos. Retrieve the musical fragments to restore harmony to the galaxy. [[Retrieve fragments->Energy Depletion]]
+The Intergalactic Orchestra has lost its melody, scattering notes across the cosmos. Retrieve the musical fragments to restore harmony to the galaxy.
+
+<div class="flex flex-row justify-between">
+    <a onclick='story.state.changeEnergy(10)'>Increase energy</a>
+    <a onclick='story.state.changeEnergy(-10)'>Decrease energy</a>
+</div>
+[[Retrieve fragments->Energy Depletion]]
+
 
 :: Energy Depletion
 
 Energy depleted!
+<a onclick='story.state.changeEnergy()'>Change energy</a> 
+
 <script>
   story.state.energy -= 50;
 </script>
-[[Back to Map|MapScreen]]
+[[Back to Map|Start]]
 
 :: Quantum Conundrum
 A quantum computer has gone haywire, creating chaos in the time-space continuum. Solve complex puzzles to recalibrate the machine and stabilize reality.

twine_src/scripts/init.js

@@ -1,9 +1,11 @@
 window.setup = window.setup || {};
-
+$.getScript("https://cdn.tailwindcss.com", function () {
+  console.log("Tailwind CSS loaded.");
+});
 // scripts/init.js
 setup.game = {
   playerName: "",
-  energyReserves: 100,
+  energy: 100,
 
   planets: [
     {
@@ -123,6 +125,12 @@ setup.game = {
       relatedPassage: "Warp Wayfarer",
     },
   ],
+  turns: [
+    {
+      1: {},
+      2: {},
+    },
+  ],
 };
 
 setup.saveNames = function () {
@@ -159,11 +167,14 @@ story.state.setIt = function () {
   story.state.cPronouns = ["It", "It", "Its", "Its", "It's"];
   story.show("Preface");
 };
-
+story.state.changeEnergy = function (change) {
+  setup.game.energy += change;
+  console.log("Energy is now ", setup.game.energy);
+};
 setup.showPlanet = function (planetIndex) {
   const planet = setup.game.planets[planetIndex];
   let content = `<h1>${planet.name}</h1><p>${planet.description}</p>`;
-  let repContent = `<span class='repName'>${planet.rep}</span><div><img class='repImage' src='${planet.repImgSrc}' /></div>`;
+  let repContent = `<span class='repName text-sm uppercase text-center'>${planet.rep}</span><div><img class='repImage w-40 h-40 -mb-4' src='${planet.repImgSrc}' /></div>`;
   var repContainer = document.getElementById("rep");
 
   repContainer.innerHTML = repContent;
@@ -221,7 +232,9 @@ setup.showRandomIncompleteScenario = function () {
 
   if (incompleteScenarios.length > 0) {
     var randomIndex = Math.floor(Math.random() * incompleteScenarios.length);
-    var scenario = incompleteScenarios[randomIndex];
+    // var scenario = incompleteScenarios[randomIndex];
+    var scenario = either(incompleteScenarios);
+
     return {
       content: `<h2>${scenario.title}</h2><p>${scenario.description}</p>`,
       relatedPassage: scenario.relatedPassage,

twine_src/styles/main.css

@@ -53,9 +53,6 @@ html {
 }
 
 .repImage {
-  width: 100px;
-
-  margin-bottom: -2rem;
 }
 #passageContainer {
   justify-self: end;