testing random background

structure/template.php

@@ -20,9 +20,9 @@ header("Cache-Control: no-cache, must-revalidate");
     <link rel="stylesheet" type="text/css" href="<?= $relativepath ?>assets/css/template.css" />
     <link rel="stylesheet" type="text/css" href="<?= $relativepath ?>assets/css/queries.css" />
 
+    <!-- Icone du site, logo de la promo-->
     <link rel = "shortcut icon" href = "<?= $relativepath ?>assets/img/ico_promo_60.ico" >
 
-
     <title><?= $pagetitle ?> | INSAT Accueil</title>
 
 
@@ -103,7 +103,33 @@ header("Cache-Control: no-cache, must-revalidate");
             })()
         </script>
     </body>
+
+
+
+    <!-- chargement du fond d'écran random -->
+
+    <script type="text/javascript">
+
+        var mobile_backgrounds = ['assets/img/asterix.svg', 'assets/img/adrenaline.svg', 'assets/img/obelix.svg', 'assets/img/assurancetourix.svg'];
+        var pc_backgrounds = ['pc_background.svg'];
+        
+        var background = "";
+        
+        // détecte les petits écrans (frigo connectés, 3DS ...)
+        //  
+        if (window.innerWidth <= 800){
+            background = mobile_backgrounds[Math.floor(Math.random() * mobile_backgrounds.length)]
+        }else{
+            background = pc_backgrounds[Math.floor(Math.random() * pc_backgrounds.length)]
+        }
+
+        document.getElementsByTagName('body')[0].style.backgroundImage = 'url(' + background + ')';
+
+
+    </script>
 </html>
+
+
 <?php
 if (isset($pagescript)) {
     echo $pagescript; //ici on appelle les scripts de la page (s'il y en a)