openfoodnetwork/app/views/registration/steps/_details.html.haml

%script{ type: "text/ng-template", id: "registration/details.html" }
  .container#registration-details
    %ng-include{ src: "'registration/steps.html'" }
    .row
      .small-12.columns
        %header
          %h2= t('.headline')
          %h5{ "ng-if": "::enterprise.type != 'own'" }= t(".enterprise")
          %h5{ "ng-if": "::enterprise.type == 'own'" }= t(".producer")
    %form{ name: 'details', novalidate: true, "ng-controller": "RegistrationFormCtrl", "ng-submit": "selectIfValid('contact',details)" }

      .row
        .small-12.medium-9.large-12.columns.end
          .field
            %label{ for: 'enterprise_name', "ng-if": "::enterprise.type != 'own'" }= t(".enterprise_name_field")
            %label{ for: 'enterprise_name', "ng-if": "::enterprise.type == 'own'" }= t(".producer_name_field")
            %input.chunky{ id: 'enterprise_name', name: 'name', placeholder: "{{'registration.steps.details.producer_name_field_placeholder' | t}}", required: true, "ng-model": 'enterprise.name' }
            %span.error{ "ng-show": "details.name.$error.required && submitted" }
              = t(".producer_name_field_error")

      .row
        .small-12.medium-9.large-6.columns
          .field
            %label{ for: 'enterprise_address' }= t(".address1_field")
            %input.chunky{ id: 'enterprise_address', name: 'address1', required: true, placeholder: "{{'registration.steps.details.address1_field_placeholder' | t}}", "ng-model": 'enterprise.address.address1' }
            %span.error{ "ng-show": "details.address1.$error.required && submitted" }
              = t(".address1_field_error")
          .field
            %label{ for: 'enterprise_address2' }= t(".address2_field")
            %input.chunky{ id: 'enterprise_address2', name: 'address2', required: false, placeholder: "", "ng-model": 'enterprise.address.address2' }

        .small-12.medium-9.large-6.columns.end
          .row
            .small-12.medium-8.large-8.columns
              .field
                %label{ for: 'enterprise_city' }= t('.suburb_field')
                %input.chunky{ id: 'enterprise_city', name: 'city', required: true, placeholder: "{{'registration.steps.details.suburb_field_placeholder' | t}}", "ng-model": 'enterprise.address.city' }
                %span.error{ "ng-show": "details.city.$error.required && submitted" }
                  = t(".suburb_field_error")
            .small-12.medium-4.large-4.columns
              .field
                %label{ for: 'enterprise_zipcode' }= t(".postcode_field")
                %input.chunky{ id: 'enterprise_zipcode', name: 'zipcode', required: true, placeholder: "{{'registration.steps.details.postcode_field_placeholder' | t}}", "ng-model": 'enterprise.address.zipcode' }
                %span.error{ "ng-show": "details.zipcode.$error.required && submitted" }
                  = t(".postcode_field_error")
          .row
            .small-12.medium-8.large-8.columns
              .field
                %label{ for: 'enterprise_country' }= t(".country_field")
                %select.chunky{ id: 'enterprise_country', name: 'country', required: true, "ng-init": "setDefaultCountry(#{DefaultCountry.id})", "ng-model": 'enterprise.country', "ng-options": 'c as c.name for c in countries' }
                %span.error{ "ng-show": "details.country.$error.required && submitted" }
                  = t(".country_field_error")
            .small-12.medium-4.large-4.columns
              .field
                %label{ for: 'enterprise_state' }= t(".state_field")
                %select.chunky{ id: 'enterprise_state', name: 'state', "ng-model": 'enterprise.address.state_id', "ng-options": 's.id as s.abbr for s in enterprise.country.states', "ng-show": 'countryHasStates()', "ng-required": 'countryHasStates()' }
                %span.error{ "ng-show": "details.state.$error.required && submitted" }
                  = t(".state_field_error")

      - if using_google_maps?
        = render 'registration/steps/location_map_google'
      - elsif ContentConfig.open_street_map_enabled
        = render 'registration/steps/location_map_osm'

      .row.buttons
        .small-12.columns
          %hr
          %input.button.primary.right{ type: "submit", value: "{{'continue' | t}}" }