Merge pull request #11 from ScriptSorcerer20/10-acht-tuerme-algorithmus
implemented "acht-damen algorithmus", seperated javascript from html,…
This commit is contained in:
GitHub
Binary file not shown.
@@ -1,5 +1,6 @@
|
||||
from flask import Blueprint, jsonify, render_template, request
|
||||
from flask_login import login_required, current_user
|
||||
import random
|
||||
|
||||
main_bp = Blueprint("main", __name__)
|
||||
|
||||
@@ -61,4 +62,14 @@ def solve():
|
||||
board[row] = -1
|
||||
|
||||
backtrack(0)
|
||||
return jsonify(solutions)
|
||||
return jsonify(solutions)
|
||||
|
||||
@main_bp.route("/solve_rooks")
|
||||
def solve_rooks_route():
|
||||
return jsonify(solve_rooks(8))
|
||||
|
||||
def solve_rooks(n=8):
|
||||
solution = list(range(n))
|
||||
random.shuffle(solution)
|
||||
return solution
|
||||
|
||||
|
||||
@@ -140,4 +140,16 @@ body {
|
||||
background: #f1f5f9;
|
||||
margin: 4px 0;
|
||||
border-radius: 6px;
|
||||
}
|
||||
|
||||
.mode-switch {
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
|
||||
.mode-switch .btn {
|
||||
margin: 5px;
|
||||
}
|
||||
|
||||
.btn.active {
|
||||
background: #22c55e;
|
||||
}
|
||||
@@ -0,0 +1,199 @@
|
||||
let mode = "queens"; // oder "rooks"
|
||||
|
||||
function setMode(newMode) {
|
||||
mode = newMode;
|
||||
resetBoard();
|
||||
|
||||
document.getElementById("btnQueens").classList.remove("active");
|
||||
document.getElementById("btnRooks").classList.remove("active");
|
||||
|
||||
if (mode === "queens") {
|
||||
document.getElementById("btnQueens").classList.add("active");
|
||||
} else {
|
||||
document.getElementById("btnRooks").classList.add("active");
|
||||
}
|
||||
|
||||
drawBoard();
|
||||
}
|
||||
|
||||
let board = Array(8).fill(-1);
|
||||
const boardDiv = document.getElementById("board");
|
||||
|
||||
function getConflicts() {
|
||||
let conflicts = [];
|
||||
|
||||
for (let r1 = 0; r1 < 8; r1++) {
|
||||
if (board[r1] === -1) continue;
|
||||
|
||||
for (let r2 = r1 + 1; r2 < 8; r2++) {
|
||||
if (board[r2] === -1) continue;
|
||||
|
||||
let c1 = board[r1];
|
||||
let c2 = board[r2];
|
||||
|
||||
// 🔴 Türme: nur gleiche Spalte
|
||||
if (mode === "rooks") {
|
||||
if (c1 === c2) {
|
||||
conflicts.push([r1, c1]);
|
||||
conflicts.push([r2, c2]);
|
||||
}
|
||||
}
|
||||
|
||||
// 🔴 Damen: Spalte + Diagonale
|
||||
else if (mode === "queens") {
|
||||
if (
|
||||
c1 === c2 ||
|
||||
Math.abs(c1 - c2) === Math.abs(r1 - r2)
|
||||
) {
|
||||
conflicts.push([r1, c1]);
|
||||
conflicts.push([r2, c2]);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
return conflicts;
|
||||
}
|
||||
|
||||
function checkSolution() {
|
||||
const status = document.getElementById("statusMessage");
|
||||
|
||||
const allPlaced = board.every(col => col !== -1);
|
||||
|
||||
if (!allPlaced) {
|
||||
status.textContent = "❗ Noch nicht alle Figuren platziert.";
|
||||
status.style.color = "orange";
|
||||
return;
|
||||
}
|
||||
|
||||
const conflicts = getConflicts();
|
||||
|
||||
if (conflicts.length > 0) {
|
||||
status.textContent = "❌ Es gibt Konflikte!";
|
||||
status.style.color = "red";
|
||||
return;
|
||||
}
|
||||
|
||||
status.textContent = "🎉 Perfekt gelöst!";
|
||||
status.style.color = "green";
|
||||
}
|
||||
|
||||
function drawBoard() {
|
||||
boardDiv.innerHTML = "";
|
||||
boardDiv.className = "board-grid";
|
||||
|
||||
const conflicts = getConflicts();
|
||||
const letters = ["A", "B", "C", "D", "E", "F", "G", "H"];
|
||||
|
||||
for (let row = -1; row < 8; row++) {
|
||||
for (let col = -1; col < 8; col++) {
|
||||
|
||||
const cell = document.createElement("div");
|
||||
|
||||
// 🔹 Ecke oben links
|
||||
if (row === -1 && col === -1) {
|
||||
cell.classList.add("label");
|
||||
}
|
||||
|
||||
// 🔹 Buchstaben (oben)
|
||||
else if (row === -1) {
|
||||
cell.textContent = letters[col];
|
||||
cell.classList.add("label");
|
||||
}
|
||||
|
||||
// 🔹 Zahlen (links)
|
||||
else if (col === -1) {
|
||||
cell.textContent = 8 - row;
|
||||
cell.classList.add("label");
|
||||
}
|
||||
|
||||
// 🔹 echtes Spielfeld
|
||||
else {
|
||||
cell.classList.add("cell");
|
||||
|
||||
if ((row + col) % 2 === 0) {
|
||||
cell.classList.add("white");
|
||||
} else {
|
||||
cell.classList.add("black");
|
||||
}
|
||||
|
||||
if (board[row] === col) {
|
||||
cell.textContent = (mode === "queens") ? "♛" : "♜";
|
||||
|
||||
if (conflicts.some(([r, c]) => r === row && c === col)) {
|
||||
cell.classList.add("invalid");
|
||||
}
|
||||
}
|
||||
|
||||
cell.onclick = () => placeQueen(row, col);
|
||||
}
|
||||
|
||||
boardDiv.appendChild(cell);
|
||||
}
|
||||
}
|
||||
|
||||
updateQueenList();
|
||||
}
|
||||
|
||||
function placeQueen(row, col) {
|
||||
if (board[row] === col) {
|
||||
board[row] = -1;
|
||||
} else {
|
||||
board[row] = col;
|
||||
}
|
||||
drawBoard();
|
||||
updateQueenList();
|
||||
}
|
||||
|
||||
async function solve() {
|
||||
|
||||
if (mode === "rooks") {
|
||||
const res = await fetch("/solve_rooks");
|
||||
const solution = await res.json();
|
||||
|
||||
board = solution;
|
||||
drawBoard();
|
||||
return;
|
||||
}
|
||||
|
||||
// Damen (wie vorher)
|
||||
const res = await fetch("/solve");
|
||||
const solution = await res.json();
|
||||
|
||||
board = Array.isArray(solution[0]) ? solution[0] : solution;
|
||||
drawBoard();
|
||||
}
|
||||
|
||||
|
||||
function resetBoard() {
|
||||
const status = document.getElementById("statusMessage");
|
||||
board = Array(8).fill(-1);
|
||||
drawBoard();
|
||||
updateQueenList();
|
||||
status.textContent = "";
|
||||
}
|
||||
|
||||
drawBoard();
|
||||
|
||||
function updateQueenList() {
|
||||
const list = document.getElementById("queenList");
|
||||
list.innerHTML = "";
|
||||
|
||||
const letters = ["A", "B", "C", "D", "E", "F", "G", "H"];
|
||||
|
||||
let count = 1;
|
||||
|
||||
for (let row = 0; row < 8; row++) {
|
||||
if (board[row] !== -1) {
|
||||
let col = board[row];
|
||||
|
||||
let pos = letters[col] + (8 - row);
|
||||
|
||||
const li = document.createElement("li");
|
||||
li.textContent = `${mode === "queens" ? "Dame" : "Turm"} ${count}: ${pos}`;
|
||||
|
||||
list.appendChild(li);
|
||||
count++;
|
||||
}
|
||||
}
|
||||
}
|
||||
+13
-143
@@ -45,163 +45,33 @@
|
||||
</form>
|
||||
</div>
|
||||
|
||||
<div class="mode-switch">
|
||||
<button class="btn active" onclick="setMode('queens')" id="btnQueens">♛ Damen</button>
|
||||
<button class="btn secondary" onclick="setMode('rooks')" id="btnRooks">♜ Türme</button>
|
||||
</div>
|
||||
|
||||
|
||||
<!-- ♟️ Game Card -->
|
||||
<div class="card game-card">
|
||||
<h2>♟️ 8-Damen Spiel</h2>
|
||||
|
||||
<p id="statusMessage"></p>
|
||||
<div class="board" id="board"></div>
|
||||
|
||||
<div class="controls">
|
||||
<button class="btn" onclick="solve()">Solve</button>
|
||||
<button class="btn" onclick="checkSolution()">Check</button>
|
||||
<button class="btn secondary" onclick="resetBoard()">Reset</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="card">
|
||||
<h3>📋 Damen Positionen</h3>
|
||||
<ul id="queenList"></ul>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
let board = Array(8).fill(-1);
|
||||
const boardDiv = document.getElementById("board");
|
||||
|
||||
function getConflicts() {
|
||||
let conflicts = [];
|
||||
|
||||
for (let r1 = 0; r1 < 8; r1++) {
|
||||
if (board[r1] === -1) continue;
|
||||
|
||||
for (let r2 = r1 + 1; r2 < 8; r2++) {
|
||||
if (board[r2] === -1) continue;
|
||||
|
||||
let c1 = board[r1];
|
||||
let c2 = board[r2];
|
||||
|
||||
if (
|
||||
c1 === c2 ||
|
||||
Math.abs(c1 - c2) === Math.abs(r1 - r2)
|
||||
) {
|
||||
conflicts.push([r1, c1]);
|
||||
conflicts.push([r2, c2]);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
return conflicts;
|
||||
}
|
||||
|
||||
function drawBoard() {
|
||||
boardDiv.innerHTML = "";
|
||||
boardDiv.className = "board-grid";
|
||||
|
||||
const conflicts = getConflicts();
|
||||
const letters = ["A", "B", "C", "D", "E", "F", "G", "H"];
|
||||
|
||||
for (let row = -1; row < 8; row++) {
|
||||
for (let col = -1; col < 8; col++) {
|
||||
|
||||
const cell = document.createElement("div");
|
||||
|
||||
// 🔹 Ecke oben links
|
||||
if (row === -1 && col === -1) {
|
||||
cell.classList.add("label");
|
||||
}
|
||||
|
||||
// 🔹 Buchstaben (oben)
|
||||
else if (row === -1) {
|
||||
cell.textContent = letters[col];
|
||||
cell.classList.add("label");
|
||||
}
|
||||
|
||||
// 🔹 Zahlen (links)
|
||||
else if (col === -1) {
|
||||
cell.textContent = 8 - row;
|
||||
cell.classList.add("label");
|
||||
}
|
||||
|
||||
// 🔹 echtes Spielfeld
|
||||
else {
|
||||
cell.classList.add("cell");
|
||||
|
||||
if ((row + col) % 2 === 0) {
|
||||
cell.classList.add("white");
|
||||
} else {
|
||||
cell.classList.add("black");
|
||||
}
|
||||
|
||||
if (board[row] === col) {
|
||||
cell.textContent = "♛";
|
||||
|
||||
if (conflicts.some(([r, c]) => r === row && c === col)) {
|
||||
cell.classList.add("invalid");
|
||||
}
|
||||
}
|
||||
|
||||
cell.onclick = () => placeQueen(row, col);
|
||||
}
|
||||
|
||||
boardDiv.appendChild(cell);
|
||||
}
|
||||
}
|
||||
|
||||
updateQueenList();
|
||||
}
|
||||
|
||||
function placeQueen(row, col) {
|
||||
if (board[row] === col) {
|
||||
board[row] = -1;
|
||||
} else {
|
||||
board[row] = col;
|
||||
}
|
||||
drawBoard();
|
||||
updateQueenList();
|
||||
}
|
||||
|
||||
async function solve() {
|
||||
const res = await fetch("/solve");
|
||||
const solutions = await res.json();
|
||||
|
||||
board = solutions[0];
|
||||
drawBoard();
|
||||
}
|
||||
|
||||
function resetBoard() {
|
||||
board = Array(8).fill(-1);
|
||||
drawBoard();
|
||||
updateQueenList();
|
||||
}
|
||||
|
||||
drawBoard();
|
||||
</script>
|
||||
|
||||
<div class="card">
|
||||
<h3>📋 Damen Positionen</h3>
|
||||
<ul id="queenList"></ul>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
function updateQueenList() {
|
||||
const list = document.getElementById("queenList");
|
||||
list.innerHTML = "";
|
||||
|
||||
const letters = ["A", "B", "C", "D", "E", "F", "G", "H"];
|
||||
|
||||
let count = 1;
|
||||
|
||||
for (let row = 0; row < 8; row++) {
|
||||
if (board[row] !== -1) {
|
||||
let col = board[row];
|
||||
|
||||
let pos = letters[col] + (8 - row);
|
||||
|
||||
const li = document.createElement("li");
|
||||
li.textContent = `Dame ${count}: ${pos}`;
|
||||
|
||||
list.appendChild(li);
|
||||
count++;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
</script>
|
||||
<script src="../static/js/dashboard.js"></script>
|
||||
|
||||
</body>
|
||||
|
||||
|
||||
Reference in New Issue
Block a user