Control html video tag from panel

Hi,

I am trying to set the html5 <video> tag options from the panel and I am wondering what the best way is to achieve this.

In the blueprint I added

  videooptions: 
    label: Video options
    type: checkboxes
    columns: 4
    options: 
      showcontrols: Show Controls
      autoplay: Autoplay Video
      loop: Loop video
      mute: Mute Audio

In the php file I created the according variables and the following html / php which works.

<video id="vid"  <?php echo $controls, $play, $loop, $mute, $poster ?>
source src="<?=$video->url()?>" type="video/mp4" />
</video>

I am having problems interfacing the variables with the settings / checkboxes from the panel since they return 0 or 1 or bool() which is true or false if I understood it correctly?

So I tried something like

if $page->autoplay() == 1
$play = "autoplay ";

which doesnΒ΄t work for some reason. And I guess there is a much smarter way.
May be someone can point me into the right direction.

Many thanks in advance.

The checkboxes field adds a comma separated list of options in your content file, which then looks something like this:

Videooptions: showcontrols, loop

depending on the selected options.

So you can use in_array to check if an option was selected:

<?php
$videoOptions = $page->videooptions()->split(',');
in_array('autoplay', $videoOptions)? $play = 'autoplay': $play = '';
?>
1 Like

Works perfectly now, many thanks!