@extends('edufair.layouts.master')
@section('content')
    <main id="main-container">
        <div class="bg-light">
            <div class="content">
                <div class="py-3 text-center" id="heading_ti_adn">
                    <h1 class="font-w700 mb-4 text-uppercase" id="f_ad_ne_main_title">
                        Take Virtual Tour
                    </h1>
                </div>
                <div class="row">
                    @foreach ($platinums as $college)
                    <div class="col-lg-6">
                        <div class="block block-rounded">
                            <div class="block-content p-0 overflow-hidden">
                                <div class="row no-gutters">
                                    <div class="col-md-4 col-lg-4 overflow-hidden d-flex align-items-center">
                                        <a href="{{$college->user->name}}" target="_blank">
                                            @if(isset($college->featured_image))

                                                @php
                                                    $url = config('filesystems.asset').'/'.'clients'.'/'.$college->user->name.'/featured_image'.'/'.$college->featured_image;
                                                    $uploadedFile = pathinfo($url);
                                                    $old_filename = $uploadedFile['filename'];
                                                    $extension = $uploadedFile['extension'];
                                                    $imageLink = config('filesystems.asset').'/'.'clients'.'/'.$college->user->name.'/featured_image'.'/'.$old_filename.'.webp';
                                                @endphp

                                                <picture>
                                                    <source type="image/webp" srcset="{{$imageLink}}">
                                                    <source type="image/{{$extension}}" srcset="{{$url}}">
                                                    <img class="img-fluid img-link" src="{{$url}}" alt="{{$college->company_name}}">
                                                </picture>
                                            @endif
                                        </a>
                                    </div>                                   
                                    <div class="col-md-8 col-lg-8 d-flex align-items-center">
                                        <div class="px-2 py-2">
                                            <p class="mb-1">
                                                <a class="text-primary-dark font-w700" href="{{$college->user->name}}">
                                                    {{$college->company_name}}
                                                </a>
                                                </p>
                                            <p class="mb-2">
                                                @if(isset($college->district->name)){{$college->district->name}}, @endif @if(isset($college->city->name)){{$college->city->name}}, @endif {{$college->location}}
                                            </p>
                                            <a href="{{$college->tour->tour_link}}" target="_blank" class="btn btn-primary btn-sm">Virtual Tour</a>
                                            <a href="{{$college->user->name}}" class="btn btn-primary btn-sm">Visit College</a>
                                        </div>
                                    </div>
                                    
                                </div>
                            </div>
                        </div>
                    </div>
                    @endforeach
                    @foreach ($golds as $college)
                    <div class="col-lg-6">
                        <div class="block block-rounded">
                            <div class="block-content p-0 overflow-hidden">
                                <div class="row no-gutters">
                                    <div class="col-md-4 col-lg-4 overflow-hidden d-flex align-items-center">
                                        <a href="{{$college->tour->tour_link}}" target="_blank">
                                            @if(isset($college->featured_image))

                                                @php
                                                    $url = config('filesystems.asset').'/'.'clients'.'/'.$college->user->name.'/featured_image'.'/'.$college->featured_image;
                                                    $uploadedFile = pathinfo($url);
                                                    $old_filename = $uploadedFile['filename'];
                                                    $extension = $uploadedFile['extension'];
                                                    $imageLink = config('filesystems.asset').'/'.'clients'.'/'.$college->user->name.'/featured_image'.'/'.$old_filename.'.webp';
                                                @endphp

                                                <picture>
                                                    <source type="image/webp" srcset="{{$imageLink}}">
                                                    <source type="image/{{$extension}}" srcset="{{$url}}">
                                                    <img class="img-fluid img-link" src="{{$url}}" alt="{{$college->company_name}}">
                                                </picture>
                                            @endif
                                        </a>
                                    </div>
                                    <div class="col-md-8 col-lg-8 d-flex align-items-center">
                                        <div class="px-2 py-2">
                                            <p class="mb-1">
                                                <a class="text-primary-dark font-w700" href="">
                                                    {{$college->company_name}}
                                                </a>
                                                </p>
                                            <p class="mb-2">
                                                @if(isset($college->district->name)){{$college->district->name}}, @endif @if(isset($college->city->name)){{$college->city->name}}, @endif {{$college->location}}
                                            </p>
                                            <a href="{{$college->tour->tour_link}}" target="_blank" class="btn btn-primary btn-sm">Virtual Tour</a>
                                            <a href="{{$college->user->name}}" class="btn btn-primary btn-sm">Visit College</a>
                                        </div>
                                    </div>

                                </div>
                            </div>
                        </div>
                    </div>
                    @endforeach
                    @foreach ($silvers as $college)
                    <div class="col-lg-6">
                        <div class="block block-rounded">
                            <div class="block-content p-0 overflow-hidden">
                                <div class="row no-gutters">
                                    <div class="col-md-4 col-lg-4 overflow-hidden d-flex align-items-center">
                                        <a href="{{$college->tour->tour_link}}" target="_blank">
                                            @if(isset($college->featured_image))

                                                @php
                                                    $url = config('filesystems.asset').'/'.'clients'.'/'.$college->user->name.'/featured_image'.'/'.$college->featured_image;
                                                    $uploadedFile = pathinfo($url);
                                                    $old_filename = $uploadedFile['filename'];
                                                    $extension = $uploadedFile['extension'];
                                                    $imageLink = config('filesystems.asset').'/'.'clients'.'/'.$college->user->name.'/featured_image'.'/'.$old_filename.'.webp';
                                                @endphp

                                                <picture>
                                                    <source type="image/webp" srcset="{{$imageLink}}">
                                                    <source type="image/{{$extension}}" srcset="{{$url}}">
                                                    <img class="img-fluid img-link" src="{{$url}}" alt="{{$college->company_name}}">
                                                </picture>
                                            @endif
                                        </a>
                                    </div>
                                    <div class="col-md-8 col-lg-8 d-flex align-items-center">
                                        <div class="px-2 py-2">
                                            <p class="mb-1">
                                                <a class="text-primary-dark font-w700" href="">
                                                    {{$college->company_name}}
                                                </a>
                                                </p>
                                            <p class="mb-2">
                                                @if(isset($college->district->name)){{$college->district->name}}, @endif @if(isset($college->city->name)){{$college->city->name}}, @endif {{$college->location}}
                                            </p>
                                            <a href="{{$college->tour->tour_link}}" target="_blank" class="btn btn-primary btn-sm">Virtual Tour</a>
                                            <a href="{{$college->user->name}}" class="btn btn-primary btn-sm">Visit College</a>
                                        </div>
                                    </div>

                                </div>
                            </div>
                        </div>
                    </div>
                    @endforeach
                </div>
            </div>
        </div>
        @section('after_js')
    @if(!(\Illuminate\Support\Facades\Auth::check()))
    <script type="text/javascript">
        $(window).on('load',function(){
            $('#myModal').modal('show');
        });
    </script>
    @endif
    @endsection
        <style>
            ul.number li {
                list-style: decimal;
            }

            #timer {
                font-size: 3em;
                font-weight: 700;
                color: #fff;
                //   text-shadow: 0 0 20px #48c8ff;
            }

            #timer div {
                display: inline-block;
                min-width: 90px;
                border: 2px dotted #ddd;
                text-align: center;
                padding: 0 5px;
                border-radius: 10px;
                margin: 0 5px;
            }

            #timer div span {
                color: #fff;
                display: block;
                font-size: 1rem;
                font-weight: 500;
            }

            .text-jobfair {
                color: #c91015 !important;
            }

            // breadcomes
            .bg-gd-white-op-rl {
                background: linear-gradient(175deg, #bb0005 0%, rgba(158, 6, 6, 0.97) 30%, #c91015 70%, rgb(171 0 0) 100%);
            }

            .q_sponsor_imgg img {
                /* max-width: 100%; */
                /* height: 120px; */
                padding: 20px;
                /* object-fit: cover; */
            }

            .q_sponsor_imgg {
                border: 1px solid #ddd;
            }

        </style>
        <script>
            function updateTimer() {
                future = Date.parse("november 16, 2021 16:40:00");
                now = new Date();
                diff = future - now;

                days = Math.floor(diff / (1000 * 60 * 60 * 24));
                hours = Math.floor(diff / (1000 * 60 * 60));
                mins = Math.floor(diff / (1000 * 60));
                secs = Math.floor(diff / 1000);

                d = days;
                h = hours - days * 24;
                m = mins - hours * 60;
                s = secs - mins * 60;

                document.getElementById("timer")
                    .innerHTML =
                    '<div>' + d + '<span>DAYS</span></div>' +
                    '<div>' + h + '<span>HRS</span></div>' +
                    '<div>' + m + '<span>MIN</span></div>' +
                    '<div>' + s + '<span>SEC</span></div>';
            }
            setInterval('updateTimer()', 1000);

        </script>

    @endsection