@extends('admin.include.main')
@section('content')
    <div class="wrapper wrapper-content animated fadeInRight">
        <div class="row">
            <div class="col-lg-12">
                  <div class="ibox ">
                    <div class="ibox-title">
                        <h5>TEACHER ROUTINE SETTING</h5>
                        <div class="ibox-tools">
                            <a class="collapse-link">
                                <i class="fa fa-chevron-up"></i>
                            </a>
                            <a class="dropdown-toggle" data-toggle="dropdown" href="#">
                                <i class="fa fa-wrench"></i>
                            </a>
                            <ul class="dropdown-menu dropdown-user">
                                <li><a href="#" class="dropdown-item">Config option 1</a>
                                </li>
                                <li><a href="#" class="dropdown-item">Config option 2</a>
                                </li>
                            </ul>
                            <a class="close-link">
                                <i class="fa fa-times"></i>
                            </a>
                        </div>
                    </div>
                    <div class="ibox-content">
                        <form method="post" id="teacherroutineform" name="form">
                            @csrf
                            <div class="row">
                                <div class="form-group col-lg-2">
                                <label for="periods">No Period :</label>
                                 </div>
                                <div class="form-group col-lg-6">
                                <input type="text" name="periods" id="periods" class="form-control" placeholder="Enter No of Periods">

                                </div>
                            </div>
                            <div class="row">
                                <div class="form-group col-lg-2">
                                     <label for="periods"> Period time :</label>
                                </div>
                                <div class="form-group col-lg-6">
                                     <input type="text" name="period_time" class="form-control" placeholder="Enter time in minutes">

                                </div>
                            </div>
                            <div class="row">
                                <div class="form-group col-lg-2">
                                    <label for="periods">Period Start time :</label>
                                </div>
                                <div class="form-group col-lg-6">
                                    <input type="time" name="period_start_time" class="form-control" placeholder="Enter Class Start time">

                                </div>
                            </div>
                             <div class="row">
                                <div class="form-group col-lg-2">
                                    <label for="periods">WeekEnd :</label>
                                </div>
                                <div class="form-group col-lg-6">
                                    <input type="radio" name="weekend" value="saturday"><label class="ml-2">Saturday</label>
                                     <input type="radio" name="weekend" value="sunday"><label class="ml-2">Sunday</label>
                                </div>

                                <div class="form-group col-lg-3">


                                </div>
                            </div>
                            <div class="row">
                                <div class="col-lg-2">
                                    <input onclick="breakcheck()" type="checkbox" name="break_check" id="break_check" style="margin-left: 77%;transform: scale(1.5)" >

                                </div>
                                <div class="col-lg-6">
                                     Include Breaks
                                </div>
                            </div>
                            <div class="row mt-2" id="breakdiv">


                            </div>
                            <div class="row  mt-2">
                                <div class="col-lg-2">
                                    <input onclick="lunchcheck()" type="checkbox" name="break_check" id="lunch_check" style="margin-left: 77%;transform: scale(1.5)" >

                                </div>
                                <div class="col-lg-6">
                                     Include Lunch
                                </div>
                            </div>
                            <div class="row mt-2" id="lunchdiv"></div>
                            <div class="offset-lg-5" style="margin-top:10px;">
                                <input onclick="dynamicroutine()" type="button" value="Submit">
                            </div>
                        </form>

                        </div>
                    </div>


                <div class="ibox ">
                    <div class="ibox-title">
                        <h5>ADD TEACHER ROUTINE</h5>
                        <div class="ibox-tools">
                            <a class="collapse-link">
                                <i class="fa fa-chevron-up"></i>
                            </a>
                            <a class="dropdown-toggle" data-toggle="dropdown" href="#">
                                <i class="fa fa-wrench"></i>
                            </a>
                            <ul class="dropdown-menu dropdown-user">
                                <li><a href="#" class="dropdown-item">Config option 1</a>
                                </li>
                                <li><a href="#" class="dropdown-item">Config option 2</a>
                                </li>
                            </ul>
                            <a class="close-link">
                                <i class="fa fa-times"></i>
                            </a>
                        </div>
                    </div>
                    <div class="ibox-content">
                    {{--  <form action="{{route('add.routine.teacher')}}" method="POST" enctype="multipart/form-data">
                            @csrf --}}
                            <input type="hidden" value="{{$teacher_id}}" name="teacher_id">

                        <div class="table-responsive">
                            <table class="table table-striped table-bordered table-hover" >
                                <thead>
                                <tr id="teacherheading">
                                    <th>S.N</th>
                                </tr>


                                </thead>
                                <tbody id="teachertb">

                                {{-- <tr>
                                    <td>Sunday</td>
                                    <td>
                                        <input type="text" name="sun1" class="form-control" placeholder="Cls\Sec\Sub">
                                    </td>
                                    <td>
                                        <input type="text" name="sun2" class="form-control">
                                    </td>
                                    <td>
                                        <input type="text" name="sun3" class="form-control">
                                    </td><td>
                                        <input type="text" name="sun4" class="form-control">
                                    </td>
                                    <td>
                                        <input type="text" name="sun5" class="form-control">
                                    </td>
                                    <td>
                                        <input type="text" name="sun6" class="form-control">
                                    </td>
                                    <td>
                                        <input type="text" name="sun7" class="form-control">
                                    </td>
                                    <td>
                                        <input type="text" name="sun8" class="form-control">
                                    </td>
                                </tr>
                                <tr>
                                    <td>Monday</td>
                                    <td>
                                        <input type="text" name="mon1" class="form-control">
                                    </td>
                                    <td>
                                        <input type="text" name="mon2" class="form-control">
                                    </td><td>
                                        <input type="text" name="mon3" class="form-control">
                                    </td><td>
                                        <input type="text" name="mon4" class="form-control">
                                    </td><td>
                                        <input type="text" name="mon5" class="form-control">
                                    </td><td>
                                        <input type="text" name="mon6" class="form-control">
                                    </td><td>
                                        <input type="text" name="mon7" class="form-control">
                                    </td><td>
                                        <input type="text" name="mon8" class="form-control">
                                    </td>
                                </tr>
                                <tr>
                                    <td>Tuesday</td>
                                    <td>
                                        <input type="text" name="tue1" class="form-control">
                                    </td>
                                    <td>
                                        <input type="text" name="tue2" class="form-control">
                                    </td><td>
                                        <input type="text" name="tue3" class="form-control">
                                    </td><td>
                                        <input type="text" name="tue4" class="form-control">
                                    </td><td>
                                        <input type="text" name="tue5" class="form-control">
                                    </td><td>
                                        <input type="text" name="tue6" class="form-control">
                                    </td><td>
                                        <input type="text" name="tue7" class="form-control">
                                    </td><td>
                                        <input type="text" name="tue8" class="form-control">
                                    </td>
                                </tr>
                                <tr>
                                    <td>Wednesday</td>
                                    <td>
                                        <input type="text" name="wed1" class="form-control">
                                    </td>
                                    <td>
                                        <input type="text" name="wed2" class="form-control">
                                    </td><td>
                                        <input type="text" name="wed3" class="form-control">
                                    </td><td>
                                        <input type="text" name="wed4" class="form-control">
                                    </td><td>
                                        <input type="text" name="wed5" class="form-control">
                                    </td><td>
                                        <input type="text" name="wed6" class="form-control">
                                    </td><td>
                                        <input type="text" name="wed7" class="form-control">
                                    </td><td>
                                        <input type="text" name="wed8" class="form-control">
                                    </td>
                                </tr>
                                <tr>
                                    <td>Thursday</td>
                                    <td>
                                        <input type="text" name="thurs1" class="form-control">
                                    </td>
                                    <td>
                                        <input type="text" name="thurs2" class="form-control">
                                    </td><td>
                                        <input type="text" name="thurs3" class="form-control">
                                    </td><td>
                                        <input type="text" name="thurs4" class="form-control">
                                    </td><td>
                                        <input type="text" name="thurs5" class="form-control">
                                    </td><td>
                                        <input type="text" name="thurs6" class="form-control">
                                    </td><td>
                                        <input type="text" name="thurs7" class="form-control">
                                    </td><td>
                                        <input type="text" name="thurs8" class="form-control">
                                    </td>
                                </tr>
                                <tr>
                                    <td>Friday</td>
                                    <td>
                                        <input type="text" name="fri1" class="form-control">
                                    </td>
                                    <td>
                                        <input type="text" name="fri2" class="form-control">
                                    </td><td>
                                        <input type="text" name="fri3" class="form-control">
                                    </td><td>
                                        <input type="text" name="fri4" class="form-control">
                                    </td><td>
                                        <input type="text" name="fri5" class="form-control">
                                    </td><td>
                                        <input type="text" name="fri6" class="form-control">
                                    </td><td>
                                        <input type="text" name="fri7" class="form-control">
                                    </td>
                                    <td>
                                        <input type="text" name="fri8" class="form-control">
                                    </td>
                                </tr> --}}
                                </tbody>

                            </table>
                        </div>

                         <div class="ibox-content">
                             <h2 class="text-success" s>Choose File To Upload</h2>
                             <hr>
                             <h3 class="text-info">Upload Image</h3>
                             <hr>
                             <div class="row">
                                 <div class="col-md-6">
                                     <div>
                                         <div class="controls">
                                             <input type="file" id="image" name="image" class="form-control btn btn-success" > </div><br>
                                         </label>
                                     </div>
                                 </div>
                                 <div class="col-md-6">
                                     <div>
                                         <img src="{{asset('adminpanel/uploads/teacher_routine/upload.png')}}" id="current_image" width="80px" height="80px">
                                     </div>
                                 </div>

                             </div>
                             <button type="submit" class="btn btn-success">Add</button>

                         </div>



                    </div>
                </div>
            </div>
        </div>
        {{-- <button type="submit" class="btn btn-success">Add</button> --}}
        {{-- </form> --}}
    </div>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"></script>

    <script type="text/javascript">
        function readURL(input) {
            if (input.files && input.files[0]) {
                var reader = new FileReader();

                reader.onload = function (e) {
                    $('#current_image').attr('src', e.target.result);
                }
                reader.readAsDataURL(input.files[0]);
            }
        }
        $("#image").change(function(){
            readURL(this);
        });


        function breakcheck(){
              var checkbox = document.getElementById('break_check');
                  if (checkbox.checked === true){
                    $('#breakdiv').append('<div class="col-lg-10"><label for=""><b>Break After :</b></label><input type="text" name="breakafter" style="margin-left:15px;"> &nbsp;<label><b>For :</b></label><input type="text" name="breakminutes" style="margin-left:15px;"><label style="margin-left:15px;"><b>Minute</b></label><button type="button" style="margin-left:15px;" onclick="breakadd()"><i class="fa fa-plus"></i></button></div>');
                  }
                  else{
                     $('#breakdiv').empty();
                  }
        }
        function breakadd(){
            debugger;
            $('#breakdiv').append('<div class="col-lg-10"><label for=""><b>Break After :</b></label><input type="text" name="breakafter1[]" style="margin-left:15px;"> &nbsp;<label><b>For :</b></label><input type="text" name="breakminutes1[]" style="margin-left:15px;"><label style="margin-left:15px;"><b>Minute</b></label><button type="button" style="margin-left:15px;"><i class="fa fa-plus" onclick="breakadd();"></i></button></div>');

        }
        function lunchcheck(){
            var checkbox = document.getElementById('lunch_check');
                  if (checkbox.checked === true){
                    $('#lunchdiv').append('<div class="col-lg-10"><label for=""><b>Lunch After :</b></label><input type="text" name="lunchafter" style="margin-left:15px;"> &nbsp;<label><b>For :</b></label><input type="text" name="lunchminutes" style="margin-left:15px;"><label style="margin-left:15px;"><b>Minute</b></label></div>');
                  }
                  else{
                     $('#lunchdiv').empty();
                  }
        }

        function dynamicroutine(){
            alert('a');
            var str = $( "form" ).serialize();

            debugger;
            console.log(str);
            var no=jQuery('input[name="periods"]').val();
            var timeperiod=jQuery('input[name="period_time"]').val();
             var addedmin=Number(timeperiod);
            var starttime=jQuery('input[name="period_start_time"]').val();
            var lunch_after=jQuery('input[name="lunchafter"]').val();
            alert(lunch_after);
            var lunch_minute=jQuery('input[name="lunchminutes"]').val();
            var start=starttime;

            var weekend=jQuery('input[name="weekend"]').val();
            alert(weekend);
            console.log(weekend);

            for(i=1;i<=no;i++){
        if(i==lunch_after){
            var rowcount=lunch_after+2;
            var a = start.split(':');
            var minutes = (+a[0]) * 60 + (+a[1]);
            var totalminutes=minutes+addedmin;
            var hours=(totalminutes/60);
            var finalhr=Math.floor(hours);
            var minutes = (hours - finalhr) * 60;
            var rminutes = Math.round(minutes);
            var finalmin=finalhr+':'+rminutes;
            $('#teacherheading').append('<td>'+start+'-'+finalmin+'</td>');
            var start=finalmin;

            var a = start.split(':');
            var minutes = (+a[0]) * 60 + (+a[1]);
            var totalminutes=minutes+Number(lunch_minute);

            var hours=(totalminutes/60);
            var finalhr=Math.floor(hours);
            var minutes = (hours - finalhr) * 60;
            var rminutes = Math.round(minutes);
            var finalmin=finalhr+':'+rminutes;
            $('#teacherheading').append('<td>'+start+'-'+finalmin+'</td>');
            var start=finalmin;

         }
     else{

            var a = start.split(':');
            var minutes = (+a[0]) * 60 + (+a[1]);
            var totalminutes=minutes+addedmin;
            var hours=(totalminutes/60);
            var finalhr=Math.floor(hours);
            var minutes = (hours - finalhr) * 60;
            var rminutes = Math.round(minutes);
            var finalmin=finalhr+':'+rminutes;
            $('#teacherheading').append('<td>'+start+'-'+finalmin+'</td>');
            var start=finalmin;
            }

            }

            for(i=0;i<=7;i++){
                     if(i==0){
                    //  if(weekend=='sunday'){
                    //     $('#teachertb').append('<tr class="tablerow"><td colspan="8">WeekEnd</td></tr>');
                    // }
                    // else{


                        $('#teachertb').append('<tr class="tablerow"><td><input type="text" name="day" value="Sunday" readonly></td></tr>');
                    // }

                    }
                 if(i==1){
                   $('#teachertb').append('<tr class="tablerow"><td><input type="text" name="day" value="Monday" readonly></td></tr>');

                }
                 if(i==2){
                    if(i==rowcount){

                    }
                    else{
                      $('#teachertb').append('<tr class="tablerow"><td><input type="text" name="day" value="Tuesday" readonly></td></tr>');
                    }

                }
                 if(i==3){
                   $('#teachertb').append('<tr class="tablerow"><td><input type="text" name="day" value="Wednesday" readonly></td></tr>');
                }
                 if(i==4){
                   $('#teachertb').append('<tr class="tablerow"><td><input type="text" name="day" value="Thursday" readonly></td></tr>');
                }
                 if(i==5){
                   $('#teachertb').append('<tr class="tablerow"><td><input type="text" name="day" value="Friday" readonly></td></tr>');
                }
                 if(i==6){
                    // if(weekend=='saturday'){
                    //     $('#teachertb').append('<tr class="tablerow"><td>WeekEnd</td></tr>');
                    // }
                    //     else{
                            $('#teachertb').append('<tr class="tablerow"><td><input type="text" name="day" value="Saturday"  readonly></td></tr>');
                        // }

                }

                 // $('#teachertb').append('<tr class="tablerow"></tr>');


            }
            for(i=0;i<no;i++){
                $('.tablerow').append('<td><select name="subectclass">@foreach($teachersubject as $subjects)<option value="{{$subjects->subject_name.'/'.$subjects->class_symbolic.'/'.$subjects->section_name}}">{{$subjects->subject_name.'/'.$subjects->class_symbolic.'/'.$subjects->section_name}}</option>@endforeach</select></td>');
            }





            debugger;
             // $('#teacherheading').append('');


        }


    </script>


@endsection