Merge branch 'mark_advancing_teams'

README.md

@@ -42,4 +42,5 @@ The built container exposes port 80.
 
 # Todo 
 
-Timer in topnav
+Timer in topnav
+showMatches={playoffStages !== null} showmatches in GroupStage mittlerweile vmtl useless weil immer eingeklappt

js/components/GroupStage.js

@@ -29,6 +29,7 @@ export default class GroupStage extends Component {
                             isSignedIn={this.props.isSignedIn}
                             isOwner={this.props.isOwner}
                             groupRef={this.groupRefs[group.id]}
+                            teams={this.props.teams}
                         />
                     ))}
                 </Row>
@@ -112,7 +113,7 @@ export class Group extends Component {
                                 />
                             ))}
                         </Collapse>
-                        <GroupScoresTable scores={this.state.scores}/>
+                        <GroupScoresTable scores={this.state.scores} teams={this.props.teams}/>
                     </CardBody>
                 </Card>
             </Col>
@@ -133,16 +134,25 @@ function GroupScoresTable(props) {
             </tr>
             </thead>
             <tbody>
-            {props.scores.map(groupScore => <GroupScoresTableRow score={groupScore} key={groupScore.id}/>)}
+            {props.scores.map(groupScore => (
+                <GroupScoresTableRow
+                    score={groupScore}
+                    key={groupScore.id}
+                    teams={props.teams}
+                />
+            ))}
             </tbody>
         </Table>
     );
 }
 
 function GroupScoresTableRow(props) {
+    const advancingTeam = props.teams?.find(team => team.id === props.score.team.id && team.advancing_from_group_stage);
+    const rowClass = advancingTeam ? 'table-success' : '';
     const teamId = `favorite-team-groupstage-${props.score.team.id}`;
+
     return (
-        <tr id={teamId}>
+        <tr className={rowClass} id={teamId}>
             <td>{props.score.position}</td>
             <td>{props.score.team.name}</td>
             <td>{props.score.group_points}</td>

pages/tournament-fullscreen-groups.js

@@ -24,7 +24,7 @@ function FullscreenPage(props) {
     return (<div>
         <Container className="fs-5" fluid>
             <Row className="row-cols-4">
-                {props.groups.map(group => <Col className="mb-2"><Group group={group} key={group.id}/></Col>)}
+                {props.groups.map(group => <Col className="mb-2"><Group group={group} key={group.id} teams={props.teams}/></Col>)}
                 <Col>
                     <div className="d-flex justify-content-center align-items-center">
                         <QRCodeSVG
@@ -128,7 +128,7 @@ class Main extends React.Component {
                 </Head>
                 <FullscreenPage
                     tournament={tournament} groups={groups} page={page} maxPage={this.pages}
-                    showLogo={showLogo}
+                    showLogo={showLogo} teams={tournament.teams}
                 />
                 <style global jsx>{`
                     body {

pages/tournament.js

@@ -31,8 +31,13 @@ class PrivateTournamentPage extends React.Component {
                 <FavoriteBar teams={this.props.tournament.teams}/>
                 <div className='stages'>
                     {groupStage != null &&
-                    <div><GroupStage groups={groupStage.groups} isSignedIn={isSignedIn} isOwner={isOwner}
-                        showMatches={playoffStages !== null}/></div>}
+                    <div><GroupStage
+                        groups={groupStage.groups}
+                        isSignedIn={isSignedIn}
+                        isOwner={isOwner}
+                        showMatches={playoffStages !== null}
+                        teams={this.props.tournament.teams}
+                    /></div>}
                     <PlayoffStages playoffStages={playoffStages} isSignedIn={isSignedIn}
                         isOwner={isOwner}/>
                 </div>