@extends('layouts.site')

@section('content')
    <style>
        #session-end{
            fill: #f26b4d;
                background: #ff5c5c;
                border-radius: 10px;
                width: 100%;
                height: 44px;
                position: absolute;
                bottom: 0%;
                /* z-index: 999999999999999999; */
                right: 2px;
                border: none;
                padding: 10px 15px;
                color: #ffffff;
        }
    </style>
<section>
    <div class="lgx-banner lgx-banner-inner">
        <div class="lgx-inner-bg">
            <div class="lgx-inner">
                <div class="container bartopline">
                    <div class="row">
                    </div><!--//.ROW-->
                </div><!-- //.CONTAINER -->
            </div><!-- //.INNER -->
        </div>
    </div>
</section>




<div class="mt-5 mb-5">
    <div class="container">
        <div class="row">
            <div class="col-md-12">
                <div class="boxing bg-white border">
    <nav id="nav-tool" class="navbar navbar-inverse navbar-fixed-top">
        <div class="container">
            <input type="hidden" value="{{ ($type=='therapist')?1:0 }}" id="userHost">
            <input type="hidden" value="{{ \Illuminate\Support\Facades\Crypt::encryptString($session->id) }}" id="userPass">
            <input type="hidden" value="{{ $session->id }}" id="sessionID">
            
            @if(\Request::segment(1) == 'sessionVideo')

            @else
            <input type="hidden" value="{{ auth()->user()->name ? auth()->user()->name : '' }}" id="userName">
            <input type="hidden" value="{{ auth()->user()->email ? auth()->user()->email : '' }}" id="userEmail">
            @endif
           
            <input type="hidden" value="{{ $session->meeting_number }}" id="meetingNumber">
            <input type="hidden" value="{{ $session->password }}" id="meetingPassword">
            <div class="col-lg-12" style="padding: 100px 0px;">
                <p style="font-size: 20px;line-height: 35px;" class="text-center">
                    
                    @if(\Request::segment(1) == 'sessionVideo')
                    @else
                    {{trans('home.welcome')}}
                    {{ auth()->user()->name ? auth()->user()->name : '' }}
                    {{trans('home.thanks-use-new-hayah')}}
                    @endif

                    <span class="d-none" id="counter-down" data-now="{{ $session->start_time }}" data-date="{{ date('Y-m-d H:i:s',strtotime($session->start_time.'+'.(in_array($session->type,[3,30,10])?$session->type+7:$session->type+15).' minutes')) }}"></span>
                </p>
                <div id="session-message" style="height: 45px"></div>


                <!-- @if(\Request::segment(1) == 'sessionVideo')

                @else
                <div class="form-group text-center mt-5 " id="agreement_secret_notice" @if(hasAgreement($session->visitor_id,$session->therapist_id,$type)) style="display: none" @endif>
                    <div class="form-check">
                        <input type="checkbox" class="form-check-input mx-2 agreement_secret_notice" id="agreement_therapist_secret_notice"  value="1" name="agreement">
                        <label class="mx-5" for="exampleCheck1">
                            {{trans('home.agreement-notice')}}
                            <a target="_blank" href="{{  config('app.locale') == "ar" ?  url('الموافقة_المستنيرة_لاخطار_السرية') : url('en/Secrets_of_confidentiality')  }}">هنا</a>
                        </label>
                    </div>
                </div>
                @endif -->


                <!-- @if(\Request::segment(1) == 'sessionVideo') -->
                
<!--                 @else
                <div class="text-center" id="start_session_after_agreement" @if(!hasAgreement($session->visitor_id,$session->therapist_id,$type)) style="display: none" @endif>
                @endif -->
                    
                <div class="text-center" id="start_session_after_agreement">
                    @if(startSessionButton($session,$type))
                        

                        @if(($session->meeting_provider=='zoom'))
                            <a href="{{ ($type=='therapist')?$session->start_url:$session->join_url }}" target="_blank" style="margin-top: 15px;font-size: 15px;font-weight: bold;padding: 10px 20px;" class="startTherapist btn btn-primary">{{trans('home.start')}}</a>
                        @else


                            <!-- @if(\Request::segment(1) == 'sessionVideo')
                            <a href="{{url('/')}}" id="session-end">

                              زرار  إنهاء الجلسة الخاص بالموقع
                            </a>
                            @else
                            <a href="{{ ($type=='therapist'?route('therapists_sessions'):route('rate_session',$session->id)) }}" id="session-end">

                              زرار  إنهاء الجلسة الخاص بالموقع
                            </a>
                            @endif -->


                        @if($session->whereby_roomUrl)

                            @if(\Request::segment(1) == 'sessionVideo')
                                <iframe src="{{ ($type=='therapist')?$session->whereby_roomUrl:$session->whereby_roomUrl }}?embed&leaveButton=on&video=off&audio=on&displayName={{ $session->id }}&participantCount=off&screenshare=on&people=off&chat=on&lang=en" allow="camera;microphone; fullscreen; speaker; display-capture" style="width: 100%;min-height: 500px;"></iframe>
                            @else
                                <iframe src="{{ ($type=='therapist')?$session->whereby_roomUrl:$session->whereby_roomUrl }}?embed&leaveButton=on&video=off&audio=on&displayName={{ auth()->user()->name}}&participantCount=off&screenshare=on&people=off&chat=on&lang=en" allow="camera;microphone; fullscreen; speaker; display-capture" style="width: 100%;min-height: 500px;"></iframe>

                            @endif
                          
                        @endif
                        @endif
                       
                    @else
                        @if(\Carbon\Carbon::create($session->start_time->format('Y-m-d H:i:s'))>\Carbon\Carbon::now())
                            <h3> {{trans('home.session-not-started')}} </h3>
                        @elseif(!\Carbon\Carbon::now()->between(\Carbon\Carbon::create($session->start_time->format('Y-m-d H:i:s')),\Carbon\Carbon::create($session->start_time->format('Y-m-d H:i:s'))->add(((in_array($session->type,[30,3,10]))?$session->type:$session->type).' minutes')))
                            <h3> {{trans('home.session-is-End')}}   </h3>
                        @elseif(!$session->therapist_start)
                            <h3> {{trans('home.Therapist not started session yet')}}   </h3>
                        @endif
                    @endif

                </div>
            </div>
            <!--/.navbar-collapse -->
        </div>
    </nav>
                    <div id="zmmtg-root"></div>

                </div>
            </div>
        </div>
    </div>
</div>
@endsection
@section('scriptSection')
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery.countdown/2.0.3/jquery.countdown.min.js"></script>
    {{--<script src="https://source.zoom.us/1.8.0/lib/vendor/react.min.js"></script>
    <script src="https://source.zoom.us/1.8.0/lib/vendor/react-dom.min.js"></script>
    <script src="https://source.zoom.us/1.8.0/lib/vendor/redux.min.js"></script>
    <script src="https://source.zoom.us/1.8.0/lib/vendor/redux-thunk.min.js"></script>
    <script src="https://source.zoom.us/1.8.0/lib/vendor/jquery.min.js"></script>
    <script src="https://source.zoom.us/1.8.0/lib/vendor/lodash.min.js"></script>

    <script src="https://source.zoom.us/zoom-meeting-1.8.0.min.js"></script>
    <script src="{{asset('zoom/js/tool.js')}}"></script>
    <script src="{{asset('zoom/js/vconsole.min.js')}}"></script>
    <script src="{{asset('zoom/js/index.js')}}"></script>--}}
    <script>


        $(document).ready(function(){
             @if(\Request::segment(1) == 'sessionVideo')

              token= '{{ csrf_token() }}';
                $.ajax({
                    type: "POST",
                    url: "{{ route('sessionStartForMobile',[Request::segment(4),$session->id]) }}",
                    data: {_token:token},
                    success: function (msg) {
                        if(msg.success){
                           console.log('Session Start');
                        }
                    }
                });

             @else

                token= '{{ csrf_token() }}';
                $.ajax({
                    type: "POST",
                    url: "{{ route('session_start',$session->id) }}",
                    data: {_token:token},
                    success: function (msg) {
                        if(msg.success){
                           console.log('Session Start');
                        }
                    }
                });

             @endif

        });

        
            // setTimeout(function(){
            //     @if($session->session_status == 'closed')
            //         window.location.reload(1);
            //     @endif
            // }, 500);
        

        $(document).on('click','#session-end',function(e){

            @if(\Request::segment(1) == 'sessionVideo')


                @if($session->session_status == 'closed')
                    window.location.href='{{ url("/") }}';
                @else
                href=$(this).attr('href');
                token= '{{ csrf_token() }}';
                $.ajax({
                    type: "POST",
                    url: "{{ route('sessionEndForMobile',[Request::segment(4),$session->id]) }}",
                    data: {_token:token},
                    success: function (msg) {
                        if(msg.success){
                            window.location.href='{{ url("/") }}';
                        }
                    }
                });
                @endif


            @else

                @if($session->session_status == 'closed')
                    window.location.href='{{ url("/") }}';
                @else
                //e.preventDefault();
                href=$(this).attr('href');
                token= '{{ csrf_token() }}';
                $.ajax({
                    type: "POST",
                    url: "{{ route('session_end',$session->id) }}",
                    data: {_token:token},
                    success: function (msg) {
                        if(msg.success){
                            window.location.href='{{ url("/") }}';
                        }
                    }
                });
                @endif

            @endif

        });


        $("#counter-down").countdown( $("#counter-down").attr('data-date'), function(event) {
            secounds=(parseInt(event.strftime('%H'))*60*60)+(parseInt(event.strftime('%M'))*60)+(parseInt(event.strftime('%S')));
            // if(session_id==6237){
            //     console.log((event.strftime('%D')*24*60*60),(event.strftime('%H')*60*60),(event.strftime('%M')*60),(event.strftime('%S')))
            //     console.log('15 minits check',secounds,(15*60),secounds<=(15*60),"#start-btn-"+session_id)
            // }

            // if(secounds<=(15*60)){
            //     $("#start-btn-"+session_id).removeClass('d-none');
            // }
            // if(session_id==6237) {
            //     console.log('8 hours check',secounds,(8*60*60),secounds<(8*60*60),"#start-btn-"+session_id)
            // }
            /*if(secounds<(8*60*60)){
                $("#cancel-btn-"+session_id).addClass('d-none');
            }*/
            @if(in_array($session->type,[30,3,10]))
                if(secounds<=10*60&&secounds>=1*60){
                    $("#session-message").html('@lang('home.This session will be ended after') '+event.strftime('%M')+' @lang('home.Minutes')').addClass('alert alert-info');

                }
            @else
                if(secounds<=15*60&&secounds>=1*60){
                $("#session-message").html('@lang('home.This session will be ended after') '+event.strftime('%M')+' @lang('home.Minutes')').addClass('alert alert-info');
                }
            @endif
                if(secounds<1*60){
                $("#session-message").html('@lang('home.This session will be ended after less than a minute')').addClass('alert alert-info');
            }
               // console.log(secounds);
                if(secounds==0||!secounds||secounds=='0'){
                    $("#session-message").html('@lang('home.This session has been end')').addClass('alert alert-info');

                    // setTimeout(function(){
                    //     window.location.href='/';
                    // }, 2000);


                // href=$("#session-end").attr('href')
                //     $("#session-message").html('').removeClass('alert alert-info')
                // if(href){
                //     $("#counter-down").remove();
                //     $("#start_session_after_agreement iframe").remove();
                //     window.location.href=href;
                // }


            }
            $(this).text(
                event.strftime('%D:%H:%M:%S')

            );
        });
        $(document).on('click','.startTherapist',function(){
            token= '{{ csrf_token() }}';
            $.ajax({
                type: "POST",
                url: "{{ route('session_therapist_start',$session->id) }}",
                data: {_token:token},
                success: function (msg) {
                }
            });
        });

        $(document).on('change', '#agreement_therapist_secret_notice', function () {
            token = '{{ csrf_token() }}';
            var value = $(this).attr('value');
            var session_id =  $("#sessionID").val();
            var statues=$(this).is(':checked');
            // console.log(session_id);
            if(statues)
            {
                $.ajax({
                    type: "POST",
                    url: "{{route('agreement-therapist-secret-notice')}}",
                    data: {"value": value,"id":session_id,_token:token},
                    success: function (msg) {
                        console.log(msg);
                        $("#agreement_secret_notice").css({'display':'none'});
                        $("#start_session_after_agreement").css({'display':'block'});
                    }
                });
                @if($type=='therapist')
                $.ajax({
                    type: "POST",
                    url: "{{ route('session_therapist_start',$session->id) }}",
                    data: {_token:token},
                    success: function (msg) {
                    }
                });
                @endif

            }

        });



        setInterval(function(){

            $.ajax({
                type: "POST",
                url: "{{ route('checkStatusOfSession',$session->id) }}",
                success: function (response) {
                    if(response.data == 'closed')
                    {
                        window.location.href='{{url("/")}}';
                        //console.log(response.data)
                    }
                }
            });
            

        }, 15000);


    </script>
@endsection