Set up synchronized video playback

Introduction

When running Pixotope across multiple machines, video playback started at the same time on all machines can gradually drift out of sync due to frame drops, restarts, or timing differences between nodes. To solve this, Pixotope provides the Pixotope Media Player plugin, an experimental plugin that extends the Electra Media Player with timecode-based synchronisation, keeping video playback locked across all machines in the Pixotope network.

Set up video playback

Enable the Pixotope Media Player plugin

The Pixotope Media Player plugin must be enabled in addition to the standard Electra Media Player plugins.

1. Open the project in the Pixotope Editor

2. Go to Edit > Plugins

3. Search for Pixotope Media Player and enable it

4. Restart the Editor when prompted

Set up the Blueprint

Create variables

In your playback Blueprint (e.g. BP_VideoPlayer), create the following variables:

1. Add a variable of type Pixotope Synced Media Player > Object Reference - name it, for example, PxMediaPlayer

   

   
   

2. Add a variable of type Media Texture > Object Reference - name it, for example, MediaTexture

   • Click the eye icon to make each variable instance editable, then Compile

3. Add a variable of type File Media Source > Object Reference - name it, for example, MediaSource

   • Click the eye icon to make each variable instance editable, then Compile

4. Add a variable of type String - name it, for example, FilePath

   • Click the eye icon to make each variable instance editable, then Compile

Construct the Pixotope Media Players on BeginPlay

Because Pixotope Media Player objects must be created at runtime, use the Event BeginPlay graph to construct and initialise them.

1. From Event BeginPlay, add a Sequence node to handle multiple players in parallel

2. Add an Is Valid node targeting the corresponding PixotopeMediaPlayer variable

3. On the Is Not Valid output, add a Construct Object from Class node:

   • Set Class to Pixotope Synced Media Player

   • Set Outer to self

4. Wire the Return Value of the Construct node to a SET node targeting the PixotopeMediaPlayer variable

5. After the SET node, add a Set Media Player node (Target is Media Texture):

   • Wire the Target pin to the corresponding MediaTexture Media Texture variable

   • Wire the New Media Player pin to the PixotopeMediaPlayer variable

Add a Load File custom event

Follow the same steps as in Set up video playback > Load a video file at runtime, but wiring the PixotopeMediaPlayer variable to the Target pin of the Open Source Latent node instead

Synchronised playback

The SynchronousPlay function

To achieve frame-accurate synchronised playback, a Pixotope Media Player must reset its sync state before playing. This is done by calling Disable Sync followed by Enable Sync immediately before Play. This sequence forces the player to re-lock to the timecode reference on every play command.

We recommend encapsulating this pattern into a reusable Blueprint function called SynchronousPlay:

1. In the My Blueprint panel, create a new Function named SynchronousPlay

2. Add an input parameter of type Pixotope Synced Media Player > Object Reference - name it Pixotope Media Player

3. In the function graph, wire the input pin through the following chain:

   • Disable Sync (Target: Pixotope Media Player) →

   • Enable Sync (Target: Pixotope Media Player) →

   • Play (Target: Pixotope Media Player)

Create the Play custom event

Replace the standard Play custom event with one that calls the SynchronousPlay function, passing the Pixotope Media Player variable as input:

1. In the Event Graph, add a Custom Event named Play

2. Call SynchronousPlay:

   • Set Target to self

   • Wire the corresponding PixotopeMediaPlayer variable to the Pixotope Media Player input pin

Control synchronized playback via a control panel

Once the Blueprint is set up, the Play and Pause events can be driven from a Pixotope control panel in the same way as standard video playback.

1. Create a new control panel

2. Select the BP_VideoPlayer object in the Engine browser tab

3. Drag the Play function onto the canvas and assign it a Trigger widget

4. Repeat for any other control functions