@extends('Frontend::default_layout')

@section('afterContent')
    <div id="map" class="map"></div><!---/map-->
@stop

@section('content')
    <div class="row margin-bottom-30">
        <div class="col-md-9 mb-margin-bottom-30">
            <div class="headline"><h2>Formularz kontaktowy</h2></div>
            <div id="contact-form-message" class="alert" style="display:none;"></div>
            {{ Former::open_vertical(route('frontend_cms_process_xhr_contact_form'))->id('contact-form') }}
                {{ Former::text('contact_form_name') }}
            
                {{ Former::text('contact_form_email') }}
                
                {{ Former::textarea('contact_form_message')->rows(6) }}    
                <br />
                <p><input type="submit" class="btn-u" value="Wyślij" /></p>
            {{ Former::close() }}
        </div><!--/col-md-9-->
        <div class="col-md-3">
            <div class="headline"><h2>Dane kontaktowe</h2></div>
            <strong>TO I OWO</strong><br />
            <i class="fa fa-map-marker"></i> {{ CachedSettings::get('cms.street') }}<br />
            {{ CachedSettings::get('cms.postal_code') }} {{ CachedSettings::get('cms.city')}}<br />
            <strong>NIP</strong> {{ CachedSettings::get('cms.nip') }}<br />
            <i class="fa fa-phone"></i> {{ CachedSettings::get('cms.phone') }}
        </div>
    </div>
@stop

@section('js')
    <script type="text/javascript">
        var contactMapLng = {{ json_encode(CachedSettings::get('cms.contact_map_longitude')) }};
        var contactMapLat = {{ json_encode(CachedSettings::get('cms.contact_map_latitude')) }};
    </script>
    <script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=true"></script>
    <script type="text/javascript" src="{{ asset('assets/frontend/plugins/gmap/gmap.js') }}"></script>
    <script type="text/javascript" src="{{ asset('assets/frontend/js/pages/page_contacts.js') }}"></script>
    <script type="text/javascript">
        function highlightFormErrors(form, errors) {
            form.find('.form-group').each(function() {
                jQuery(this).removeClass("has-error");
                jQuery(this).find(".help-block").remove();
            });

            jQuery.each(errors, function(key, value) {
                var input = form.find("#" + key);

                input.parents(".form-group").addClass('has-error')
                jQuery("<span>").addClass("help-block").text(value).insertAfter(input);
                ;
            });
        }

        jQuery(document).ready(function() {
            ContactPage.initMap();        

            jQuery(document).ready(function() {       
                jQuery("#contact-form").bind('submit', function(e) {
                    jQuery("#contact-form-send-button").addClass('disabled');
                    var action = jQuery(this).attr('action');

                    e.preventDefault();
                    jQuery.ajax({
                       url: action,
                       dataType: "json",
                       type: "POST",
                       data: jQuery("#contact-form").serialize(),
                    }).done(function(data) {
                        jQuery("#contact-form-message").hide();

                        if(typeof data.validation_errors !== "undefined") {
                            highlightFormErrors(jQuery("#contact-form"), data.validation_errors);
                        } else {
                            switch(data.status) {
                                case 'success':
                                    jQuery("#contact-form-message").removeClass('alert-success').removeClass('alert-danger');
                                    jQuery("#contact-form").fadeOut(600, function() {
                                        jQuery("#contact-form-message").addClass('alert-success').text(data.message);
                                        jQuery("#contact-form-message").fadeIn(400);
                                    });

                                    break;

                                case 'error':
                                    jQuery("#contact-form-message").removeClass('alert-success').removeClass('alert-danger');
                                    jQuery("#contact-form").fadeOut(600, function() {
                                        jQuery("#contact-form-message").addClass('alert-danger').text(data.message);
                                        jQuery("#contact-form-message").fadeIn(400);
                                    });

                                    break;
                            }
                        }
                    }).always(function() {
                        jQuery("#contact-form-send-button").removeClass('disabled');
                    });
                });
            });


        });
    </script>
@stop