discourse-calendar/assets/javascripts/discourse/components/modal/post-event-builder.hbs

<DModal
  @title={{i18n
    (concat
      "discourse_post_event.builder_modal."
      (if @model.event.id "update_event_title" "create_event_title")
    )
  }}
  class="post-event-builder-modal"
  @closeModal={{@closeModal}}
  @flash={{this.flash}}
>
  <:body>
    <ConditionalLoadingSection @isLoading={{this.isSaving}}>
      <form>
        <DateTimeInputRange
          @from={{this.startsAt}}
          @to={{this.endsAt}}
          @timezone={{@model.event.timezone}}
          @onChange={{this.onChangeDates}}
        />

        <EventField
          class="name"
          @label="discourse_post_event.builder_modal.name.label"
        >
          <Input
            @value={{@model.event.name}}
            placeholder={{i18n
              "discourse_post_event.builder_modal.name.placeholder"
            }}
          />
        </EventField>

        <EventField
          class="url"
          @label="discourse_post_event.builder_modal.url.label"
        >
          <Input
            @value={{@model.event.url}}
            placeholder={{i18n
              "discourse_post_event.builder_modal.url.placeholder"
            }}
          />
        </EventField>

        <EventField
          class="timezone"
          @label="discourse_post_event.builder_modal.timezone.label"
        >
          <TimezoneInput
            @value={{@model.event.timezone}}
            @onChange={{this.setNewTimezone}}
            class="input-xxlarge"
            @none="discourse_post_event.builder_modal.timezone.remove_timezone"
          />
        </EventField>

        <EventField @label="discourse_post_event.builder_modal.status.label">
          <label class="radio-label">
            <RadioButton
              @name="status"
              @value="public"
              @selection={{@model.event.status}}
              @onChange={{this.onChangeStatus}}
            />
            <span class="message">
              <span class="title">
                {{i18n "discourse_post_event.models.event.status.public.title"}}
              </span>
              <span class="description">
                {{i18n
                  "discourse_post_event.models.event.status.public.description"
                }}
              </span>
            </span>
          </label>
          <label class="radio-label">
            <RadioButton
              @name="status"
              @value="private"
              @selection={{@model.event.status}}
              @onChange={{this.onChangeStatus}}
            />
            <span class="message">
              <span class="title">
                {{i18n
                  "discourse_post_event.models.event.status.private.title"
                }}
              </span>
              <span class="description">
                {{i18n
                  "discourse_post_event.models.event.status.private.description"
                }}
              </span>
            </span>
          </label>
          <label class="radio-label">
            <RadioButton
              @name="status"
              @value="standalone"
              @selection={{@model.event.status}}
              @onChange={{this.onChangeStatus}}
            />
            <span class="message">
              <span class="title">
                {{i18n
                  "discourse_post_event.models.event.status.standalone.title"
                }}
              </span>
              <span class="description">
                {{i18n
                  "discourse_post_event.models.event.status.standalone.description"
                }}
              </span>
            </span>
          </label>
        </EventField>

        <EventField
          @enabled={{eq @model.event.status "private"}}
          @label="discourse_post_event.builder_modal.invitees.label"
        >
          <GroupSelector
            @fullWidthWrap={{true}}
            @groupFinder={{this.groupFinder}}
            @groupNames={{@model.event.raw_invitees}}
            @onChangeCallback={{this.setRawInvitees}}
            @placeholderKey="topic.invite_private.group_name"
          />
        </EventField>

        <EventField
          class="reminders"
          @label="discourse_post_event.builder_modal.reminders.label"
        >
          <div class="reminders-list">
            {{#each @model.event.reminders as |reminder|}}
              <div class="reminder-item">
                <ComboBox
                  class="reminder-type"
                  @value={{reminder.type}}
                  @nameProperty="name"
                  @valueProperty="value"
                  @content={{this.reminderTypes}}
                />

                <Input
                  class="reminder-value"
                  min={{0}}
                  @value={{reminder.value}}
                  placeholder={{i18n
                    "discourse_post_event.builder_modal.name.placeholder"
                  }}
                />

                <ComboBox
                  class="reminder-unit"
                  @value={{reminder.unit}}
                  @nameProperty="name"
                  @valueProperty="value"
                  @content={{this.reminderUnits}}
                />

                <ComboBox
                  class="reminder-period"
                  @value={{reminder.period}}
                  @nameProperty="name"
                  @valueProperty="value"
                  @content={{this.reminderPeriods}}
                />

                <DButton
                  class="remove-reminder"
                  @icon="times"
                  @action={{fn @model.event.removeReminder reminder}}
                />

              </div>
            {{/each}}
          </div>

          <DButton
            class="add-reminder"
            @disabled={{this.addReminderDisabled}}
            @icon="plus"
            @label="discourse_post_event.builder_modal.add_reminder"
            @action={{@model.event.addReminder}}
          />
        </EventField>

        <EventField
          class="recurrence"
          @label="discourse_post_event.builder_modal.recurrence.label"
        >
          <ComboBox
            class="available-recurrences"
            @value={{@model.event.recurrence}}
            @content={{this.availableRecurrences}}
            @options={{hash
              none="discourse_post_event.builder_modal.recurrence.none"
            }}
          />
        </EventField>

        <EventField
          class="minimal-event"
          @label="discourse_post_event.builder_modal.minimal.label"
        >
          <label class="checkbox-label">
            <Input @type="checkbox" @checked={{@model.event.minimal}} />
            <span class="message">
              {{i18n
                "discourse_post_event.builder_modal.minimal.checkbox_label"
              }}
            </span>
          </label>
        </EventField>

        {{#if this.allowedCustomFields.length}}
          <EventField
            @label="discourse_post_event.builder_modal.custom_fields.label"
          >
            <p class="event-field-description">
              {{i18n
                "discourse_post_event.builder_modal.custom_fields.description"
              }}
            </p>
            {{#each this.allowedCustomFields as |allowedCustomField|}}
              <span class="label custom-field-label">
                {{allowedCustomField}}
              </span>
              <Input
                class="custom-field-input"
                @value={{readonly
                  (get @model.event.custom_fields allowedCustomField)
                }}
                placeholder={{i18n
                  "discourse_post_event.builder_modal.custom_fields.placeholder"
                }}
                {{on "input" (fn this.setCustomField allowedCustomField)}}
              />
            {{/each}}
          </EventField>
        {{/if}}
      </form>
    </ConditionalLoadingSection>
  </:body>
  <:footer>
    {{#if @model.event.id}}
      <DButton
        class="btn-primary"
        @label="discourse_post_event.builder_modal.update"
        @icon="calendar-day"
        @action={{this.updateEvent}}
      />

      <DButton
        @icon="trash-alt"
        class="btn-danger"
        @action={{this.destroyPostEvent}}
      />
    {{else}}
      <DButton
        class="btn-primary"
        @label="discourse_post_event.builder_modal.create"
        @icon="calendar-day"
        @action={{this.createEvent}}
      />
    {{/if}}
  </:footer>
</DModal>