@extends('web.page')

@section('page_class', 'template-normal')
@section('title_prefix', $item->title.' - ')
@section('description', $item->description)
@section('keywords', implode(', ',$item->tags->where('lang', Lang::getLocale())->pluck('name')->toArray()))

@section('content')

    <section class="header_image">
        @if($item->headerImage != null)
            <img src="/storage/blog/images/full/{{ $item->headerImage->file_name }}">
        @else
            <img src="/images/header/background_neutral.jpg">
        @endif
    </section>

    <section class="title">
        <div class="container-fluid">
            <div class="col-md-12 wow fadeInUp">
                <h1>{{ $item->title }}</h1>
            </div>
        </div>
    </section>

    <section>
        <div class="content">
            <div class="container">
                <div class="row">
                    <div class="col-md-12 wow fadeInUp">
                        {!! $item->content !!}
                    </div>

                    <div class="col-md-12">
                        <div class="documents_container">
                            <ul>
                                @foreach($item->documents as $document)
                                    @if($document->extension == 'mp3' || $document->extension == 'waw')
                                        <li>
                                            <audio controls>
                                                <source src="/storage/{{ $document->path }}" type="audio/mpeg">
                                                Your browser does not support the audio element.
                                            </audio>
                                        </li>
                                    @else
                                        <li><a href="/document/download/{{ $document->id }}" class="icon-{{ $document->extension }}">{{ $document->description }}</a> </li>
                                    @endif
                                @endforeach
                            </ul>
                        </div>

                        <div class="image-galery">
                            @foreach($item->images as $image)
                                @if($item->header_image_id != $image->id)
                                    <a href="/storage/blog/images/full/{{ $image->file_name }}" data-lightbox="roadtrip" data-title="{{ $image->description }}">
                                        <img src="/storage/blog/images/thumb/{{ $image->file_name }}" alt="{{ $image->description }}">
                                    </a>
                                @endif
                            @endforeach
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>
@stop