openproject/frontend/public/templates/components/inplace_editor.html

<span ng-if="!isEditable">{{ entity.props[attribute] }}</span>
<div ng-if="isEditable" class="inplace-editor type-{{type}}" ng-class="{busy: isBusy, preview: isPreview}">
  <div class="ined-read-value" ng-class="{ default: placeholderSet }" ng-hide="isEditing" ng-switch="type">
    <span class="read-value-wrapper" ng-switch-when="wiki_textarea" ng-bind-html="readValue"></span>
    <span class="read-value-wrapper" ng-switch-default ng-bind="readValue"></span>
    <span class="editing-link-wrapper">
      <accessible-by-keyboard execute="startEditing()">
        <icon-wrapper icon-name="edit" icon-title="{{ editTitle }}">
        </icon-wrapper>
      </accessible-by-keyboard>
    </span>
  </div>
  <div class="ined-edit" ng-if="isEditing">
    <form name="editForm" ng-submit="submit(false)" novalidate>
      <div class="ined-input-wrapper" ng-switch="type">
        <div class="ined-input-wrapper-inner">
          <input ng-switch-when="text"
                 class="focus-input"
                 name="value"
                 type="text"
                 ng-disabled="isBusy"
                 ng-model="dataObject.value" />
          <textarea ng-switch-when="textarea"
                    class="focus-input"
                    name="value"
                    ng-disabled="isBusy"
                    ng-model="dataObject.value">
          </textarea>
          <textarea wiki-toolbar ng-switch-when="wiki_textarea"
                    class="focus-input"
                    ng-show="!isPreview || isBusy"
                    preview-toggle="togglePreview()"
                    name="value"
                    ng-disabled="isBusy"
                    ng-model="dataObject.value"
                    data-wp_autocomplete_url="{{ autocompletePath }}">
          </textarea>
          <select ng-switch-when="select"
                  class="focus-input"
                  name="value"
                  ng-disabled="isBusy"
                  ng-model="dataObject.value"
                  ng-options="item.href as item.title for item in options"></select>
        </div>
        <div class="preview-wrapper" ng-if="isPreview && !isBusy">
          <span ng-bind-html="previewHtml"></span>
        </div>
      </div>
      <div class="ined-errors" ng-show="error" role="alert" ng-bind="error"></div>
      <div class="ined-controls" ng-hide="isBusy">
        <accessible-by-keyboard execute="editForm.$valid && submit(false)" class="ined-edit-save">
          <icon-wrapper icon-name="yes" icon-title="{{ saveTitle }}">
          </icon-wrapper>
        </accessible-by-keyboard>
        <accessible-by-keyboard execute="editForm.$valid && submit(true)" class="ined-edit-save-send">
          <span title="{{ saveAndSendTitle }}">
            <i class="icon-yes"></i>
            <i class="icon-mail"></i>
          </span>
        </accessible-by-keyboard>
        <accessible-by-keyboard execute="discardEditing()" class="ined-edit-close">
          <icon-wrapper icon-name="close" icon-title="{{ cancelTitle }}">
          </icon-wrapper>
        </accessible-by-keyboard>
      </div>
    </form>
  </div>
</div>