mirror of
https://github.com/stronk-dev/LivepeerEvents.git
synced 2025-07-05 10:45:10 +02:00
Add score inspector
This commit is contained in:
parent
584346951a
commit
8b103d3a05
@ -1,8 +1,11 @@
|
|||||||
import React, { useState, useEffect } from 'react'
|
import React, { useState, useEffect } from 'react'
|
||||||
import Address from '../components/OrchAddressViewer';
|
import Address from '../components/OrchAddressViewer';
|
||||||
|
import { Popover } from '@mantine/core';
|
||||||
|
import ScoreView from './scoreViewer';
|
||||||
|
|
||||||
const Winner = (obj) => {
|
const Winner = (obj) => {
|
||||||
const [thisScore, setThisScore] = useState(0);
|
const [thisScore, setThisScore] = useState(0);
|
||||||
|
const [opened, setOpened] = useState(false);
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
// Get score of this Orch
|
// Get score of this Orch
|
||||||
@ -22,7 +25,12 @@ const Winner = (obj) => {
|
|||||||
|
|
||||||
let scoreObj = null;
|
let scoreObj = null;
|
||||||
if (thisScore) {
|
if (thisScore) {
|
||||||
scoreObj = <div className="strokeSmollLeft" style={{ minWidth: '100px' }} >
|
scoreObj =
|
||||||
|
<Popover className="strokeSmollLeft" style={{ minWidth: '100px', cursor: 'pointer' }}
|
||||||
|
opened={opened}
|
||||||
|
onClose={() => setOpened(false)}
|
||||||
|
target={
|
||||||
|
<div className="strokeSmollLeft" onClick={() => setOpened((o) => !o)} >
|
||||||
<div className="rowAlignLeft" >
|
<div className="rowAlignLeft" >
|
||||||
<h4>Global Score</h4>
|
<h4>Global Score</h4>
|
||||||
</div>
|
</div>
|
||||||
@ -31,6 +39,13 @@ const Winner = (obj) => {
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
}
|
}
|
||||||
|
width={260}
|
||||||
|
position="bottom"
|
||||||
|
withArrow
|
||||||
|
>
|
||||||
|
<ScoreView score={obj.stats.scores[obj.address]} />
|
||||||
|
</Popover>
|
||||||
|
}
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className="row">
|
<div className="row">
|
||||||
|
116
src/components/scoreViewer.js
Normal file
116
src/components/scoreViewer.js
Normal file
@ -0,0 +1,116 @@
|
|||||||
|
import React from "react";
|
||||||
|
|
||||||
|
const ScoreView = (obj) => {
|
||||||
|
|
||||||
|
console.log(obj.score);
|
||||||
|
return (
|
||||||
|
<div className="row">
|
||||||
|
<div className="stroke">
|
||||||
|
<div className="row">
|
||||||
|
<h4>x</h4>
|
||||||
|
</div>
|
||||||
|
<div className="row">
|
||||||
|
<h4>FRA</h4>
|
||||||
|
</div>
|
||||||
|
<div className="row">
|
||||||
|
<h4>LAX</h4>
|
||||||
|
</div>
|
||||||
|
<div className="row">
|
||||||
|
<h4>LON</h4>
|
||||||
|
</div>
|
||||||
|
<div className="row">
|
||||||
|
<h4>MDW</h4>
|
||||||
|
</div>
|
||||||
|
<div className="row">
|
||||||
|
<h4>NYC</h4>
|
||||||
|
</div>
|
||||||
|
<div className="row">
|
||||||
|
<h4>PRG</h4>
|
||||||
|
</div>
|
||||||
|
<div className="row">
|
||||||
|
<h4>SIN</h4>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div className="stroke">
|
||||||
|
<div className="row">
|
||||||
|
<h4>Success</h4>
|
||||||
|
</div>
|
||||||
|
<div className="row">
|
||||||
|
{(obj.score["FRA"].success_rate * 10).toFixed(1)}
|
||||||
|
</div>
|
||||||
|
<div className="row">
|
||||||
|
{(obj.score["LAX"].success_rate * 10).toFixed(1)}
|
||||||
|
</div>
|
||||||
|
<div className="row">
|
||||||
|
{(obj.score["LON"].success_rate * 10).toFixed(1)}
|
||||||
|
</div>
|
||||||
|
<div className="row">
|
||||||
|
{(obj.score["MDW"].success_rate * 10).toFixed(1)}
|
||||||
|
</div>
|
||||||
|
<div className="row">
|
||||||
|
{(obj.score["NYC"].success_rate * 10).toFixed(1)}
|
||||||
|
</div>
|
||||||
|
<div className="row">
|
||||||
|
{(obj.score["PRG"].success_rate * 10).toFixed(1)}
|
||||||
|
</div>
|
||||||
|
<div className="row">
|
||||||
|
{(obj.score["SIN"].success_rate * 10).toFixed(1)}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div className="stroke">
|
||||||
|
<div className="row">
|
||||||
|
<h4>Speed</h4>
|
||||||
|
</div>
|
||||||
|
<div className="row">
|
||||||
|
{(obj.score["FRA"].round_trip_score * 10).toFixed(1)}
|
||||||
|
</div>
|
||||||
|
<div className="row">
|
||||||
|
{(obj.score["LAX"].round_trip_score * 10).toFixed(1)}
|
||||||
|
</div>
|
||||||
|
<div className="row">
|
||||||
|
{(obj.score["LON"].round_trip_score * 10).toFixed(1)}
|
||||||
|
</div>
|
||||||
|
<div className="row">
|
||||||
|
{(obj.score["MDW"].round_trip_score * 10).toFixed(1)}
|
||||||
|
</div>
|
||||||
|
<div className="row">
|
||||||
|
{(obj.score["NYC"].round_trip_score * 10).toFixed(1)}
|
||||||
|
</div>
|
||||||
|
<div className="row">
|
||||||
|
{(obj.score["PRG"].round_trip_score * 10).toFixed(1)}
|
||||||
|
</div>
|
||||||
|
<div className="row">
|
||||||
|
{(obj.score["SIN"].round_trip_score * 10).toFixed(1)}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div className="stroke">
|
||||||
|
<div className="row">
|
||||||
|
<h4>Score</h4>
|
||||||
|
</div>
|
||||||
|
<div className="row">
|
||||||
|
{(obj.score["FRA"].score * 10).toFixed(1)}
|
||||||
|
</div>
|
||||||
|
<div className="row">
|
||||||
|
{(obj.score["LAX"].score * 10).toFixed(1)}
|
||||||
|
</div>
|
||||||
|
<div className="row">
|
||||||
|
{(obj.score["LON"].score * 10).toFixed(1)}
|
||||||
|
</div>
|
||||||
|
<div className="row">
|
||||||
|
{(obj.score["MDW"].score * 10).toFixed(1)}
|
||||||
|
</div>
|
||||||
|
<div className="row">
|
||||||
|
{(obj.score["NYC"].score * 10).toFixed(1)}
|
||||||
|
</div>
|
||||||
|
<div className="row">
|
||||||
|
{(obj.score["PRG"].score * 10).toFixed(1)}
|
||||||
|
</div>
|
||||||
|
<div className="row">
|
||||||
|
{(obj.score["SIN"].score * 10).toFixed(1)}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
)
|
||||||
|
}
|
||||||
|
|
||||||
|
export default ScoreView;
|
Loading…
x
Reference in New Issue
Block a user