kibana-with-account/src/plugins/kibana/public/visualize/editor/editor.html

kibana-with-account is develop based kibana project

<div ng-controller="VisEditor" class="vis-editor vis-type-{{ vis.type.name }}">

  <navbar ng-if="chrome.getVisible()">
    <div class="fill bitty-modal-container">
      <div ng-if="vis.type.requiresSearch && $state.linked && !unlinking"
        ng-dblclick="unlink()"
        tooltip="Double click to unlink this visualization from the saved search"
        class="bitty-modal visualize-linked">
        <i aria-hidden="true" class="fa fa-link"></i>
        &nbsp;
        This visualization is linked to a saved search:
        <b>{{ savedVis.savedSearch.title }}</b>
      </div>

      <div
        ng-if="vis.type.requiresSearch && unlinking"
        ng-click="clearUnlinking()"
        class="bitty-modal">
        <i aria-hidden="true" class="fa fa-chain-broken"></i> Unlinked!
      </div>

      <form ng-if="vis.type.requiresSearch && $state.linked" class="inline-form fill" name="queryInput">
        <div class="typeahead">
          <div class="input-group">
            <input
              disabled
              type="text"
              class="form-control">

            <button
              class="btn btn-default" type="submit"
              ng-disabled="true" aria-label="Search">
              <span aria-hidden="true" class="fa fa-search"></span>
            </button>
          </div>
        </div>
      </form>

      <form
        ng-if="vis.type.requiresSearch && !$state.linked"
        ng-submit="fetch()"
        class="inline-form fill"
        name="queryInput">
        <div class="typeahead" kbn-typeahead="visualize">
          <div class="input-group"
            ng-class="queryInput.$invalid ? 'has-error' : ''">
            <input
              ng-model="state.query"
              parse-query
              input-focus
              kbn-typeahead-input
              placeholder="Search..."
              type="text"
              class="form-control">

            <button
              class="btn btn-default" type="submit"
              ng-disabled="queryInput.$invalid" aria-label="Search">
              <span aria-hidden="true" class="fa fa-search"></span>
            </button>
          </div>
          <kbn-typeahead-items></kbn-typeahead-items>
        </div>
      </form>
    </div>

    <div class="button-group">
      <kbn-tooltip text="New Visualization" placement="bottom" append-to-body="1">
        <button ng-click="startOver()" aria-label="New Visualization"><i aria-hidden="true" class="fa fa-file-new-o"></i></button>
      </kbn-tooltip>

      <kbn-tooltip text="Save Visualization" placement="bottom" append-to-body="1">
        <!-- normal save -->
        <button
          ng-class="{active: configTemplate.is('save')}"
          ng-click="configTemplate.toggle('save')"
          ng-if="!editableVis.dirty"
          aria-expanded="{{ configTemplate.is('save') }}"
          aria-label="Save Visualization">
          <i aria-hidden="true" class="fa fa-save"></i>
        </button>

        <!-- save stub with tooltip -->
        <button disabled ng-if="editableVis.dirty" tooltip="Apply or Discard your changes before saving" aria-label="Apply or Discard your changes before saving">
          <i aria-hidden="true" class="fa fa-save"></i>
        </button>
      </kbn-tooltip>

      <kbn-tooltip text="Load Saved Visualization" placement="bottom" append-to-body="1">
        <button
          ng-class="{active: configTemplate.is('load')}"
          ng-click="configTemplate.toggle('load')"
          aria-haspopup="true"
          aria-expanded="{{ configTemplate.is('load') }}"
          aria-label="Load Saved Visualization">
          <i aria-hidden="true" class="fa fa-folder-open-o"></i>
        </button>
      </kbn-tooltip>
      <kbn-tooltip text="Share Visualization" placement="bottom" append-to-body="1">
        <button
          ng-class="{active: configTemplate.is('share')}"
          ng-click="configTemplate.toggle('share')"
          aria-haspopup="true"
          aria-expanded="{{ configTemplate.is('share') }}"
          aria-label="Share Visualization">
          <i aria-hidden="true" class="fa fa-external-link"></i>
        </button>
      </kbn-tooltip>
      <kbn-tooltip text="Refresh" placement="bottom" append-to-body="1">
        <button
          ng-click="fetch()"
          aria-label="Refresh">
          <i aria-hidden="true" class="fa fa-refresh"></i>
        </button>
      </kbn-tooltip>
    </div>
  </navbar>

  <config
    ng-if="chrome.getVisible()"
    config-template="configTemplate"
    config-object="conf">
  </config>

  <filter-bar state="state"></filter-bar>

  <div class="vis-editor-content">

    <div class="collapsible-sidebar" ng-if="chrome.getVisible()">
        <vis-editor-sidebar class="vis-editor-sidebar"></vis-editor-sidebar>
    </div>

    <div class="vis-editor-canvas" ng-class="{ embedded: !chrome.getVisible() }">
      <div class="visualize-info" ng-if="savedVis.id">
        <div class="visualize-info-tab" title="{{::savedVis.vis.type.title}}">
          <i class="fa" aria-label="{{::savedVis.vis.type.title}} Icon" ng-class="savedVis.vis.type.icon"></i>
          <span ng-bind="::savedVis.title"></span>
        </div>
      </div>

      <visualize
        vis="vis"
        ui-state="uiState"
        show-spy-panel="chrome.getVisible()"
        editable-vis="editableVis"
        search-source="savedVis.searchSource">
      </visualize>
    </div>
  </div>

</div>