@extends('template.master')

@section('page_styles')
    {{--CUSTOM STYLES HERE--}}

    <link rel="stylesheet" href="{{ asset('css/pages/gmb.css') }}">
    <link rel="stylesheet" href="{{ asset('css/pages/gmb.view.css') }}">
    <style>
        .la-copy {
            cursor: pointer;
        }
    </style>
@stop

@section('content')
    @if (isset($no_data) && $no_data)
        @include('no_data', [
                   'nd_title' => 'No Available Google My Business Data',
                   'nd_subtitle' => 'Unverified listing. Please contact our team for further assistance.'
        ])
    @else
    <div class="container-fluid">
        <!-- Begin Page Header-->
        <div class="row">
            <div class="page-header">
                <div class="d-flex align-items-center">
                    <h2 class="page-header-title text-gradient-01">{{$location['locationName']}}</h2>
                    <div style="opacity:0">
                        <input type="text" id="myInput" value="{{route('gmb.public_view_account', ['company_id' => (isset($domain->company_id) ? $domain->company_id : 0)])}}?locName={{$location['name']}}&public_code={{$domain->public_code}}">
                    </div>
                </div>
                <div>
                    @if (!auth()->guest() && Route::current()->getName() != 'gmb.public_view_account')
                        <i class="la la-copy text-dark" onclick="javascript:public_link()"> copy public link</i>
                    @endif
                </div>
            </div>
        </div>
        <!-- End Page Header -->
        <div class="row flex-row about">
            <div class="col-xl-5">
                <!-- Begin Widget -->
                <div class="widget has-shadow">
                    <div class="widget-header bordered no-actions d-flex align-items-center">
                        <h4>Business Details</h4>
                    </div>
                    <div class="widget-body business-left">
                        <div class="about-infos d-flex flex-column pt-0">
                            <!-- Grid row -->
                            <div class="row widget-scroll" style="overflow-y: scroll; height: 380px;background-color: #eee">
                                                                @foreach ($media->mediaItems as $photo)
                                    <div class="col-md-4 margin-top-10 col-gal text-center">
                                        <a class="gallery-a" data-fancybox="gallery" href="{{$photo->googleUrl}}">
                                            <img src="{{$photo->thumbnailUrl}}" alt="" class="img-fluid img-business">
                                        </a>
                                    </div>
                                                                    @endforeach
                                @if ($photos == 0)
                                    <div class="col-md-12">
                                        @include('no_data', [
                                                  'nd_title' => 'No Photos',
                                                  'nd_subtitle' => 'No photos found for this Business.'
                                       ])
                                    </div>
                                @endif
                            </div>
                        </div><br/>
                        <div class="about-infos d-flex flex-column ">
                            <div class="about-title">Business Name: <i class="la la-edit pull-right text-primary" data-toggle="modal" data-target="#edit-modal-business" data-backdrop="static" data-keyboard="false" ></i></div>
                            <div class="about-text">
                                {{$location['locationName']}}
                            </div>
                        </div>
                        <div class="about-infos d-flex flex-column">
                            <div class="about-title">Description:</div>
                            <div class="about-text">
                                {{$location['profile']['description']}}
                            </div>
                        </div>
                        <div class="about-infos d-flex flex-column">
                            <div class="about-title">Category:</div>
                            <div class="about-text">
                               {{$location['primaryCategory']['displayName']}} <br/>
                                @foreach ($location['additionalCategories'] as $additionalCategory)
                                    {{$additionalCategory['displayName']}}<br/>
                                @endforeach
                            </div>
                        </div>
                        <div class="about-infos d-flex flex-column">
                            <div class="about-title">Address:</div>
                            <div class="about-text">
                                @foreach ($location['address']['addressLines'] as $address)
                                    {{$address}}
                                @endforeach
                                {{@$location['address']['sublocality']}}, {{@$location['address']['locality']}}, {{@$location['address']['administrativeArea']}},
                                {{@$location['address']['regionCode']}} {{@$location['address']['postalCode']}}
                            </div>
                        </div>
                        <div class="about-infos d-flex flex-column">
                            <div class="about-title">Opening Hours: <span class="badge @if($location['openInfo']['status'] === 'OPEN') badge-success @else badge-warning @endif"> {{$location['openInfo']['status']}} </span>
                            </div>
                            <div class="about-text">
                                @if (isset($location['regularHours']['periods']))
                                    <table class="table">
                                    @foreach ($location['regularHours']['periods'] as $period)
                                        <tr>
                                            <td>{{$period['openDay']}} &nbsp;</td> <td>{{$period['openTime']}} - {{$period['closeTime']}}</td>
                                        </tr>
                                    @endforeach
                                    </table>
                                @endif
                            </div>
                        </div>
                        <div class="about-infos d-flex flex-column">
                            <div class="about-title">Phone:</div>
                            <div class="about-text">{{$location['primaryPhone']}}</div>
                        </div>
                        <div class="about-infos d-flex flex-column">
                            <div class="about-title">Website:</div>
                            <div class="about-text">
                                <a @if (!empty($location['websiteUrl']))href="{{$location['websiteUrl']}}" target="_blank"@endif>@if (!empty($location['websiteUrl'])){{$location['websiteUrl']}}@else N/A @endif</a>
                            </div>
                        </div>
                        <div class="about-infos d-flex flex-column">
                                                        <div class="about-title mr-auto">Ratings (@if ($reviews->totalReviewCount) {{$reviews->totalReviewCount}} @else 0 @endif ) :</div>
                            <div class="about-text">
                                @for ($r =1 ; $r <= $average_rating; $r++)
                                <i class="la la-star starico"></i>
                                @endfor
                            </div>
                        </div>
                    </div>
                </div>
                <!-- End Widget -->
            </div>
            <!-- Begin Column -->
            <div class="col-xl-7 column">
                <div class="widget has-shadow">
                    <div class="padding-top-15"><!-- widget-body -->
                        <ul class="nav nav-tabs nav-fill" role="tablist">
                            <li class="nav-item">
                                <a class="nav-link active show" id="j-drop-tab-1" data-toggle="tab" href="#j-d-tab-1" role="tab" aria-controls="j-d-tab-1" aria-selected="false">Insights</a>
                            </li>
                            <li class="nav-item">
                                <a class="nav-link" id="j-drop-tab-2" data-toggle="tab" href="#j-d-tab-2" role="tab" aria-controls="j-d-tab-2" aria-selected="false">Reviews</a>
                            </li>
                            <li class="nav-item">
                                <a class="nav-link" id="j-drop-tab-3" data-toggle="tab" href="#j-d-tab-3" role="tab" aria-controls="j-d-tab-3" aria-selected="true">Local Posts</a>
                            </li>
                            <li class="nav-item">
                                <a class="nav-link " id="j-drop-tab-4" data-toggle="tab" href="#j-d-tab-4" role="tab" aria-controls="j-d-tab-4" aria-selected="true">Q & A</a>
                            </li>
                        </ul>
                        <div class="tab-content pt-1">
                            <div class="tab-pane fade active show" id="j-d-tab-1" role="tabpanel" aria-labelledby="j-drop-tab-1">
                                <div class="widget-body">
                                    <div class="row">
                                        <div class="col-md-6 margin-bottom-10">
                                            <h3 class="text-left">Your Insights for the past 30 days</h3>
                                        </div>
                                    </div>
                                    <!--GMB Stats-->
                                    <div class="row border  inside-row ">
                                                                                @foreach ($insights['summary'] as $summary_title => $summary_value)
                                            @if ($ctr === 1)
                                                <div class="col-md-4 justify-content-start text-center box-stats" id="gmb-stats">
                                                    <div class="widget-box">
                                                        <div class="widget-box-in bg-grey ">
                                                            <br />
                                                            <img src="{{asset('img/gmb-stats.png')}}" alt=""><br/>
                                                            <h4>GMB Stats</h4>
                                                        </div>
                                                    </div>
                                                </div>
                                            @endif
                                            <div style="" class="col-md-4 justify-content-start text-center box-stats">
                                                <div style="display:none !important;" class="widget-box as-section as-{{$ctr}}">
                                                    <div class="widget-box-in stats-widget-in">
                                                        <h2 class="font-weight-bold">{{$summary_value}}</h2><br/>
                                                        {{--<h4>0.49% <i class="la la-arrow-down text-danger font-weight-bold"></i></h4><br/>--}}
                                                        <b>{{str_replace('_', ' ', $summary_title)}}</b>
                                                        {{@$insights['descriptions'][$summary_title]}}
                                                    </div>
                                                </div>
                                            </div>
                                                                                    @endforeach

                                        @if ($ctr === 1)
                                            <div class="col-md-12 text-right"><br/>
                                                <h3>GMB statistics are not available for the above dates.</h3><br/><br/>
                                            </div>
                                        @endif
                                    </div>

                                    <!--Searches-->
                                    <div class=" border ">
                                        <div class="row">
                                            <div class="col-md-12">
                                                <div class="d-flex flex-column mr-auto ml-2 padding-left-10 padding-top-5">
                                                    <h2 class="title">Searches</h2>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="row">
                                            <div class="col-md-5" id="container" style="width: 100%; height: 300px; margin: 0 auto">

                                            </div>
                                            <div class="col-md-5">
                                                <div class="row">
                                                    <div class="col-md-7">
                                                        <ul class="search-hight-chart-legend">
                                                            <li>
                                                                <i></i>
                                                                <span>Direct Search <em>Customers who find your listing searching for your business name or address.</em></span>
                                                            </li>
                                                            <li>
                                                                <i></i>
                                                                <span>Discovered through keywords <em>Customers who find your listing searching for a category, product, or service.</em></span>
                                                            </li>
                                                        </ul>
                                                    </div>
                                                    @php $total = $insights['summary']['QUERIES_INDIRECT'] + $insights['summary']['QUERIES_DIRECT'];
                                                    $queries_indirect_p = ($insights['summary']['QUERIES_INDIRECT']/$total)*100;
                                                    $queries_direct_p = ($insights['summary']['QUERIES_DIRECT']/$total)*100;
                                                    @endphp
                                                    <div class="col-md-5">
                                                        <ul class="hight-chart-search-avg">
                                                            <li>
                                                                <b>{{@$insights['summary']['QUERIES_DIRECT']}}</b>
                                                                <span>({{round($queries_direct_p,2)}}% of total)</span>
                                                            </li>
                                                            <li>
                                                                <b>{{@$insights['summary']['QUERIES_INDIRECT']}}</b>
                                                                <span>({{round($queries_indirect_p,2)}}% of total)</span>
                                                            </li>
                                                        </ul>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                    <br/>
                                    <!--Views-->
                                    <div class=" border padding-top-10 padding-bottom-10 padding-right-20">
                                        <div class="row">
                                            <div class="col-md-12">
                                                <div class="d-flex flex-column mr-auto ml-2 padding-left-10 padding-top-5">
                                                    <h3 class="title">Views</h3>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="row">
                                            <div class="col-md-7" id="views-container" style="width: 100%; height: 300px; margin: 0 auto">

                                            </div>
                                            <div class="col-md-5">
                                                <ul class="view-chart-legend-block">
                                                    <li>
                                                        <i></i>
                                                        <span>Total Views</span>
                                                        <b>{{$insights['search_views_daily_total'] + $insights['maps_views_daily_total']}}</b>
                                                    </li>
                                                    <li>
                                                        <i class="lisitng-search-block"></i>
                                                        <span>Listing Search</span>
                                                        <b>{{$insights['search_views_daily_total']}}</b>
                                                    </li>
                                                    <li>
                                                        <i class="lisitng-map-block"></i>
                                                        <span>Listing Maps</span>
                                                        <b>{{$insights['maps_views_daily_total']}}</b>
                                                    </li>
                                                </ul>
                                            </div>
                                        </div>
                                    </div>
                                    <br/>
                                    <!--Customer actions-->
                                    <div class=" border padding-top-10 padding-bottom-10 padding-right-20">
                                        <div class="row">
                                            <div class="col-md-12">
                                                <div class="d-flex flex-column mr-auto ml-2 padding-left-10 padding-top-5">
                                                    <h3 class="title">Customer actions</h3>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="row">
                                            <div class="col-md-7" id="customer-container" style="width: 100%; height: 300px; margin: 0 auto">

                                            </div>
                                            <div class="col-md-5">
                                                <ul class="view-chart-legend-block">
                                                    <li>
                                                        <i class="lisitng-search-block"></i>
                                                        <span>Visit your website</span>
                                                        <b>{{$insights['website_daily_total']}}    </b>
                                                    </li>
                                                    <li>
                                                        <i class="lisitng-map-block"></i>
                                                        <span>Request directions</span>
                                                        <b>{{$insights['driving_daily_total']}}</b>
                                                    </li>
                                                    <li>
                                                        <i class="lisitng-call-block"></i>
                                                        <span>Call you</span>
                                                        <b>{{$insights['phone_daily_total']}}</b>
                                                    </li>
                                                </ul>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="tab-pane fade" id="j-d-tab-2" role="tabpanel" aria-labelledby="j-drop-tab-2">
                                <div class="widget-body widget widget-10 has-shadow">
                                    <ul class="ticket list-group w-100">
                                        <!-- 01 -->
                                        @if (isset($reviews->reviews))
                                        @foreach($reviews->reviews as $review)
                                            @if(isset($review->comment) && $review->comment != '')
                                                <li class="list-group-item">
                                                    <div class="media">
                                                        <div class="media-left  pr-4">
                                                            <img src="@if(isset($review->reviewer)){{$review->reviewer['profilePhotoUrl']}}@endif" alt="..." class="user-img rounded-circle">
                                                        </div>
                                                        <div class="media-body align-self-center">
                                                            <div class="username" style="font-weight: 600;">
                                                                @if(isset($review->reviewer))
                                                                    <h4>{{$review->reviewer['displayName']}}</h4>
                                                                @else
                                                                    N/A
                                                                @endif
                                                            </div>
                                                            <div class="msg" style="padding-top: 10px;padding-bottom: 10px;">
                                                                <p style="color:black;">
                                                                    {{$review->comment}}
                                                                </p>
                                                            </div>
                                                            <div class="status" style="padding-top: 5px;">
                                                                <i>
                                                                    ({{\Carbon\Carbon::createFromTimeStamp(strtotime($review->createTime))->diffForHumans()}})
                                                                </i>
                                                                <div class="col no-padding d-flex justify-content-end">
                                                                    <div class="users-like">
                                                                                                                                                                                                                        @for ($r = 1; $r<=$ratings[$review->starRating]; $r++)
                                                                            <i class="la la-star" style="font-size:1.5em;color:yellow;-webkit-text-stroke: 1px black;"></i>
                                                                        @endfor
                                                                    </div>
                                                                </div>
                                                            </div>
                                                            {{--<div class="clearfix"><br /></div>
                                                            <div class="media-footer">
                                                                <div class="widget-footer d-flex align-items-center border-f">

                                                                    <div class="col no-padding d-flex justify-content-end">
                                                                        <div class="meta">
                                                                            <a href="#" class="btn btn-primary">
                                                                                Respond to this Review
                                                                            </a>
                                                                            <a href="#" class="btn btn-primary">
                                                                                Share
                                                                            </a>
                                                                        </div>
                                                                    </div>
                                                                </div>
                                                            </div>--}}
                                                        </div>

                                                    </div>
                                                </li>
                                            @endif
                                        @endforeach
                                        @else
                                            <div class="col-md-12"><br/>
                                                @include('no_data', [
                                                          'nd_title' => 'No Reviews',
                                                          'nd_subtitle' => 'No reviews found for this Business.'
                                               ])
                                            </div>
                                        @endif
                                    <!-- End 01 -->
                                    </ul>
                                </div>
                            </div>
                            <div class="tab-pane fade" id="j-d-tab-3" role="tabpanel" aria-labelledby="j-drop-tab-3">
                                @if(isset($local_posts->localPosts))
                                    <div class="blog-grid">
                                        <div class="container">
                                                <div class="col-md-12">
                                                    <div class="blog-list-grid">
                                                    @foreach($local_posts->localPosts as $post)
                                                        <div class="blog-list">
                                                            <div class="blog-list-img">
                                                                <img src="{{@$post->media[0]->googleUrl}}">
                                                            </div>
                                                            <div class="blog-list-description">
                                                                <h4>
                                                                    {{date('F d, Y', strtotime(@$post->createTime))}}
                                                                </h4>
                                                                <p>{{@$post->summary}}</p>
                                                            </div>
                                                        </div>
                                                    @endforeach
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                @else
                                    <div class="col-md-12">
                                        @include('no_data', [
                                                  'nd_title' => 'No Local Posts',
                                                  'nd_subtitle' => 'No local posts found for this Business.'
                                       ])
                                    </div>
                                @endif
                            </div>
                            <div class="tab-pane fade db-social" id="j-d-tab-4" role="tabpanel" aria-labelledby="j-drop-tab-4">
                                @if(isset($questions->questions))
                                    @foreach ($questions->questions as $question)
                                        <div class="widget has-shadow">
                                            <!-- Begin Widget Header -->
                                            <div class="widget-header d-flex align-items-center">
                                                <div class="user-image">
                                                    <img class="rounded-circle" src="@if(isset($question->author->displayName)){{$question->author->profilePhotoUrl}}@endif" alt="...">
                                                </div>
                                                <div class="d-flex flex-column mr-auto">
                                                    <div class="title">
                                                <span class="username">
                                                     @if(isset($question->author))
                                                        {{$question->author->displayName}}
                                                    @endif
                                                </span> asked:
                                                    </div>
                                                    <div class="time">
                                                        {{\Carbon\Carbon::createFromTimeStamp(strtotime(@$question->createTime))->diffForHumans()}}
                                                    </div>
                                                </div>
                                            </div>
                                            <!-- End Widget Header -->
                                            <!-- Begin Widget Body -->
                                            <div class="widget-body">
                                                <p>
                                                    {{@$question->text}}
                                                </p>
                                            </div>
                                            <!-- End Widget Body -->
                                            <!-- Begin Widget Footer -->
                                            <div class="widget-footer d-flex align-items-center">
                                                <div class="col-xl-8 col-md-8 col-7 no-padding d-flex justify-content-start align-items-center">
                                                </div>
                                                <div class="col-xl-4 col-md-4 col-5 no-padding d-flex justify-content-end">
                                                    <div class="meta">
                                                        <ul>
                                                            <li>
                                                                <a href="javascript:void(0);">
                                                                    <i class="la la-comment"></i><span class="numb">
                                                                        @if (isset($question->answer->answers))
                                                                            {{count($question->answer->answers)}}
                                                                        @endif
                                                            </span>
                                                                </a>
                                                            </li>

                                                        </ul>
                                                    </div>
                                                </div>
                                            </div>
                                            <!-- End Widget Footer -->
                                            <!-- Begin Reply -->
                                            @if (isset($question->answer->answers))
                                                @foreach ($question->answer->answers as $answer)
                                                    <div class="reply">
                                                        <div class="reply-header d-flex align-items-center">
                                                            <div class="user-image">
                                                                <img class="rounded-circle" src="@if(isset($answer->author->displayName)){{$answer->author->profilePhotoUrl}}@endif" alt="...">
                                                            </div>
                                                            <div class="d-flex flex-column mr-auto">
                                                                <div class="title">
                                                    <span class="username">
                                                         @if(isset($answer->author))
                                                            {{$answer->author->displayName}}
                                                        @endif
                                                    </span>
                                                                </div>
                                                                <div class="time">
                                                                    {{\Carbon\Carbon::createFromTimeStamp(strtotime($answer->createTime))->diffForHumans()}}
                                                                </div>
                                                            </div>
                                                        </div>
                                                        <div class="reply-body">
                                                            <p>
                                                                {{@$answer->text}}
                                                            </p>
                                                        </div>
                                                    </div>
                                                @endforeach
                                            @endif
                                            <hr />
                                            <!-- End Reply -->
                                        </div>
                                    @endforeach
                                @else
                                    <div class="col-md-12">
                                        @include('no_data', [
                                                  'nd_title' => 'No Q&A data',
                                                  'nd_subtitle' => 'No Q&A data found for this Business.'
                                       ])
                                    </div>
                                @endif
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <!-- End Column -->
        </div>
        <!-- End Row -->

    </div>
    @endif
@stop

@if (isset($no_data) && $no_data)

@else
    @section('page_modals')

        <div id="edit-modal-business" class="modal fade">
            <div class="modal-dialog modal-dialog-centered modal-md">
                <div class="modal-content">
                    <div class="modal-header">
                        <h4 class="modal-title">Update business details</h4>
                        <button type="button" class="close" data-dismiss="modal">
                            <span aria-hidden="true">×</span>
                            <span class="sr-only">close</span>
                        </button>
                    </div>
                    <form id="card-form" action="{{ route('gmb.update_location').'?location='.$location['name'].'&type=profile' }}" method="POST">
                    <div class="modal-body">
                            @csrf
                            <table class="table">
                                <tr>
                                    <td>Business Name:</td>
                                    <td><input type="text" class="form-control" name="locationName" value="{{$location['locationName']}}"></td>
                                </tr>
                                <tr>
                                    <td>Description:</td>
                                    <td><textarea class="form-control" name="profile->description">{{$location['profile']['description']}}</textarea></td>
                                </tr>
                            </table>
                    </div>
                    <input type="submit" id="submitForm" class="btn btn-success btn-square text-white pull-right" value="Save">
                    </form>
                </div>
            </div>
        </div>
        <div id="edit-modal-category" class="modal fade">
            <div class="modal-dialog modal-dialog-centered modal-md">
                <div class="modal-content">
                    <div class="modal-header">
                        <h4 class="modal-title">Update business categories</h4>
                        <button type="button" class="close" data-dismiss="modal">
                            <span aria-hidden="true">×</span>
                            <span class="sr-only">close</span>
                        </button>
                    </div>
                    <form id="card-form" action="{{ route('gmb.update_location').'?location='.$location['name'].'&type=categories' }}" method="POST">
                    <div class="modal-body">
                        <table class="table" id="category-table">
                            <tr>
                                <td>Category:</td>
                                <td><input type="text" name="primaryCategory->displayName" class="form-control" value="{{$location['primaryCategory']['displayName']}}"></td>
                            </tr>
                            @foreach ($location['additionalCategories'] as $additionalCategory)
                            <tr>
                                <td></td>
                                <td><input type="text" class="form-control" value="{{$additionalCategory['displayName']}}" name="additionalCategories[]"></td>
                            </tr>
                            @endforeach
                        </table>
                        <input type="button" class="btn" value="Add category" onclick="javascript:addCategory()">
                    </div>
                    <input type="submit" id="submitForm" class="btn btn-success btn-square text-white pull-right" value="Save">
                    </form>
                </div>
            </div>
        </div>
        <div id="edit-modal-address" class="modal fade">
            <div class="modal-dialog modal-dialog-centered modal-md">
                <div class="modal-content">
                    <div class="modal-header">
                        <h4 class="modal-title">Update business address</h4>
                        <button type="button" class="close" data-dismiss="modal">
                            <span aria-hidden="true">×</span>
                            <span class="sr-only">close</span>
                        </button>
                    </div>
                    <form id="card-form" action="{{ route('gmb.update_location').'?location='.$location['name'].'&type=address' }}" method="POST">
                    <div class="modal-body">
                        <table class="table">
                            @foreach ($location['address']['addressLines'] as $key => $address)
                                <tr>
                                    <td>@if(!$key) Address @endif</td>
                                    <td>
                                        <input type="text" class="form-control" name="addressLines[]" value="{{$address}}">
                                    </td>
                                </tr>
                            @endforeach
                            <tr>
                                <td>Sublocality</td>
                                <td>
                                    <input type="text" class="form-control" name="sublocality" value="{{@$location['address']['sublocality']}}">
                                </td>
                            </tr>
                            <tr>
                                <td>Locality</td>
                                <td>
                                    <input type="text" class="form-control" name="locality" value="{{@$location['address']['locality']}}">
                                </td>
                            </tr>
                            <tr>
                                <td>Administrative Area</td>
                                <td>
                                    <input type="text" class="form-control" name="administrativeArea" value="{{@$location['address']['administrativeArea']}}">
                                </td>
                            </tr>
                            <tr>
                                <td>Region Code</td>
                                <td>
                                    <input type="text" class="form-control" name="regionCode" value="{{@$location['address']['regionCode']}}">
                                </td>
                            </tr>
                            <tr>
                                <td>Postal Code</td>
                                <td>
                                    <input type="text" class="form-control" name="postalCode" value="{{@$location['address']['postalCode']}}">
                                </td>
                            </tr>
                        </table>
                    </div>
                    <input type="submit" id="submitForm" class="btn btn-success btn-square text-white pull-right" value="Save">
                    </form>
                </div>
            </div>
        </div>
        <div id="edit-modal-opening" class="modal fade">
            <div class="modal-dialog modal-dialog-centered modal-md">
                <div class="modal-content">
                    <div class="modal-header">
                        <h4 class="modal-title">Update business opening hours</h4>
                        <button type="button" class="close" data-dismiss="modal">
                            <span aria-hidden="true">×</span>
                            <span class="sr-only">close</span>
                        </button>
                    </div>
                    <div class="modal-body">
                        @include('gmb.schedule')
                    </div>
                    <button type="button" class="btn btn-success btn-square text-white" data-dismiss="modal">
                        Save
                    </button>
                </div>
            </div>
        </div>
        <div id="edit-modal-phone" class="modal fade">
            <div class="modal-dialog modal-dialog-centered modal-md">
                <div class="modal-content">
                    <div class="modal-header">
                        <h4 class="modal-title">Update business phone</h4>
                        <button type="button" class="close" data-dismiss="modal">
                            <span aria-hidden="true">×</span>
                            <span class="sr-only">close</span>
                        </button>
                    </div>
                    <form id="card-form" action="{{ route('gmb.update_location').'?location='.$location['name'].'&type=primaryPhone' }}" method="POST">
                    <div class="modal-body">
                        <table class="table">
                            <tr>
                                <td>Phone:</td>
                                <td><input type="text" class="form-control" name="primaryPhone" value="{{$location['primaryPhone']}}"></td>
                            </tr>
                        </table>
                    </div>
                    <input type="submit" id="submitForm" class="btn btn-success btn-square text-white pull-right" value="Save">
                    </form>
                </div>
            </div>
        </div>
        <div id="edit-modal-website" class="modal fade">
            <div class="modal-dialog modal-dialog-centered modal-md">
                <div class="modal-content">
                    <div class="modal-header">
                        <h4 class="modal-title">Update business website</h4>
                        <button type="button" class="close" data-dismiss="modal">
                            <span aria-hidden="true">×</span>
                            <span class="sr-only">close</span>
                        </button>
                    </div>
                    <form id="card-form" action="{{ route('gmb.update_location').'?location='.$location['name'].'&type=websiteUrl' }}" method="POST">
                    <div class="modal-body">
                        <table class="table">
                            <tr>
                                <td>Website:</td>
                                <td><input type="text" name="websiteUrl" class="form-control" value="{{$location['websiteUrl']}}"></td>
                            </tr>
                        </table>
                    </div>
                    <input type="submit" id="submitForm" class="btn btn-success btn-square text-white pull-right" value="Save">
                    </form>
                </div>
            </div>
        </div>

    @stop

    @section('page_scripts')
        <!--CUSTOM SCRIPTS-->
        <link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/fancyapps/fancybox@3.5.7/dist/jquery.fancybox.min.css" />
        <script src="https://cdn.jsdelivr.net/gh/fancyapps/fancybox@3.5.7/dist/jquery.fancybox.min.js"></script>
        <script src="https://code.highcharts.com/highcharts.js"></script>
        <script src="https://code.highcharts.com/modules/exporting.js"></script>
        <script src="https://code.highcharts.com/modules/export-data.js"></script>
        <script>
            function runAfterPreload(){
                // $('.as-section').hide();
                // Animation with all options
                var duration = 0;
                $('.as-0').show();
                $('.as-0').animateCSS('fadeInRight', duration);
                for(var x=1;x<=13;x++){
                    $('.as-'+x).show();
                    duration += 350;
                    $('.as-'+x).animateCSS('fadeInUp', duration);
                }

            }

            $(function(){
                Highcharts.chart('container', {
                    chart: {
                        plotBackgroundColor: null,
                        plotBorderWidth: null,
                        plotShadow: false,
                        type: 'pie',
                    },
                    title: {
                        text: ''
                    },
                    tooltip: {
                        pointFormat: '{series.name}: <b>{point.percentage:.1f}%</b>'
                    },
                    plotOptions: {
                        pie: {
                            allowPointSelect: true,
                            cursor: 'pointer',
                            dataLabels: {
                                enabled: false,
                                format: '<b>{point.name}</b>: {point.percentage:.1f} %'
                            }
                        }
                    },
                    exporting: {
                        enabled: false
                    },
                    series: [{
                        name: 'Searches',
                        colorByPoint: true,
                        data: [{
                            name: 'Discovered through keywords',
                            y: {{$queries_indirect_p}},
                            sliced: true,
                            selected: true
                        }, {
                            name: 'Direct Search',
                            y: {{$queries_direct_p}}
                        }]
                    }]
                });

                @php $color = ['maps' => '#059587', 'search' => '#518FF5']; @endphp
                Highcharts.chart('views-container', {
                    chart: {
                        type: 'area'
                    },
                    title: {
                        text: ' '
                    },
                    xAxis: {
                        type: 'datetime'
                    },
                    yAxis: {
                        title: {
                            text: 'Count'
                        },
                        tickInterval: 20
                    },
                    tooltip: {
                        pointFormat: '{series.name} <br/>{point.y}'
                    },
                    plotOptions: {
                        series: {
                            pointStart: Date.UTC({{date('Y', strtotime($day_30_ago))}}, "{{(date('n', strtotime($day_30_ago))-1)}}", {{date('j', strtotime($day_30_ago))}}),
                            pointInterval: 24 * 3600 * 1000
                        }
                    },
                    exporting: {
                        enabled: false
                    },
                    series: [
                        @foreach ($highcharts['search_and_maps'] as $key => $search_maps)
                            {
                                color: "{{$color[$key]}}",
                                name: "{{$key}}",
                                data: [
                                    @foreach ($search_maps as $value)
                                    {{$value}},
                                    @endforeach
                                ]
                            },
                        @endforeach
                    ]
                });

                @php $color = ['website' => '#518FF5', 'call' => '#049E45', 'directions' => '#059587']; @endphp
                Highcharts.chart('customer-container', {
                    chart: {
                        type: 'column'
                    },
                    title: {
                        text: ' '
                    },
                    xAxis: {
                        categories: [
                            @for ($d=0; $d<=29; $d++)
                                "{{add_x_days_from_date($day_30_ago, $d)}}",
                            @endfor
                        ],
                        crosshair: true
                    },
                    yAxis: {
                        min: 0,
                        tickInterval: 5,
                        title: {
                            text: 'Count'
                        }
                    },
                    tooltip: {
                        headerFormat: '<span style="font-size:10px">{point.key}</span><table>',
                        pointFormat: '<tr><td style="color:{series.color};padding:0">{series.name}: </td>' +
                            '<td style="padding:0"><b>{point.y:1f}</b></td></tr>',
                        footerFormat: '</table>',
                        shared: true,
                        useHTML: true
                    },
                    exporting: {
                        enabled: false
                    },
                    plotOptions: {
                        column: {
                            pointPadding: 0.2,
                            borderWidth: 0
                        }
                    },
                    series: [
                        @foreach ($highcharts['customer_actions'] as $key => $search_maps)
                        {
                            color: "{{$color[$key]}}",
                            name: "{{$key}}",
                            data: [
                                @foreach ($search_maps as $value)
                                {{$value}},
                                @endforeach
                            ]
                        },
                        @endforeach
                    ]
                });



                Highcharts.chart('customer-container22', {
                    chart: {
                        type: 'area'
                    },
                    title: {
                        text: 'Customer actions'
                    },
                    xAxis: {
                        type: 'datetime'
                    },
                    yAxis: {
                        title: {
                            text: 'Count'
                        },
                        tickInterval: 10,
                        max: 50
                    },
                    tooltip: {
                        pointFormat: '{series.name} <br/>{point.y}'
                    },
                    plotOptions: {
                        series: {
                            pointStart: Date.UTC({{date('Y', strtotime($day_30_ago))}}, "{{(date('n', strtotime($day_30_ago))-1)}}", {{date('j', strtotime($day_30_ago))}}),
                            pointInterval: 24 * 3600 * 1000
                        }
                    },
                    series: [
                            @foreach ($highcharts['customer_actions'] as $key => $search_maps)
                        {
                            color: "{{$color[$key]}}",
                            name: "{{$key}}",
                            data: [
                                @foreach ($search_maps as $value)
                                {{$value}},
                                @endforeach
                            ]
                        },
                        @endforeach
                    ]
                });

            });

            function addCategory () {
                let html = '<tr>';
                html += '<td></td>';
                html += '<td><div class="form-check form-check-inline"><input type="text" class="form-control" name="additionalCategories[]">&nbsp;';
                html += '<input type="button" class="btn btn-danger" value="Delete" onclick="javascript:deleteRow(this)"></form></td>';
                html += '</tr>';

                $('#category-table').append(html);
            }

            function deleteRow (_this_) {
                $(_this_).closest('tr').remove();
            }

            function public_link() {
                var copyText = document.getElementById("myInput");
                copyText.select();
                copyText.setSelectionRange(0, 99999);
                document.execCommand("copy");
                new Noty({
                    text: '<div class="text-center success ">Public link has been copied to your clipboard</div>',
                    type: 'success',
                    layout: 'topCenter',
                    timeout: 3000,
                    animation: {
                        open: 'animated fadeIn', // Animate.css class names
                        close: 'animated fadeOut' // Animate.css class names
                    }
                }).show()
                // alert(copyText.value);
            }
        </script>
    @stop
@endif