@extends('layouts.master', ['view' => 'contact'])

@section('editable_content')

    <div class="image-wrapper">
        @include('layouts.partials.navigation')

        @if(isset($page->content))
            <div class="content-placeholder">

                {{-- Make extra block for the creative backgrounds in this design :p --}}
                <div class="background"></div>
                <div class="grey-block"></div>

                <div class="grid-row">
                    <span class="right-icon styling"></span>


                    {{-- Impression block --}}
                    <div class="page-impression grid-col">

                        {{-- Quote --}}
                        <div class="quote">
                            <p>‘{{$page->content->translation->name}}’</p>
                        </div>

                        {{-- Maps --}}
                        <div id="map" @if(starts_with($page->code_name, 'so')) data-marker-type="so"
                             @elseif(starts_with($page->code_name, 'vso')) data-marker-type="vso"
                             @else data-marker-type="default"
                             @endif
                             @if(!in_array($page->root->code_name, ['services','jobs','foundation']))
                             data-googlex="{{ \Config::get('business.schools.'.$page->root->code_name.'.googlex') }}"
                             data-googley="{{ \Config::get('business.schools.'.$page->root->code_name.'.googley') }}"
                             @else
                             data-googlex="{{ \Config::get('business.schools.so-vught.googlex') }}"
                             data-googley="{{ \Config::get('business.schools.so-vught.googley') }}"
                             @endif
                        ></div>

                        <span class="left-icon styling"></span>

                    </div>

                    {{-- Main content block --}}
                    <div class="grid-col main">


                        {{-- Loaded content --}}
                        <div class="content">

                            <h1>{{$page->translation->name}}</h1>

                            <div class="content-divider">

                                <div class="contact-info">
                                    <p>

                                        <strong>@lang('translations.postbus')</strong><br/>
                                        {{ \Config::get('business.post_address') }}<br/>
                                        {{ \Config::get('business.post_zip') }} {{ \Config::get('business.post_city') }}

                                        <br/>
                                        <br/>

                                        <strong>{{KommaLang::get('contactInfo')}}</strong><br/>
                                        @if(!in_array($page->root->code_name, ['services','jobs','foundation','academy']))
                                            {{ \Config::get('business.schools.'.$page->root->code_name.'.address') }}<br/>
                                            {{ \Config::get('business.schools.'.$page->root->code_name.'.zip') }} {{ \Config::get('business.schools.'.$page->root->code_name.'.city') }}
                                            <br/>
                                            <br/>
                                            <a href="tel:{{ \Config::get('business.schools.'.$page->root->code_name.'.phone_call') }}">{{ \Config::get('business.schools.'.$page->root->code_name.'.phone_display') }}</a><br/>
                                            <a href="mailto:{{ \Config::get('business.schools.'.$page->root->code_name.'.email') }}">{{ \Config::get('business.schools.'.$page->root->code_name.'.email') }}</a>
                                        @else
                                            {{ \Config::get('business.schools.so-vught.address') }}<br/>
                                            {{ \Config::get('business.schools.so-vught.zip') }} {{ \Config::get('business.schools.so-vught.city') }}
                                        @endif
                                    </p>
                                </div>

                                @unless(in_array($page->root->code_name,[ 'services', 'jobs', 'foundation', 'academy']) )
                                    <div class="faq">
                                        <p>
                                            <strong>{{$links->{$page->school->type.'-faq'}->name}}</strong><br/>
                                            {{KommaLang::get('contactFaq')}}
                                        </p>
                                        <a class="button" href="/{{$links->{$page->school->type.'-faq'}->route}}">
                                            {{$links->{$page->school->type.'-faq'}->name}}
                                        </a>
                                    </div>
                                @endunless

                            </div>

                        </div>

                        {{-- Location description --}}
                        @if(isset($page->content->translation->description['contact_route']))
                            <div class="location-description">
                                {{$page->content->translation->description['contact_route']->description}}
                            </div>
                        @endif

                        {{-- Form --}}
                        @include('forms.contact')

                    </div>
                </div>
            </div>
        @else
            <p>{{$page->code_name}}</p>
        @endif

    </div>

@endsection

@section('extra-js')
    <script type="text/javascript" src="/js/contact.js"></script>
    <script type="text/javascript" src="/js/googleMaps.js"></script>
    <script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyAr_5PdhCcx8O5yJlofJ_kSSjoPW2Fpnfc&callback=initMap"
            type="text/javascript"></script>

    <script>
        $(function () {

            resizeMyPage();

            $(window).resize(
                $.throttle(100, resizeMyPage)
            );
        });

        function resizeMyPage() {
            // Main content must be at least 200px higher then the impression block
            $('.content-placeholder .main').css('min-height', $('.contact .page-impression').height() + 200);

            // Resizing for the grey block on (default)pages
            var greyHeight = $('.content-placeholder .main').height() - $('.contact .page-impression').height() + 100;
            var greyWidth = ($('.content-placeholder').width() - $('.contact .content-placeholder>.grid-row').width()) / 2 + $('.contact .page-impression').width();
            $('.grey-block').height(greyHeight).width(greyWidth);
        }
    </script>

@endsection