@extends('layouts.app')

@section('page_css')
    @parent

    <style>
        .tabulator .tabulator-tableHolder{
            overflow: unset !important;
        }        
        td:first-child , th:first-child  {
            position:sticky;
            left:0;
            z-index:1;
            background-color: white;

        }
        td:last-child, th:last-child {
            position:sticky;
            right:0;
            z-index:1;
            background-color: white;
        }
        thead tr th {
            position:sticky;
            top:0;
        }

        #meetings_links{
            position:sticky;
            left:0;
            z-index:1;
            background-color: white;            
        }
     
    </style>
@endsection

@section('theme_css')
@endsection
<!-- START @PAGE CONTENT -->

@section('content')

    <h2 class="intro-y text-lg font-medium mt-10">Meetings - Listing
        <div class="text-sm font-medium">Total {!! count($meetings) !!} Records</div>
    </h2>
    

    <div class="intro-y box p-5 mt-5">
       <!--  <div class="tab-pane active grid grid-cols-12 gap-y-8 gap-x-10"  role="tabpanel" aria-labelledby="weekly-report-tab">
            <div class="lg:col-span-12 sm:col-span-6 md:col-span-4 mb-5">
                <div class="text-slate-500">Cohort Name</div>
                <div class="mt-1.5 flex items-center">
                    <div class="text-base">{{ @$cohort_details["cohorts"]["cohort_name"] }}</div>
                </div>
            </div>
        </div>     -->    
        @php
            $rights_arr = explode(",",Auth::guard('admin')->user()->rights);
        @endphp
        
        <div class="overflow-x-auto scrollbar-hidden mt-5">
            <form id="startup-form" class="startup-form-level-1 sm:mr-auto" action="{!! route('admin.startups.changeStatus') !!}">
                <input type="hidden" name="previous_level" value="{!! @$level ?? _STARTUP_LEVEL_1 !!}">
                <input type="hidden" name="next_level" value="{!! _STARTUP_LEVEL_2 !!}">
                <div class="overflow-x-auto">
                    <table class="table">
                       <thead>
                          <tr>
                             {{-- <th class="border-b-2 dark:border-dark-5 whitespace-nowrap">S.No.</th> --}}
                             <th class="border-b-2 dark:border-dark-5 whitespace-nowrap">Topic</th>
                             <th class="border-b-2 dark:border-dark-5 whitespace-nowrap">Agenda</th>
                             <th class="border-b-2 dark:border-dark-5 whitespace-nowrap">Date of Meeting</th> 
                             <th class="border-b-2 dark:border-dark-5 whitespace-nowrap">Meeting Time</th>                      
                             <th class="border-b-2 dark:border-dark-5 whitespace-nowrap">Duration</th>
                             <th class="border-b-2 dark:border-dark-5 whitespace-nowrap">Time Zone</th>
                             <th class="border-b-2 dark:border-dark-5 whitespace-nowrap">Host Email</th>
                             <th class="border-b-2 dark:border-dark-5 whitespace-nowrap">Join</th>
                          </tr>
                       </thead>
                       <tbody>
                        @if(@$meetings)
                          @foreach($meetings as $_meetings)
                            @php
                                $meeting_duration=json_decode($_meetings['duration'],1);

                                $_meeting_date=strtok($_meetings['meeting_date_time'], " ");
                                $_meeting_time=strtok(" ");
                                $meeting_time=date('h:i a', strtotime($_meeting_time));
                                $meeting_date=date("d/m/Y", strtotime($_meeting_date));

                                $duration=json_decode($_meetings['duration'],1);
                                $meeting_date_time_in_seconds=strtotime($_meetings['meeting_date_time']);
                                $duration_in_seconds=(int)$duration['hour']*60*60+(int)$duration['min']*60;
                                $meeting_d_t_plus_duration_in_sec=$meeting_date_time_in_seconds+$duration_in_seconds;
                            @endphp
                            <tr>
                             <td class="border-b-2 dark:border-dark-5 whitespace-nowrap">{{ $_meetings['topic']}}</td>
                             <td class="border-b-2 dark:border-dark-5 whitespace-nowrap">{{ $_meetings['agenda']}}</td>
                             <td class="border-b-2 dark:border-dark-5 whitespace-nowrap">{{ $meeting_date}}</td>
                             <td class="border-b-2 dark:border-dark-5 whitespace-nowrap">{{ $meeting_time}}</td>
                             <td class="border-b-2 dark:border-dark-5 whitespace-nowrap">{{$meeting_duration['hour'] }} hr {{ $meeting_duration['min'] }} min</td>
                             <td class="border-b-2 dark:border-dark-5 whitespace-nowrap">{{ $_meetings['timezone']}}</td>
                             <td class="border-b-2 dark:border-dark-5 whitespace-nowrap">{{ $_meetings['host_email']}}</td>
                             <td class="border-b-2 dark:border-dark-5 whitespace-nowrap">
                                @if($meeting_date_time_in_seconds<=strtotime(date('Y-m-d H:i')) && strtotime(date('Y-m-d H:i'))<=$meeting_d_t_plus_duration_in_sec)
                                    <a class="btn btn-outline-primary py-1 px-2 mr-2" href="{{ $_meetings['start_url']}}">Start Meeting</a>
                                @elseif($meeting_date_time_in_seconds>strtotime(date('Y-m-d h:i')))
                                    <a class="btn btn-outline-primary py-1 px-2 mr-2" href="javascript:void(0)">Upcoming</a>
                                @else
                                    <a class="btn btn-outline-primary py-1 px-2 mr-2" href="javascript:void(0)">Expired</a>
                                @endif
                             </td>
                          </tr>
                          @endforeach
                        @else
                                <tr>
                                    <td class="border-b whitespace-nowrap text-danger" colspan="10">
                                        No Records Found...
                                    </td>
                                </tr>   
                        @endif
                       </tbody>
                    </table>

                    <!-- END: Pagination -->
                   {{-- <div id="meetings_links" class="intro-y col-span-12 flex flex-wrap sm:flex-row sm:flex-nowrap items-center">
                        <span  class="ml-5">{{ $meetings->links() }}</span>
                    </div>--}}
                    <!-- END: Pagination -->
                 </div>

            </form>
        </div>
    </div>

@endsection

@section('modals')
    @parent
@endsection

@section('plugin_scripts')

@endsection

@section('page_scripts')
    @parent
<script>
$(document).ready(function(){

    var isSucess=@JSON(session()->get('isSucess'));
    if(isSucess=='inserted')
        showMessage("inserted Sucessfully");

    if(isSucess=='updated')   
        showMessage("Updated Sucessfully");

    function showMessage(msg, type) 
    {
        if(type=='error'){
        cash("#error-notification-content").find('.error-message-section').html(msg);
            Toastify({
                node: cash("#error-notification-content")
                    .clone()
                    .removeClass("hidden")[0],
                duration: 1500,
                newWindow: true,
                close: true,
                gravity: "top",
                position: "center",
                stopOnFocus: true,
            }).showToast();
        }else{
            cash("#success-notification-content").find('.success-message-section').html(msg);
            Toastify({
                node: cash("#success-notification-content")
                    .clone()
                    .removeClass("hidden")[0],
                duration: 1500,
                newWindow: true,
                close: true,
                gravity: "top",
                position: "center",
                stopOnFocus: true,
            }).showToast();
        }
    }
});
</script>

    {{ Html::script(config('app.assets_url').'dist/js/startups/startup.js') }}
@endsection
<!--/ END PAGE CONTENT -->