{{-- PDF viewer js--}}
<script src="{{ asset('/js/pdf.min.js') }}"></script>
<script src="{{ asset('/js/pdf.worker.min.js') }}"></script>

@if($pdfPreview === 'true' || $pdfPreview === true)
    <div id="loadingSpinnerAjax" class="d-flex justify-content-center align-items-center w-100">
        <div class="spinner-border text-primary d-flex justify-content-center" role="status">
            <span class="sr-only">Loading...</span>
        </div>
    </div>
    <div id="pdfPreview" class="carousel slide" data-ride="carousel">
        <div class="carousel-inner">
            <div class="carousel-item active caro_border p-0">
                <canvas oncontextmenu="return false;" class="d-block w-100" id="the-canvas"></canvas>
            </div>
        </div>
        <a class="carousel-control-prev" href="#pdfPreview" role="button" id="prev" >
            <span class="caro_arrow"><i class="fas fa-angle-left"></i></span>
            <span class="sr-only">{{ __('contract.preview.pdfPrevious') }}</span>
        </a>
        <a class="carousel-control-next" href="#pdfPreview" role="button" id="next">
            <span class="caro_arrow"><i class="fas fa-angle-right"></i></span>
            <span class="sr-only">{{ __('contract.preview.pdfNext') }}</span>
        </a>
    </div>

    <p id="pdfPage" class="text-center">{{ __('contract.preview.pdfPage') }} <span id="page_num"></span> / <span id="page_count"></span></p>
    
    @if ( Session::has('ocean') ) 
    <div class="d-flex justify-content-center mt-5">
        <a href="{{ $pdf }}" target="_blank" class="btn btn-secondary btn-save btn_little_save w-100">{{ __('contract.congrat.buttonDownloadContract') }}</a>
    </div>
    @endif

    <script>
        // If absolute URL from the remote server is provided, configure the CORS
        // header on that server.
        ///     ---- [ pdfs/wiki.pdf ] ----
        var url = '{{ $pdf."?rnd=".uniqid() }}';
    </script>

    <script type="text/javascript" src="{{URL::asset('/js/pdf_preview.js')}}?{{ time() }}"></script>
@else
    <div id="previewHtml" class="p-4 overflow-auto disable-select">
        {!! $previewHtml !!}
    </div>
    <div id="previewHtmlScroll" class="d-block d-sm-none">
        <div id="previewHtmlScrollDown" class="btn btn-secondary btn-preview-scroll float-left d-flex align-items-center"><i class="fas fa-chevron-down"></i></div>
        <div id="previewHtmlScrollUp" class="btn btn-secondary btn-preview-scroll float-right d-flex align-items-center"><i class="fas fa-chevron-up"></i></i></div>
    </div>
@endif