{% apply spaceless %}
{% if form.submission and form.status %}
<div class="row">
  <div class="col-12">
    <div class="alert alert-success">
      {{ form.parameters.messages.success ?? "The form has been successfully submitted." }}
    </div>
  </div>
</div>
{% elseif form.submission and (not form.status) %}
<div class="row">
  <div class="col-12">
    <div class="alert alert-danger">
      {% if form.parameters.messages.error %}
      {{ form.parameters.messages.error }}
      {% else %}
      {% for descriptor, message in form.errors %}
      <div>{{ descriptor }}: {{ message|join(', ') }}</div>
      {% endfor %}
      {% endif %}
    </div>
  </div>
</div>
{% endif %}
<form method="post" id="form-{{ form.id }}">
{% for tab in form.tabs %}
  <div class="row wpcrm-form">
  {% if tab.showLabel %}<div class="col-sm-12"><h5>{{ tab.label }}</h5></div>{% endif %}
  {% for column in tab.columns %}
    <div class="col-sm-{{ ( column.width / 100 * 12)|round }} wpcrm-form-column">
    {% for section in column.sections %}
    <div class="row wpcrm-form-section">
    {% if section.showLabel %}<div class="col-sm-12 wpcrm-form-section-label"><strong>{{ section.label }}</strong></div>{% endif %}
      <div class="col-sm-12">
      {% for row in section.rows %}
        {% set cellWidth = 12/(row|length) %}
        <div class="row">
        {% for cell in row %}
          {% if cell.isVisible %}
            {% if cell.isSpacer %}
              <div class="col-12 pb-3 mb-3 wpcrm-form-spacer"></div>
            {% else %}
            {% set control = cell.control %}
              <div class="col-sm-{{ cellWidth }} wpcrm-form-cell">
                <div class="form-group row">
                  {% set controlDisabled = control.disabled %}
                  {% if not controlDisabled %}
                    {% if form.parameters.mode == "create" %}
                      {% set controlDisabled = not(control.metadata.isValidForCreate) %}
                    {% elseif form.parameters.mode == "edit" %}
                      {% set controlDisabled = not(control.metadata.isValidForUpdate) %}
                    {% elseif form.parameters.mode == "upsert"  %}
                      {% if form.record %}
                        {% set controlDisabled = not(control.metadata.isValidForUpdate) %}
                      {% else %}
                        {% set controlDisabled = not(control.metadata.isValidForCreate) %}
                      {% endif %}
                    {% endif %}
                  {% endif %}
                  {% set labelWidth = (cell.showLabel? (section.cellLabelPosition == 'top'? 12 : 4) : 0) %}
                  {% set controlWidth = (12 - labelWidth) %}
                  {% if controlWidth == 0 %}{% set controlWidth = 12 %}{% endif %}
                  {% if cell.showLabel and section.cellLabelPosition == 'left' %}
                  <label class="col-form-label col-sm-{{ labelWidth }}" for="{{ control.id }}">{{ cell.label }} {{ control.required? '*' : '' }}</label>
                  {% elseif cell.showLabel %}
                  <div class="col-sm-{{ labelWidth }}" style="text-align:{{ section.cellLabelAlignment }};">
                    <label class="form-control-label" for="{{ control.id }}">{{ cell.label }} {{ control.required? '*' : '' }}</label>
                  </div>
                  {% endif %}
                  <div class="col-sm-{{ controlWidth }} {% if control.name in form.errors|keys %}has-danger{% endif %}">
                  {% if control.classId in [ '{4273EDBD-AC1D-40D3-9FB2-095C621B552D}' ] %}{# text field #}
                    {% if control.name == 'fullname' %}{# decompose fullname into firstname and lastname #}
                      {% include "form/fullname.twig" %}
                    {% else %}{# text field #}
                      <input type="text" id="{{ control.id }}" name="{{ control.name }}" class="form-control" {% if controlDisabled %}readonly="readonly"{% endif %} value="{{ attribute( form.record, (control.name == "__compat_name"? "name" : control.name) ) ?? form.defaults[(control.name == "__compat_name"? "name" : control.name )] }}">
                      {% for errorMessage in form.errors[control.name] %}
                        <div class="form-control-feedback">{{ errorMessage }}</div>
                      {% endfor %}
                    {% endif %}
                  {% elseif control.classId == '{ADA2203E-B4CD-49BE-9DDF-234642B43B52}' %}{# email field #}
                    <input type="email" id="{{ control.id }}" name="{{ control.name }}" class="form-control" {% if controlDisabled %}readonly="readonly"{% endif %} value="{{ attribute( form.record, control.name ) ?? form.defaults[control.name] }}">
                    {% for errorMessage in form.errors[control.name] %}
                      <div class="form-control-feedback">{{ errorMessage }}</div>
                    {% endfor %}
                  {% elseif control.classId == '{71716B6C-711E-476C-8AB8-5D11542BFB47}' %}{# url field #}
                    <input type="url" id="{{ control.id }}" name="{{ control.name }}" class="form-control" {% if controlDisabled %}readonly="readonly"{% endif %} value="{{ attribute( form.record, control.name ) ?? form.defaults[control.name] }}">
                    {% for errorMessage in form.errors[control.name] %}
                      <div class="form-control-feedback">{{ errorMessage }}</div>
                    {% endfor %}
                  {% elseif control.classId == '{5B773807-9FB2-42DB-97C3-7A91EFF8ADFF}' %}{# datetime field #}
                    {% set dateOnly = (control.metadata.format == 'DateOnly') %}
                    {% set dateFormat = dateOnly? form.options.dateformat : form.options.datetimeformat %}
                    <input type="datetime" id="{{ control.id }}" name="{{ control.name }}" class="form-control {{ dateOnly? 'crm-datepicker' : 'crm-datetimepicker' }}" {% if controlDisabled %}disabled="disabled"{% endif %} value="{{ attribute( form.record, control.name )? attribute( form.record, control.name )|date(dateFormat) : form.defaults[control.name] }}">
                    {% for errorMessage in form.errors[control.name] %}
                      <div class="form-control-feedback">{{ errorMessage }}</div>
                    {% endfor %}
                  {% elseif control.classId == '{67FAC785-CD58-4F9F-ABB3-4B7DDC6ED5ED}' %}{# radio field #}
                    {% include "form/radio.twig" %}
                    {% for errorMessage in form.errors[control.name] %}
                      <div class="form-control-feedback">{{ errorMessage }}</div>
                    {% endfor %}
                  {% elseif control.classId == '{3EF39988-22BB-4F0B-BBBE-64B5A3748AEE}' or
                    control.classId == '{5D68B988-0661-4DB2-BC3E-17598AD3BE6C}'
                  %}{# select field #}
                    {% include "form/select.twig" %}
                    {% for errorMessage in form.errors[control.name] %}
                      <div class="form-control-feedback">{{ errorMessage }}</div>
                    {% endfor %}
                  {% elseif control.classId == '{4AA28AB7-9C13-4F57-A73D-AD894D048B5F}' %}{# multi-select field #}
                    {% include "form/multi-select.twig" %}
                    {% for errorMessage in form.errors[control.name] %}
                      <div class="form-control-feedback">{{ errorMessage }}</div>
                    {% endfor %}
                  {% elseif control.classId == '{B0C6723A-8503-4FD7-BB28-C8A06AC933C2}' %}{# checkbox field #}
                    {% set controlValue = attribute( form.record, control.name ).value %}
                    {% if controlValue is null %}
                      {% set controlValue = attribute( form.record, control.name ) %}
                    {% endif %}
                    {% if controlValue is null %}
                      {% set controlValue = form.defaults[control.name] %}
                    {% endif %}
                    {% if not controlDisabled %}
                      <input type="hidden" name="{{ control.name }}" value="0">
                    {% endif %}
                    <div class="form-check form-check-inline">
                      <label class="form-check-label"><input type="checkbox" id="{{ control.id }}" name="{{ control.name }}" class="form-check-input" value="1" {{ controlValue? 'checked="checked"' : '' }} {% if controlDisabled %}disabled="disabled"{% endif %}></label>
                    </div>
                    {% for errorMessage in form.errors[control.name] %}
                      <div class="form-control-feedback">{{ errorMessage }}</div>
                    {% endfor %}
                  {% elseif control.classId == '{270BD3DB-D9AF-4782-9025-509E298DEC0A}' %}{# lookup field #}
                    {% set controlValue = attribute( form.record, control.name ) %}
                    {% if controlValue is null %}
                      {% set controlValue = form.defaults[control.name]|toEntityReference %}
                    {% endif %}
                    {% set lookupTypes = {} %}
                    {% for lookupType in control.metadata.lookupTypes %}
                      {% set lookupTypes = lookupTypes|merge( { (lookupType): entities_list[lookupType] ?? lookupType|capitalize } ) %}
                    {% endfor %}
                    <div class="input-group wpcrm-lookup" data-types="{{ lookupTypes|json_encode }}">
                      <input type="text" id="{{ control.id }}" data-field="{{ control.name }}" class="form-control wpcrm-lookup-display" readonly="readonly" value="{{ controlValue.DisplayName }}">
                      {% if not controlDisabled %}
                        <span class="input-group-btn">
                        {% if controlValue %}
                          <button class="btn btn-secondary" type="button" data-action="disassociate"><i class="fa fa-times" aria-hidden="true"></i></button>
                        {% else %}
                          <button class="btn btn-secondary" type="button" data-action="associate"><i class="fa fa-search" aria-hidden="true"></i></button>
                        {% endif %}
                        </span>
                      {% endif %}
                    </div>
                    {% for errorMessage in form.errors[control.name] %}
                      <div class="form-control-feedback">{{ errorMessage }}</div>
                    {% endfor %}
                    <input type="hidden" name="{{ control.name }}" value="{{ { "LogicalName": controlValue.logicalName, "Id": controlValue.id, "DisplayName": controlValue ~ '' }|json_encode }}">
                  {% elseif control.classId == '{628064E7-E104-4B65-9EBF-3ED02F9AEBB6}' %}{# lookup view field #}
                    {% set controlValue = attribute( form.record, control.name ) %}
                    {% if controlValue is null %}
                      {% set controlValue = form.defaults[control.name]|toEntityReference %}
                    {% endif %}
                    <select id="{{ control.id }}" name="{{ control.name }}" class="form-control" {% if controlDisabled %}disabled="disabled"{% endif %} autocomplete="off">
                      <option value=""></option>
                      {% for optionRecord in control.options %}
                        {% set optionValue = { "LogicalName": optionRecord.logicalName, "Id": optionRecord.id, "DisplayName": optionRecord.displayName } %}
                        <option value="{{ optionValue|json_encode }}" {{ (controlValue.id == optionRecord.id)? 'selected="selected"' : '' }}>
                          {% if control.displayAttribute != null %}
                            {{ optionRecord|formatted_value(control.displayAttribute) }}
                          {% else %}
                            {{ optionRecord.displayName }}
                          {% endif %}
                        </option>
                      {% endfor %}
                    </select>
                    {% for errorMessage in form.errors[control.name] %}
                      <div class="form-control-feedback">{{ errorMessage }}</div>
                    {% endfor %}
                  {% elseif control.classId == '{E0DECE4B-6FC8-4A8F-A065-082708572369}' %}{# textarea field #}
                    {% if control.name matches '/address\\d_composite/' %}{# decompose composite address field #}
                      {% include "form/address.twig" %}
                    {% else %}{# textarea field #}
                      <textarea class="form-control" id="{{ control.id }}" name="{{ control.name }}" rows="{{ cell.rowspan ?? 3 }}" {% if controlDisabled %}readonly="readonly"{% endif %}>{{ attribute( form.record, control.name ) ?? form.defaults[control.name] }}</textarea>
                      {% for errorMessage in form.errors[control.name] %}
                        <div class="form-control-feedback">{{ errorMessage }}</div>
                      {% endfor %}
                    {% endif %}
                  {% elseif control.classId == '{533B9E00-756B-4312-95A0-DC888637AC78}' or
                            control.classId == '{C3EFE0C3-0EC6-42BE-8349-CBD9079DFD8E}' or
                            control.classId == '{C6D124CA-7EDA-4A60-AEA9-7FB8D318B68F}' %}{# money, decimal, integer #}
                    <input type="text" id="{{ control.id }}" name="{{ control.name }}" class="form-control" {% if controlDisabled %}readonly="readonly"{% endif %} value="{{ attribute( form.record, control.name ) ?? form.defaults[control.name] }}">
                  {% endif %}
                  </div>
                </div>
              </div>
            {% endif %}
          {% endif %}
        {% endfor %}
        </div>
      {% endfor %}
      </div>
    </div>
    {% endfor %}
  </div>
  {% endfor %}
</div>
{% if form.captcha.enabled %}
  <div class="row wpcrm-form-captcha">
    <div class="col-sm-12">
      <div class="form-group">
        <div class="g-recaptcha" data-sitekey="{{ form.captcha.sitekey }}"></div>
      </div>
    </div>
  </div>
{% endif %}
{% endfor %}
<div class="row">
  <div class="col-sm-12">
    <button type="submit" class="btn btn-primary">Submit</button>
  </div>
</div>
{% for fieldName, fieldValue in form.hiddenDefaults %}
  {% if fieldValue is iterable %}
    <input type="hidden" name="{{ fieldName }}" value="{{ fieldValue|json_encode }}">
  {% else %}
    <input type="hidden" name="{{ fieldName }}" value="{{ fieldValue }}">
  {% endif %}
{% endfor %}
  <input type="hidden" name="_key" value="{{ form.key }}">
</form>
{% embed "form/lookup.twig" %}{% endembed %}
<script>
  (function(w, $) {
    var validationRules = {};

    w.wpcrmFormValidationRules = w.wpcrmFormValidationRules || {};
    w.wpcrmFormValidationRules['{{ form.id }}'] = validationRules;

    function filterOptions(){
      if ($('select[data-wpcrm-statecode-input]').length === 0) {
        return;
      }

      var currentState = $('select[data-wpcrm-statecode-input]').val();
      var allStatusOptions = $('select[data-wpcrm-statuscode-input] option');
      var activeStatusOptions = $('select[data-wpcrm-statuscode-input] option[data-wpcrm-state=' + currentState + ']');

      allStatusOptions.prop({
        'hidden': true,
        'disabled': true
      });

      activeStatusOptions.prop({
        'hidden': false,
        'disabled': false
      });
    }

    function setSelectedOption(){
      $('select[data-wpcrm-statuscode-input] option:not([hidden])').first().prop('selected', true);
    }

    $('select[data-wpcrm-statecode-input]').on('change', function() {
      filterOptions();
      setSelectedOption();
    });

    filterOptions();
  }(window, jQuery));
</script>
{% endapply %}