@extends('layouts.master2')
@section('scriptDataLayer')
    <script>smartech('dispatch', 'detail deals', {dealsurl: '{{ url()->current() }}', dealstitle: '{{ $deals->name }}', dealsmerchant: '{{ $deals->merchant_name }}'}) ;</script>
    <script>smartech('dispatch', 'open regular deal', {dealid: {{ $deals->id }} }) ;</script>
@endsection

@section('meta')
    <meta property="og:type" content="article" />
    <meta property="og:image" content="{{ $deals->image }}" />
    <meta property="og:title" content="{{ $deals->name}}" />
    <meta property="og:description" content="{{ $deals->name}}" />
    <meta property="og:url" content="{{ Request::url() }}" />
    <meta property="og:site_name" content="Giladiskon.com" />
@endsection

@section('pageHeader')
<div class="bg-gd-primary d-block d-md-none py-3" v-sticky>
    <div class="container">
        <div class="row align-items-center">
            <div class="col-2">
                <a href="{{ url('/') }}">
                    <i class="fa fa-arrow-left text-white cursor-pointer"></i>
                </a>
            </div>
            <div class="col-10 pl-0">
                <div class="text-white wrapper-text-elipsis">
                    <span>{{ $deals->name }}</span>
                </div>
            </div>
        </div>
    </div>
</div>
@endsection

@section('loginMobile')
    @if(!$userDetails && !$wasRemoveSignIn)
        <signin :close_able="true"></signin>
    @endif
@show
@section('canonical')
    @if (env('APP_ENV') == "production")
        <link href="{{ 'https://www.giladiskon.com/deals/'.$deals->slug }}" rel="canonical">
    @elseif (env('APP_ENV') == "development")
        <link href="{{ 'https://dev.giladiskon.com/deals/'.$deals->slug }}" rel="canonical">
    @else
        <link href="{{ URL::to('/').'/deals/'.$deals->slug }}" rel="canonical">
    @endif
@endsection
@if (!empty($seo)) 
    @if (!empty($seo->meta_title)) @section('title', $seo->meta_title ) @endif
    @if (!empty($seo->meta_description)) @section('meta_description', $seo->meta_description ) @endif
    @if (!empty($seo->meta_keyword)) @section('meta_keyword', $seo->meta_keyword ) @endif
@else
    @section('title', $deals->name)
@endif

@section('content')
<div>
    <div class="d-block d-md-none gd-voucher-detail-slider gd-slider">
        @if (!empty($deals->discount))
            <div class="discount-label right">
                <span class="h4">{{ $deals->discount }}%</span>
            </div>
        @endif
        @if (count($deals->images) > 0)
            @foreach($deals->images as $img) 
            <div class="item-box">
                <img v-gallery:dealsDetailMobile src="{{ $img->image_url }}" alt="{{ $deals->name }}" class="img-fluid">
            </div>
            @endforeach
        @else
            <img v-gallery:dealsDetailMobile src="{{ $deals->image }}" alt="{{ $deals->name }}" class="img-fluid">             
        @endif
        
        @if(isset($deals->giveaway_ID))
            <div class="giveaway_icon">
                @php
                    $giveawayUrl = url('giveaway?giftId='.$deals->giveaway_ID);
                    if($user) {
                        $giveawayUrl = url('giveaway/bridge?giftId='.$deals->giveaway_ID);
                    }
                @endphp
                @if ($user)
                    <a href="{{ !isset($deals->giveaway_URL) ? $deals->giveaway_URL : $giveawayUrl }}" target="blank">
                        <img src="{{ $deals->giveaway_Icon }}" alt="Giladiskon Giveaway">
                    </a>
                @else
                    <login-button>
                        <template v-slot:button>
                            <img src="{{ $deals->giveaway_Icon }}" alt="Giladiskon Giveaway">
                        </template>
                    </login-button>
                @endif
            </div>
        @endif
    </div>
    <div class="container py-md-5 deals-detail">
        <div class="row">
            <div class="col-12 col-md-6 d-none d-md-block">
                <div class="gd-voucher-detail-slider gd-slider">
                    @if(!empty($deals->discount))
                        <div class="discount-label right">
                            <span class="h4">{{ $deals->discount }}%</span>
                        </div>
                    @endif
                    @if (count($deals->images) > 0)
                        @foreach($deals->images as $img)
                        <div class="item-box">
                            <img  v-gallery:dealsDetailDesktop src="{{ $img->image_url }}" alt="{{ $deals->name }}" class="img-fluid">
                        </div>
                        @endforeach
                    @else
                        <img v-gallery:dealsDetail src="{{ $deals->image }}" alt="{{ $deals->name }}" class="img-fluid w-100">
                    @endif
                    @if(isset($deals->giveaway_ID))
                        <div class="giveaway_icon">
                            @php
                                $giveawayUrl = url('giveaway?giftId='.$deals->giveaway_ID);
                                if($user) {
                                    $giveawayUrl = url('giveaway/bridge?giftId='.$deals->giveaway_ID);
                                }
                            @endphp
                            @if ($user)
                                <a href="{{ !isset($deals->giveaway_URL) ? $deals->giveaway_URL : $giveawayUrl }}" target="blank">
                                    <img src="{{ $deals->giveaway_Icon }}" alt="Giladiskon Giveaway">
                                </a>
                            @else
                                <login-button>
                                    <template v-slot:button>
                                        <img src="{{ $deals->giveaway_Icon }}" alt="Giladiskon Giveaway">
                                    </template>
                                </login-button>
                            @endif
                        </div>
                    @endif
                </div>
            </div>
            <div class="col-12 col-md-6">
                <div class="h-100 bg-white summary">
                    <div class="p-md-3 pt-md-4 border-bottom">
                        <div class="row">
                            <div class="col-12 col-md-10">
                                <div class="pt-3 pt-md-0"><h5>{{ $deals->name }}</h5></div>
                                <div class="text-gd-primary font-weight-bold gd-font-sm">Berlaku Hingga : {{ date('d F Y', strtotime($deals->expired_date)) }}</div>
                                <div class="text-gd-grey">
                                    <like-info :deals="{{ json_encode($deals) }}" @if($user) {{ 'logged_in' }} @endif clickable></like-info>&nbsp;&nbsp;
                                    <comment-info :deals="{{ json_encode($deals) }}" @if($user) {{ 'logged_in' }} @endif :username="@if($user) {{ json_encode($user->full_name) }} @else {{ 'null' }} @endif" clickable></comment-info>
                                </div>
                            </div>
                            <div class="col-2 d-none d-md-block">
                                {{-- <img src="{{ asset('img/icon/ic_fav.svg') }}" alt="add to favorite" class="ic-favorit"> --}}
                                @if($user) 
                                    <favorit-icon :status="{{ $deals->is_favourite }}" :dealsid="{{ $deals->id }}" :type="'deals'"></favorit-icon>
                                @endif
                            </div>
                            @if ($deals->coupon_code)
                            <div class="col-12">
                                <coupon-code :code="{{ json_encode($deals->coupon_code) }}"></coupon-code>
                            </div>
                            @endif
                        </div>
                    </div>
                    @if (!empty($deals->start_price) && !empty($deals->final_price))
                    <div class="row">
                        <div class="col-12">
                            <div class="py-2 px-md-3">
                                <strike class="text-gd-grey">{{ 'Rp '.number_format($deals->start_price, 0, ",", ".") }}</strike>&nbsp;&nbsp;<span class="font-weight-bold h5 text-gd-primary">{{ 'Rp '. number_format($deals->final_price, 0, ",", ".") }}</span>
                            </div>
                        </div>
                    </div>
                    @endif
                    {{-- <div class="py-3 p-md-3 d-none d-md-block">
                        <div class="row">
                            <div class="col-12">
                                <div>
                                    <div class="gd-font-md font-weight-bold">Tentang Deals</div>
                                    <div class="gd-font-sm">
                                        <read-more
                                            :article_data="{{ json_encode($deals->description) }}"
                                            :max_chars="200">
                                        </read-more>
                                    </div> 
                                </div>
                            </div>
                        </div> </div> --}}
                        @if($deals->url != "" && $deals->url != "https://www.giladiskon.com/")
                        <div class="row">
                            <div class="col-12">
                                @if ($deals->expired_date > \Carbon\Carbon::now())
                                    <div class="btn-use-voucher mt-3">
                                        <a href="{{ setProperUrl($deals->url) }}" onclick="gdTrack({object_type_id: 1, object_id: {{ json_encode($deals->id) }}, action_id: 10, content: {{ json_encode($deals->url) }}, referrer: {{ json_encode(url()->current()) }} })" target="_blank" class="btn btn-block bg-gd-primary text-white p-3" id="btn-shop-now">Belanja Sekarang</a>
                                    </div>
                                @else
                                    <div class="btn-use-voucher mt-3">
                                        <span class="btn btn-block bg-gd-grey text-white p-3">Expired</span>
                                    </div>
                                @endif
                            </div>
                        </div>
                        @endif
                    <div class="pt-3 p-md-3 border-top">
                        <div class="row">
                            <div class="col-12 align-items-end">
                                <share 
                                    :share_url="'{{ url('deals/'. $deals->slug) }}'"
                                    :share_message="'{{ str_replace("'", "\'", $deals->name) }}'"
                                    :deals_id="{{ $deals->id }}">
                                </share>
                            </div>
                        </div>
                    </div>
                    @if ($deals->tags) 
                    <div class="py-3 p-md-3 border-top">
                        <div class="row">
                            <div class="col-12">
                                <tags :tag_lists="{{ json_encode($deals->tags) }}" :type="'deal'"></tags>
                            </div>
                        </div>
                    </div>
                    @endif
                </div>
            </div>
        </div>
    </div>
    @if(!empty($deals->merchant_id)) 
    <div class="d-block d-md-none bg-white border-bottom py-3">
        <div class="container">
            <div class="row">
                <div class="col-3">
                    <img src="{{ $deals->merchant_image }}" alt="{{ $deals->merchant_name }}" class="img-fluid">
                </div>
                <div class="col-9">
                    <div class="font-weight-bold">{{ ucfirst($deals->merchant_name) }}</div>
                    <a href="{{ url('merchant/'.$deals->merchant_slug) }}" class="text-gd-primary">Merchant Detail</a>
                </div>
            </div>
        </div>
    </div>
    @endif
    {{-- <div class="d-block p-3 d-md-none bg-white">
        <div class="row">
            <div class="col-12">
                <div>
                    <div class="gd-font-md font-weight-bold">Tentang Deals</div>
                    <div class="gd-font-sm">{!! $deals->description !!}</div>
                </div>
            </div>
        </div>
    </div> --}}
    <div class="container">
        <div class="row">
            <div class="col-12">
                <div class="my-3">
                    <banner-slider :pos="2"></banner-slider>
                </div>
            </div>
        </div>
    </div>

    @if (isset($deals->description))
    <div class="container bg-white my-3 py-3">
        <div class="row">
            <div class="col-12">
                <div class="gd-font-md font-weight-bold">Tentang Deals</div>
            </div>
            <div class="col-12">
                <div class="gd-font-sm">
                    {{-- @if (strlen(trim(strip_tags($deals->description))) > 250)
                        {{ Str::limit(trim(strip_tags($deals->description)), 250, '') }}
                        <span id="dots">...</span>
                        <span id="more">{{ substr(trim(strip_tags($deals->description)), 200) }}</span>
                        <a onclick="show_full_desc()" href="javascript:void(0)" id="show_more" class="stretched-link">read more</a>
                    @else 
                       
                    @endif --}}
                    {!! $deals->description !!}
                </div>
            </div>
        </div>
    </div>
    @endif

    {{-- <div class="container bg-white my-3 py-3">
        <div class="row align-items-center mt-2 mb-3">
            <div class="col-8">
                <div class="row align-items-center">
                    <div class="col-12 col-md-auto">
                        <h5 class="mb-0">Komentar</h5>
                    </div>
                </div>
            </div>
        </div>
        <div class="row">
            <div class="col-12">
                <comment-list-detail-page 
                    :object_type_id="{{ (int) $deals->object_type_id }}" 
                    :object_id="{{ (int) $deals->id }}" 
                    :total_data="{{ (int) $deals->comments_count }}" 
                    :username="@if($user) {{ json_encode($user->full_name) }} @else {{ 'null' }} @endif"
                    submitable
                    />
            </div>
        </div>
    </div> --}}

    @livewire('section', ['cookie' => $cookie])
</div>
@endsection

@section('mobileMenu')
@php
    $message = urlencode($deals->name."\r\n". url()->full());
@endphp
@if($deals->url != "" && strpos($deals->url, "www.giladiskon.com") === false )
<div class="bg-white py-3 d-block d-md-none fixed-bottom" v-sticky sticky-side="bottom">
    <div class="container">
        <div class="row">
            @if ($deals->expired_date > \Carbon\Carbon::now())
                <div class="col-6 pr-1">
                    <a href="{{ setProperUrl($deals->url) }}" onclick="sendCustomActivity('use reguler deals', {dealid: {{ $deals->id }} }); gdTrack({object_type_id: 1, object_id: {{ json_encode($deals->id) }}, action_id: 10, content: {{ json_encode($deals->url) }}, referrer: {{ json_encode(url()->current()) }} })" target="_blank" class="btn btn-block btn-sm btn-gd-primary" id="btn-shop-now-mobile">Belanja Sekarang</a>
                </div>
                <div class="col-6 pl-1 d-block d-md-none">
                    <span onclick="sendCustomActivity('share whatsapp', {dealid: {{ $deals->id }} }); gdTrack({object_type_id: 1, object_id: {{ json_encode($deals->id) }}, action_id: 3, content: 'whatsapp', referrer: {{ json_encode(url()->current()) }} }); shareWhatsapp('{{ $message }}');" target="_blank" class="btn btn-block btn-sm btn-success" id="btn-shop-now-mobile">Share&nbsp;&nbsp;<i class="fa fa-whatsapp"></i></span>
                </div>
            @else
                <div class="col-12">
                    <span class="btn btn-block bg-gd-grey text-white p-3">Expired</span>
                </div>
            @endif
        </div>
    </div>
</div>
@else 
<div class="bg-white py-3 d-block d-md-none fixed-bottom" v-sticky sticky-side="bottom">
    <div class="container">
        <div class="row">
            @if ($deals->expired_date > \Carbon\Carbon::now())
                <div class="col-12">
                    <span onclick="sendCustomActivity('share whatsapp', {dealid: {{ $deals->id }} }); gdTrack({object_type_id: 1, object_id: {{ json_encode($deals->id) }}, action_id: 3, content: 'whatsapp', referrer: {{ json_encode(url()->current()) }} }); shareWhatsapp('{{ $message }}');" target="_blank" class="btn btn-block btn-sm btn-success" id="btn-shop-now-mobile">Share&nbsp;&nbsp;<i class="fa fa-whatsapp"></i></span>
                </div>
            @else
                <div class="col-12">
                    <span class="btn btn-block bg-gd-grey text-white p-3">Expired</span>
                </div>
            @endif
        </div>
    </div>
</div>
@endif
@endsection

@section('script')
@parent
<script src="{{ asset('js/slick.min.js') }}"></script>
<script>
    function show_full_desc() {
        var dots = document.getElementById("dots");
        var moreText = document.getElementById("more");
        var btnText = document.getElementById("show_more");

        if (dots.style.display === "none") {
            dots.style.display = "inline";
            btnText.innerHTML = "read more";
            moreText.style.display = "none";
        } else {
            dots.style.display = "none";
            btnText.innerHTML = "read less";
            moreText.style.display = "inline";
        }
    }
</script>
@endsection