I am working on Magic Mirror and I want to stream a wowza(m3u8) video to it. I have working code of it which is as below.
<html>
<div id="playerElement" style="width:100%; height:0; padding:0 0 56.25% 0"></div>
<script type="text/javascript" src="//player.wowza.com/player/latest/wowzaplayer.min.js"></script>
<script type="text/javascript">
WowzaPlayer.create('playerElement',
{
"license":"PLAY1-XXXX-XXXXX-XXXXX-XXXXX-XXXXX",
"title":"",
"description":"",
"sourceURL":"https://s3.amazonaws.com/XXXXX/HLS/XXXXX/XXXX_XXXXX.m3u8",
"autoPlay":false,
"volume":"75",
"mute":false,
"loop":false,
"audioOnly":false,
"uiShowQuickRewind":true,
"uiQuickRewindSeconds":"30"
}
);
</script>
</html>
I want to create a script element instead of script tag on which I want to create attribute which can create/hold the instance of wowza player. Something like
var script = document.createElement("script")
script.attr = WowzaPlayer.create('playerElement',
{
"license":"PLAY1-XXXX-XXXXX-XXXXX-XXXXX-XXXXX",
"title":"",
"description":"",
"sourceURL":"https://s3.amazonaws.com/XXXXX/HLS/XXXXX/XXXX_XXXXX.m3u8",
"autoPlay":false,
"volume":"75",
"mute":false,
"loop":false,
"audioOnly":false,
"uiShowQuickRewind":true,
"uiQuickRewindSeconds":"30"
}
);
I tried various options like creating a html variable and assigning it to
var wrapper = document.createElement("div");
wrapper.insertAdjacentHTML("afterbegin", html);
but it didn't work either. Please consider that I am not used to Javascript and HTML. Any help will be appreciated