GoGreen PC TuneUp™
Learn More

Insta-Install™
this is how we code sign our software and ssl encrypt our websites from our affiliate partner SSL.com

myBlog

myBlog Home

Back to Blog MTNCOMP


HTML5 video full screen playback not working on WIX using WOWZA

Published: Sunday, October 20, 2019 written by Drew Jackson
View Count: 30
Keywords: Wowza, Wix, ACTRA, 2019, Full Screen, Javascript, DOM



working the National Finals 2019 for ACTRA (American Cowboy Team Roping Association), the platform on WIX was fine for the last 3 years, and now, for some reason, browsers cannot go full screen for the video feed.
 
It's weird. What is more weird, is that the Safari browser has not problem, and FF, Chrome and IE and Edge won't go full screen.
 
https://www.actra.org/livevideo
 
Just reading the CODE created by WOWZA to see what is broke for full screen.. ….   Put this -> in your browser à view-source:https://player.cloud.wowza.com/hosted/2zkzmlkc/wowza.js

 


10/20 update - so we found that WIX had changed their platform to block full screen Wowza, so we had to go outside and put a link on our ACTRA portal -- https://secure.rg4s.com/secure.actra.org/LiveVideo.asp

problem bypassed and solved.

 


 


(function(e,t,n) {var r="attachEvent",i="addEventListener",s="DOMContentLoaded";if(!t[i])i=t[r]?(s="onreadystatechange")&&r:"";e[n]=function(r){/in/.test(t.readyState)?!i?setTimeout(function(){e[n](r)},9):t[i](s,r,false):r()}}) (window,document,"domReady");

 

domReady(function() {

  var wowza_css=document.createElement('link');

  wowza_css.rel='stylesheet';

  wowza_css.href= "//player.cloud.wowza.com/wowza_embed.css";

  wowza_css.onload=loadVideoJSCSS;

  document.getElementsByTagName('head')[0].appendChild(wowza_css);

 

  function loadVideoJSCSS() {

    var ls = document.createElement('link');

    ls.rel='stylesheet';

    ls.href= "//player.cloud.wowza.com/js-lib/video-js-5/video-js.min.css";

    ls.onload = loadPlayer;

    document.getElementsByTagName('head')[0].appendChild(ls);

  };

 

 

  function loadPlayer() {

   

 

    var playerText="

 
"

 

    playerText+="

    playerText+="               "

    playerText+="

"

 

 

    var doc = document.createElement('div');

    doc.innerHTML = playerText;

    var playerDiv = doc.firstChild;

    w_ie('wowza_player', playerDiv);

 

    function w_ie(id, div) {

      document.getElementById(id).appendChild(div);

    }

 

    params = {

      poster:              "//prod-railsapp.s3.amazonaws.com/uploads/player/video_poster_image/322537/ACTRA_bw_logo.jpg",        // Posterframe URL

      preload:             "none",

      autoplay:            false,

      playlist: [{

      mediaid:             "ACTRA National Finals 2018",

      title:               "ACTRA National Finals 2018",

      file:                "//wowzaprod186-i.akamaihd.net/hls/live/712242/cb3dbf0d/playlist.m3u8",

      sources:             [],

      live:                true,                  // Live flag

      countdown:           false,    // Countdown flag

      countdown_timestamp: "", // UNIX timestamp of the countdown date (required to show the countdown)

      live_done:           false                  // Show the "Thanks for watching message"

      }],

      freecaster: {

        player_root:         "https://player.cloud.wowza.com/hosted/2zkzmlkc/",

        get_video_path:      "wowza.json", // Will call player_root + get_video_path to get updated playlist item

        noactions:           true,       // Disable internal views counter

        template_livedate:   "%a %e %b %Y @ %H:%M",

        template_countdown:  "%days day(s) %hours:%minutes:%seconds",

        live_done_message:   "Thanks for watching!",

        live_done_image:     null,       // Optional image to append below the live_done message

       watermark_path:      "//prod-railsapp.s3.amazonaws.com/uploads/player/logo_image/322537/ACTRA_bw_logo.jpg",       // Path to SVG

        watermark_href:      "#",       // Watermark link URL

        watermark_position:  "top-right"

      }

    };

 

   var wpTechOrder=document.getElementById('wowza_player').getAttribute('techOrder')

 

    if (wpTechOrder) {

      params.techOrder=wpTechOrder.split(' ');

    }

 

    var script = document.createElement("script");

    script.type = "text/javascript";

    script.src = "//player.cloud.wowza.com/js-lib/fc-vjs-wrapper.js"

    document.getElementsByTagName("head")[0].appendChild(script);

 

    var node = document.createElement('style');

    node.innerHTML = '\n.vjs-error .vjs-error-display:before {\n  content: \"\" !important;\n}\n\n.vjs-error-display.vjs-modal-dialog {\n  background: none !important;\n}\n\n.fc-poster #fcplayer_freecaster_countdown {\n  height: 95px !important;\n  width: 280px !important;\n  font-size: 18px !important;\n  top: 70px !important;\n\n  font-weight: bold;\n  line-height: 25px;\n  padding-left: 40px;\n  padding-top: 10px;\n  border-radius: 0px 20px 20px 0px;\n  background: rgba(0,0,0,0.5);\n  color: #FFFFFF;\n  z-index: 1000;\n}\n\n.fc-poster #fcplayer_freecaster_countdown #fcplayer_freecaster_countdown_livedate::before {\n    content: \"Stream will start on:\";\n    font-size: 15px;\n    font-weight: bold;\n    display: block;\n    color: #FFFFFF;\n    clear: both;\n}\n\n.fc-overlays {\n    pointer-events: none;\n}\n';

    document.getElementsByTagName("head")[0].appendChild(node);

 

 

  }

});


 
more to come....
 

if you found this article helpful, consider contributing $10, 20 or so..to the author. more authors coming soon
FYI we use paypal or patreon, patreon has 3x the transaction fees, so we don't, not yet.

© 2019 myBlog™ v1.1 All rights reserved. We count views as reads, so let's not over think it.