parent
32b1e355a4
commit
a17028c651
216
src/battle.js
216
src/battle.js
@ -1,105 +1,111 @@
|
|||||||
document.getElementById('joinForm').addEventListener('submit', function (event) {
|
document.getElementById('joinForm').addEventListener('submit', function (event) {
|
||||||
event.preventDefault();
|
event.preventDefault();
|
||||||
const username = document.getElementById('username').value;
|
const username = document.getElementById('username').value;
|
||||||
joinGame(username);
|
joinGame(username);
|
||||||
});
|
});
|
||||||
|
|
||||||
document.getElementById('submitMove').addEventListener('click', function () {
|
document.getElementById('submitMove').addEventListener('click', function () {
|
||||||
const username = document.getElementById('username').value;
|
const username = document.getElementById('username').value;
|
||||||
const move = document.getElementById('submitMove').value;
|
const move = document.getElementById('submitMove').value;
|
||||||
const target = document.getElementById('targetPlayer').value;
|
const target = document.getElementById('targetPlayer').value;
|
||||||
submitMove(username, move, target);
|
submitMove(username, move, target);
|
||||||
});
|
});
|
||||||
|
|
||||||
let pollInterval;
|
let pollInterval;
|
||||||
|
|
||||||
function joinGame(username) {
|
function joinGame(username) {
|
||||||
fetch('battle.php', {
|
fetch('battle.php', {
|
||||||
method: 'POST',
|
method: 'POST',
|
||||||
headers: {
|
headers: {
|
||||||
'Content-Type': 'application/x-www-form-urlencoded'
|
'Content-Type': 'application/x-www-form-urlencoded'
|
||||||
},
|
},
|
||||||
body: `action=join&username=${encodeURIComponent(username)}`
|
body: `action=join&username=${encodeURIComponent(username)}`
|
||||||
}).then(response => response.json())
|
}).then(response => response.json())
|
||||||
.then(data => {
|
.then(data => {
|
||||||
document.getElementById('joinForm').style.display = 'none';
|
document.getElementById('joinForm').style.display = 'none';
|
||||||
document.getElementById('gameContainer').style.display = 'block';
|
document.getElementById('gameContainer').style.display = 'block';
|
||||||
updateGameState(data);
|
updateGameState(data);
|
||||||
pollInterval = setInterval(pollGameState, 1000);
|
pollInterval = setInterval(pollGameState, 1000);
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
function submitMove(username, move, target) {
|
function submitMove(username, move, target) {
|
||||||
fetch('battle.php', {
|
fetch('battle.php', {
|
||||||
method: 'POST',
|
method: 'POST',
|
||||||
headers: {
|
headers: {
|
||||||
'Content-Type': 'application/x-www-form-urlencoded'
|
'Content-Type': 'application/x-www-form-urlencoded'
|
||||||
},
|
},
|
||||||
body: `action=move&username=${encodeURIComponent(username)}&move=${encodeURIComponent(move)}&target=${encodeURIComponent(target)}`
|
body: `action=move&username=${encodeURIComponent(username)}&move=${encodeURIComponent(move)}&target=${encodeURIComponent(target)}`
|
||||||
}).then(response => response.json())
|
}).then(response => response.json())
|
||||||
.then(data => {
|
.then(data => {
|
||||||
if (data.error) {
|
if (data.error) {
|
||||||
alert(data.error);
|
alert(data.error);
|
||||||
} else {
|
} else {
|
||||||
updateGameState(data);
|
updateGameState(data);
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
function updateGameState(gameState) {
|
function updateGameState(gameState) {
|
||||||
const gameStateDiv = document.getElementById('gameState');
|
const gameStateDiv = document.getElementById('gameState');
|
||||||
gameStateDiv.innerHTML = '';
|
gameStateDiv.innerHTML = '';
|
||||||
gameStateDiv.innerHTML += `<p>Players: ${gameState.fighters.map(f => f.name).join(', ')}</p>`;
|
gameStateDiv.innerHTML += `<p>Players: ${gameState.fighters.map(f => f.name).join(', ')}</p>`;
|
||||||
gameState.moves.forEach(move => {
|
gameState.moves.forEach(move => {
|
||||||
gameStateDiv.innerHTML += `<p>${move.fighter}: ${move.move} -> ${move.target}</p>`;
|
gameStateDiv.innerHTML += `<p>${move.fighter}: ${move.move} -> ${move.target}</p>`;
|
||||||
});
|
});
|
||||||
|
|
||||||
const fightersDiv = document.getElementById('fighters');
|
const fightersDiv = document.getElementById('fighters');
|
||||||
fightersDiv.innerHTML = '';
|
fightersDiv.innerHTML = '';
|
||||||
gameState.fighters.forEach(fighter => {
|
gameState.fighters.forEach(fighter => {
|
||||||
fightersDiv.innerHTML += `<p>${fighter.name} - HP: ${fighter.hp}, ATT: ${fighter.attack}</p>`;
|
fightersDiv.innerHTML += `<p>${fighter.name} - HP: ${fighter.hp}, ATT: ${fighter.attack}</p>`;
|
||||||
});
|
});
|
||||||
|
|
||||||
const username = document.getElementById('username').value;
|
const username = document.getElementById('username').value;
|
||||||
const submitButton = document.getElementById('submitMove');
|
const submitButton = document.getElementById('submitMove');
|
||||||
const targetSelector = document.getElementById('targetPlayer');
|
const targetSelector = document.getElementById('targetPlayer');
|
||||||
|
const currentTarget = targetSelector.value; // Сохраняем текущий выбор цели
|
||||||
if (gameState.battle_end) {
|
|
||||||
const winnerDiv = document.createElement('div');
|
if (gameState.battle_end) {
|
||||||
winnerDiv.innerHTML = `<p>Battle End! Winner: ${gameState.winner}</p>`;
|
const winnerDiv = document.createElement('div');
|
||||||
document.body.appendChild(winnerDiv);
|
winnerDiv.innerHTML = `<p>Battle End! Winner: ${gameState.winner}</p>`;
|
||||||
submitButton.disabled = true;
|
document.body.appendChild(winnerDiv);
|
||||||
clearInterval(pollInterval);
|
submitButton.disabled = true;
|
||||||
} else {
|
clearInterval(pollInterval);
|
||||||
const aliveFighters = gameState.fighters.filter(fighter => fighter.hp > 0);
|
} else {
|
||||||
targetSelector.innerHTML = '';
|
const aliveFighters = gameState.fighters.filter(fighter => fighter.hp > 0);
|
||||||
|
targetSelector.innerHTML = '';
|
||||||
if (aliveFighters.length > 2) {
|
|
||||||
targetSelector.style.display = 'block';
|
if (aliveFighters.length > 2) {
|
||||||
aliveFighters.forEach(fighter => {
|
targetSelector.style.display = 'block';
|
||||||
if (fighter.name !== username) {
|
aliveFighters.forEach(fighter => {
|
||||||
const option = document.createElement('option');
|
if (fighter.name !== username) {
|
||||||
option.value = fighter.name;
|
const option = document.createElement('option');
|
||||||
option.textContent = fighter.name;
|
option.value = fighter.name;
|
||||||
targetSelector.appendChild(option);
|
option.textContent = fighter.name;
|
||||||
}
|
targetSelector.appendChild(option);
|
||||||
});
|
}
|
||||||
} else {
|
});
|
||||||
targetSelector.style.display = 'none';
|
|
||||||
}
|
// Восстанавливаем текущий выбор цели, если он существует в новом списке
|
||||||
|
if (aliveFighters.some(fighter => fighter.name === currentTarget)) {
|
||||||
if (gameState.last_fighter === username) {
|
targetSelector.value = currentTarget;
|
||||||
submitButton.style.display = 'none';
|
}
|
||||||
} else {
|
} else {
|
||||||
submitButton.style.display = 'block';
|
targetSelector.style.display = 'none';
|
||||||
}
|
}
|
||||||
}
|
|
||||||
}
|
if (gameState.last_fighter === username) {
|
||||||
|
submitButton.style.display = 'none';
|
||||||
function pollGameState() {
|
} else {
|
||||||
fetch('battle.php')
|
submitButton.style.display = 'block';
|
||||||
.then(response => response.json())
|
}
|
||||||
.then(data => {
|
}
|
||||||
updateGameState(data);
|
}
|
||||||
});
|
|
||||||
}
|
function pollGameState() {
|
||||||
|
fetch('battle.php')
|
||||||
|
.then(response => response.json())
|
||||||
|
.then(data => {
|
||||||
|
updateGameState(data);
|
||||||
|
});
|
||||||
|
}
|
||||||
|
Loading…
x
Reference in New Issue
Block a user