dodanie funkcji zczytyjacej pozycje zawodnikow / bez podpiecia do serwera

This commit is contained in:
unknown 2024-01-07 16:16:47 +01:00
parent 3c9c2a6e9f
commit 7f68677a3b

View File

@ -4,6 +4,7 @@ import { ComputersCanvas } from "./canvas";
import { Link } from "react-router-dom"; import { Link } from "react-router-dom";
const Hero = () => { const Hero = () => {
const [isOpen, setIsOpen] = useState(false); const [isOpen, setIsOpen] = useState(false);
const [gameMinute, setGameMinute] = useState(''); const [gameMinute, setGameMinute] = useState('');
@ -28,6 +29,17 @@ const Hero = () => {
var shooterX = 12; var shooterX = 12;
var shooterY = 12; var shooterY = 12;
var shooter = [0,0]
var goalkeeper = [0,0]
var stricers = new Array;
var defenders = new Array;
var bodyPart = "";
var technique = "";
var actionType = "";
var possition = "";
//zamiana procentowych pozycji na kartezyjskie //zamiana procentowych pozycji na kartezyjskie
function konwerturX(x){ function konwerturX(x){
var fX = parseFloat(x.slice(0,-1)) var fX = parseFloat(x.slice(0,-1))
@ -99,11 +111,38 @@ const Hero = () => {
} }
} }
// funkcja zsczytuje pozycje zawodnikow przed wyslaniem zapytania do serwera
function loadPlayers(){
var players = document.querySelectorAll('.player')
// wyczyszczenie list zawierajacych lokalizacje zawodnikow
defenders = []
stricers = []
shooter = null
goalkeeper = null
//zebranie iformacji o kazdym z zawodnikow
players.forEach(function(player){
var type = player.getAttribute('type')
if(type == 0){
shooter = player.getAttribute('possition')
}else if(type == 1 ){
goalkeeper = player.getAttribute('possition')
}else if(type == 2){
defenders.push(player.getAttribute('possition'))
}else {
stricers.push(player.getAttribute('possition'))
}
})
}
function addPlayer(possition, ball){ function addPlayer(possition, ball){
//Zmiana stylu w zaleznosci czy zawodnik jest obronca/napastnikiem iyp. //Zmiana stylu w zaleznosci czy zawodnik jest obronca/napastnikiem iyp.
var pName = "Strzelec" var pName = "Strzelec"
//kolor kropki //kolor kropki
// kolor tła kafelka // kolor tła kafelka
var pColor = "#fc0303" var pColor = "#fc0303"
if(possition == 1){ if(possition == 1){
var pName = "Bramkarz" var pName = "Bramkarz"
@ -115,9 +154,11 @@ const Hero = () => {
var pName = "Napastnik" var pName = "Napastnik"
var pColor = "#fc6703" var pColor = "#fc6703"
} }
var player = document.createElement('div'); var player = document.createElement('div');
player.className = 'player'; player.className = 'player';
player.style.width = "inherit" player.style.width = "inherit"
player.setAttribute("type",possition)
var list = document.getElementById("list") var list = document.getElementById("list")
// div z nazwa gracza // div z nazwa gracza
@ -129,7 +170,7 @@ const Hero = () => {
var posytion = document.createElement('div') var posytion = document.createElement('div')
posytion.style.fontSize = "10px" posytion.style.fontSize = "10px"
posytion.innerHTML = "x:" + konwerturX(ball.style.left) + "m " + "y:" + konwetujY(ball.style.top) + "m"; posytion.innerHTML = "x:" + konwerturX(ball.style.left) + "m " + "y:" + konwetujY(ball.style.top) + "m";
player.setAttribute('possition',[konwerturX(ball.style.left),konwetujY(ball.style.top)])
//div z przyciskiem usuwającym //div z przyciskiem usuwającym
var btnDelete = document.createElement('button') var btnDelete = document.createElement('button')
btnDelete.innerHTML = 'Usun' btnDelete.innerHTML = 'Usun'
@ -193,6 +234,7 @@ const Hero = () => {
//var shooterX = konwerturX(ball.style.left) //var shooterX = konwerturX(ball.style.left)
//var shooterY = konwetujY(ball.style.top) //var shooterY = konwetujY(ball.style.top)
posytion.innerHTML = "x:" + konwerturX(ball.style.left) + "m " + "y:" + konwetujY(ball.style.top) + "m"; posytion.innerHTML = "x:" + konwerturX(ball.style.left) + "m " + "y:" + konwetujY(ball.style.top) + "m";
player.setAttribute('possition',[konwerturX(ball.style.left),konwetujY(ball.style.top)]);
bojo.addEventListener("mouseup", function(){ bojo.addEventListener("mouseup", function(){
ball.style.background = pColor ball.style.background = pColor
bojo.removeEventListener("mousemove", whileMove) bojo.removeEventListener("mousemove", whileMove)
@ -205,6 +247,9 @@ const Hero = () => {
// // Wyłanie zapytania do serwera // // Wyłanie zapytania do serwera
function sentQuestion() { function sentQuestion() {
loadPlayers()
var ball = document.querySelector('.football'); var ball = document.querySelector('.football');
if (ball) { if (ball) {
@ -213,7 +258,7 @@ const Hero = () => {
shooterX = konwerturX(ball.style.left) shooterX = konwerturX(ball.style.left)
shooterY = konwetujY(ball.style.top) shooterY = konwetujY(ball.style.top)
console.log('Wysyłanie wartości: ', shooterX, shooterY); console.log('Wysyłanie wartości: ', shooterX, shooterY);
fetch(`http://127.0.0.1:5000/get_model?x=${shooterX}&y=${shooterY}`).then( fetch(`http://127.0.0.1:5000/get_model?x=${shooter[0]}&y=${shooter[1]}`).then(
res => res.json() res => res.json()
).then( ).then(
data => { data => {