breeding iframe showing (bad) data
This commit is contained in:
Chris kerr
parent
3624ac4a0c
commit
59fe208f5f
69
app.py
69
app.py
@ -113,5 +113,74 @@ def monster_info(monster_name):
|
||||
)
|
||||
|
||||
|
||||
# Update the breeding route
|
||||
@app.route("/breeding")
|
||||
def breeding():
|
||||
# Get all monsters for dropdown
|
||||
cursor = g.db.cursor()
|
||||
cursor.execute("SELECT DISTINCT name FROM monsters")
|
||||
monsters = [row[0] for row in cursor.fetchall()]
|
||||
|
||||
# Pass the monsters to the breeding template
|
||||
return render_template("breeding.html", monsters=monsters)
|
||||
|
||||
|
||||
# Add this route for fetching breeding combinations
|
||||
@app.route("/get_breeding_combinations")
|
||||
def get_breeding_combinations():
|
||||
selected_monster = request.args.get("monster")
|
||||
if not selected_monster:
|
||||
return jsonify({"error": "Invalid input"})
|
||||
|
||||
base_combinations = get_base_combinations(selected_monster)
|
||||
mate_combinations = get_mate_combinations(selected_monster)
|
||||
|
||||
return jsonify(
|
||||
{"base_combinations": base_combinations, "mate_combinations": mate_combinations}
|
||||
)
|
||||
|
||||
|
||||
# Function to get base breeding combinations
|
||||
def get_base_combinations(selected_monster):
|
||||
cursor = g.db.cursor()
|
||||
|
||||
# Fetch breed IDs based on the selected monster as a base
|
||||
cursor.execute(
|
||||
"""
|
||||
SELECT breeds.target
|
||||
FROM breeds
|
||||
JOIN breed_requirements ON breeds.id = breed_requirements.breed_id
|
||||
WHERE breed_requirements.requirement_type = 'base'
|
||||
AND breed_requirements.requirement_value = ?
|
||||
""",
|
||||
(selected_monster,),
|
||||
)
|
||||
|
||||
base_combinations = cursor.fetchall()
|
||||
|
||||
return [row[0] for row in base_combinations]
|
||||
|
||||
|
||||
# Function to get mate breeding combinations
|
||||
def get_mate_combinations(selected_monster):
|
||||
cursor = g.db.cursor()
|
||||
|
||||
# Fetch breed IDs based on the selected monster as a mate
|
||||
cursor.execute(
|
||||
"""
|
||||
SELECT breeds.target
|
||||
FROM breeds
|
||||
JOIN breed_requirements ON breeds.id = breed_requirements.breed_id
|
||||
WHERE breed_requirements.requirement_type = 'mate'
|
||||
AND breed_requirements.requirement_value = ?
|
||||
""",
|
||||
(selected_monster,),
|
||||
)
|
||||
|
||||
mate_combinations = cursor.fetchall()
|
||||
|
||||
return [row[0] for row in mate_combinations]
|
||||
|
||||
|
||||
if __name__ == "__main__":
|
||||
app.run(debug=True)
|
||||
|
||||
@ -1,13 +1,12 @@
|
||||
// static/js/app.js
|
||||
|
||||
document.addEventListener("DOMContentLoaded", function () {
|
||||
const familyDropdown = document.getElementById("familyDropdown");
|
||||
const monsterDropdown = document.getElementById("monsterDropdown");
|
||||
const iframe = document.getElementById("monsterIframe");
|
||||
const monsterIframe = document.getElementById("monsterIframe");
|
||||
const breedingIframe = document.getElementById("breedingIframe");
|
||||
|
||||
// Initialize dropdowns and iframe
|
||||
// Initialize dropdowns and iframes
|
||||
updateMonstersDropdown();
|
||||
updateIframe();
|
||||
updateIframes();
|
||||
|
||||
// Fetch families data from the server
|
||||
fetch("/get_families")
|
||||
@ -15,17 +14,17 @@ document.addEventListener("DOMContentLoaded", function () {
|
||||
.then(data => {
|
||||
populateDropdown(familyDropdown, data);
|
||||
updateMonstersDropdown();
|
||||
updateIframe();
|
||||
updateIframes();
|
||||
})
|
||||
.catch(error => console.error("Error fetching families:", error));
|
||||
|
||||
familyDropdown.addEventListener("change", function () {
|
||||
updateMonstersDropdown();
|
||||
updateIframe();
|
||||
updateIframes();
|
||||
});
|
||||
|
||||
monsterDropdown.addEventListener("change", function () {
|
||||
updateIframe();
|
||||
updateIframes();
|
||||
});
|
||||
|
||||
function populateDropdown(dropdown, data) {
|
||||
@ -51,17 +50,24 @@ document.addEventListener("DOMContentLoaded", function () {
|
||||
.catch(error => console.error("Error fetching monsters:", error));
|
||||
}
|
||||
|
||||
function updateIframe() {
|
||||
function updateIframes() {
|
||||
const selectedFamily = familyDropdown.value;
|
||||
const selectedMonster = monsterDropdown.value;
|
||||
|
||||
// Update iframe src based on selected family and monster
|
||||
const iframeSrc = selectedMonster
|
||||
// Update monsterIframe src based on selected family and monster
|
||||
const monsterIframeSrc = selectedMonster
|
||||
? `/monster/${selectedMonster}`
|
||||
: selectedFamily
|
||||
? `/monster/${selectedFamily}`
|
||||
: "about:blank";
|
||||
|
||||
iframe.src = iframeSrc;
|
||||
monsterIframe.src = monsterIframeSrc;
|
||||
|
||||
// Update breedingIframe src based on the selected monster
|
||||
const breedingIframeSrc = selectedMonster
|
||||
? `/get_breeding_combinations?monster=${selectedMonster}`
|
||||
: "about:blank";
|
||||
|
||||
breedingIframe.src = breedingIframeSrc;
|
||||
}
|
||||
});
|
||||
|
||||
@ -544,6 +544,10 @@ video {
|
||||
position: static;
|
||||
}
|
||||
|
||||
.col-span-1 {
|
||||
grid-column: span 1 / span 1;
|
||||
}
|
||||
|
||||
.m-4 {
|
||||
margin: 1rem;
|
||||
}
|
||||
@ -564,14 +568,18 @@ video {
|
||||
margin-top: 1rem;
|
||||
}
|
||||
|
||||
.mt-8 {
|
||||
margin-top: 2rem;
|
||||
.flex {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.grid {
|
||||
display: grid;
|
||||
}
|
||||
|
||||
.h-auto {
|
||||
height: auto;
|
||||
}
|
||||
|
||||
.w-auto {
|
||||
width: auto;
|
||||
}
|
||||
@ -592,19 +600,10 @@ video {
|
||||
border-radius: 0.375rem;
|
||||
}
|
||||
|
||||
.border {
|
||||
border-width: 1px;
|
||||
}
|
||||
|
||||
.border-2 {
|
||||
border-width: 2px;
|
||||
}
|
||||
|
||||
.border-gray-400 {
|
||||
--tw-border-opacity: 1;
|
||||
border-color: rgb(156 163 175 / var(--tw-border-opacity));
|
||||
}
|
||||
|
||||
.border-teal-500 {
|
||||
--tw-border-opacity: 1;
|
||||
border-color: rgb(20 184 166 / var(--tw-border-opacity));
|
||||
@ -628,10 +627,6 @@ video {
|
||||
padding: 1rem;
|
||||
}
|
||||
|
||||
.p-8 {
|
||||
padding: 2rem;
|
||||
}
|
||||
|
||||
.font-mono {
|
||||
font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
|
||||
}
|
||||
|
||||
40
templates/breeding.html
Normal file
40
templates/breeding.html
Normal file
@ -0,0 +1,40 @@
|
||||
<!-- breeding.html -->
|
||||
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<title>Breeding Combinations</title>
|
||||
<link rel="stylesheet" href="../static/style/output.css" />
|
||||
</head>
|
||||
<body class="bg-slate-700">
|
||||
<h1 class="font-bold text-blue-500">Breeding Combinations</h1>
|
||||
|
||||
<div id="breedingCombinations">
|
||||
{% if selected_monster %}
|
||||
<h2 class="font-bold text-blue-500 mt-4">
|
||||
Breeding Combinations for {{ selected_monster.name }}
|
||||
</h2>
|
||||
<div class="grid grid-cols-2 gap-1">
|
||||
<div class="col-span-1">
|
||||
<h3 class="font-bold text-blue-500">Base Combinations</h3>
|
||||
<ul>
|
||||
{% for combination in selected_monster.base_combinations %}
|
||||
<li>{{ combination.target }}</li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
</div>
|
||||
<div class="col-span-1">
|
||||
<h3 class="font-bold text-blue-500">Mate Combinations</h3>
|
||||
<ul>
|
||||
{% for combination in selected_monster.mate_combinations %}
|
||||
<li>{{ combination.target }}</li>
|
||||
{% endfor %}
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
{% endif %}
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
@ -1,32 +1,47 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<title>DWM APP</title>
|
||||
<link rel="stylesheet" href="../static/style/output.css">
|
||||
<link rel="stylesheet" href="../static/style/output.css" />
|
||||
<script src="{{ url_for('static', filename='js/index.js') }}"></script>
|
||||
</head>
|
||||
<body class="p-4 m-4 font-mono text-white bg-slate-700">
|
||||
<h1 class="text-2xl font-black text-white">Welcome to the Dragon Warrior Monsters 2 App</h1>
|
||||
</head>
|
||||
<body class="p-4 m-4 font-mono text-white bg-slate-700">
|
||||
<h1 class="text-2xl font-black text-white">
|
||||
Welcome to the Dragon Warrior Monsters 2 App
|
||||
</h1>
|
||||
|
||||
<div>
|
||||
<label for="familyDropdown">Select Family:</label>
|
||||
<select id="familyDropdown" class="p-2 rounded-md bg-slate-800">
|
||||
<option value="" >All Families</option>
|
||||
<option value="">All Families</option>
|
||||
</select>
|
||||
|
||||
<label for="monsterDropdown">Select Monster:</label>
|
||||
<select id="monsterDropdown" class="p-2 rounded-md bg-slate-800">
|
||||
<option value="">All Monsters</option>
|
||||
</select>
|
||||
<div id="modules" class="flex">
|
||||
<iframe
|
||||
id="monsterIframe"
|
||||
src=""
|
||||
class="w-auto mt-4 ml-4 border-2 border-teal-500 rounded-md"
|
||||
onload="resizeIframe(this)"
|
||||
></iframe>
|
||||
|
||||
<iframe id="monsterIframe" src="" class="w-auto mt-4 ml-4 border-2 border-teal-500 rounded-md" onload="resizeIframe(this)"></iframe>
|
||||
<iframe
|
||||
id="breedingIframe"
|
||||
class="w-auto mt-4 ml-4 h-auto border-2 border-teal-500 rounded-md"
|
||||
onload="resizeIframe(this)"
|
||||
></iframe>
|
||||
</div>
|
||||
</div>
|
||||
<script>
|
||||
function resizeIframe(iframe) {
|
||||
iframe.style.height = iframe.contentWindow.document.body.scrollHeight+ 16 +'px';
|
||||
iframe.style.height =
|
||||
iframe.contentWindow.document.body.scrollHeight + 4 + "px";
|
||||
}
|
||||
</script>
|
||||
</body>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
Loading…
Reference in New Issue
Block a user