@extends('frontend.layouts.content-sidebar',
    array('body_class' => 'assessment-page',
        'metaTitle' => strip_tags($object->title),
        'hasRecaptcha' => true,
        'hasMaps' => true))

@section('content-toolbar')
    @include('frontend.templates.components.share_buttons')
@stop

@section('content-top')
    <div class="rich-content assassment-page__title">
        <h1>{{ $object->title }}</h1>
        <img src="{{ url('images/eit-climate-kic-eu-flag-transparent-2.png') }}" class="assessment__logo" alt="Climate-KIC"/>
    </div>
@stop

@section('content-left')
    <div class="rich-content assessment assessment__step1" data-role="step1">
        {!! $object->content !!}
        <button class="std-button dark-blue" type="button" data-acton="next">Start quick assessment</button>
    </div>
    <div class="assessment assessment__step2" data-role="step2">
        <form name="assessmentForm" method="POST" class="form" id="assessment_form">
            <div class="assessment__section-title">
                <h2>Personal details</h2>
                <a href="#" class="assessment__back" data-action="back">Back</a>
            </div>
            <div class="assessment__row">
                <div class="assessment__col assessment__col--1">
                    <div class="form__field" data-field="first_name">
                        <label for="first_name">First name *</label>
                        <input type="text" maxlength="30" id="first_name" name="first_name" />
                    </div>
                </div>
                <div class="assessment__col assessment__col--1">
                    <div class="form__field" data-field="last_name">
                        <label class="input-value">Last name *</label>
                        <input type="text" maxlength="30" id="last_name" name="last_name" />
                    </div>
                </div>
                <div class="assessment__col assessment__col--2">
                <div class="form__field" data-field="job_title">
                    <label for="job_title">Job title *</label>
                    <input type="text" maxlength="60" id="job_title" name="job_title" />
                </div>
                </div>
                <div class="assessment__col assessment__col--2">
                    <div class="form__field" data-field="company">
                        <label for="company" for="company">Company *</label>
                        <input type="text" maxlength="60" id="company" name="company" />
                    </div>
                </div>
                <div class="assessment__col assessment__col--2">
                <div class="form__field" data-field="assessment_email">
                    <label for="assessment_email">E-mail address *</label>
                    <input type="email" maxlength="100" id="assessment_email" name="assessment_email" />
                </div>
                </div>
            </div>
            <div class="assessment__section-title">
                <h2>Site details</h2>
            </div>
            <div class="assessment__row">
                <div class="assessment__col assessment__col--2">
                    <div class="form__field" data-field="site_name">
                        <label for="site_name">Site name *</label>
                        <input type="text" maxlength="200" id="site_name" name="site_name" />
                    </div>
                    <div class="form__field" data-field="site_country">
                        <label for="site_country">Country *</span>
                        <select placeholder="Choose an option..." data-placeholder="Choose an option..." class="is-required-field chosen-select" data-field_type="text" id="site_country" name="site_country">
                            <option value="" disabled selected>Choose an option...</option>
                            <option value="TH">Thailand</option>
                            <option value="MY">Malaysia</option>
                            <option value="VN">Vietnam</option>
                            <option value="OTHER">Other</option>
                        </select>
                        <div class="assessment__country-warning" data-role="warning">
                            <div class="assessment__country-warning-dialog">
                                <p></p>
                                <button class="std-button" type="button" data-action="dismiss">OK</button>
                            </div>
                        </div>
                    </div>
                    <div class="form__field" data-field="rooftop_size">
                        <label for="rooftop_size">Rooftop size [m2]</label>
                        <input type="number" id="rooftop_size" name="rooftop_size" />
                    </div>
                    <div class="form__field" data-field="load_profile" data-role="uploadinfo">
                        <label for="load_profile">Upload load profile *</label>
                        <div>
                            <a href="#" class="form__button" data-action="upload">@lang('Choose File')</a>
                            <span class="assessment__selected-file" data-role="selected">@lang('No file selected')</span>
                            <input type="file" id="load_profile" name="load_profile">
                        </div>
                        <div>
                            <a href="#" class="assessment__no-load-profile" data-action="noload">If you don't have access to your load profile click here</a>
                        </div>
                    </div>
                    <div class="assessment__load-info" data-role="loadinfo">
                        <div class="form__field" data-field="industry_sector">
                            <label for="industry_sector">Industry sector *</label>
                            <select placeholder="Choose an option..." data-placeholder="Choose an option..." data-field_type="text" id="industry_sector" name="industry_sector">
                                <option value="" disabled selected>Choose an option...</option>
                                <option value="food_production">Food Production</option>
                                <option value="logistics">Logistics</option>
                                <option value="consumer_products">Consumer Products</option>
                                <option value="textile">Textile</option>
                                <option value="electronic_equipment">Electronic Equipment</option>
                                <option value="office_building">Office Building</option>
                                <option value="other">Other</option>
                            </select>
                        </div>
                        <div class="form__field" data-field="electricity_consumption">
                            <label for="electricity_consumption">Total annual electricity consumption in MWh *</label>
                            <input type="text" id="electricity_consumption" name="electricity_consumption" />
                        </div>
                        <div>
                            <a href="#" class="assessment__has-load-profile" data-action="hasload">Upload load profile</a>
                        </div>
                    </div>
                </div>
                <div class="assessment__col assessment__col--2">
                    <div class="form__field" data-field="location_found">
                        <label for="location_street">Location *</label>
                        <input
                            class="is-required-field"
                            type="text"
                            maxlength="200"
                            id="location_street"
                            name="location_street"
                            placeholder="Enter a Location"
                            data-role="location"
                        />
                        <div class="assessment__location-map" data-role="map"></div>
                        <input type="hidden" id="location_found" name="location_found" />
                        <input type="hidden" id="location_lat" name="location_lat" />
                        <input type="hidden" id="location_lng" name="location_lng" />
                    </div>
                </div>
            </div>
            <div class="assessment__row">
                <div class="assessment__col assessment__col--2">
                    * Mandatory fields
                </div>
                <div class="assessment__col assessment__col--2">
                    {!! Form::hidden('g-recaptcha-response',null,["class"=>"g-recaptcha-response"]) !!}
                    <input type="hidden" name="is_upload" value="1"/>
                    <input type="button" class="form__button" name="submit" value="Submit"/>
                </div>
            </div>
        </form>
    </div>
    <div class="assessment assessment__step3" data-role="step3">
        <div class="assessment__thank-you">
            {!! $object->summary !!}
        </div>
    </div>
@stop

@section('content-footer')
    @include('frontend.templates.blocks.teaser-block')
    @include('frontend.templates.components.related_footer', array('title' => trans('frontend.further_reading')))
@stop