Commit 92a66181 authored by Joaquin Valentin Peralta's avatar Joaquin Valentin Peralta
Browse files

Jugadores andando

parent 0034a68e
......@@ -3,14 +3,13 @@ import React, { useState } from 'react';
import TextField from '@mui/material/TextField';
import { Footer } from 'common/footer/footer';
import {
IconButton, Typography, Divider, Container,
IconButton, Typography, Divider, Container, Grid, Paper,
} from '@mui/material';
import SearchIcon from '@mui/icons-material/Search';
import { Grafica } from 'pages/grafica/grafica';
import { ApiService } from 'networking/api-service';
import { API_ROUTES } from 'networking/api-routes';
import { ListaJugadores } from 'common/lista/lista';
import raw from '../../consultas/consultas.txt';
import styles from './comparacion.module.scss';
const Comparacion = () => {
......@@ -36,11 +35,11 @@ const Comparacion = () => {
const request = `
select ?name ?info
where {
?persona rdf:type dbo:SoccerPlayer.
?persona foaf:name ?name.
?persona dbo:abstract ?info.
?persona dbo:birthDate "${fechaNac}"^^xsd:date .
filter( regex(?name, "${name}","I") && lang(?info) = "en" )
?persona rdf:type dbo:SoccerPlayer.
?persona foaf:name ?name.
?persona dbo:abstract ?info.
?persona dbo:birthDate "${fechaNac}"^^xsd:date .
filter( regex(?name, "${name}","I") && lang(?info) = "en" )
}
LIMIT 1
`;
......@@ -54,157 +53,216 @@ LIMIT 1
});
setAbstract(response.data.results.bindings[0]?.info.value);
};
const handleClickLista = (fechaNac) => {
const handleClickLista = async (fechaNac) => {
// query con nombre
setListaJugadores([]);
fetch(raw)
.then((r) => r.text())
.then(async (text) => {
const request = `${text}
SELECT ?jugador ?nombre ?foto ?pais ?temporada ?valoracion ?altura ?pierna ?club ?nombreClub ?bandera ?linkTransfermarkt
WHERE {
?nombreProp rdfs:subPropertyOf football:nombre .
?jugador ?nombreProp ?nombre .
?tieneNac rdfs:subPropertyOf football:nacionalidad .
?jugador ?tieneNac ?pais .
?tieneFecha rdfs:subPropertyOf football:fechaNac .
?jugador ?tieneFecha "1987-06-24"^^xsd:date .
OPTIONAL {
#Transfermarkt
?tieneAltura rdfs:subPropertyOf football:altura .
?jugador ?tieneAltura ?altura .
?piernaHabil rdfs:subPropertyOf football:pierna .
?jugador ?piernaHabil ?pierna .
?tieneFecha rdfs:subPropertyOf football:fechaNac .
?jugador ?tieneFecha "1987-06-24"^^xsd:date .
?juegaPara rdfs:subPropertyOf football:juegaPara .
?jugador ?juegaPara ?club .
?club ?nombreProp ?nombreClub.
?urlTransf rdfs:subPropertyOf football:transfermarktURL .
?jugador ?urlTransf ?linkTransfermarkt .
}.
OPTIONAL {
#FIFA
?versionJuego rdfs:subPropertyOf football:versionJuego .
?jugador ?versionJuego ?stats .
?tieneFoto rdfs:subPropertyOf football:foto .
?stats ?tieneFoto ?foto .
?tieneVal rdfs:subPropertyOf football:valoracion .
?stats ?tieneVal ?valoracion .
const request = `
PREFIX rdf: <http://www.w3.org/1999/02/22-rdf-syntax-ns#>
PREFIX xsd: <http://www.w3.org/2001/XMLSchema#>
PREFIX fo: <http://purl.org/ontology/fo/>
PREFIX foo: <http://filmontology.org/ontology/1.0/>
prefix rdfs: <http://www.w3.org/2000/01/rdf-schema#>
prefix owl: <http://www.w3.org/2002/07/owl#>
prefix football: <http://football.org/football#>
prefix fifa: <http://football.org/fifa#>
SELECT ?jugador ?nombre ?foto ?pais ?temporada ?valoracion ?altura ?pierna ?club ?nombreClub ?bandera ?linkTransfermarkt
WHERE {
?nombreProp rdfs:subPropertyOf football:nombre .
?jugador ?nombreProp ?nombre .
?tieneNac rdfs:subPropertyOf football:nacionalidad .
?jugador ?tieneNac ?pais .
?tieneFecha rdfs:subPropertyOf football:fechaNac .
?jugador ?tieneFecha "${fechaNac}"^^xsd:date .
OPTIONAL {
#Transfermarkt
?tieneAltura rdfs:subPropertyOf football:altura .
?jugador ?tieneAltura ?altura .
?anio rdfs:subPropertyOf football:temporada .
?stats ?anio ?temporada .
?piernaHabil rdfs:subPropertyOf football:pierna .
?jugador ?piernaHabil ?pierna .
?juegaPara rdfs:subPropertyOf football:juegaPara .
?jugador ?juegaPara ?club .
}
filter(regex(?nombre, "messi", "i"))
}
ORDER BY DESC(?temporada)
LIMIT 10
`;
const response = await ApiService.get(API_ROUTES.EXAMPLE, {
query: request,
});
await getDBpediaInfo(nombre, fechaNac);
const lista = [];
response.data.results.bindings.forEach(async (elem) => {
const nuevo = {
valoracion: elem.valoracion?.value,
temporada: elem.temporada?.value,
};
// es uno solo el elemento de transfermarkt
if (elem.linkTransfermarkt) {
// eslint-disable-next-line no-unused-vars
const f = datoTrans.fechaNac;
setDatoTrans((prev) => {
const trans = { ...prev };
trans.pierna = elem.pierna?.value;
trans.altura = elem.altura?.value;
trans.club = elem.club?.value;
trans.nombreClub = elem.nombreClub?.value;
trans.link = elem.linkTransfermarkt?.value;
trans.nombre = elem.nombre?.value;
trans.pais = elem.pais?.value;
trans.altura = elem.altura?.value;
trans.pierna = elem.pierna?.value;
trans.bandera = elem.bandera?.value;
return trans;
});
}
lista.push(nuevo);
?urlTransf rdfs:subPropertyOf football:transfermarktURL .
?jugador ?urlTransf ?linkTransfermarkt .
}.
OPTIONAL {
#FIFA
?versionJuego rdfs:subPropertyOf football:versionJuego .
?jugador ?versionJuego ?stats .
?tieneFoto rdfs:subPropertyOf football:foto .
?jugador ?tieneFoto ?foto .
?tieneVal rdfs:subPropertyOf football:valoracion .
?stats ?tieneVal ?valoracion .
?anio rdfs:subPropertyOf football:temporada .
?stats ?anio ?temporada .
}
filter(regex(?nombre, "${nombre}", "i"))
}
ORDER BY DESC(?temporada)
LIMIT 10
`;
const response = await ApiService.get(API_ROUTES.EXAMPLE, {
query: request,
});
console.log('respuesta ', response.data.results.bindings);
await getDBpediaInfo(nombre, fechaNac);
const lista = [];
response.data.results.bindings.forEach(async (elem) => {
const nuevo = {
valoracion: elem.valoracion?.value,
temporada: elem.temporada?.value,
};
// es uno solo el elemento de transfermarkt
if (elem.linkTransfermarkt) {
// eslint-disable-next-line no-unused-vars
const f = datoTrans.fechaNac;
setDatoTrans((prev) => {
const trans = { ...prev };
trans.pierna = elem.pierna?.value;
trans.altura = elem.altura?.value;
trans.club = elem.club?.value;
trans.nombreClub = elem.nombreClub?.value;
trans.link = elem.linkTransfermarkt?.value;
trans.nombre = elem.nombre?.value;
trans.pais = elem.pais?.value;
trans.altura = elem.altura?.value;
trans.pierna = elem.pierna?.value;
trans.bandera = elem.bandera?.value;
return trans;
});
setListaValoracion(lista.sort());
});
}
lista.push(nuevo);
});
setListaValoracion(lista.sort((a, b) => a - b).reverse());
};
const handleSearch = () => {
// llamada a la api
fetch(raw)
.then((r) => r.text())
.then(async (text) => {
const request = `${text}
SELECT ?jugador ?nombre ?foto ?pais ?temporada ?fechaNac
WHERE {
?nombreProp rdfs:subPropertyOf football:nombre .
?jugador ?nombreProp ?nombre .
?tieneNac rdfs:subPropertyOf football:nacionalidad .
?jugador ?tieneNac ?pais .
const handleSearch = async () => {
// llamada a la api
const request = `
PREFIX rdf: <http://www.w3.org/1999/02/22-rdf-syntax-ns#>
PREFIX xsd: <http://www.w3.org/2001/XMLSchema#>
PREFIX fo: <http://purl.org/ontology/fo/>
PREFIX foo: <http://filmontology.org/ontology/1.0/>
prefix rdfs: <http://www.w3.org/2000/01/rdf-schema#>
prefix owl: <http://www.w3.org/2002/07/owl#>
prefix football: <http://football.org/football#>
prefix fifa: <http://football.org/fifa#>
?tieneFecha rdfs:subPropertyOf football:fechaNac .
?jugador ?tieneFecha ?fechaNac .
?versionJuego rdfs:subPropertyOf football:versionJuego .
?jugador ?versionJuego ?stats .
?tieneFoto rdfs:subPropertyOf football:foto .
?stats ?tieneFoto ?foto .
?anio rdfs:subPropertyOf football:temporada .
?stats ?anio ?temporada .
filter(regex(?nombre, "${nombre}", "i"))
}
LIMIT 10
`;
const response = await ApiService.get(API_ROUTES.EXAMPLE, {
query: request,
});
const lista = [];
response.data.results.bindings.forEach((elem) => {
const nuevo = {
nombre: elem.nombre.value,
foto: elem.foto ? elem.foto.value : undefined,
pais: elem.pais.value,
fechaNac: elem.fechaNac.value,
};
// eslint-disable-next-line no-empty
if (lista.find((nu) => nu.nombre === nuevo.nombre)) {
} else { lista.push(nuevo); }
});
setListaJugadores(lista);
SELECT ?jugador ?nombre ?foto ?pais ?temporada ?fechaNac
WHERE {
?nombreProp rdfs:subPropertyOf football:nombre .
?jugador ?nombreProp ?nombre .
?tieneNac rdfs:subPropertyOf football:nacionalidad .
?jugador ?tieneNac ?pais .
?tieneFecha rdfs:subPropertyOf football:fechaNac .
?jugador ?tieneFecha ?fechaNac .
?versionJuego rdfs:subPropertyOf football:versionJuego .
?jugador ?versionJuego ?stats .
?tieneFoto rdfs:subPropertyOf football:foto .
?jugador ?tieneFoto ?foto .
?anio rdfs:subPropertyOf football:temporada .
?stats ?anio ?temporada .
filter(regex(?nombre, "${nombre}", "i"))
}
LIMIT 10
`;
const response = await ApiService.get(API_ROUTES.EXAMPLE, {
query: request,
});
const lista = [];
if (response.data.results.bindings.length > 0) {
response.data.results.bindings.forEach((elem) => {
const nuevo = {
nombre: elem.nombre.value,
foto: elem.foto ? elem.foto.value : undefined,
pais: elem.pais.value,
fechaNac: elem.fechaNac.value,
};
// eslint-disable-next-line no-empty
if (lista.find((nu) => nu.nombre === nuevo.nombre)) {
} else { lista.push(nuevo); }
});
setListaJugadores(lista);
}
};
return (
<>
<NavBar />
<Container>
<h1>
JUGADORES
</h1>
<p>{abstract}</p>
<Grid container spacing={2}>
<Container item xs={4}>
<Paper className={styles.ficha}>
<Typography>
FICHA DEL JUGADOR
</Typography>
<Typography>
Nombre:
{' '}
{datoTrans.nombre}
</Typography>
<Typography>
{' '}
Nacionalidad:
{' '}
{datoTrans.pais}
{' '}
{datoTrans.bandera}
</Typography>
<Typography>
{' '}
Fecha de nacimiento:
{' '}
{datoTrans.fechaNac}
</Typography>
<Typography>
{' '}
Pierna habil:
{' '}
{datoTrans.pierna}
</Typography>
<Typography>
{' '}
Altura:
{' '}
{datoTrans.altura}
</Typography>
{/* <Typography>
{' '}
Biografía:
{' '}
{abstract}
</Typography> */}
</Paper>
</Container>
<Container item xs={8}>
<Paper className={styles.ficha}>
<p>{abstract}</p>
</Paper>
</Container>
</Grid>
</Container>
<Divider />
<div className={styles.content}>
......@@ -226,49 +284,6 @@ LIMIT 1
<div className={styles.chart}>
<Grafica data={listaValoracion} dataKey1="temporada" dataKey2="valoracion" />
</div>
<div className={styles.ficha}>
<Typography>
FICHA DEL JUGADOR
</Typography>
<Typography>
Nombre:
{' '}
{datoTrans.nombre}
</Typography>
<Typography>
{' '}
Nacionalidad:
{' '}
{datoTrans.pais}
{' '}
{datoTrans.bandera}
</Typography>
<Typography>
{' '}
Fecha de nacimiento:
{' '}
{datoTrans.fechaNac}
</Typography>
<Typography>
{' '}
Pierna habil:
{' '}
{datoTrans.pierna}
</Typography>
<Typography>
{' '}
Altura:
{' '}
{datoTrans.altura}
</Typography>
{/* <Typography>
{' '}
Biografía:
{' '}
{abstract}
</Typography> */}
</div>
</div>
<Footer />
......
......@@ -4,8 +4,6 @@
display: flex;
}
.ficha {
width: 400px;
height: 600px;
display: flex;
flex-direction: column;
}
......
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment