refactoring, cleanup

app.py

@@ -120,6 +120,7 @@ def monster_stats(monster_name):
     )
 
 
+
 # Add this route for fetching breeding combinations
 @app.route("/breeds")
 def get_breeding_combinations():

static/js/indexListener.js

@@ -1,15 +1,9 @@
 document.addEventListener("DOMContentLoaded", function () {
     const familyDropdown = document.getElementById("familyDropdown");
     const monsterDropdown = document.getElementById("monsterDropdown");
-    //const parent = document.getElementById("parent")
-
-    // Implementing Family Icon Grid in place of family dropdown
-    //const familyGrid = document.getElementById("familyGrid")
 
     // Initialize dropdowns
-    updateMonstersDropdownByFamily();
-    // Initialize Family Grid();
-    // populateFamilyGrid();
+    updateMonsterDropdownByFamily();
 
     // Fetch families data from the server and populate families dropdown
     fetch("/get_families")
@@ -21,22 +15,11 @@ document.addEventListener("DOMContentLoaded", function () {
 
     // Listeners for Dropdown Changes
     familyDropdown.addEventListener("change", function () {
-        updateMonstersDropdownByFamily();
+        updateMonsterDropdownByFamily();
     });
 
     monsterDropdown.addEventListener("change", function () {
         updateIframes();
     });
 
-    // Listener for a click on the one of the family icons
-    //familyGrid.addEventListener("click", function() {
-    //    updateMonsterGrid(); // Need a function for this too...
-    //});
-
-    // Listener for a click on a breeding parent
-    //parent.addEventListener("click", function() {
-    //    updateMonstersDropdownBySelected();
-    //    updateIFrames();  
-    //});
-
 });

static/js/updateMonsterDropdownByFamily.js

@@ -1,4 +1,4 @@
-function updateMonstersDropdownByFamily() {
+function updateMonsterDropdownByFamily() {
     const selectedFamily = familyDropdown.value;
 
     // Fetch monsters data from the server based on the selected family

static/js/updateMonsterDropdownBySelected.js

@@ -2,8 +2,11 @@
 //    const selectedMonster = parent.value;
 //
 //    // Fetch monsters data from the server based on the selected monster
-//    fetch(`/monster/${selectedMonster}`)
+//    fetch(`/monster_info_json/${selectedMonster}`)
 //        .then(response => response.json())
 //        .then(data => populateDropdown(monsterDropdown, data))
 //        .catch(error => console.error("Error fetching monsters:", error));
 //}
+
+// I was using this to try to update the page when a monster 
+// in the breeding page is clicked

templates/breeds.html

@@ -42,5 +42,8 @@
       </div>
       {% endif %}
     </div>
+    {% for file in js_files %}
+    <script src="{{ url_for('static', filename='js/' + file) }}"></script>
+    {% endfor %}
   </body>
 </html>