@extends('layouts.website')

@section('page_title', 'Shareholder documents | Grindrod Limited')
@section('metaDescription', "Our ambition is to find the perfect logistics solution for our customers across a multitude of industries including mining, agricultural, new energy commodities and project cargo.")

@section('content')
    
    <!-- <page-header section-class="sh-info-header no-banner">
        <template v-slot:heading>Shareholder documents</template>
        <template v-slot:body>
            This section of the website provides a library of useful reports and presentations including current and historical documents - final and interim financial results, investor presentations, integrated annual reports and other supporting documents.
        </template>
    </page-header> -->
    
    <!-- <section class="page-header no-banner">
    	<div class="container">
    		<div class="banner-description">
    			<h1>Shareholder Documents</h1>
    		</div>
    	</div>
    </section> -->

@foreach($page_sections as $page_section)

    {!! $page_section->section_content !!}

    @if($page_section->content_type == 'embeded video')
        <div class="embed-responsive embed-responsive-16by9" id="watch-video">
            <iframe class="embed-responsive-item" src="{{$page_section->embeded_video}}" allowfullscreen></iframe>
        </div>
    @endif

    @if($page_section->content_type == "csi_slider")
            <div id="csi-slider">
                <csi-slider  sectionid="{{$page_section->id}}"></csi-slider> 
            </div>
    @endif


    @if( $page_section->id == 45)
        
    <section class="tabs-module investor-tabs-module">
        <nav>
            <div class="container">
                <div class="nav nav-tabs" id="nav-tab" role="tablist">
                                        @foreach($documents as $doc_type => $docs)

                                                                       <a class="nav-item nav-link {{ $is_active }}" id="" data-toggle="tab" href="#{{$doc_type}}" role="tab" aria-controls="{{$doc_type}}" aria-selected="false" >
                            {!!  ($doc_type == 'annual-reports') ? "Integrated<br>Annual Reports" : $doc_type_diplay_value !!}
                        </a>

                        
                    @endforeach
                </div>
            </div>
        </nav>
        <div class="tab-content investor-tab-content">
            @foreach($documents as $doc_type => $documents_arr)

                                                        <div class="tab-pane fade {{ $active_show }}" id="{{$doc_type}}" role="tabpanel" aria-labelledby="{{$doc_type}}" >
                        <section class="investor-content-section bg-cover bg-top-left h-750" style='background-image: url("{{$bg_img}}")'>
                            <div class="container">
                            @if($doc_type == 'latest_results')
                                    <h2>LATEST RESULTS REPORTS</h2>
                                    <div class="ir-results-wrapper">
                                        @foreach($documents_arr as $key => $latest)
                                            {{-- dd($latest) --}}
                                            <div class="ir-results-item">
                                                <h5>{{ $latest->DocumentName }}</h5>
                                                <div class="downloand-wrapper">
                                                    @php $lrDate = $latest->created_at ?? $latest->DocumentDate; @endphp
                                                    <div class="doc-date">
                                                        <strong>Published on</strong> <span>{{ date('d M Y', strtotime($lrDate)) }}</span>
                                                    </div>
                                                    <div class="download-links">
                                                        <a href="{{ $latest->download }}" target="_blank">
                                                            <span>
                                                                view 
                                                                <img src="/images/icons/download.svg" alt="{{ $latest->DocumentName }} - Download" title="{{ $latest->DocumentName }} - Download">
                                                            </span>
                                                        </a>
                                                        @if(!is_null($latest->report_html))
                                                            <a href="{{ $latest->report_html }}" class="html-view" target="_blank">Html</a>
                                                        @endif
                                                        @if(!is_null($latest->recording))
                                                            @php
                                                                $path = "/share_holder_documents/document_$latest->id/";
                                                                $recording = $latest->recording;
                                                                // $recording = 'https://player.vimeo.com/video/646471054?h=7d86f1795f';
                                                            @endphp
                                                            <a href="#" class="recording-view" data-video="{{ $recording }}">Recording</a>
                                                        @endif
                                                    </div>                                    
                                                </div> 
                                            </div>
                                        @endforeach
                                    </div>
                                @else
                                                                        <h2>{{ $doc_type_diplay_value  }}</h2>
                                    <div class="investor-tabs">
                                        <ul class="nav nav-tabs justify-content-between">
                                            @php
                                                $latestDocYear = array_keys($documents_arr->toArray());
                                            @endphp
                                            @foreach($documents_arr as $frYear => $frDoc)
                                                                                            @if($frDoc[0]->DocumentTypeID == 1 || $frDoc[0]->DocumentTypeID == 3)
                                                    <li class="nav-item">
                                                        <a class="nav-link @if($frYear == max($latestDocYear)) active @endif" data-toggle="tab" href="#{{ $doc_type }}-tab-{{ $frYear }}" role="tab" aria-controls="{{ $doc_type }}-tab-{{ $frYear }}" aria-selected="false">{{ $decrementedYear }} FY</a>
                                                    </li>
                                                @else
                                                    <li class="nav-item">
                                                        <a class="nav-link @if($frYear == max($latestDocYear)) active @endif" data-toggle="tab" href="#{{ $doc_type }}-tab-{{ $frYear }}" role="tab" aria-controls="{{ $doc_type }}-tab-{{ $frYear }}" aria-selected="false">{{ $frYear }}</a>
                                                    </li>
                                                @endif
                                            @endforeach
                                        </ul>
                                        <div class="tab-content investor-inner-tab-content" id="investor-inner-tab">
                                            @foreach($documents_arr  as $frdYear => $frDocs)
                                                <div class="tab-pane fade @if($frdYear == max($latestDocYear)) show active @endif" id="{{ $doc_type }}-tab-{{ $frdYear }}" role="tabpanel" aria-labelledby="{{ $doc_type }}-tab-{{ $frdYear }}">
                                                    <div class="ir-results-wrapper">
                                                        @foreach($frDocs as $finalDoc)
                                                        <div class="ir-results-item">
                                                            <h5>{{ $finalDoc->DocumentName }}</h5>

                                                            <div class="downloand-wrapper">
                                                                @php $frDate = $finalDoc->created_at ?? $finalDoc->DocumentDate; @endphp
                                                                <div class="doc-date">
                                                                    <strong>Published on</strong> <span>{{ date('d M Y', strtotime($frDate)) }}</span>
                                                                </div>
                                                                <div class="download-links">
                                                                    <a href="{{ $finalDoc->download }}" target="_blank">
                                                                        <span>
                                                                            view 
                                                                            <img src="/images/icons/download.svg" alt="{{ $finalDoc->DocumentName }} - Download" title="{{ $finalDoc->DocumentName }} - Download">
                                                                        </span>
                                                                    </a>
                                                                    @if(!is_null($finalDoc->report_html))
                                                                        <a href="{{ $finalDoc->report_html }}" class="html-view" target="_blank">Html</a>
                                                                    @endif
                                                                    @if(!is_null($finalDoc->recording))
                                                                        @php
                                                                            $path = "/share_holder_documents/document_$finalDoc->id/";
                                                                            $recording = $finalDoc->recording;
                                                                            // $recording = 'https://player.vimeo.com/video/646471054?h=7d86f1795f';
                                                                        @endphp

                                                                        @if($finalDoc->id == 2472)
                                                                            <a href="{{ $finalDoc->recording }}" target="_blank">Recording</a>
                                                                        @else
                                                                            <a href="#" class="recording-view" data-video="{{ $recording }}">Recording</a>
                                                                        @endif
                                                                    @endif
                                                                </div>
                                                            </div>
                                                        </div>
                                                        @endforeach
                                                    </div>
                                                </div>
                                            @endforeach
                                        </div>
                                    </div>
                                @endif
                            </div>
                        </section>
                    </div>
            @endforeach
            
            <!-- Modal -->
            <div class="modal fade" id="recordingModal" tabindex="-1" role="dialog" aria-labelledby="exampleModalLabel" aria-hidden="true">
                <div class="modal-dialog modal-xl" role="document">
                <div class="modal-content">
                    <div class="modal-header">
                    <h5 class="modal-title" id="exampleModalLabel">Watch Recording</h5>
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                        <span aria-hidden="true">&times;</span>
                    </button>
                    </div>
                    <div class="modal-body">
                    <!-- <video controls style="width: 100%; height: auto" preload id="videoModal">
                        <source src="https://copelnet.com.ar/videos/copelco2020quedateentucasa.mp4" type="video/mp4" id="videoSource" />
                    </video> -->

                    <div class="embed-responsive embed-responsive-16by9">
                        <iframe title="vimeo-player" src="" frameborder="0" allowfullscreen id="videoSource"></iframe>
                    </div>

                        <!-- <iframe title="vimeo-player" src="https://player.vimeo.com/video/646471054?h=7d86f1795f" width="640" height="360" frameborder="0" allowfullscreen></iframe> -->
                    </div>
                    <div class="modal-footer">
                    <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
                    </div>
                </div>
                </div>
            </div>

        </div>
         
    </section>

    @endif

    @if(count($page_section->tabs))