<?php 

include('../dbconnect.php');
ob_start();
session_start();

if( !isset($_SESSION['user']) ) {
 header("Location: ../index.php");
 exit;
}


?>
<!DOCTYPE html>
<html lang="en">

<head>

    <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">
    <meta name="description" content="">
    <meta name="author" content="">

    <title>Super Admin | Dashboard</title>

    <!-- Bootstrap core CSS-->
    <link href="../vendor/bootstrap/css/bootstrap.min.css" rel="stylesheet">

    <!-- Custom fonts for this template-->
    <link href="../vendor/fontawesome-free/css/all.min.css" rel="stylesheet" type="text/css">

    <!-- Page level plugin CSS-->
    <link href="../vendor/datatables/dataTables.bootstrap4.css" rel="stylesheet">

    <!-- Custom styles for this template-->
    <link href="../css/sb-admin.css" rel="stylesheet">
    <link href="../css/style.css" rel="stylesheet">
    <link rel="icon" href="../images/logo.jpg" type="image/gif" sizes="16x16">


    <script>
    function cb() {
        var off = document.getElementsByName("off[]");

        var offlength = off.length;
        var hol = document.getElementsByName("hol[]");
        var hollength = hol.length;
        var start = document.getElementsByName("start[]");
        var end = document.getElementsByName("end[]");


        var pststart = document.getElementsByName("pststart[]");
        var pstoff = document.getElementsByName("pstoff[]");
        var psthol = document.getElementsByName("psthol[]");
        var pstend = document.getElementsByName("pstend[]");

        var starttime = new Date(start.value);


        for (k = 0; k < offlength; k++) {
            //off[k].checked = false;

            //alert(offlength);
            start[k].readOnly = false;
            end[k].readOnly = false;
            start[k].type = "time";
            end[k].type = "time";
            end[k].hidden = false;
            if (off[k].checked == true) {
                hol[k].disabled = true;
                start[k].readOnly = true;
                end[k].readOnly = true;
                start[k].type = 'text';
                start[k].value = 'OFF';
                end[k].type = 'text';
                end[k].value = 'OFF';
                end[k].hidden = true;
                /* 
                                var a = k+3;

                                pstoff[k].checked = true;
                                pststart[k].type = 'text';
                                pststart[k].value = 'OFF';
                                pstend[k].value = 'OFF';
                                pstend[k].hidden = true;
                                pststart[k].readOnly = true;
                                psthol[k].disabled = true; */

            } else {
                hol[k].disabled = false;
            }
            if (hol[k].checked == true) {
                start[k].readOnly = true;
                end[k].readOnly = true;
                off[k].disabled = true;
                start[k].type = 'text';
                start[k].value = 'HOLIDAY OFF';
                end[k].type = 'text';
                end[k].value = 'HOLIDAY OFF';
                end[k].hidden = true;
            } else {
                off[k].disabled = false;
            }
        }



    }



    function ol() {


        var off = document.getElementsByName("pstoff[]");
        var offlength = off.length;

        var hol = document.getElementsByName("psthol[]");
        var hollength = hol.length;

        var start = document.getElementsByName("pststart[]");

        var end = document.getElementsByName("pstend[]");


        for (k = 0; k < 7; k++) {

            if (off[k].checked == true) {
                hol[k].disabled = true;
                start[k].readOnly = true;
                end[k].readOnly = true;
                start[k].type = 'text';
                start[k].value = 'OFF';
                end[k].type = 'text';
                end[k].value = 'OFF';
                end[k].hidden = true;;





            }
            if (hol[k].checked == true) {
                start[k].readOnly = true;
                end[k].readOnly = true;
                off[k].disabled = true;
                start[k].type = 'text';
                start[k].value = 'HOLIDAY OFF';
                end[k].type = 'text';
                end[k].value = 'HOLIDAY OFF';
                end[k].hidden = true;






            }


        }
    }

    function indicb() {
        var off = document.getElementsByName("indioff[]");
        var offlength = off.length;
        var hol = document.getElementsByName("indihol[]");
        var hollength = hol.length;
        var start = document.getElementsByName("indistart[]");
        var end = document.getElementsByName("indiend[]");
        for (k = 0; k < offlength; k++) {
            //off[k].checked = false;
            start[k].readOnly = false;
            end[k].readOnly = false;
            start[k].type = "time";
            end[k].type = "time";
            end[k].hidden = false;
            if (off[k].checked == true) {
                hol[k].disabled = true;
                start[k].readOnly = true;
                end[k].readOnly = true;
                start[k].type = 'text';
                start[k].value = 'OFF';
                end[k].type = 'text';
                end[k].value = 'OFF';
                end[k].hidden = true;;
            } else {
                hol[k].disabled = false;
            }
            if (hol[k].checked == true) {
                start[k].readOnly = true;
                end[k].readOnly = true;
                off[k].disabled = true;
                start[k].type = 'text';
                start[k].value = 'HOLIDAY OFF';
                end[k].type = 'text';
                end[k].value = 'HOLIDAY OFF';
                end[k].hidden = true;
            } else {
                off[k].disabled = false;
            }
        }


        /*
    if (document.getElementById("off").checked == true) {
        document.getElementById("hol").disabled = true;
        } else {
            document.getElementById("hol").disabled = false;
    }
    if (document.getElementById("hol").checked == true) {
    document.getElementById("off").disabled = true;
    } else {
       document.getElementById("off").disabled = false;
    }
*/
    }

    function indiol() {


        var off = document.getElementsByName("indipstoff[]");
        var offlength = off.length;

        var hol = document.getElementsByName("indipsthol[]");
        var hollength = hol.length;

        var start = document.getElementsByName("indipststart[]");

        var end = document.getElementsByName("indipstend[]");


        for (k = 0; k < offlength; k++) {
            //off[k].checked = false;
            start[k].readOnly = false;
            end[k].readOnly = false;
            start[k].type = "time";
            end[k].type = "time";
            end[k].hidden = false;
            if (off[k].checked == true) {
                hol[k].disabled = true;
                start[k].readOnly = true;
                end[k].readOnly = true;
                start[k].type = 'text';
                start[k].value = 'OFF';
                end[k].type = 'text';
                end[k].value = 'OFF';
                end[k].hidden = true;;
            } else {
                hol[k].disabled = false;
            }
            if (hol[k].checked == true) {
                start[k].readOnly = true;
                end[k].readOnly = true;
                off[k].disabled = true;
                start[k].type = 'text';
                start[k].value = 'HOLIDAY OFF';
                end[k].type = 'text';
                end[k].value = 'HOLIDAY OFF';
                end[k].hidden = true;
            } else {
                off[k].disabled = false;
            }
        }
    }
    </script>



</head>

<body id="page-top">
	<div id="preloader">
   		<img src="../images/loaderS.gif" alt="processing..." height="150px" width="200px"/>
	</div>
    <div id="pageloader">
        <img src="../images/loaderS.gif" alt="processing..." height="150px" width="200px" />
    </div>



    <?php include('uppernav.php')?>





    <!-- Sidebar -->

    <?php 
       $dashboard = "active";
      include('sidebar.php');
      ?>
    <div id="content-wrapper">

        <div class="container-fluid">

            <!-- Breadcrumbs-->
            <ol class="breadcrumb">
                <li class="breadcrumb-item">
                    <a href="schedule.php"> Schedule</a>
                </li>
                <li class="breadcrumb-item active">Edit Schedule</li>
            </ol>


             

                    <div class="row p-3">
                        <div id="indidebug" class="col-lg-12 col-sm-12 col-md-12"></div>

                        <div class="col-lg-12 col-sm-12 col-md-12 form-inline">
                            <div class="alert alert-warning alert-dismissible fade show" id="alert" role="alert" hidden>
                                <p id="success"> </p>
                                <button type="button" class="close" data-dismiss="alert" aria-label="Close">
                                    <span aria-hidden="true">&times;</span>
                                </button>
                            </div>
                            <form>
                                <input type="week" class="form-control" name="indifrom" id="indifrom"> - <input
                                    type="week" class="form-control" name="indito" id="indito">
                                <select name="emp" id="emp" class="form-control">
                                    <option selected disabled> Employee </option>
                                    <option value="All"> All </option>

                                    <?php 
                                    $sqlemp = "SELECT * FROM empdetails JOIN empinfo ON empdetails.detailid = empinfo.empid WHERE  supervisor='$accountname' OR detailid ='$user'";
                                    $empres = mysqli_query($conn, $sqlemp);
                                    while($emprow = mysqli_fetch_assoc($empres)){
                                        if($emp == $emprow['empid']){
                                            echo '<option value="'.$emprow['empid'].'" selected>'.$emprow['empid'].' '.$emprow['firstname'].' '.$emprow['surname'].'</option>';
                                        }
                                        else{
                                            echo '<option value="'.$emprow['empid'].'" >'.$emprow['empid'].' '.$emprow['firstname'].' '.$emprow['surname'].'</option>';

                                        }


                                    }
                                    ?>
                                </select>

                            </form>

                        </div>
                        <div class="col-lg-12 col-sm-12 col-md-12 pl-4 pt-2" id="indimanila">
                            <div class="row">
                                <div class="col-lg-12">
                                    <h5>Manila</h5>
                                </div>


                                <div class="col-lg-12">
                                    <div class="row">
                                        <?php 
                            $day = array('Sunday', 'Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday','Saturday');
                            for($a=0; $a < 7; $a++){
                            echo'
                            <div class="col-sm-4 form-group">
                            
                                <div class="col-sm-12">
                                <label> <b>'.$day[$a].'</b></label>
                                </div>
                                <div class="col-sm-12 form-inline">
                                <input type="checkbox" class="indioff" name="indioff[]" id ="indioff" onclick="indicb()" value="OFF" style="height: 20px; width: 20px;">&nbsp<label>&nbsp<b> OFF</b> </label>
                                &nbsp&nbsp&nbsp&nbsp
                                <input type="checkbox"  class="indihol" name="indihol[]" id="indihol" onclick="indicb()" value="HOLIDAY OFF" style="height: 20px; width: 20px;">&nbsp<label>&nbsp<b> HOLIDAY OFF</b> </label>
                                </div>
                                <div class="col-sm-12 form-inline">
                                <input type="time" name="indistart[]" id="indistart" placeholder="Time" class="form-control"> &nbsp-&nbsp<input type="time" name="indiend[]" id="indiend" placeholder="Time" class="form-control" >
                                </div>
                            
                            </div>';
                            }
                          ?>
                                    </div>
                                </div>
                                <div class="col-lg-12">


                                    <button type="button" name="indinext" id="indinext"
                                        class="btn btn-primary pull-right" onclick='indinext()'> Next <i
                                            class="fas fa-angle-right"></i></button>
                                </div>
                            </div>
                        </div>
                        <div class="col-lg-12 col-sm-12 col-md-12 pl-4 pt-2" id="indipacific">
                            <div class="row">
                                <div class="col-lg-12">
                                    <h5>Pacific</h5>
                                </div>


                                <div class="col-lg-12">
                                    <div class="row" name="indipstsched">
                                        
                                    </div>


                                </div>


                                <div class="col-lg-12">

           
                                    <button type="button" class="btn btn-success pull-right" data-toggle="modal" onclick="view()" data-target="#confirmupdate"> 
                                    <i class="fas fa-check"></i> Save </button>

                                    <button type="button" name="indiback" id="indiback"
                                        class="btn btn-primary pull-right"> <i class="fas fa-angle-left"></i> Back
                                    </button>

                                </div>

                                <div class="modal fade" id="confirmupdate" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
                                <div class="modal-dialog modal-dialog-centered" role="document">
                                    <div class="modal-content">
                                    <div class="modal-header">
                                        <h5 class="modal-title" id="exampleModalLabel">Confirm Schedule Update </h5>
                                        <button class="close" type="button" data-dismiss="modal" aria-label="Close">
                                        <span aria-hidden="true">×</span>
                                        </button>
                                    </div>
                                    <div class="modal-body">Are you sure you want to update employee schedule?</div>
                                    <div class="modal-footer">
                                            <button type="button" name="indisubmitsched" id="indisubmitsched"
                                                class="btn btn-success"> <i class="fas fa-check"></i> Yes
                                            </button>
                                        <button class="btn btn-danger" type="button" data-dismiss="modal"> <i class='fas fa-close'></i> No</button>
                                        
                                    </div>
                                    </div>
                                </div>
                                </div>

                            </div> <!-- div row end -->

                        </div>


                    </div>

             

            

            <!-- Icon Cards-->

            <!-- /.container-fluid -->

            <!-- Sticky Footer -->


        </div>
        <!-- /.content-wrapper -->

    </div>
    <!-- /#wrapper -->

    <!-- Scroll to Top Button-->
    <a class="scroll-to-top rounded" href="#page-top">
        <i class="fas fa-angle-up"></i>
    </a>

    <!-- Logout Modal-->
    <div class="modal fade" id="logoutModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel"
        aria-hidden="true">
        <div class="modal-dialog" role="document">
            <div class="modal-content">
                <div class="modal-header">
                    <h5 class="modal-title" id="exampleModalLabel">Ready to Leave?</h5>
                    <button class="close" type="button" data-dismiss="modal" aria-label="Close">
                        <span aria-hidden="true">×</span>
                    </button>
                </div>
                <div class="modal-body">Select "Logout" below if you are ready to end your current session.</div>
                <div class="modal-footer">
                    <button class="btn btn-secondary" type="button" data-dismiss="modal">Cancel</button>
                    <a class="btn btn-primary" href="login.html">Logout</a>
                </div>
            </div>
        </div>
    </div>

    <!-- Bootstrap core JavaScript-->
    <script src="../vendor/jquery/jquery.min.js"></script>
    <script src="../vendor/bootstrap/js/bootstrap.bundle.min.js"></script>

    <!-- Core plugin JavaScript-->
    <script src="../vendor/jquery-easing/jquery.easing.min.js"></script>

    <!-- Page level plugin JavaScript-->
    <script src="../vendor/chart.js/Chart.min.js"></script>
    <script src="../vendor/datatables/jquery.dataTables.js"></script>
    <script src="../vendor/datatables/dataTables.bootstrap4.js"></script>


    <!-- Custom scripts for all pages-->
    <script src="../js/sb-admin.min.js"></script>

    <!-- Demo scripts for this page-->
    <script src="../js/demo/datatables-demo.js"></script>
    <script src="../js/demo/chart-area-demo.js"></script>

    <script language="javascript" type="text/javascript">
    $(document).ready(function() {
        $("form").on("submit", function() {
            $("#pageloader").fadeIn();
        }); //submit

        $('#preloader').fadeOut();

        $('#pacific').hide();
        $('#indipacific').hide();




        $("#next").on("click", function() {
            $("#pacific").show();
            $("#manila").hide();

            var starts = [];
            var end = [];

            i = 0;
            x = 0;

            $('input[name^="start"]').each(function() {
                starts[i++] = $(this).val();
                
            });

            $('input[name^="end"]').each(function() {
                end[x++] = $(this).val();

            });

            var froms = $('#from').val();
            var tos = $('#to').val();

            $.ajax({
                url: "loadpstsched.php",
                type: "POST",
                data: {
                    "loadsched": 1,
                    "start": starts,
                    "end": end,
                    "from": froms,
                    "to": tos
                },
                dataType: "json",
                success: function(data) {

                    $('div[name=pstsched]').html(data.sched);

                    ol();


                }

            });


        }); //submit

        var click_count = 0;

        $("#indinext").on("click", function() {
            click_count = click_count+1;

            //alert(click_count);

            if(click_count > 1){
                indiol();
                $("#indipacific").show();
                $("#indimanila").hide();

            }else{

                
                var indistarts = [];
                var indiend = [];

                indii = 0;
                indix = 0;

                $('input[name^="indistart"]').each(function() {
                    indistarts[indii++] = $(this).val();
                    if($(this).val() == ''){
                    $('#indialertrequired').show();
                    this.reportValidity();
                        e.preventDefault();

                }

                });

                $('input[name^="indiend"]').each(function() {
                    indiend[indix++] = $(this).val();
                    if($(this).val() == ''){
                    $('#indialertrequired').show();
                    this.reportValidity();
                        e.preventDefault();

                }

                });

                var indifroms = $('#indifrom').val();
                var inditos = $('#indito').val();
                if(!$('#emp').val()){

                                
                $('#indialertrequired').show();
                e.preventDefault();
                }

                
                if(indifroms == '' || inditos == '' ){


                $('#indialertrequired').show();
                e.preventDefault();

                }else{
                $('#indialertrequired').hide();
                }

                $("#indipacific").show();
                $("#indimanila").hide();






                $.ajax({
                    url: "loadpstsched.php",
                    type: "POST",
                    data: {
                        "indiloadsched": 1,
                        "indistart": indistarts,
                        "indiend": indiend,
                        "indifrom": indifroms,
                        "indito": inditos
                    },
                    dataType: "json",
                    success: function(data) {



                        $('div[name=indipstsched]').html(data.sched);

                        indiol();

                        

                    }

                });

            }




        });

        $("#back").on("click", function() {
            $("#pacific").hide();
            $("#manila").show();
        });

        $("#indiback").on("click", function() {
            $("#indipacific").hide();
            $("#indimanila").show();
        });





        $("#team").on("change", function() {



            var teams = $(this).val();


            $.ajax({
                url: "fetchdata.php",
                type: "POST",
                data: {
                    "team": teams
                },
                dataType: "json",
                success: function(data) {

                    $('tbody[name=tblempbody]').html(data.employeeinfo);





                }

            });



        });





        $("#submitsched").on("click", function() {

            var start = [];
            var end = [];
            var pststart = [];
            var pstend = [];
            var weekfrom = $('#from').val();
            var weekto = $('#to').val();
            var team = $('#team').val();




            a = 0;
            b = 0;
            c = 0;
            d = 0;


            $('input[name^="start"]').each(function() {
                start[a++] = $(this).val();

            });

            $('input[name^="end"]').each(function() {
                end[b++] = $(this).val();


            });
            $('input[name^="pststart"]').each(function() {
                pststart[c++] = $(this).val();


            });

            $('input[name^="pstend"]').each(function() {
                pstend[d++] = $(this).val();

            });

                $("#pageloader").fadeIn();
      




            $.ajax({
                url: "newupdatesched.php",
                type: "POST",
                data: {
                    "subsched": 1,
                    "start": start,
                    "end": end,
                    "pststart": pststart,
                    "pstend": pstend,
                    "from": weekfrom,
                    "to": weekto,
                    "team": team
                },
                success: function(response) {

              
                    $("#pageloader").fadeOut();
                   
                    $('#debug').html(response);

                    alert('success');

       

                }

            });





        });


        $("#indisubmitsched").on("click", function() {

            var indistart = [];
            var indiend = [];
            var indipststart = [];
            var indipstend = [];
            var indiweekfrom = $('#indifrom').val();
            var indiweekto = $('#indito').val();
            var emp = $('#emp').val();





            a = 0;
            b = 0;
            c = 0;
            d = 0;


            $('input[name^="indistart"]').each(function() {
                indistart[a++] = $(this).val();

            });

            $('input[name^="indiend"]').each(function() {
                indiend[b++] = $(this).val();


            });
            $('input[name^="indipststart"]').each(function() {
                indipststart[c++] = $(this).val();
                if($(this).val() == ''){
                   $('#indialertrequired').show();
                   this.reportValidity();
                    e.preventDefault();

               }


            });

            $('input[name^="indipstend"]').each(function() {
                indipstend[d++] = $(this).val();
                if($(this).val() == ''){
                   $('#indialertrequired').show();
                   this.reportValidity();
                    e.preventDefault();

               }

            });

            $("#pageloader").fadeIn();

            $.ajax({
                url: "newupdatesched.php",
                type: "POST",
                data: {
                    "indisubsched": 1,
                    "indistart": indistart,
                    "indiend": indiend,
                    "indipststart": indipststart,
                    "indipstend": indipstend,
                    "indifrom": indiweekfrom,
                    "indito": indiweekto,
                    "emp": emp
                },
                success: function(response) {

                    $('#confirmupdate').modal('hide');

                    $("#pageloader").fadeOut();
                    

                    $('#indidebug').html(response)
                    $("#indipacific").hide();
                    $("#indimanila").show();

              
                    


                }

            });



        });
























    }); //document ready
    </script>
    <script>
    $('a[data-toggle="tab"]').click(function(e) {
        e.preventDefault();
        $(this).tab('show');
    });

    $('a[data-toggle="tab"]').on("shown.bs.tab", function(e) {
        var id = $(e.target).attr("href");
        localStorage.setItem('selectedTab', id)
    });

    var selectedTab = localStorage.getItem('selectedTab');
    if (selectedTab != null) {
        $('a[data-toggle="tab"][href="' + selectedTab + '"]').tab('show');
    }
    </script>

</body>

</html>