@extends('index')
@php
    $title = $data['display_name']. ' Cams | ' . $title_global;
@endphp
@section('title',$title)
@section('content')
    <div class="content-inner">
        <div class="row mb-50">
            <div class="col-sm-5 col-lg-4">
                <div class="info-model">
                    <div class="avarta-model">
                        <div class="img-cover" style="background-image:url('{{ $data['image'] }}')">
                            <img src='{{ $data['image'] }}'>
                        </div>
                        <span>
                            <div title="Click to add model to favorites" class="favourite"  data-url="{{ route('attachFavourite',$data['id']) }}" data-model-id="{{ $data['id'] }}">
                                <div class="detail-favorites  {{ ($data['favourite'] ? 'active' : '') }}">
                                    {{ __('Live Sex Cam with') }} {{ $data['display_name'] }}
                                    <i class="fas fa-heart "></i>
                                </div>
                            </div>
                        </span>
                    </div>
                    <div class="ac-model">
                        <p>
                            @if($data->age)
                                <span>{{ __('Age') }}</span>
                                {{ $data->age }}
                            @elseif($data['source'] == \App\Models\Config::CHATURBATE)
                                <span>{{ __('Followers') }}</span>
                                {{ getDataInJson($data,'num_followers') }}
                            @elseif($data['source'] == \App\Models\Config::STRIP_CASH)
                                <span>{{ __('Favorited Count') }}</span>
                                {{ getDataInJson($data,'favoritedCount') }}
                            @endif
                        </p>
                        <p>
                            <span>{{ __('Gender') }} </span>
                            {{ Str::title($data->gender) }}
                        </p>
                    </div>
                    <div class="des-model">
                        <p>
                            {{ $data->description }}
                        </p>
                        <a href="{{ $data['chat_url'] }}" class="btn btn-danger btn-lg btn-block">Start Live Sex Show with {{ $data['display_name'] }}</a>
                    </div>
                </div>
            </div>
            <div class="col-sm-7 col-lg-8">
                <div class="item-model ad-model model-big">
                    @if($data['is_online'])
                        <div class="img-cover">
                            {!!  handleLiveChat($data) !!}
                        </div>
                    @elseif($data['source'] == \App\Models\Config::CHATURBATE)
                        <div class="img-cover chaturbate" style="background-image:url('{{ asset($logo_global) }}')">
                            <img src='{{ asset($logo_global) }}'>
                        </div>
                    @else
                        <div class="img-cover" style="background-image:url('{{ $data['image'] }}')">
                            <img src='{{ $data['image'] }}'>
                        </div>
                    @endif
                    <div class="txt-ad-model">
                        <h3>{{ $data['display_name'] }}</h3>
                        @if($data->is_online)
                            <div class="live-m">Live</div>
                        @endif
                    </div>
                    {{--<span class="mute"><i class="fas fa-volume-mute"></i></span>--}}
                </div>
            </div>
        </div>

        <div class="al-txt">Do you like {{ $data['display_name'] }}'s sexcam? You will also like...</div>
        <div class="grid">
            @foreach($related as $model)
                @include('components.view-model')
{{--                <div class="grid-item">--}}
{{--                <a href="{{  route('detailPage',['id' => $itemRelated['id'] ]) }}" class="item-model">--}}
{{--                    <div class="img-cover" style="background-image:url('{{ $itemRelated['image'] }}')">--}}
{{--                        <img src='{{ $itemRelated['image'] }}'>--}}
{{--                    </div>--}}
{{--                    <div class="txt-model favourite" data-url="{{ route('attachFavourite',$itemRelated['id']) }}" data-model-id="{{ $itemRelated['id'] }}">--}}
{{--                        <h3 class="status {{ ($itemRelated['is_online']) ? 'online' : 'offline' }}">{{ $itemRelated['display_name'] }}</h3>--}}
{{--                        <div class="fav-model {{ ($itemRelated['favourite'] ? 'active' : '') }}">--}}
{{--                            <span>90%</span>--}}
{{--                            <i class="fas fa-heart"></i>--}}
{{--                        </div>--}}
{{--                    </div>--}}
{{--                </a>--}}
{{--            </div>--}}
            @endforeach
        </div>

    </div>

@endsection

@push('scripts')
    <script src="{{ asset('js/player.js') }}"></script>
{{--    <script>--}}
{{--        var canvasRef = document.getElementById('myCanvas');--}}
{{--        var modelId = "{{$data['model_id']}}";--}}
{{--        var modelToken = "{{ $data['json_data']->token }}";--}}
{{--        var modelSnapshotServer = "{{ $data['json_data']->snapshotUrl }}";--}}
{{--        var player;--}}

{{--        // $('[data-model-item]').hover(--}}
{{--        $('#myCanvas').click(--}}
{{--            function () {--}}
{{--                player = (new StripchatPlayer())--}}
{{--                    .setCanvasRef(canvasRef)--}}
{{--                    .setModelId(modelId)--}}
{{--                    .setModelToken(modelToken)--}}
{{--                    .setModelSnapshotServer(modelSnapshotServer)--}}
{{--                    .mount();--}}
{{--            },--}}
{{--            function () {--}}
{{--                player.unmount();--}}
{{--            }--}}
{{--        );--}}
{{--    </script>--}}
    <script>
        $(".start-live").click(function () {
            var url = $(this).data('href');
            window.open(url, '_blank');
        });
    </script>
@endpush