<?php

    function consolelog($data) {
        if(is_array($data) || is_object($data)) {
                echo("<script>console.log('PHP: ".json_encode($data)."');</script>");
            } else {
                echo("<script>console.log('PHP: ".$data."');</script>");
            }
    }

    function isMobile() {
        return preg_match("/(android|avantgo|blackberry|bolt|boost|cricket|docomo|fone|hiptop|mini|mobi|palm|phone|pie|tablet|up\.browser|up\.link|webos|wos)/i", $_SERVER["HTTP_USER_AGENT"]);
    }

    include "str2safestr.php";

    if(isset($_REQUEST['project'])) {
        $project = str2safestr(strtolower($_REQUEST['project']));
        // project doesnt exit, go to overview
        //if (!file_exists('projects/'.$project)){header("Refresh:0; url=index.php?project=quicklooks");}
    } else {
        //just entered dolueg in header and no project? refresh and go to overview
       //  header("Refresh:0; url=index.php?project=overview");
       $project='quicklooks';
    }

    if(isset($_REQUEST['subproject'])) {
        $subproject = str2safestr(strtolower($_REQUEST['subproject']));
        // project doesnt exit, go to overview
        //if (!file_exists('projects/'.$project)){header("Refresh:0; url=index.php?project=quicklooks");}
    } else {
        //just entered dolueg in header and no project? refresh and go to overview
       //  header("Refresh:0; url=index.php?project=overview");
    }

    header("X-XSS-Protection: 1; mode=block");

?>
<!DOCTYPE html>
<html lang="en">
<!-- ttt -->
 <head>
  <title>Cloudlab</title>
  <meta http-equiv="cache-control" content="no-cache">
  <meta http-equiv="pragma" content="no-cache">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  <meta name="viewport" content="initial-scale=1,user-scalable=no,maximum-scale=1,width=device-width">
  <link href="https://fonts.googleapis.com/css?family=Open+Sans&display=swap" rel="stylesheet">
  <link rel="stylesheet" type="text/css" href="css/default.css">
  <link rel="stylesheet" type="text/css" href="css/cloudlab.css">
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/fancybox/3.5.7/jquery.fancybox.css" type="text/css" media="screen" />
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jquery.tablesorter/2.31.1/css/theme.metro-dark.min.css" type="text/css" media="screen" />

<script src="https://"+<?php echo $_SERVER['SERVER_NAME']; ?>+"/cloudlab/lib/js/utils.js"></script>
<script src="https://code.jquery.com/jquery-3.6.0.js"></script>
<script src="https://code.jquery.com/ui/1.13.2/jquery-ui.js"></script>

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-datetimepicker/2.5.20/jquery.datetimepicker.full.min.js"
integrity="sha512-AIOTidJAcHBH2G/oZv9viEGXRqDNmfdPVPYOYKGy3fti0xIplnlgMHUGfuNRzC6FkzIo0iIxgFnr9RikFxK+sw==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>


<link rel="apple-touch-icon" sizes="180x180" href="media/icon/apple-touch-icon.png">
<link rel="icon" type="image/png" sizes="32x32" href="media/icon/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="16x16" href="media/icon"/favicon-16x16.png">
<link rel="manifest" href="media/icon/site.webmanifest">

 </head>

<!-- Google tag (gtag.js) -->
<script async src="https://www.googletagmanager.com/gtag/js?id=G-2VRZB8T7PT"></script>
<script>
  window.dataLayer = window.dataLayer || [];
  function gtag(){dataLayer.push(arguments);}
  gtag('js', new Date());

  gtag('config', 'G-2VRZB8T7PT');
</script>

 <body>
    <div class="menu"> 
    <a href="https://cloudlab.ethz.ch" class="back" target="_blank">
    <!-- <div class="tooltip">Test</div>-->
    <h2 class="title" title="CLOUDLAB">
    <!--<img height="30vh" width="30vw" src="media/logo/Cloudlab_logo.png"></img>   -->
    CLOUDLAB
    <!-- <img height="30vh" width="30vw" src="media/logo/Cloudlab_logo.png"></img> -->
    </h2>

    </a>
     <a class="love" href="https://github.com/spirrobe" target="_blank">  Made with  ❤️ in Switzerland by spirrobe</a>
    </div>   


  <div class="submenu">
    <?php include "projects.php"; ?>
  </div>
    <?php
       include "subprojects.php"; // enter some stuff here
    ?>


     <a href="https://cloudlab.ethz.ch" style="padding:0;margin:0;">
      <div id="logo_foot">
        <div class="footer" height="10vh">
        <img id="img_foot" class="footer" src="media/footer/footer0.jpeg"/ >
        </div>
      </div>
     </a>


  <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>

  <script>
    function resizeIframe(obj) {
      // reset first
      //console.log(obj);
      if (visualViewport.pageTop > curpos) {curpos = visualViewport.pageTop;}
      children = obj.contentWindow.document.documentElement.children
      if (children == null) {setTimeout(resizeIframe(iframe), 5000); return;}
      for (let i=0; children.length;i++) {
        if (i >= children.length) {break;}
        if (children[i].nodeName == 'BODY') {
           obj.style.height = children[i].scrollHeight + 'px';
        }
      }
      obj.style.height = obj.contentWindow.document.documentElement.scrollHeight + 'px';
      if (window.outerHeight < curpos) {curpos = window.outerHeight;}
      if (curpos > 0) {window.scrollTo(0, curpos);}
      //console.log(curpos);
    }
   function updateIframe() {
     if ('forecast' == <?php echo '"'.$_REQUEST['project'].'"';?> 
         && ['smdego', 'smdnap'].includes(<?php echo '"'.$_REQUEST['subproject'].'"';?>)) {
        return;
     }
     if ('mpdev' == <?php echo '"'.$_REQUEST['project'].'"';?> ) {
        return;
     }
  

     var iframe = document.getElementById('iframe');

     //$('frame').load(resizeIframe, $('frame'));
     if (visualViewport.pageTop > curpos) {curpos = visualViewport.pageTop;}
     //resizeIframe(iframe);
     var ro = new ResizeObserver(function() {
         // Called when the body size changes
         resizeIframe(iframe);
         //console.log('resizing contentwindow via observer');      });
      //console.log(iframe, iframe.contentDocument.body);
      ro.observe(iframe.contentDocument.body);
      iframe.focus();
   }
    function randomfooter() {
       rng = (Math.random(Date()) * 5).toFixed(0);
       foot = document.getElementById('img_foot');
       foot.src="media/footer/footer"+rng+'.jpeg';
    }

function docscroll() {
     curpos = visualViewport.pageTop;
     //console.log(curpos);
   }

  $( document ).ready(function() {
   // $('iframe.iframecontent').ready(updateIframe());
   curpos = visualViewport.pageTop;

   randomfooter();
   footerinterval = setInterval(randomfooter, 30 * 1000);
   //updateIframe();
   // updateiframe does not change anything if the iframe is properly
   // loaded already so we can use it several times
   // fast load iframe
   //setTimeout(updateIframe, 500);
   // keep checking if something changed the view
   //setInterval(updateIframe, 1000);
   // somewhat fast load iframe
   //setTimeout(updateIframe, 1000);
   // rather slow iframe
   //setTimeout(updateIframe, 2500);
   //setTimeout(updateIframe, 5000);
   //setTimeout(setInterval(updateIframe, 5000), 10000);
    //setTimeout(updateIframe, 2500);
    //$(window).scroll(function() {docscroll();});
    var iframe = document.getElementById('iframe');
    //setTimeout(resizeIframe(iframe), 2500);
    //setTimeout(resizeIframe(iframe), 5000);
    //setTimeout(resizeIframe(iframe), 10000);
    var resizetimer = setTimeout(updateIframe, 3000);
  });


  // every 5 seconds check if the height is sensible...
  </script>
  <script>
//  setselects();
  </script>

 </body>

 </html>
