|
|
|
@ -1,13 +1,13 @@
|
|
|
|
import React, {useEffect, useState} from 'react';
|
|
|
|
import React, {useState, useEffect} from 'react';
|
|
|
|
|
|
|
|
import Carousel from 'nuka-carousel';
|
|
|
|
|
|
|
|
|
|
|
|
/* Style */
|
|
|
|
/* Style */
|
|
|
|
import '../Pages/Play.css';
|
|
|
|
import '../Pages/Play.css';
|
|
|
|
import '../Style/Global.css'
|
|
|
|
import '../Style/Global.css'
|
|
|
|
|
|
|
|
import './ScoreBoard.css';
|
|
|
|
import { useTheme } from '../Style/ThemeContext';
|
|
|
|
import { useTheme } from '../Style/ThemeContext';
|
|
|
|
|
|
|
|
|
|
|
|
/* Ressources */
|
|
|
|
/* Ressources */
|
|
|
|
import Person from '../res/img/Person.png'
|
|
|
|
|
|
|
|
import leave from '../res/img/bot.png'
|
|
|
|
|
|
|
|
import trophy from '../res/icon/trophy.png'
|
|
|
|
import trophy from '../res/icon/trophy.png'
|
|
|
|
import share from '../res/icon/share.png';
|
|
|
|
import share from '../res/icon/share.png';
|
|
|
|
|
|
|
|
|
|
|
|
@ -19,16 +19,21 @@ import Row from 'react-bootstrap/Row';
|
|
|
|
import Col from 'react-bootstrap/Col';
|
|
|
|
import Col from 'react-bootstrap/Col';
|
|
|
|
|
|
|
|
|
|
|
|
/* Component */
|
|
|
|
/* Component */
|
|
|
|
import ButtonImgNav from './ButtonImgNav';
|
|
|
|
|
|
|
|
import User from '../model/User';
|
|
|
|
import User from '../model/User';
|
|
|
|
|
|
|
|
|
|
|
|
/* Services */
|
|
|
|
/* Services */
|
|
|
|
import ScoreboardService from '../services/ScoreboardService';
|
|
|
|
import ScoreboardService from '../services/ScoreboardService';
|
|
|
|
|
|
|
|
import { BiLineChart, BiLineChartDown } from 'react-icons/bi';
|
|
|
|
|
|
|
|
import { CarouselCaption } from 'react-bootstrap';
|
|
|
|
|
|
|
|
import { BsLine } from 'react-icons/bs';
|
|
|
|
|
|
|
|
|
|
|
|
//@ts-ignore
|
|
|
|
//@ts-ignore
|
|
|
|
const ScoreBoard: React.FC<{ Player: User }> = ({ Player }) => {
|
|
|
|
const ScoreBoard: React.FC<{ Player: User }> = ({ Player }) => {
|
|
|
|
const theme=useTheme();
|
|
|
|
const theme=useTheme();
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
const [carouselKey, setCarouselKey] = useState(0);
|
|
|
|
|
|
|
|
const [activeTab, setActiveTab] = useState("perso");
|
|
|
|
|
|
|
|
|
|
|
|
// DAILY STATS
|
|
|
|
// DAILY STATS
|
|
|
|
const [dailyMastermindStats, setDailyMastermindStats] = useState<any>(null);
|
|
|
|
const [dailyMastermindStats, setDailyMastermindStats] = useState<any>(null);
|
|
|
|
const [dailyEasyEnigmaStats, setDailyEasyEnigmaStats] = useState<any>(null);
|
|
|
|
const [dailyEasyEnigmaStats, setDailyEasyEnigmaStats] = useState<any>(null);
|
|
|
|
@ -82,228 +87,274 @@ const ScoreBoard: React.FC<{ Player: User }> = ({ Player }) => {
|
|
|
|
}, []);
|
|
|
|
}, []);
|
|
|
|
|
|
|
|
|
|
|
|
return (
|
|
|
|
return (
|
|
|
|
// <div className='LeaderBoardiv'>
|
|
|
|
<Tabs
|
|
|
|
<div className='LeaderBoardiv'>
|
|
|
|
activeKey={activeTab}
|
|
|
|
<Tabs style={{width:"100%"}}
|
|
|
|
onSelect={(key:any) => {
|
|
|
|
defaultActiveKey="daily"
|
|
|
|
setActiveTab(key);
|
|
|
|
|
|
|
|
// Forcer une mise à jour du carousel
|
|
|
|
|
|
|
|
setCarouselKey((prevKey) => prevKey + 1);
|
|
|
|
|
|
|
|
}}
|
|
|
|
id="ScoreBoard"
|
|
|
|
id="ScoreBoard"
|
|
|
|
className="mb-3">
|
|
|
|
className="tabsStats justify-content-around"
|
|
|
|
<Tab eventKey="perso" title="Vos Stats" disabled = { !Player.pseudo.startsWith("Guest_") ? false : true}>
|
|
|
|
>
|
|
|
|
<Container fluid>
|
|
|
|
<Tab eventKey="perso" title="Vos Stats" disabled={!Player.pseudo.startsWith("Guest_") ? false : true}>
|
|
|
|
<Row>Stats en MasterMind :</Row>
|
|
|
|
<Tab.Content className={`tabsStats ${activeTab !== 'perso' ? 'hidden' : ''}`}>
|
|
|
|
<Row>
|
|
|
|
<Carousel adaptiveHeight wrapAround slidesToShow={1} cellSpacing={10} key={carouselKey}>
|
|
|
|
<Col sm={10}>Partie Jouées :</Col>
|
|
|
|
<div className="stats">
|
|
|
|
<Col className='leftRow'>{Player !== null ? Player.mastermindStats.nbGames : "0"}</Col>
|
|
|
|
<h5>Mastermind</h5>
|
|
|
|
</Row>
|
|
|
|
<hr />
|
|
|
|
<Row>
|
|
|
|
<p>Parties Jouées: {Player.mastermindStats.nbGames}</p>
|
|
|
|
<Col sm={10}>Best-Score :</Col>
|
|
|
|
<p>Best-Score: {Player.mastermindStats.bestScore}</p>
|
|
|
|
<Col className='leftRow'>{Player !== null ? Player.mastermindStats.bestScore : "0"}</Col>
|
|
|
|
<p>Moyenne d'essai: {Player.mastermindStats.avgNbTry}</p>
|
|
|
|
</Row>
|
|
|
|
</div>
|
|
|
|
<Row>
|
|
|
|
<div className="stats">
|
|
|
|
<Col sm={10}>Moyenne d'essai :</Col>
|
|
|
|
<h5>Enigme facile</h5>
|
|
|
|
<Col className='leftRow'>{Player !== null ? Player.mastermindStats.avgNbTry : "0"}</Col>
|
|
|
|
<hr />
|
|
|
|
</Row>
|
|
|
|
<p>Parties Jouées: {Player.easyEnigmaStats.nbGames}</p>
|
|
|
|
<hr/>
|
|
|
|
<p>Nombre de victoires: {Player.easyEnigmaStats.nbWins}</p>
|
|
|
|
<Row>Stats en Enigme facile :</Row>
|
|
|
|
<p>Ratio V/D: {Player.easyEnigmaStats.ratio}</p>
|
|
|
|
<Row>
|
|
|
|
<p>Meilleur temps: {Player.easyEnigmaStats.bestTime}</p>
|
|
|
|
<Col sm={10}>Partie jouée :</Col>
|
|
|
|
<p>Moyenne de temps: {Player.easyEnigmaStats.avgTime}</p>
|
|
|
|
<Col className='leftRow'>{Player !== null ? Player.easyEnigmaStats.nbGames : "0"}</Col>
|
|
|
|
</div>
|
|
|
|
</Row>
|
|
|
|
<div className="stats">
|
|
|
|
<Row>
|
|
|
|
<h5>Enigme moyenne</h5>
|
|
|
|
<Col sm={10}>Nombre de victoire :</Col>
|
|
|
|
<hr />
|
|
|
|
<Col className='leftRow'>{Player !== null ? Player.easyEnigmaStats.nbWins : "0"}</Col>
|
|
|
|
<p>Parties Jouées: {Player.mediumEnigmaStats.nbGames}</p>
|
|
|
|
</Row>
|
|
|
|
<p>Best-Score: {Player.mediumEnigmaStats.bestScore}</p>
|
|
|
|
<Row>
|
|
|
|
<p>Moyenne d'essai: {Player.mediumEnigmaStats.avgNbTry}</p>
|
|
|
|
<Col sm={10}>Ratio V/D :</Col>
|
|
|
|
</div>
|
|
|
|
<Col className='leftRow'>{Player !== null ? Player.easyEnigmaStats.ratio.toFixed(2) + "%" : "00.0%"}</Col>
|
|
|
|
<div className="stats">
|
|
|
|
</Row>
|
|
|
|
<h5>Enigme difficile</h5>
|
|
|
|
<Row>
|
|
|
|
<hr />
|
|
|
|
<Col sm={10}>Meilleur temps :</Col>
|
|
|
|
<p>Parties Jouées: {Player.hardEnigmaStats.nbGames}</p>
|
|
|
|
<Col className='leftRow'>{Player !== null ? Player.easyEnigmaStats.bestTime : "0"}</Col>
|
|
|
|
<p>Nombre de victoires: {Player.hardEnigmaStats.nbWins}</p>
|
|
|
|
</Row>
|
|
|
|
<p>Ratio V/D: {Player.hardEnigmaStats.ratio}</p>
|
|
|
|
<Row>
|
|
|
|
<p>Meilleur temps: {Player.hardEnigmaStats.bestTime}</p>
|
|
|
|
<Col sm={10}>Moyenne de temps :</Col>
|
|
|
|
<p>Moyenne de temps: {Player.hardEnigmaStats.avgTime}</p>
|
|
|
|
<Col className='leftRow'>{Player !== null ? Player.easyEnigmaStats.avgTime.toFixed(2) : "0"}</Col>
|
|
|
|
</div>
|
|
|
|
</Row>
|
|
|
|
<div className="stats">
|
|
|
|
<hr/>
|
|
|
|
<h5>En ligne</h5>
|
|
|
|
<Row>Stats en Enigme moyenne :</Row>
|
|
|
|
<hr />
|
|
|
|
<Row>
|
|
|
|
<p>Parties Jouées: {Player.onlineStats.nbGames}</p>
|
|
|
|
<Col sm={10}>Partie jouée :</Col>
|
|
|
|
<p>Nombre de victoires: {Player.onlineStats.nbWins}</p>
|
|
|
|
<Col className='leftRow'>{Player !== null ? Player.mediumEnigmaStats.nbGames : "0"}</Col>
|
|
|
|
<p>Ratio V/D: {Player.onlineStats.ratio}</p>
|
|
|
|
</Row>
|
|
|
|
</div>
|
|
|
|
<Row>
|
|
|
|
</Carousel>
|
|
|
|
<Col sm={10}>Best-Score :</Col>
|
|
|
|
</Tab.Content>
|
|
|
|
<Col className='leftRow'>{Player !== null ? Player.mediumEnigmaStats.bestScore : "0"}</Col>
|
|
|
|
|
|
|
|
</Row>
|
|
|
|
|
|
|
|
<Row>
|
|
|
|
|
|
|
|
<Col sm={10}>Moyenne d'essai :</Col>
|
|
|
|
|
|
|
|
<Col className='leftRow'>{Player !== null ? Player.mediumEnigmaStats.avgNbTry.toFixed(2) : "0"}</Col>
|
|
|
|
|
|
|
|
</Row>
|
|
|
|
|
|
|
|
<hr/>
|
|
|
|
|
|
|
|
<Row>Stats en Enigme difficile :</Row>
|
|
|
|
|
|
|
|
<Row>
|
|
|
|
|
|
|
|
<Col sm={10}>Partie jouée :</Col>
|
|
|
|
|
|
|
|
<Col className='leftRow'>{Player !== null ? Player.hardEnigmaStats.nbGames : "0"}</Col>
|
|
|
|
|
|
|
|
</Row>
|
|
|
|
|
|
|
|
<Row>
|
|
|
|
|
|
|
|
<Col sm={10}>Nombre de victoire :</Col>
|
|
|
|
|
|
|
|
<Col className='leftRow'>{Player !== null ? Player.hardEnigmaStats.nbWins : "0"}</Col>
|
|
|
|
|
|
|
|
</Row>
|
|
|
|
|
|
|
|
<Row>
|
|
|
|
|
|
|
|
<Col sm={10}>Ratio V/D :</Col>
|
|
|
|
|
|
|
|
<Col className='leftRow'>{Player !== null ? Player.hardEnigmaStats.ratio.toFixed(2) + "%" : "00.0%"}</Col>
|
|
|
|
|
|
|
|
</Row>
|
|
|
|
|
|
|
|
<Row>
|
|
|
|
|
|
|
|
<Col sm={10}>Meilleur temps :</Col>
|
|
|
|
|
|
|
|
<Col className='leftRow'>{Player !== null ? Player.hardEnigmaStats.bestTime : "0"}</Col>
|
|
|
|
|
|
|
|
</Row>
|
|
|
|
|
|
|
|
<Row>
|
|
|
|
|
|
|
|
<Col sm={10}>Moyenne de temps :</Col>
|
|
|
|
|
|
|
|
<Col className='leftRow'>{Player !== null ? Player.hardEnigmaStats.avgTime.toFixed(2) : "0"}</Col>
|
|
|
|
|
|
|
|
</Row>
|
|
|
|
|
|
|
|
<hr/>
|
|
|
|
|
|
|
|
<Row>Stats en ligne :</Row>
|
|
|
|
|
|
|
|
<Row>
|
|
|
|
|
|
|
|
<Col sm={10}>Partie jouée :</Col>
|
|
|
|
|
|
|
|
<Col className='leftRow'>{Player !== null ? Player.onlineStats.nbGames : "0"}</Col>
|
|
|
|
|
|
|
|
</Row>
|
|
|
|
|
|
|
|
<Row>
|
|
|
|
|
|
|
|
<Col sm={10}>Nombre de victoire :</Col>
|
|
|
|
|
|
|
|
<Col className='leftRow'>{Player !== null ? Player.onlineStats.nbWins : "0"}</Col>
|
|
|
|
|
|
|
|
</Row>
|
|
|
|
|
|
|
|
<Row>
|
|
|
|
|
|
|
|
<Col sm={10}>Ratio V/D :</Col>
|
|
|
|
|
|
|
|
<Col className='leftRow'>{Player !== null ? Player.onlineStats.ratio.toFixed(2) + "%" : "0"}</Col>
|
|
|
|
|
|
|
|
</Row>
|
|
|
|
|
|
|
|
</Container>
|
|
|
|
|
|
|
|
</Tab>
|
|
|
|
</Tab>
|
|
|
|
<Tab eventKey="daily" title="Daily"
|
|
|
|
<Tab eventKey="daily" title="Daily">
|
|
|
|
style={{display:"flex", flexDirection:'column', alignItems:'center'}}>
|
|
|
|
<Tab.Content className={`tabsStats ${activeTab !== 'daily' ? 'hidden' : ''}`}>
|
|
|
|
<img src={trophy}
|
|
|
|
<Carousel adaptiveHeight wrapAround slidesToShow={1} cellSpacing={10} key={carouselKey}>
|
|
|
|
height='100'
|
|
|
|
<div className="stats">
|
|
|
|
width='100'
|
|
|
|
<h5>Mastermind</h5>
|
|
|
|
alt="Person2"/>
|
|
|
|
<hr />
|
|
|
|
<Container fluid>
|
|
|
|
|
|
|
|
<Row>MasterMind :</Row>
|
|
|
|
|
|
|
|
{dailyMastermindStats !== null ? (dailyMastermindStats.tab.length !== 0 ? dailyMastermindStats.tab.map((stats: any, index: number) => (
|
|
|
|
{dailyMastermindStats !== null ? (dailyMastermindStats.tab.length !== 0 ? dailyMastermindStats.tab.map((stats: any, index: number) => (
|
|
|
|
<Row key={index}>
|
|
|
|
<>
|
|
|
|
<Col sm={10}>{index+1}.{stats.pseudo}</Col>
|
|
|
|
|
|
|
|
<Col className='leftRow'>{stats.score}</Col>
|
|
|
|
|
|
|
|
</Row>
|
|
|
|
|
|
|
|
)) : (
|
|
|
|
|
|
|
|
<Row>
|
|
|
|
<Row>
|
|
|
|
<Col sm={10}>No data</Col>
|
|
|
|
<Col>
|
|
|
|
</Row>
|
|
|
|
<p>{index+1}.{stats.pseudo}</p>
|
|
|
|
|
|
|
|
</Col>
|
|
|
|
|
|
|
|
<Col>
|
|
|
|
|
|
|
|
<p>{stats.score}</p>
|
|
|
|
|
|
|
|
</Col>
|
|
|
|
|
|
|
|
</Row>
|
|
|
|
|
|
|
|
</>
|
|
|
|
)) : (
|
|
|
|
)) : (
|
|
|
|
<Row>
|
|
|
|
<p className='text-warning'>Nothing for the moment</p>
|
|
|
|
<Col sm={10}>No data</Col>
|
|
|
|
|
|
|
|
</Row>
|
|
|
|
|
|
|
|
)}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<hr/>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
<Row>Multijoueur :</Row>
|
|
|
|
|
|
|
|
{dailyOnlineStats !== null ? (dailyOnlineStats.tab.length !== 0 ? dailyOnlineStats.tab.map((stats: any, index: number) => (
|
|
|
|
|
|
|
|
<Row key={index}>
|
|
|
|
|
|
|
|
<Col sm={10}>{index+1}.{stats.pseudo}</Col>
|
|
|
|
|
|
|
|
<Col className='leftRow'>{stats.wins}</Col>
|
|
|
|
|
|
|
|
</Row>
|
|
|
|
|
|
|
|
)) : (
|
|
|
|
)) : (
|
|
|
|
|
|
|
|
<p className='text-warning'>Nothing for the moment</p>
|
|
|
|
|
|
|
|
)}
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
<div className="stats">
|
|
|
|
|
|
|
|
<h5>Enigme facile</h5>
|
|
|
|
|
|
|
|
<hr />
|
|
|
|
|
|
|
|
{dailyEasyEnigmaStats !== null ? (dailyEasyEnigmaStats.tab.length !== 0 ? dailyEasyEnigmaStats.tab.map((stats: any, index: number) => (
|
|
|
|
|
|
|
|
<>
|
|
|
|
<Row>
|
|
|
|
<Row>
|
|
|
|
<Col sm={10}>No data</Col>
|
|
|
|
<Col>
|
|
|
|
</Row>
|
|
|
|
<p>{index+1}.{stats.pseudo}</p>
|
|
|
|
|
|
|
|
</Col>
|
|
|
|
|
|
|
|
<Col>
|
|
|
|
|
|
|
|
<p>{stats.time}</p>
|
|
|
|
|
|
|
|
</Col>
|
|
|
|
|
|
|
|
</Row>
|
|
|
|
|
|
|
|
</>
|
|
|
|
)) : (
|
|
|
|
)) : (
|
|
|
|
<Row>
|
|
|
|
<p className='text-warning'>Nothing for the moment</p>
|
|
|
|
<Col sm={10}>No data</Col>
|
|
|
|
)) : (
|
|
|
|
</Row>
|
|
|
|
<p className='text-warning'>Nothing for the moment</p>
|
|
|
|
)}
|
|
|
|
)}
|
|
|
|
|
|
|
|
</div>
|
|
|
|
<hr/>
|
|
|
|
<div className="stats">
|
|
|
|
|
|
|
|
<h5>Enigme moyenne</h5>
|
|
|
|
<Row>Enigme facile :</Row>
|
|
|
|
<hr />
|
|
|
|
{dailyEasyEnigmaStats !== null ? (dailyEasyEnigmaStats.tab.length !== 0 ? dailyEasyEnigmaStats.tab.map((stats: any, index: number) => (
|
|
|
|
{dailyMediumEnigmaStats !== null ? (dailyMediumEnigmaStats.tab.length !== 0 ? dailyMediumEnigmaStats.tab.map((stats: any, index: number) => (
|
|
|
|
<Row key={index}>
|
|
|
|
<>
|
|
|
|
<Col sm={10}>{index+1}.{stats.pseudo}</Col>
|
|
|
|
<Row>
|
|
|
|
<Col className='leftRow'>{stats.time}</Col>
|
|
|
|
<Col>
|
|
|
|
</Row>
|
|
|
|
<p>{index+1}.{stats.pseudo}</p>
|
|
|
|
|
|
|
|
</Col>
|
|
|
|
|
|
|
|
<Col>
|
|
|
|
|
|
|
|
<p>{stats.time}</p>
|
|
|
|
|
|
|
|
</Col>
|
|
|
|
|
|
|
|
</Row>
|
|
|
|
|
|
|
|
</>
|
|
|
|
)) : (
|
|
|
|
)) : (
|
|
|
|
|
|
|
|
<p className='text-warning'>Nothing for the moment</p>
|
|
|
|
|
|
|
|
)) : (
|
|
|
|
|
|
|
|
<p className='text-warning'>Nothing for the moment</p>
|
|
|
|
|
|
|
|
)}
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
<div className="stats">
|
|
|
|
|
|
|
|
<h5>Enigme difficile</h5>
|
|
|
|
|
|
|
|
<hr />
|
|
|
|
|
|
|
|
{dailyHardEnigmaStats !== null ? (dailyHardEnigmaStats.tab.length !== 0 ? dailyHardEnigmaStats.tab.map((stats: any, index: number) => (
|
|
|
|
|
|
|
|
<>
|
|
|
|
<Row>
|
|
|
|
<Row>
|
|
|
|
<Col sm={10}>No data</Col>
|
|
|
|
<Col>
|
|
|
|
</Row>
|
|
|
|
<p>{index+1}.{stats.pseudo}</p>
|
|
|
|
|
|
|
|
</Col>
|
|
|
|
|
|
|
|
<Col>
|
|
|
|
|
|
|
|
<p>{stats.time}</p>
|
|
|
|
|
|
|
|
</Col>
|
|
|
|
|
|
|
|
</Row>
|
|
|
|
|
|
|
|
</>
|
|
|
|
)) : (
|
|
|
|
)) : (
|
|
|
|
|
|
|
|
<p className='text-warning'>Nothing for the moment</p>
|
|
|
|
|
|
|
|
)) : (
|
|
|
|
|
|
|
|
<p className='text-warning'>Nothing for the moment</p>
|
|
|
|
|
|
|
|
)}
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
<div className="stats">
|
|
|
|
|
|
|
|
<h5>En ligne</h5>
|
|
|
|
|
|
|
|
<hr />
|
|
|
|
|
|
|
|
{dailyOnlineStats !== null ? (dailyOnlineStats.tab.length !== 0 ? dailyOnlineStats.tab.map((stats: any, index: number) => (
|
|
|
|
|
|
|
|
<>
|
|
|
|
<Row>
|
|
|
|
<Row>
|
|
|
|
<Col sm={10}>No data</Col>
|
|
|
|
<Col>
|
|
|
|
</Row>
|
|
|
|
<p>{index+1}.{stats.pseudo}</p>
|
|
|
|
|
|
|
|
</Col>
|
|
|
|
|
|
|
|
<Col>
|
|
|
|
|
|
|
|
<p>{stats.wins}</p>
|
|
|
|
|
|
|
|
</Col>
|
|
|
|
|
|
|
|
</Row>
|
|
|
|
|
|
|
|
</>
|
|
|
|
|
|
|
|
)) : (
|
|
|
|
|
|
|
|
<p className='text-warning'>Nothing for the moment</p>
|
|
|
|
|
|
|
|
)) : (
|
|
|
|
|
|
|
|
<p className='text-warning'>Nothing for the moment</p>
|
|
|
|
)}
|
|
|
|
)}
|
|
|
|
|
|
|
|
</div>
|
|
|
|
<hr/>
|
|
|
|
</Carousel>
|
|
|
|
|
|
|
|
</Tab.Content>
|
|
|
|
</Container>
|
|
|
|
|
|
|
|
</Tab>
|
|
|
|
</Tab>
|
|
|
|
<Tab eventKey="weekly" title="Weekly">
|
|
|
|
<Tab eventKey="weekly" title="Weekly">
|
|
|
|
<img src={trophy}
|
|
|
|
<Tab.Content className={`tabsStats ${activeTab !== 'weekly' ? 'hidden' : ''}`}>
|
|
|
|
height='100'
|
|
|
|
<Carousel adaptiveHeight wrapAround slidesToShow={1} cellSpacing={10} key={carouselKey}>
|
|
|
|
width='100'
|
|
|
|
<div className="stats">
|
|
|
|
alt="Person2"/>
|
|
|
|
<h5>Mastermind</h5>
|
|
|
|
<Container fluid>
|
|
|
|
<hr />
|
|
|
|
<Row>MasterMind :</Row>
|
|
|
|
|
|
|
|
{weeklyMastermindStats !== null ? (weeklyMastermindStats.tab.length !== 0 ? weeklyMastermindStats.tab.map((stats: any, index: number) => (
|
|
|
|
{weeklyMastermindStats !== null ? (weeklyMastermindStats.tab.length !== 0 ? weeklyMastermindStats.tab.map((stats: any, index: number) => (
|
|
|
|
<Row key={index}>
|
|
|
|
<>
|
|
|
|
<Col sm={10}>{index+1}.{stats.pseudo}</Col>
|
|
|
|
|
|
|
|
<Col className='leftRow'>{stats.score}</Col>
|
|
|
|
|
|
|
|
</Row>
|
|
|
|
|
|
|
|
)) : (
|
|
|
|
|
|
|
|
<Row>
|
|
|
|
<Row>
|
|
|
|
<Col sm={10}>No data</Col>
|
|
|
|
<Col>
|
|
|
|
</Row>
|
|
|
|
<p>{index+1}.{stats.pseudo}</p>
|
|
|
|
|
|
|
|
</Col>
|
|
|
|
|
|
|
|
<Col>
|
|
|
|
|
|
|
|
<p>{stats.score}</p>
|
|
|
|
|
|
|
|
</Col>
|
|
|
|
|
|
|
|
</Row>
|
|
|
|
|
|
|
|
</>
|
|
|
|
)) : (
|
|
|
|
)) : (
|
|
|
|
<Row>
|
|
|
|
<p className='text-warning'>Nothing for the moment</p>
|
|
|
|
<Col sm={10}>No data</Col>
|
|
|
|
|
|
|
|
</Row>
|
|
|
|
|
|
|
|
)}
|
|
|
|
|
|
|
|
<hr/>
|
|
|
|
|
|
|
|
<Row>Multijoueur :</Row>
|
|
|
|
|
|
|
|
{weeklyOnlineStats !== null ? (weeklyOnlineStats.tab.length !== 0 ? weeklyOnlineStats.tab.map((stats: any, index: number) => (
|
|
|
|
|
|
|
|
<Row key={index}>
|
|
|
|
|
|
|
|
<Col sm={10}>{index+1}.{stats.pseudo}</Col>
|
|
|
|
|
|
|
|
<Col className='leftRow'>{stats.wins}</Col>
|
|
|
|
|
|
|
|
</Row>
|
|
|
|
|
|
|
|
)) : (
|
|
|
|
)) : (
|
|
|
|
|
|
|
|
<p className='text-warning'>Nothing for the moment</p>
|
|
|
|
|
|
|
|
)}
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
<div className="stats">
|
|
|
|
|
|
|
|
<h5>Enigme facile</h5>
|
|
|
|
|
|
|
|
<hr />
|
|
|
|
|
|
|
|
{weeklyEasyEnigmaStats !== null ? (weeklyEasyEnigmaStats.tab.length !== 0 ? weeklyEasyEnigmaStats.tab.map((stats: any, index: number) => (
|
|
|
|
|
|
|
|
<>
|
|
|
|
<Row>
|
|
|
|
<Row>
|
|
|
|
<Col sm={10}>No data</Col>
|
|
|
|
<Col>
|
|
|
|
</Row>
|
|
|
|
<p>{index+1}.{stats.pseudo}</p>
|
|
|
|
|
|
|
|
</Col>
|
|
|
|
|
|
|
|
<Col>
|
|
|
|
|
|
|
|
<p>{stats.time}</p>
|
|
|
|
|
|
|
|
</Col>
|
|
|
|
|
|
|
|
</Row>
|
|
|
|
|
|
|
|
</>
|
|
|
|
)) : (
|
|
|
|
)) : (
|
|
|
|
<Row>
|
|
|
|
<p className='text-warning'>Nothing for the moment</p>
|
|
|
|
<Col sm={10}>No data</Col>
|
|
|
|
)) : (
|
|
|
|
</Row>
|
|
|
|
<p className='text-warning'>Nothing for the moment</p>
|
|
|
|
)}
|
|
|
|
)}
|
|
|
|
|
|
|
|
</div>
|
|
|
|
<hr/>
|
|
|
|
<div className="stats">
|
|
|
|
|
|
|
|
<h5>Enigme moyenne</h5>
|
|
|
|
<Row>Enigme facile :</Row>
|
|
|
|
<hr />
|
|
|
|
{weeklyEasyEnigmaStats !== null ? (weeklyEasyEnigmaStats.tab.length !== 0 ? weeklyEasyEnigmaStats.tab.map((stats: any, index: number) => (
|
|
|
|
{weeklyMediumEnigmaStats !== null ? (weeklyMediumEnigmaStats.tab.length !== 0 ? weeklyMediumEnigmaStats.tab.map((stats: any, index: number) => (
|
|
|
|
<Row key={index}>
|
|
|
|
<>
|
|
|
|
<Col sm={10}>{index+1}.{stats.pseudo}</Col>
|
|
|
|
<Row>
|
|
|
|
<Col className='leftRow'>{stats.time}</Col>
|
|
|
|
<Col>
|
|
|
|
</Row>
|
|
|
|
<p>{index+1}.{stats.pseudo}</p>
|
|
|
|
|
|
|
|
</Col>
|
|
|
|
|
|
|
|
<Col>
|
|
|
|
|
|
|
|
<p>{stats.time}</p>
|
|
|
|
|
|
|
|
</Col>
|
|
|
|
|
|
|
|
</Row>
|
|
|
|
|
|
|
|
</>
|
|
|
|
|
|
|
|
)) : (
|
|
|
|
|
|
|
|
<p className='text-warning'>Nothing for the moment</p>
|
|
|
|
)) : (
|
|
|
|
)) : (
|
|
|
|
|
|
|
|
<p className='text-warning'>Nothing for the moment</p>
|
|
|
|
|
|
|
|
)}
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
<div className="stats">
|
|
|
|
|
|
|
|
<h5>Enigme difficile</h5>
|
|
|
|
|
|
|
|
<hr />
|
|
|
|
|
|
|
|
{weeklyHardEnigmaStats !== null ? (weeklyHardEnigmaStats.tab.length !== 0 ? weeklyHardEnigmaStats.tab.map((stats: any, index: number) => (
|
|
|
|
|
|
|
|
<>
|
|
|
|
<Row>
|
|
|
|
<Row>
|
|
|
|
<Col sm={10}>No data</Col>
|
|
|
|
<Col>
|
|
|
|
</Row>
|
|
|
|
<p>{index+1}.{stats.pseudo}</p>
|
|
|
|
|
|
|
|
</Col>
|
|
|
|
|
|
|
|
<Col>
|
|
|
|
|
|
|
|
<p>{stats.time}</p>
|
|
|
|
|
|
|
|
</Col>
|
|
|
|
|
|
|
|
</Row>
|
|
|
|
|
|
|
|
</>
|
|
|
|
|
|
|
|
)) : (
|
|
|
|
|
|
|
|
<p className='text-warning'>Nothing for the moment</p>
|
|
|
|
)) : (
|
|
|
|
)) : (
|
|
|
|
|
|
|
|
<p className='text-warning'>Nothing for the moment</p>
|
|
|
|
|
|
|
|
)}
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
<div className="stats">
|
|
|
|
|
|
|
|
<h5>En ligne</h5>
|
|
|
|
|
|
|
|
<hr />
|
|
|
|
|
|
|
|
{weeklyOnlineStats !== null ? (weeklyOnlineStats.tab.length !== 0 ? weeklyOnlineStats.tab.map((stats: any, index: number) => (
|
|
|
|
|
|
|
|
<>
|
|
|
|
<Row>
|
|
|
|
<Row>
|
|
|
|
<Col sm={10}>No data</Col>
|
|
|
|
<Col>
|
|
|
|
</Row>
|
|
|
|
<p>{index+1}.{stats.pseudo}</p>
|
|
|
|
|
|
|
|
</Col>
|
|
|
|
|
|
|
|
<Col>
|
|
|
|
|
|
|
|
<p>{stats.wins}</p>
|
|
|
|
|
|
|
|
</Col>
|
|
|
|
|
|
|
|
</Row>
|
|
|
|
|
|
|
|
</>
|
|
|
|
|
|
|
|
)) : (
|
|
|
|
|
|
|
|
<p className='text-warning'>Nothing for the moment</p>
|
|
|
|
|
|
|
|
)) : (
|
|
|
|
|
|
|
|
<p className='text-warning'>Nothing for the moment</p>
|
|
|
|
)}
|
|
|
|
)}
|
|
|
|
|
|
|
|
</div>
|
|
|
|
<hr/>
|
|
|
|
</Carousel>
|
|
|
|
</Container>
|
|
|
|
</Tab.Content>
|
|
|
|
</Tab>
|
|
|
|
</Tab>
|
|
|
|
</Tabs>
|
|
|
|
</Tabs>
|
|
|
|
|
|
|
|
|
|
|
|
<ButtonImgNav dest='/' img={share}/>
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
//</div>
|
|
|
|
|
|
|
|
);
|
|
|
|
);
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
