<% javascript "contacts/new_contact.js" %>

<h1>
  <%= _("Contact Us") %>
</h1>
<p>
  <%= raw _('%{application_name} is provided by the %{organisation_name}. You can find out more about us on our <a href="%{organisation_url}" target="_blank">website</a>. If you would like to contact us about %{application_name}, please fill out the form below.') % {organisation_name: Rails.configuration.branding[:organisation][:name],
                                     organisation_url: Rails.configuration.branding[:organisation][:url],
                                     application_name: Rails.configuration.branding[:application][:name]} %>
</p>
<div class="column_container">
  <!-- left column  content -->
  <div class="column_left">
    <div class="white_background">
      <%= form_for @contact, url: contacts_path, html: {class: "roadmap-form"} do |f| %>
        <fieldset class="side-by-side">
          <% if ContactUs.require_name %>
            <div>
              <%= f.label :name, (_('Name') + content_tag(:abbr, "*", class: "required")).html_safe %>
              <% if user_signed_in? then %>
                <%= f.text_field :name, value: current_user.name(false) %>
              <% else %>
                <%= f.text_field :name %>
              <% end %>
              <% if f.object.errors[:name].present? %>
                <p class="inline-error"><%= f.object.errors[:name].join(_(" and ")) %></p>
              <% end %>
            </div>
          <% end %>
          
          <div>
            <%= f.label :email, (_('Email') + content_tag(:abbr, "*", class: "required")).html_safe %>
            <% if user_signed_in? then %>
              <%= f.email_field :email, value: current_user.email %>
            <% else %>
              <%= f.email_field :email %>
            <% end %>
            <% if f.object.errors[:email].present? %>
              <p class="inline-error"><%= f.object.errors[:email].join(_(" and ")) %></p>
            <% end %>
          </div>
          
          <% if ContactUs.require_subject %>
            <div>
              <%= f.label :subject, (_('Subject') + content_tag(:abbr, "*", class: "required")).html_safe %>
              <%= f.text_field :subject %>
              <% if f.object.errors[:subject].present? %>
                <p class="inline-error"><%= f.object.errors[:subject].join(_(" and ")) %></p>
              <% end %>
            </div>
          <% end %>
          
          <div>
            <%= f.label :message, (_('Message') + content_tag(:abbr, "*", class: "required")).html_safe %>
            <%= f.text_area :message, rows: 10, class: "input-large" %>
            <% if f.object.errors[:message].present? %>
              <p class="inline-error"><%= f.object.errors[:message].join(_(" and ")) %></p>
            <% end %>
          </div>
          
          <% if !user_signed_in? then %>
            <div>
              <%= t('helpers.security_check') %>
              <%= recaptcha_tags %>
            </div>
          <% end %>
          
          <div>
            <label></label>
            <%= render partial: 'shared/accessible_submit_button',
                       locals: {id: 'create_contact_submit', 
                                val: 'Submit', 
                                disabled_initially: true,
                                tooltip: _('Fill in the required fields')} %>
          </div>
        </fieldset>

      <% end %>
    </div>
  </div>
  
  <!-- right column information -->
  <div class="column_right">
    <div class="white_background">
      <%= raw _("<ul><li>%{organisation_name}</li>
                     <li>%{organisation_address_line1}</li>
                     <li>%{organisation_address_line2}</li>
                     <li>%{organisation_address_line3}</li>
                     <li>%{organisation_address_line4}</li>
                     <li>%{organisation_address_country}</li>
                 </ul>
                 <p>Helpline: %{organisation_telephone}</p>
                <p>Email <a href='mailto:%{organisation_email}?Subject=%{application_name} inquiry' target='_top'>%{organisation_email}</a></p>") %
                  { organisation_name: Rails.configuration.branding[:organisation][:name],
                    organisation_address_line1: Rails.configuration.branding[:organisation][:address_line1],
                    organisation_address_line2: Rails.configuration.branding[:organisation][:address_line2],
                    organisation_address_line3: Rails.configuration.branding[:organisation][:address_line3],
                    organisation_address_line4: Rails.configuration.branding[:organisation][:address_line4],
                    organisation_address_country: Rails.configuration.branding[:organisation][:address_country],
                    organisation_telephone: Rails.configuration.branding[:organisation][:telephone],
                    organisation_email: Rails.configuration.branding[:organisation][:email],
                    application_name: Rails.configuration.branding[:application][:name]} %>
        <!-- map -->
        <div class="div_map">
          <iframe width="90%" height="250" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" src="<%= Rails.configuration.branding[:organisation][:google_maps_link] %>"></iframe>

        </div>
      </div>
  </div>
  
</div>