player.mustache

{{!
  This file is part of Moodle - http://moodle.org/

  Moodle is free software: you can redistribute it and/or modify
  it under the terms of the GNU General Public License as published by
  the Free Software Foundation, either version 3 of the License, or
  (at your option) any later version.

  Moodle is distributed in the hope that it will be useful,
  but WITHOUT ANY WARRANTY; without even the implied warranty of
  MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
  GNU General Public License for more details.

  You should have received a copy of the GNU General Public License
  along with Moodle.  If not, see <http://www.gnu.org/licenses/>.
}}
{{!
  @template filter_opencast/player

  Opencast player template.
  The purpose of this template is to render a opencast video.

  Example context (json):
  {
      "resolution": "500/300",
      "width": "400",
      "height": "250",
      "playerid": "ocplayer_0",
      "configurl": "/filter/opencast/config.json",
      "modplayerpath": "/mod/opencast/player.html",
      "data": "{&quot;metadata&quot;:{&quot;title&quot;: &quot;Test video&quot;, &quot;etc&quot;: &quot;...&quot;}"
  }
}}

{{#resolution}}
<div class="filter-opencast player-wrapper" style="--aspect-ratio: {{resolution}}; {{#width}}width: {{width}}px; height: {{height}}px{{/width}}">
{{/resolution}}
{{^resolution}}
<div class="filter-opencast player-wrapper">
{{/resolution}}
    <iframe src="{{modplayerpath}}" class="mod-opencast-paella-player" id="{{playerid}}" allowfullscreen></iframe>
</div>

<script>
function init_{{playerid}}() {
    let iframeWindow = document.getElementById('{{playerid}}').contentWindow;
    if (!iframeWindow.MoodlePaellaPlayer || iframeWindow.document.readyState  !== 'complete') {
        setTimeout(init_{{playerid}}, 20, '{{playerid}}', '{{configurl}}');
    }
    else {
        iframeWindow.MoodlePaellaPlayer.initPaella(
            '{{{configurl}}}',
            '{{{themeurl}}}',
            JSON.parse('{{{data}}}')
        );
    }
}

init_{{playerid}}();
</script>