zulip/static/templates/settings/bot-settings.handlebars

<div id="bot-settings" class="settings-section">

  <div class="settings-section-title">
    <i class="icon-vector-github settings-section-icon"></i>
    {{t "Your Bots" }}
  </div>

  <div class="bot-settings-form">
    {{#tr this}}
    <p class="bot-settings-note padded-container">
      Looking for our <a href="/integrations" target="_blank">Integrations</a>
      or <a href="{{ server_uri }}/api" target="_blank">API</a> documentation?
    </p>
    {{/tr}}

    <ol id="bots_list">
    </ol>
    <div id="bot_table_error" class="alert alert-error hide"></div>

    <div class="add-new-bot-box grey-bg">
      <form id="create_bot_form" class="form-horizontal no-padding">
        <h4 class="new-bot-section-title light no-margin">Add a New Bot</h4>
        <div class="new-bot-form">
          <div class="input-group">
            <label for="create_bot_name">{{t "Full name" }}</label>
            <input type="text" name="bot_name" id="create_bot_name" class="required"
                   maxlength=100 placeholder="{{t 'Full Bot Name' }}" value="" />
            <div><label for="create_bot_name" generated="true" class="text-error"></label></div>
          </div>
          <div class="input-group">
            <label for="bot_short_name">{{t "Username" }}</label>
            <input type="text" name="bot_short_name" id="create_bot_short_name" class="required bot_local_part"
                   placeholder="{{t 'bot_user_name' }}" value="" />
                   -{{t "bot" }}@{{ page_params.domain }}
            <div>
              <label for="create_bot_short_name" generated="true" class="text-error"></label>
            </div>
          </div>
          <div class="input-group new-bot-ui">
            <label for="create_bot_default_sending_stream">{{t "Send to stream" }}</label>
            <select name="bot_default_sending_stream" id="create_bot_default_sending_stream"></select>
          </div>
          <div class="input-group new-bot-ui">
            <label for="create_bot_default_events_register_stream">{{t "Listen on" }}</label>
            <select name="bot_default_events_register_stream" id="create_bot_default_events_register_stream"></select>
          </div>
          <div class="input-group">
            <div id="bot_avatar_file"></div>
            <input type="file" name="bot_avatar_file_input" class="notvisible" id="bot_avatar_file_input" value="{{t 'Upload avatar' }}" />
            <button class="btn btn-default display-none" id="bot_avatar_clear_button">{{t "Clear avatar" }}</button>
            <button class="button white" id="bot_avatar_upload_button">{{t "Customize avatar" }}</button> ({{t "Optional" }})
          </div>
          <p>
            <div id="bot_avatar_file_input_error" class="text-error"></div>
          </p>
          <input type="submit" class="button" id="create_bot_button" value="{{t 'Create Bot' }}" />
        </div>
      </form>
    </div>

    <hr class="settings_separator" />

    <div class="form-horizontal" id="api_key_button_box">
      <div class="input-group side-padded-container">
        {{#tr this}}
        <p class="api-key-note">For most bots using the API, you'll want to give each bot
          its own name and API key using the above section.  But if you
          want to write a bot that can access your own private
          messages, you should use your personal API key.
        </p>
        {{/tr}}
        <button class="button white" id="api_key_button">{{t "Show/change your API key" }}</button>
      </div>
    </div>
    <div id="get_api_key_box">
      {{#tr this}}
      <p>Please re-enter your password to confirm your identity.
        (<a href="/accounts/password/reset/" target="_blank">Forgotten it?</a>)</p>
      {{/tr}}
      <form action="/json/fetch_api_key" method="post" class="form-horizontal">
        <div class="control-group">
          <label for="password" class="control-label">{{t "Current password" }}</label>
          <input type="password" autocomplete="off"
                 name="password" id="get_api_key_password" value="" />
        </div>
        <div class="control-group">
          <input type="submit" name="view_api_key" value="{{t 'Get API key' }}"
                 class="btn btn-primary" />
        </div>
      </form>
    </div>
    <div id="show_api_key_box">
      <p>{{t "Your API key:" }}</p>
      <p><b><span id="api_key_value"></span></b></p>
      <button type="submit" class="btn btn-primary regenerate_api_key">
        {{t "Generate new API Key" }}
      </button>
      <div id="user_api_key_error text-error">
      </div>
    </div>

  </div>
</div>