D2S char stats and skills tabs done

res/app.js

@@ -381,7 +381,7 @@ $(document).ready(function () {
         return "/saveCharacter.php?cmd=" + cmd + "&name=" + name + "&value=" + value + "&filePath=" + filePath;
     }
 
-    $(".charform input[name='Difficulty'], .charform .skill, #CharacterName, #CharacterClass, #CharacterLevel, #CharacterClass").change(function () {
+    $(".charform input[name='Difficulty'], .charform .skill, #CharacterName, #CharacterClass, #CharacterLevel, #CharacterClass, .stats input").change(function () {
         var name = $(this).attr("name");
         var newValue = $(this).val();
 

saveCharacter.php

@@ -231,13 +231,76 @@ switch ($cmd) {
         $char->setChar("Difficulty", $value);
         echo "Handling Difficulty command - Difficulty: $value, File Path: $filePath";
         break;
-    
+
     // skills
     case "skills":
         //var_dump($char->cData);
         $char->setSkill($name, $value);
         echo "Handling skills command - Skill: $name, Value: $value, File Path: $filePath";
         break;
+
+    // stats
+// Handle strength command
+    case "strength":
+        $char->setStat("strength", $value); // Set the "strength" stat to the provided value
+        echo "Handling strength command - Value: $value, File Path: $filePath"; // Display a message indicating the handling of the strength command
+        break;
+
+// Handle dexterity command
+    case "dexterity":
+        $char->setStat("dexterity", $value); // Set the "dexterity" stat to the provided value
+        echo "Handling dexterity command - Value: $value, File Path: $filePath"; // Display a message indicating the handling of the dexterity command
+        break;
+
+// Handle vitality command
+    case "vitality":
+        $char->setStat("vitality", $value); // Set the "vitality" stat to the provided value
+        echo "Handling vitality command - Value: $value, File Path: $filePath"; // Display a message indicating the handling of the vitality command
+        break;
+
+// Handle energy command
+    case "energy":
+        $char->setStat("energy", $value); // Set the "energy" stat to the provided value
+        echo "Handling energy command - Value: $value, File Path: $filePath"; // Display a message indicating the handling of the energy command
+        break;
+
+// Handle hitpoints command
+    case "hitpoints":
+        $char->setStat("hitpoints", $value); // Set the "hitpoints" stat to the provided value
+        echo "Handling hitpoints command - Value: $value, File Path: $filePath"; // Display a message indicating the handling of the hitpoints command
+        break;
+
+// Handle maxhp command
+    case "maxhp":
+        $char->setStat("maxhp", $value); // Set the "maxhp" stat to the provided value
+        echo "Handling maxhp command - Value: $value, File Path: $filePath"; // Display a message indicating the handling of the maxhp command
+        break;
+
+// Handle mana command
+    case "mana":
+        $char->setStat("mana", $value); // Set the "mana" stat to the provided value
+        echo "Handling mana command - Value: $value, File Path: $filePath"; // Display a message indicating the handling of the mana command
+        break;
+
+// Handle maxmana command
+    case "maxmana":
+        $char->setStat("maxmana", $value); // Set the "maxmana" stat to the provided value
+        echo "Handling maxmana command - Value: $value, File Path: $filePath"; // Display a message indicating the handling of the maxmana command
+        break;
+
+// Handle stamina command
+    case "stamina":
+        $char->setStat("stamina", $value); // Set the "stamina" stat to the provided value
+        echo "Handling stamina command - Value: $value, File Path: $filePath"; // Display a message indicating the handling of the stamina command
+        break;
+
+// Handle maxstamina command
+    case "maxstamina":
+        $char->setStat("maxstamina", $value); // Set the "maxstamina" stat to the provided value
+        echo "Handling maxstamina command - Value: $value, File Path: $filePath"; // Display a message indicating the handling of the maxstamina command
+        break;
+
+    // default command
     default:
         // Handle unknown command
         echo "Unknown command: $cmd";

src/tabs/Chars.php

@@ -84,7 +84,6 @@ EOT;
             $radio .= "<label for='$difficulty'>$difficulty</label><br>";
         }
 
-        $skills = '';
         /*  
         'skills' => 
         array (size=1)
@@ -100,13 +99,75 @@ EOT;
                   'col' => int 2
                   'icon' => int 0
          */
-        $skillcounter = 1;
+//        $skillcounter = 1;
-        foreach ($c->cData['skills']['skills'] as $k => $skill) {
+//        foreach ($c->cData['skills']['skills'] as $k => $skill) {
-            $skills .= "<input cmd='skills' style='width: 64px;' class='skill-$k skill' name='$skillcounter' type='number' min='0' max='255' value='{$skill['points']}'>:  {$skill['skill']}<hr>";
+//            $skills .= "<input cmd='skills' style='width: 64px;' class='skill-$k skill' name='$skillcounter' type='number' min='0' max='255' value='{$skill['points']}'>:  {$skill['skill']}<hr>";
-            $skillcounter++;
+//            $skillcounter++;
+//        }
+
+
+// Sort the skills array by page
+usort($c->cData['skills']['skills'], function($a, $b) {
+    return $a['page'] <=> $b['page'];
+});
+
+$skills = '';
+$skillcounter = 1;
+$currentPage = null;
+$tabLinks = '';
+$tabContents = '';
+
+foreach ($c->cData['skills']['skills'] as $k => $skill) {
+    // Check if the current skill is on a new page
+    if ($skill['page'] !== $currentPage) {
+        // Close the previous tab content (if any)
+        if ($currentPage !== null) {
+            $tabContents .= "</div>";
         }
 
+        // Generate tab link
+        $tabLinks .= "<li class='nav-item'>";
+        $tabLinks .= "<a class='nav-link" . ($currentPage === null ? " active" : "") . "' data-toggle='tab' href='#page{$skill['page']}'>Page {$skill['page']}</a>";
+        $tabLinks .= "</li>";
 
+        // Start a new tab content for the current page
+        $tabContents .= "<div id='page{$skill['page']}' class='tab-pane fade" . ($currentPage === null ? " show active" : "") . "' role='tabpanel'>";
+        $currentPage = $skill['page'];
+    }
+
+    // Append the skill to the current page content
+    $tabContents .= "<div class='row align-items-center'>";
+    $tabContents .= "<div class='col-md-3'>" . $skill['skill'] . "</div>";
+    $tabContents .= "<div class='col-md-9'>";
+    $tabContents .= "<input cmd='skills' style='width: 64px;' class='skill-$k skill' name='$skillcounter' type='number' min='0' max='255' value='{$skill['points']}'>";
+    $tabContents .= "</div>";
+    $tabContents .= "</div>";
+
+    $skillcounter++;
+}
+
+// Close the last tab content
+if ($currentPage !== null) {
+    $tabContents .= "</div>";
+}
+
+// Generate the complete tabs structure
+$tabs = "<ul class='nav nav-tabs' role='tablist'>";
+$tabs .= $tabLinks;
+$tabs .= "</ul>";
+$tabs .= "<div class='tab-content'>";
+$tabs .= $tabContents;
+$tabs .= "</div>";
+
+// Combine the tabs structure and skills content
+$skillsMarkup = "<div class='container'>$tabs</div>";
+
+       
+        
+        
+        
+        
+        
         // dump($c['Waypoints']);
         $tabContent .= <<<EOT
 <div style="background: white; margin-top: 10px;" class="tab-pane fade" id="{$c->cData['CharacterName']}" role="tabpanel" aria-labelledby="{$c->cData['CharacterName']}-tab">
@@ -122,13 +183,66 @@ EOT;
                     <select id='CharacterClass' name='CharacterClass'>
                         $option
                     </select><br>
-                    Character Level: <input style="border: 1px solid black;width: 54px;" type="number" name="CharacterLevel" id="CharacterLevel" value="{$c->cData['CharacterLevel']}"><br>
+                    Character Level: <input style="border: 1px solid black;width: 54px;" type="number" name="CharacterLevel" id="CharacterLevel" value="{$c->cData['CharacterLevel']}">
+                    <hr>
+                    
+                    <!-- STATS -->
+                    <div class="stats">
+  <div class="form-row">
+    <div class="form-group col-md-3">
+      <label for="strength">Strength:</label>
+      <input type="number" class="form-control" id="strength" name="strength" min="1" max="255" value="{$c->cData['stats']['strength']}" required>
+    </div>
+    <div class="form-group col-md-3">
+      <label for="dexterity">Dexterity:</label>
+      <input type="number" class="form-control" id="dexterity" name="dexterity" min="1" max="255" value="{$c->cData['stats']['dexterity']}" required>
+    </div>
+    <div class="form-group col-md-3">
+      <label for="vitality">Vitality:</label>
+      <input type="number" class="form-control" id="vitality" name="vitality" min="1" max="255" value="{$c->cData['stats']['vitality']}" required>
+    </div>
+    <div class="form-group col-md-3">
+      <label for="energy">Energy:</label>
+      <input type="number" class="form-control" id="energy" name="energy" min="1" max="255" value="{$c->cData['stats']['energy']}" required>
+    </div>
+  </div>
+
+  <div class="form-row">
+    <div class="form-group col-md-3">
+      <label for="hitpoints">Hitpoints:</label>
+      <input type="number" class="form-control" id="hitpoints" name="hitpoints" min="1" max="255" value="{$c->cData['stats']['hitpoints']}" required>
+    </div>
+    <div class="form-group col-md-3">
+      <label for="maxhp">Max HP:</label>
+      <input type="number" class="form-control" id="maxhp" name="maxhp" min="1" max="255" value="{$c->cData['stats']['maxhp']}" required>
+    </div>
+    <div class="form-group col-md-3">
+      <label for="mana">Mana:</label>
+      <input type="number" class="form-control" id="mana" name="mana" min="1" max="255" value="{$c->cData['stats']['mana']}" required>
+    </div>
+    <div class="form-group col-md-3">
+      <label for="maxmana">Max Mana:</label>
+      <input type="number" class="form-control" id="maxmana" name="maxmana" min="1" max="255" value="{$c->cData['stats']['maxmana']}" required>
+    </div>
+  </div>
+
+  <div class="form-row">
+    <div class="form-group col-md-6">
+      <label for="stamina">Stamina:</label>
+      <input type="number" class="form-control" id="stamina" name="stamina" min="1" max="255" value="{$c->cData['stats']['stamina']}" required>
+    </div>
+    <div class="form-group col-md-6">
+      <label for="maxstamina">Max Stamina:</label>
+      <input type="number" class="form-control" id="maxstamina" name="maxstamina" min="1" max="255" value="{$c->cData['stats']['maxstamina']}" required>
+    </div>
+  </div>   
+               </div>
                     <hr>
                     <!--Difficulty:<br>
                     $radio-->
                     <div>
                         <h3>Skills</h3>
-                        $skills
+                        $skillsMarkup
                     </div>
                 </div>
                 <div class="col">