only loading video in mobile so that the file isn't downloaded twice

preventing file from being downloaded twice

diff --git a/parts/slideshow.php b/parts/slideshow.php
index dbb85ed..05c0d74 100644 (file)
--- a/parts/slideshow.php
+++ b/parts/slideshow.php
@@ -1,14 +1,19 @@
 <?php if (is_front_page()) : ?>
        <div id="front-page-video-container">
-
-      <video class="show-for-medium-down" id="front-page-video" src="<?php echo get_template_directory_uri();?>/assets/header-video.mp4" autoplay="" loop="" muted="" playsinline>
+      <video class="show-for-medium-down" id="front-page-video" src="" autoplay="" loop="" muted="" playsinline>
     </video>
-    
     <?php global $post;?>
     <div class="show-for-large-up">
         <?php echo the_field('parallax', $post->ID); ?>
     </div>
-    
   </div>
 <?php endif; ?>
-
+<?php $site_assets = json_encode( get_template_directory_uri() . '/assets/'); ?>
+<script>
+  jQuery(function($){
+    if( $(window).width() < 1024){
+      var assets = <?php echo $site_assets ?>;
+      $("#front-page-video").attr('src', assets + 'header-video.mp4');
+    }
+  });
+</script>