<div ng-if="vm.configuration" class="position-relative">
  <div class="saveConfigurationButton abs-position">
    <button
      class="btn btn-primary wide-config-btn"
      ng-disabled="vm.saving"
      ng-click="vm.saveConfig()"
    >
      Save configuration
    </button>
  </div>

  <div class="lt-module-page__content">
    <div class="container-fluid">
      <div class="wizdom-controls">
        <div class="row wizdom-controls-row noborder">
          <div class="col-sm-12">
            <div class="form-horizontal">
              <div class="form-group">
                <div class="col-sm-4">
                  <label class="control-label"
                    >{{'Added to waitinglist template' | translate}}</label
                  >
                </div>
                <div class="col-sm-8">
                  <wizdom365-template-picker
                    template-url="vm.configuration.addedToWaitinglistTemplate"
                    directory-path="CourseManagement/Templates/EmailTemplates"
                  />
                </div>
              </div>

              <div class="form-group">
                <div class="col-sm-4">
                  <label class="control-label"
                    >{{'Calendar cancel template' | translate}}</label
                  >
                </div>
                <div class="col-sm-8">
                  <wizdom365-template-picker
                    template-url="vm.configuration.calendarCancelTemplate"
                    directory-path="CourseManagement/Templates/EmailTemplates/Calendar"
                  />
                </div>
              </div>

              <div class="form-group">
                <div class="col-sm-4">
                  <label class="control-label"
                    >{{'Calendar invite template' | translate}}</label
                  >
                </div>
                <div class="col-sm-8">
                  <wizdom365-template-picker
                    template-url="vm.configuration.calendarInviteTemplate"
                    directory-path="CourseManagement/Templates/EmailTemplates/Calendar"
                  />
                </div>
              </div>

              <div class="form-group">
                <div class="col-sm-4">
                  <label class="control-label"
                    >{{'Course canceled template' | translate}}</label
                  >
                </div>
                <div class="col-sm-8">
                  <wizdom365-template-picker
                    template-url="vm.configuration.courseCanceledTemplate"
                    directory-path="CourseManagement/Templates/EmailTemplates"
                  />
                </div>
              </div>

              <div class="form-group">
                <div class="col-sm-4">
                  <label class="control-label"
                    >{{'Deregister template' | translate}}</label
                  >
                </div>
                <div class="col-sm-8">
                  <wizdom365-template-picker
                    template-url="vm.configuration.deregisterTemplate"
                    directory-path="CourseManagement/Templates/EmailTemplates"
                  />
                </div>
              </div>

              <div class="form-group">
                <div class="col-sm-4">
                  <label class="control-label"
                    >{{'Message to teacher template' | translate}}</label
                  >
                </div>
                <div class="col-sm-8">
                  <wizdom365-template-picker
                    template-url="vm.configuration.messageToTeacherTemplate"
                    directory-path="CourseManagement/Templates/EmailTemplates"
                  />
                </div>
              </div>

              <div class="form-group">
                <div class="col-sm-4">
                  <label class="control-label"
                    >{{'Metadata changed template' | translate}}</label
                  >
                </div>
                <div class="col-sm-8">
                  <wizdom365-template-picker
                    template-url="vm.configuration.metadataChangedTemplate"
                    directory-path="CourseManagement/Templates/EmailTemplates"
                  />
                </div>
              </div>

              <div class="form-group">
                <div class="col-sm-4">
                  <label class="control-label"
                    >{{'No longer on waitinglist template' | translate}}</label
                  >
                </div>
                <div class="col-sm-8">
                  <wizdom365-template-picker
                    template-url="vm.configuration.noLongerOnWaitinglistTemplate"
                    directory-path="CourseManagement/Templates/EmailTemplates"
                  />
                </div>
              </div>

              <div class="form-group">
                <div class="col-sm-4">
                  <label class="control-label"
                    >{{'Print participants template' | translate}}</label
                  >
                </div>
                <div class="col-sm-8">
                  <wizdom365-template-picker
                    template-url="vm.configuration.printParticipantsTemplate"
                    directory-path="CourseManagement/Templates/ViewTemplates/Print"
                  />
                </div>
              </div>

              <div class="form-group">
                <div class="col-sm-4">
                  <label class="control-label"
                    >{{'Register colleague template' | translate}}</label
                  >
                </div>
                <div class="col-sm-8">
                  <wizdom365-template-picker
                    template-url="vm.configuration.registerColleagureTemplate"
                    directory-path="CourseManagement/Templates/EmailTemplates"
                  />
                </div>
              </div>

              <div class="form-group">
                <div class="col-sm-4">
                  <label class="control-label"
                    >{{'Share template' | translate}}</label
                  >
                </div>
                <div class="col-sm-8">
                  <wizdom365-template-picker
                    template-url="vm.configuration.shareTemplate"
                    directory-path="CourseManagement/Templates/EmailTemplates"
                  />
                </div>
              </div>

              <div class="form-group">
                <div class="col-sm-4">
                  <label class="control-label"
                    >{{'Signup template' | translate}}</label
                  >
                </div>
                <div class="col-sm-8">
                  <wizdom365-template-picker
                    template-url="vm.configuration.signupTemplate"
                    directory-path="CourseManagement/Templates/EmailTemplates"
                  />
                </div>
              </div>

              <div class="form-group">
                <div class="col-sm-4">
                  <label class="control-label"
                    >{{'User moved from waiting list template' |
                    translate}}</label
                  >
                </div>
                <div class="col-sm-8">
                  <wizdom365-template-picker
                    template-url="vm.configuration.userMovedFromWaitingListTemplate"
                    directory-path="CourseManagement/Templates/EmailTemplates"
                  />
                </div>
              </div>

              <div class="form-group">
                <!--add translation to this option-->
                <div class="col-sm-4">
                  <label class="control-label"
                    >{{'Select participant data fields for export' |
                    translate}}</label
                  >
                </div>
                <div class="col-sm-8">
                  <div ng-repeat="field in vm.availableFields">
                    <label>
                      <input
                        type="checkbox"
                        ng-model="vm.selectedFields[$index]"
                        ng-true-value="'{{field}}'"
                        ng-false-value="undefined"
                        ng-disabled="field === 'Name' || field === 'Email'"
                      />
                      {{field}}
                    </label>
                  </div>
                  <input
                    type="text"
                    ng-model="vm.customFields"
                    placeholder="Insert other fields: field1,field2,field3"
                    class="form-control"
                  />
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
</div>
