Skip to content

Changing Content

In this example you can change the Shot displayed on the Canvas by clicking the buttons below.

Each of the buttons sets the demo Display's Content Key to the key of a specific shot.

js
function buttonClick() {
    Plinthos.displays.demo.contentKey = 'cube';
    // OR
    Plinthos.displays.demo.show('cube');
}
html
<Button onclick="Plinthos.displays.demo.contentKey='cube'">Cube</Button>
<!-- OR -->
<Button onclick="Plinthos.displays.demo.show('cube')">Cube</Button>

Accessing the DisplayController

In order to access the Display Instance, the click handler references the global Plinthos object which is set up during the initialization of the Snippet.

Plinthos has a property displays which contains a DisplayController for each of the Snippet's configured Displays - keyed by their Instance Key.

Via contentKey Property

Setting the contentKey of a DisplayController automatically transitions the Display to show the Content with that key. If the Stage connected to that Display does not have any Content with that Key, the value of contentKey is not changed and nothing will happen.

Via show Function

Calling the show function on the Display Controller and passing in the Content Key as the first parameter will achieve the same result.