show irating change prediction

Author: fgc

src/frontend/components/Standings/DriverInfoRow/DriverInfoRow.tsx

@@ -1,3 +1,4 @@
+import { useMemo } from 'react';
 import { SpeakerHigh } from '@phosphor-icons/react';
 import { getTailwindStyle } from '../../../utils/colors';
 import { formatTime } from '../../../utils/time';
@@ -12,6 +13,7 @@ interface DriverRowInfoProps {
   delta?: number;
   position: number;
   badge: React.ReactNode;
+  iratingChange?: number;
   lastTime?: number;
   fastestTime?: number;
   onPitRoad?: boolean;
@@ -38,11 +40,32 @@ export const DriverInfoRow = ({
   radioActive,
   isLapped,
   isLappingAhead,
+  iratingChange,
 }: DriverRowInfoProps) => {
   // convert seconds to mm:ss:ms
   const lastTimeString = formatTime(lastTime);
   const fastestTimeString = formatTime(fastestTime);
 
+  const iratingChangeDisplay = useMemo(() => {
+    if (iratingChange === undefined || iratingChange === null) {
+      return { text: '-', color: 'text-gray-400' };
+    }
+    const roundedChange = Math.round(iratingChange);
+    let text: string;
+    let color = 'text-gray-400';
+
+    if (roundedChange > 0) {
+      text = `▲${roundedChange}`;
+      color = 'text-green-400';
+    } else if (roundedChange < 0) {
+      text = `▼${Math.abs(roundedChange)}`;
+      color = 'text-red-400';
+    } else {
+      text = `${roundedChange}`;
+    }
+    return { text, color };
+  }, [iratingChange]);
+
   return (
     <tr
       key={carIdx}
@@ -82,6 +105,9 @@ export const DriverInfoRow = ({
         </div>
       </td>
       <td>{badge}</td>
+      <td className={`px-2 text-left ${iratingChangeDisplay.color}`}>
+        {iratingChangeDisplay.text}
+      </td>
       <td className={`px-2`}>{delta?.toFixed(1)}</td>
       <td className={`px-2 ${hasFastestTime ? 'text-purple-400' : ''}`}>
         {fastestTimeString}

src/frontend/components/Standings/Standings.tsx

@@ -4,6 +4,7 @@ import { useAutoAnimate } from '@formkit/auto-animate/react';
 import { DriverClassHeader } from './DriverClassHeader/DriverClassHeader';
 import { SessionBar } from './SessionBar/SessionBar';
 import { Fragment } from 'react/jsx-runtime';
+import { StandingsWithIRatingGain } from './hooks';
 import { useCarClassStats, useDriverStandings } from './hooks';
 import { SessionFooter } from './SessionFooter/SessionFooter';
 
@@ -37,6 +38,7 @@ export const Standings = () => {
                   hasFastestTime={result.hasFastestTime}
                   delta={result.delta}
                   position={result.classPosition}
+                  iratingChange={(result as StandingsWithIRatingGain).iratingChange}
                   lastTime={result.lastTime}
                   fastestTime={result.fastestTime}
                   onPitRoad={result.onPitRoad}

src/frontend/components/Standings/hooks/useDriverStandings.tsx

@@ -13,7 +13,17 @@ import {
   createDriverStandings,
   groupStandingsByClass,
   sliceRelevantDrivers,
+  Standings as DriverStandingInfo, // Renaming to avoid conflict if needed locally
 } from '../createStandings';
+import {
+  calculateIRatingGain,
+  RaceResult,
+  CalculationResult,
+} from '../../../utils/iratingGain';
+
+export interface StandingsWithIRatingGain extends DriverStandingInfo {
+  iratingChange?: number;
+}
 
 export const useDriverStandings = ({ buffer }: { buffer: number }) => {
   const sessionDrivers = useSessionDrivers();
@@ -28,8 +38,8 @@ export const useDriverStandings = ({ buffer }: { buffer: number }) => {
   const carIdxTrackSurface = useTelemetry('CarIdxTrackSurface');
   const radioTransmitCarIdx = useTelemetry('RadioTransmitCarIdx');
 
-  const standings = useMemo(() => {
-    const standings = createDriverStandings(
+  const standingsWithGain = useMemo(() => {
+    const initialStandings = createDriverStandings(
       {
         playerIdx: driverCarIdx,
         drivers: sessionDrivers,
@@ -47,8 +57,44 @@ export const useDriverStandings = ({ buffer }: { buffer: number }) => {
         sessionType,
       }
     );
-    const grouped = groupStandingsByClass(standings);
-    return sliceRelevantDrivers(grouped, { buffer });
+    const groupedByClass = groupStandingsByClass(initialStandings);
+
+    const augmentedGroupedByClass: [string, StandingsWithIRatingGain[]][] = groupedByClass.map(
+      ([classId, classStandings]) => {
+        const raceResultsInput: RaceResult<number>[] = classStandings.map(
+          (driverStanding) => ({
+            driver: driverStanding.carIdx,
+            finishRank: driverStanding.classPosition,
+            startIRating: driverStanding.driver.rating,
+            started: true, // This is a critical assumption.
+          }),
+        );
+
+        if (raceResultsInput.length === 0) {
+          return [classId, classStandings as StandingsWithIRatingGain[]];
+        }
+
+        const iratingCalculationResults = calculateIRatingGain(raceResultsInput);
+
+        const iratingChangeMap = new Map<number, number>();
+        iratingCalculationResults.forEach((calcResult: CalculationResult<number>) => {
+          iratingChangeMap.set(
+            calcResult.raceResult.driver,
+            calcResult.iratingChange,
+          );
+        });
+
+        const augmentedClassStandings: StandingsWithIRatingGain[] = classStandings.map(
+          (driverStanding) => ({
+            ...driverStanding,
+            iratingChange: iratingChangeMap.get(driverStanding.carIdx),
+          }),
+        );
+        return [classId, augmentedClassStandings];
+      },
+    );
+
+    return sliceRelevantDrivers(augmentedGroupedByClass, { buffer });
   }, [
     driverCarIdx,
     sessionDrivers,
@@ -63,5 +109,5 @@ export const useDriverStandings = ({ buffer }: { buffer: number }) => {
     buffer,
   ]);
 
-  return standings;
+  return standingsWithGain;
 };

src/frontend/utils/iratingGain.ts

@@ -0,0 +1,124 @@
+// Based on the Rust implementation provided in https://github.com/Turbo87/irating-rs
+
+export interface RaceResult<D = unknown> {
+  driver: D;
+  finishRank: number; // u32
+  startIRating: number; // u32
+  started: boolean;
+}
+
+export interface CalculationResult<D = unknown> {
+  raceResult: RaceResult<D>;
+  iratingChange: number; // f32
+  newIRating: number; // u32
+}
+
+function chance(a: number, b: number, factor: number): number {
+  const expA = Math.exp(-a / factor);
+  const expB = Math.exp(-b / factor);
+  return (
+    ((1 - expA) * expB) / ((1 - expB) * expA + (1 - expA) * expB)
+  );
+}
+
+export function calculateIRatingGain<D>(
+  raceResults: RaceResult<D>[],
+): CalculationResult<D>[] {
+  const br1 = 1600 / Math.LN2;
+
+  const numRegistrations = raceResults.length;
+  if (numRegistrations === 0) {
+    return [];
+  }
+
+  const numStarters = raceResults.filter((r) => r.started).length;
+  const numNonStarters = numRegistrations - numStarters;
+
+  const chances: number[][] = raceResults.map((resultA) =>
+    raceResults.map((resultB) =>
+      chance(resultA.startIRating, resultB.startIRating, br1),
+    ),
+  );
+
+  const expectedScores: number[] = chances.map(
+    (chancesRow) => chancesRow.reduce((sum, val) => sum + val, 0) - 0.5,
+  );
+
+  const fudgeFactors: number[] = raceResults.map((result) => {
+    if (!result.started) {
+      return 0;
+    }
+    const x = numRegistrations - numNonStarters / 2;
+    return (x / 2 - result.finishRank) / 100;
+  });
+
+  let sumChangesStarters = 0;
+  const changesStarters: (number | null)[] = raceResults.map(
+    (result, index) => {
+      if (!result.started) {
+        return null;
+      }
+      if (numStarters === 0) return 0;
+
+      const expectedScore = expectedScores[index];
+      const fudgeFactor = fudgeFactors[index];
+      const change =
+        ((numRegistrations -
+          result.finishRank -
+          expectedScore -
+          fudgeFactor) *
+          200) /
+        numStarters;
+      sumChangesStarters += change;
+      return change;
+    },
+  );
+
+  const expectedScoreNonStartersList: (number | null)[] = raceResults.map(
+    (result, index) => (!result.started ? expectedScores[index] : null)
+  );
+
+  const sumExpectedScoreNonStarters: number = expectedScoreNonStartersList
+    .filter((score): score is number => score !== null)
+    .reduce((sum, val) => sum + val, 0);
+
+  const avgExpectedScoreNonStarters = numNonStarters > 0 ? sumExpectedScoreNonStarters / numNonStarters : 0;
+
+  const changesNonStarters: (number | null)[] = expectedScoreNonStartersList.map(
+    (expectedScore) => {
+      if (expectedScore === null) {
+        return null;
+      }
+      if (numNonStarters === 0) return 0;
+      if (avgExpectedScoreNonStarters === 0) return 0;
+
+      return (
+        (-sumChangesStarters / numNonStarters) *
+        (expectedScore / avgExpectedScoreNonStarters)
+      );
+    },
+  );
+
+  const changes: number[] = raceResults.map((_result, index) => {
+    const starterChange = changesStarters[index];
+    const nonStarterChange = changesNonStarters[index];
+
+    if (starterChange !== null) {
+      return starterChange;
+    }
+    if (nonStarterChange !== null) {
+      return nonStarterChange;
+    }
+    throw new Error(`Driver at index ${index} is neither starter nor non-starter.`);
+  });
+
+  return raceResults.map((result, index) => {
+    const change = changes[index];
+    const newIRating = Math.max(0, Math.round(result.startIRating + change));
+    return {
+      raceResult: result,
+      iratingChange: change,
+      newIRating: newIRating,
+    };
+  });
+}