{{#with view.category}}

<div {{bindAttr class="view.loading:invisible"}}>
  <div class="modal-body">
    <form>
      <section class='field'>
        <label>{{i18n category.name}}</label>
        {{view Discourse.TextField valueBinding="name" placeholderKey="category.name_placeholder" maxlength="50"}}
      </section>

      <section class='field'>
        <label>{{i18n category.description}}</label>

        {{#if description}}
          {{description}}
        {{else}}
          {{i18n category.no_description}}
        {{/if}}
        {{#if topic_url}}
          <br/>
          <button class="btn btn-small" {{action showCategoryTopic target="view"}}>{{i18n category.change_in_category_topic}}</button>
        {{/if}}
      </section>

      <section class='field'>
        <label>{{i18n category.hotness}}</label>
        {{view Discourse.HotnessView hotnessBinding="hotness"}}
      </section>


      <section class='field'>
        <label>{{i18n category.badge_colors}}</label>
        <div class="category-color-editor">
          <span class='badge-category' {{bindAttr style="view.colorStyle"}}>{{view.categoryName}}</span>

          <div class='input-prepend input-append' style="margin-top: 10px;">
            <span class='color-title'>{{i18n category.background_color}}:</span>
            <span class='add-on'>#</span>{{view Discourse.TextField valueBinding="color" placeholderKey="category.color_placeholder" maxlength="6"}}
            {{view Discourse.ColorsView colorsBinding="view.backgroundColors" usedColorsBinding="view.usedBackgroundColors" valueBinding="color"}}
          </div>

          <div class='input-prepend input-append'>
            <span class='color-title'>{{i18n category.foreground_color}}:</span>
            <span class='add-on'>#</span>{{view Discourse.TextField valueBinding="text_color" placeholderKey="category.color_placeholder" maxlength="6"}}
            {{view Discourse.ColorsView colorsBinding="view.foregroundColors" valueBinding="text_color"}}
          </div>
        </div>
      </section>

    </form>
  </div>
  <div class="modal-footer">
    <button class='btn btn-primary' {{bindAttr disabled="view.disabled"}} {{action saveCategory target="view"}}>{{view.buttonTitle}}</button>
    {{#if view.deleteVisible}}
      <button class='btn btn-danger pull-right' {{bindAttr disabled="view.deleteDisabled"}} {{action deleteCategory target="view"}}><i class="icon icon-trash"></i>{{view.deleteButtonTitle}}</button>
    {{/if}}
  </div>
</div>

{{/with}}