🎮 React component that displays a controller operated by inputs from a CSV file, generated by the associated bakkesmod plugin -> InputLogger in Rocket League.

The component takes a CSV that looks like this...

And displays a controller that follows a timer, here orchestrated by a video playback :

With npm:

npm i rocket-input-controller

or with yarn:

yarn add rocket-input-controller

• A CSV file that follows the format described above using the bakkesmod plugin -> InputLogger.
• (optional) A video that matches actions described in the CSV.

The main component is ControllerOperator, which takes a CSV file and a mapping, and displays a controller that follows the CSV.

import { ControllerOperator, ControllerType, Color, defaultMapping } from 'rocket-input-controller'

return (
  <ControllerOperator
    intervalTiming={75}
    csv={...}
    controller={{
      type: ControllerType.XboxOne,
      color: Color.Black,
    }}
    mapping={defaultMapping}
    playing={true}
    currentTime={...}
  />
)

Everything configurable will be stored using localforage so the configuration will be kept between page reloads.

Controller can be changed using saveController, getController will return the current saved controller (or default one if there's not).

Available controllers are XboxOne and PS4, each with a black and white variation.

import { saveController } from 'rocket-input-controller'

await saveController({
  ...controller,
  type: ControllerType.PS4,
  color: Color.White,
})

Controller mapping can be changed using saveControllerMapping, getControllerMapping will return the current saved mapping (or default one if there's not).

import { saveControllerMapping, ControllerInputs } from 'rocket-input-controller'

await saveControllerMapping({
  throttle: ControllerInputs.TriggerRight,
  brake: ControllerInputs.TriggerLeft,
  jump: ControllerInputs.FaceDown,
  boost: ControllerInputs.BumperRight,
  handBrake: ControllerInputs.FaceLeft,
  directionalAirRoll: ControllerInputs.BumperLeft,
  airRollLeft: ControllerInputs.FaceLeft,
  airRollRight: ControllerInputs.FaceRight,
})

You can clone the repo and run the example shown in the video to see how it works. Have fun ! 🎉