

<!-- https://dygraphs.com/index.html -->

<?php
    // Initialize the session
    session_start();
    // Check if the user is already logged in, if yes then redirect him to welcome page
    if(!isset($_SESSION["loggedin"]) || $_SESSION["loggedin"] !== true){
        header("location: logout.php");
        exit;
    }
?>
<!doctype html>
<html>
    <head>
        <link rel="icon" type="image/png" href="/images/favicon.ico">
        <meta charset="utf-8">
        <!-- <meta http-equiv="X-UA-Compatible" content="IE=edge"> -->
        <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">

        <link rel="stylesheet" href="/libraries/jquery-ui.css">
        <link rel="stylesheet" href="/libraries/jquery.modal.min.css"/>
        <link rel="stylesheet" href="/libraries/bootstrap.min.css">
        <link rel="stylesheet" href="/libraries/semantic.min.css">  
        <link rel="stylesheet" href="/libraries/datatables.min.css"/>
        <link rel="stylesheet" href="/libraries/dygraph.min.css" />
        <link rel="stylesheet" href="/libraries/bootstrap-slider.min.css" />
        <link rel="stylesheet" href="/libraries/bootstrap-icons.css">
        <!-- <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.7.1/font/bootstrap-icons.css"> -->
        <!-- <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-slider/11.0.2/css/bootstrap-slider.min.css"> -->
        <link rel="stylesheet" href="/css/style.css">
        <link rel="stylesheet" href="/css/drivers.css">
        <link rel="stylesheet" href="/css/layout.css">
        <link rel="stylesheet" href="/css/listTable.css">
        <link rel="stylesheet" href="/css/dashboard.css">
        <link rel="stylesheet" href="/css/graphs.css">
        <link rel="stylesheet" href="/css/settings.css">
        <link rel="stylesheet" href="/css/widgetDosingPumps.css">
        <link rel="stylesheet" href="/css/widgetLights.css">
        <link rel="stylesheet" href="/css/widgetDs18b20.css">
        <link rel="stylesheet" href="/css/widgetProbes.css">
        <link rel="stylesheet" href="/css/widgetCustomRules.css">
        <link rel="stylesheet" href="/css/widgetSchedules.css">
        <link rel="stylesheet" href="/css/widgetLogs.css">
        <!-- <link rel="stylesheet" href="/css/settingsMenu.css"> -->
        <link rel="stylesheet" href="/css/customRules.css">
        <link rel="stylesheet" href="/css/wizards.css">
        <!-- Custom styles for this template -->
        <link rel="stylesheet" type="text/css" href="/libraries/datepicker/mtr-datepicker.min.css" />
        <link rel="stylesheet" type="text/css" href="/libraries/datepicker/mtr-datepicker.default-theme.min.css" />
        <!-- <link rel="stylesheet" type="text/css" href="/libraries/datepicker/demo/jumbotron-narrow.css" /> -->
        <!-- <link rel="stylesheet" href="/css/header.css">
        <link rel="stylesheet" href="/css/buttons.css">
        <link rel="stylesheet" href="/css/widgetsLights.css">
        <link rel="stylesheet" href="/css/widgetSchedules.css">
        <link rel="stylesheet" href="/css/widgetCustomRules.css">
        <link rel="stylesheet" href="/css/widgetDosingPumps.css">
        <link rel="stylesheet" href="/css/icons.css"> -->
        <style>
        </style>
        <!-- <script src="https://cdnjs.cloudflare.com/ajax/libs/jscolor/2.4.5/jscolor.min.js"></script> -->
        <!-- <script src="https://cdnjs.cloudflare.com/ajax/libs/jscolor/2.0.4/jscolor.min.js"></script> -->
        <!-- <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.0.2/jquery.min.js"></script> -->
        
        <script src="/libraries/HackTimer.min.js"></script>
        <script src="/libraries/jscolor.min.js"></script>
        <script src="/libraries/jquery.min.js"></script>
        <script src="/libraries/moment.js"></script>
        <script src="/libraries/jquery-1.12.4.js"></script>
        <script src="/libraries/jquery-ui.js"></script>
        <script src="/libraries/jquery.modal.min.js"></script>
        <script src="/libraries/datatables.min.js"></script>
        <script src="/libraries/dygraph.js"></script>
        <script src="/libraries/pdfmake.min.js"></script>
        <script src="/libraries/vfs_fonts.js"></script>
        <script src="/libraries/bootstrap-slider.min.js"></script>
        <script src="/libraries/jquery.csv.min.js"></script>
        <!-- <script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-slider/11.0.2/bootstrap-slider.min.js"></script> -->
        <!-- <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-csv/1.0.21/jquery.csv.min.js"></script> -->
        <script src="/libraries/imageMapResizer.min.js"></script>
        <!-- <script type="text/javascript" src="/libraries/datepicker/scripts/mtr-datepicker-timezones.js"></script> -->
        <script type="text/javascript" src="/libraries/datepicker/mtr-datepicker.js"></script>
        <!-- <script type="text/javascript" src="/libraries/datepicker/demo/demo.js"></script> -->
        

        <script src="js/global.js"></script>
        <title>Robo-Tank Aquarium Controller</title>
    </head>

    <body>
        <?php
            // Initialize the session
            // session_start();
            
            // Check if the user is logged in, if not then redirect him to login page
            if(!isset($_SESSION["loggedin"]) || $_SESSION["loggedin"] !== true){
                header("location: logout.php");
                exit;
            }

        ?>

        <script>
            jscolor.presets.default = {
                // value: '#88DD20',
                // position: 'right',
                closeButton: true, 
                closeText: 'Close',
                buttonColor: '#FFF',
                backgroundColor: '#333',
                palette: '#fff #000 #808080 #996e36 #f55525 #ffe438 #88dd20 #22e0cd #269aff #bb1cd4',
            };
        </script>


<!-- <div style="width:20px" data-jscolor="{}"><br></div> -->
            
        <div class="mainContainer" id="mainContainer">
        </div>
        <!-- <?php // include "php/layout.php"; ?>  -->

        <!-- grayed out background when popup is loaded -->
        <div id="popupBackground" class="popupBackground"></div>
        <!-- <div id="main-section" class="main-section"></div> -->
        
        <!-- popup window to add new ds18b20 sensor -->
        <div class="ds18b20Popup" id="ds18b20Popup">
            <div class="ds18b20Popup-content">
          <!-- <div id="datepicker-demo-custom"></div> -->
                <div class="ds18b20PopupHeader"></div>
                <div class="ds18b20Popup-body"></div>
            </div>
        </div>

        <div class="boxStyle" id="editPopup">
            <div class="editBoxHeader"></div>
            <div id="editScroll">
                <div class="editPopupInstructions"></div>
                <div class="editPopupBox"></div> 
                <div class="editPopupBox2" id="editPopupBox2"></div>
                <div class="editPopupButtons" id="editPopupButtons"></div>
            </div>
        </div>
        <!-- popup window for wizards -->
        <!-- <div id="wizardPopup" class="wizardPopup">
            <div class="wizardPopup-box">
                <div class="wizardPopupHeader"></div>
                <div class="wizardPopup-body"></div>
            </div>
        </div> --> 


          
        <script src="js/startupWizard.js"></script>
        <script src="js/system.js"></script>
        <script src="js/update.js"></script>
        <script src="js/systemI2C.js"></script>
        <script src="js/layout.js"></script>
        <!-- <script src="js/style.js"></script> -->
        <script src="js/widgetsLights.js"></script>
        <script src="js/widgetsDs18b20.js"></script>
        <script src="js/widgetsProbes.js"></script>
        <script src="js/widgetsSchedules.js"></script>
        <script src="js/settingsDosing.js"></script>
        <script src="js/graphs.js"></script>
        <script src="js/firstRun.js"></script>
        <script src="js/widgetsAcOutlets.js"></script>
        <script src="js/widgetsDcPorts.js"></script>
        <script src="js/widgetsSensors.js"></script>
        <script src="js/widgetsLogs.js"></script>
        <script src="js/settingsSystem.js"></script>
        <script src="js/settingsMenu.js"></script>
        <script src="js/settingsDrivers.js"></script>
        <script src="js/settingsEmail.js"></script>
        <script src="js/settingsProbes.js"></script>
        <script src="js/customRules.js"></script>

        <script type="text/javascript">
        </script>
    </body>
</html>
