Video banner not playing on low battery mode

[Joseht]

Hey guys, hope you’re doing great,

I have my site elixirdiuomo.com which doesnt have password btw, and in mobile it doesn’t play the video banner when phone is on low battery mode, any way to solve this guys? I will highly appreciate your help!

 

Kindly,

[Dan-From-Ryviu]

Hi @Joseht 

In low battery mode, Safari needs a user to interact with the video to start, but you can try to add this code to theme.liquid file, before </head> in Online Store > Themes > Edit code 

<script>
$('video').addClass('inlinevideo');
$('body').on('click touchstart', function ()  {var videoElement = document.getElementsByClassName('video-js');if (videoElement.playing) {} else {$('.video-js').trigger('play');}});
</script>

[Joseht]

Hey there mate, 

It didn’t work on either safari or google chrome, and same after I added the code unfortunately 

[Dan-From-Ryviu]

<script>
  // Function to play video in low power mode
  function playInlineVideo() {
    var videoElements = document.getElementsByClassName('video-js');
    Array.prototype.forEach.call(videoElements, function(videoElement) {
      if (videoElement.paused) {
        videoElement.play();
      }
    });
  }

  // Add event listeners for 'click' and 'touchstart' events on the body
  document.body.addEventListener('click', playInlineVideo);
  document.body.addEventListener('touchstart', playInlineVideo);
</script>

Please try to update code to this and check again 

[Dan-From-Ryviu]

If it is still not working, you can try to add this code 

<script src="https://code.jquery.com/jquery-2.2.4.min.js" integrity="sha256-BbhdlvQf/xTY9gja0Dq3HiwQF8LaCRTXxZKRutelT44=" crossorigin="anonymous"></script>
<script>
//PLAYS VIDEO IN LOW POWER MODE
$('body').on('click touchstart', function ()  {var videoElement = document.getElementsByClassName('video-js');if (videoElement.playing) {} else {$('.inlinevideo').trigger('play');}});

</script>

[Joseht]

Tried both and sadly it didn’t work, I believe in the first <script a “>” was missing so I added it and tried again, non of both with out without worked anyway 

[Dan-From-Ryviu]

Could you send a collab request to access your store so I can help you to add code and check directly? 

[Joseht]

Please be my guest. Our email is elixirdiuomo@gmail.com, idk how to send you a request for that tho

[Dan-From-Ryviu]

Please go to your store admin > Settings > Users and permissions, and give me your Collaborator request code so I can send a request to access your store.

[Joseht]

There it goes, it’s 0445

[Dan-From-Ryviu]

Request sent

[Joseht]

Done! 

[Dan-From-Ryviu]

Please check again.

[Joseht]

Terrific! Thank you so much, it works now, it still you have to scroll a bit for it to appear since it still appears the “no image” but as soon you scroll it appears, any thoughts on that?

[Dan-From-Ryviu]

Let me take a look at

[Dan-From-Ryviu · Accepted solution]

Hi @Joseht 

After checking, it must has action touch or click on screen to make video playing on low battery mode, 

[Joseht]

Ok, well thank you anyway it’s much better like that than to remaining white, again thank you so much gent!