notebook-actionBar.html

<!--
Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
-->
<headroom tolerance="10" offset="30" class="noteAction"
          ng-show="note.id && !paragraphUrl">
  <h3>
    <div style="float: left; width: auto; max-width: 40%"
      ng-controller="ElasticInputCtrl as input">
      <input type="text" pu-elastic-input class="form-control2" placeholder="New name"
             style="min-width: 0px; max-width: 85%; margin-left: 2em;"
             ng-if="input.showEditor" ng-model="input.value" ng-escape="input.showEditor = false" focus-if="input.showEditor"
             ng-blur="updateNoteName(input.value);input.showEditor = false;" ng-enter="updateNoteName(input.value);input.showEditor = false;" />
      <p class="form-control-static2 reverse-ellipsis ellipsis"
         tooltip-placement="bottom"
         uib-tooltip={{noteName(note)}}
         ng-click="input.showEditor = !revisionView; input.value = note.name"
         ng-show="!input.showEditor"><span>{{noteName(note)}}</span></p>
    </div>
    <div style="float: left; padding-bottom: 10px">
      <span class="labelBtn btn-group">
      <button type="button"
              class="btn btn-default btn-xs"
              ng-click="runAllParagraphs(note.id)"
              ng-class="{'disabled':isNoteRunning()}"
              tooltip-placement="bottom" uib-tooltip="Run all paragraphs"
              ng-disabled="revisionView">
        <i class="icon-control-play"></i>
      </button>
      <button type="button"
              class="btn btn-default btn-xs"
              ng-click="toggleAllEditor()"
              ng-hide="viewOnly"
              tooltip-placement="bottom" uib-tooltip="Show/hide the code"
              ng-disabled="revisionView">
        <i ng-class="editorToggled ?  'fa icon-size-fullscreen' :'fa icon-size-actual'"></i></button>
      <button type="button"
              class="btn btn-default btn-xs"
              ng-click="toggleAllTable()"
              ng-hide="viewOnly"
              tooltip-placement="bottom" uib-tooltip="Show/hide the output"
              ng-disabled="revisionView">
        <i ng-class="tableToggled ? 'fa icon-notebook' : 'fa icon-book-open'"></i>
      </button>
      <button type="button"
              class="btn btn-default btn-xs"
              ng-click="clearAllParagraphOutput(note.id)"
              ng-hide="viewOnly"
              ng-class="{'disabled':isNoteRunning()}"
              tooltip-placement="bottom" uib-tooltip="Clear output"
              ng-disabled="revisionView">
        <i class="fa fa-eraser"></i>
      </button>

      <button type="button"
              class="btn btn-default btn-xs"
              ng-hide="viewOnly"
              tooltip-placement="bottom" uib-tooltip="Clone this note" data-source-note-name="{{note.name}}"
              data-toggle="modal" data-target="#noteCreateModal" data-clone="true"
              ng-disabled="revisionView">
        <i class="fa fa-copy"></i>
      </button>
      <button type="button"
              class="btn btn-default btn-xs"
              ng-hide="viewOnly"
              ng-click="exportNote()"
              tooltip-placement="bottom" uib-tooltip="Export this note"
              ng-disabled="revisionView">
        <i class="fa fa-download"></i>
      </button>

      <button type="button"
              class="btn btn-primary btn-xs"
              ng-class="isNoteRunning() ? 'disabled' : ''"
              ng-if="ticket.principal && ticket.principal !== 'anonymous'"
              ng-hide="viewOnly || note.config.personalizedMode !== 'true'"
              ng-click="toggleNotePersonalizedMode()"
              tooltip-placement="bottom" uib-tooltip="Switch to collaboration mode {{isOwner ? '' : '(owner can change)'}}"
              ng-disabled="revisionView">
        <i class="fa fa-user"></i>
      </button>
      <button type="button"
              class="btn btn-default btn-xs"
              ng-class="isNoteRunning() ? 'disabled' : ''"
              ng-if="ticket.principal && ticket.principal !== 'anonymous'"
              ng-hide="viewOnly || note.config.personalizedMode === 'true'"
              ng-click="toggleNotePersonalizedMode()"
              tooltip-placement="bottom" uib-tooltip="Switch to personal mode {{isOwner ? '' : '(owner can change)'}}"
              ng-disabled="revisionView">
        <i class="fa fa-users"></i>
      </button>
    </span>

    <span class="labelBtn btn-group" role="group" ng-if="isRevisionSupported()" >
      <div class="btn-group" role="group">
        <button type="button"
                class="btn btn-default btn-xs dropdown-toggle"
                id="versionControlDropdown"
                ng-hide="viewOnly"
                data-toggle="dropdown"
                tooltip-placement="bottom" uib-tooltip="Version control"
                ng-disabled="revisionView">
          <i class="fa fa-file-code-o"></i>
        </button>
        <button type="button"
                class="btn btn-default btn-xs"
                id="setRevision"
                ng-hide="viewOnly"
                ng-click="setNoteRevision()"
                ng-disabled="!revisionView"
                tooltip-placement="bottom" uib-tooltip="Set revision">
          <i class="fa fa-arrow-circle-o-right"></i>
        </button>
        <ul class="dropdown-menu" style="width:250px"
          aria-labelledby="versionControlDropdown">
          <li>
            <div class="commit-container">
              <div>
                <input type="text"
                       dropdown-input
                       placeholder="commit message"
                       id="note.checkpoint.message"
                       style="width: 145px;"
                       ng-model="note.checkpoint.message"/>
                <button type="button"
                        class="btn btn-default btn-xs"
                        ng-hide="viewOnly"
                        ng-click="checkpointNote(note.checkpoint.message)"
                        style="margin-left: 4px;"
                        tooltip-append-to-body="true"
                        tooltip-class="revisionTooltip"
                        tooltip-placement="bottom" uib-tooltip="Commit this note">Commit
                </button>
              </div>
            </div>
          </li>
        </ul>
        <button type="button"
                class="btn btn-default btn-xs"
                ng-click="toggleRevisionsComparator()"
                tooltip-placement="bottom" uib-tooltip="Compare revisions">
          <i class="fa fa-exchange"></i>
        </button>
      </div>
      <div class="btn-group" role="group">
        <button type="button" class="btn btn-default btn-xs revisionName" title="{{currentRevision}}">
          <div style="overflow: hidden">{{currentRevision}}</div>
        </button>
        <button type="button" ng-if="noteRevisions.length > 0"
          class="btn btn-default dropdown-toggle caretSeparator"
          data-toggle="dropdown" id="revisionsDropdown">
          <span class="caret"></span>
        </button>
        <ul class="dropdown-menu pull-right" aria-labelledby="revisionsDropdown">
          <li ng-repeat="revision in noteRevisions | orderBy:'time':true" class="revision">
            <a style="cursor:pointer" ng-click="visitRevision(revision)">
              <span style="display: block;">
                <strong>{{revision.message}}</strong>
              </span>
              <span class="revisionDate">
                <em>{{formatRevisionDate(revision.time)}}</em>
              </span>
            </a>
          </li>
        </ul>
      </div>
    </span>

    <span class="labelBtn btn-group" id="searchGroup" style="vertical-align:middle; display:inline-block;">
      <button type="button" class="btn btn-default btn-xs dropdown-toggle"
              data-toggle="dropdown" tooltip-placement="bottom" uib-tooltip="Search code"
      ng-click="searchClicked()">
        <i class="fa fa-search"></i>
      </button>
      <ul class="dropdown-menu search-dropdown" ng-click="$event.stopPropagation()"
          ng-style="{left : search.left}" style="width: 350px">
        <li>
          <div class="input-group input-group-sm search-group">
            <span class="input-group-addon">Find</span>
            <input type="text" class="form-control" id="findInput"
                   ng-class="{'no-match': !hasMatches() && search.searchText !== '',
                    'has-match': search.searchText !== ''}"
                   ng-change="markAllOccurrencesAndHighlightFirst()"
                   ng-click="markAllOccurrencesAndHighlightFirst()" ng-keypress="onPressOnFindInput($event)"
                   ng-model="search.searchText"  ng-trim="false"/>
            <span class="input-group-addon after-input" ng-show="search.searchText !== ''"
                  ng-class="{'no-match': !hasMatches() && search.searchText !== ''}">
              {{search.currentOccurrence}} of {{search.occurrencesCount}}
            </span>
            <div class="input-group-btn">
              <button class="btn btn-default" ng-click="prevOccurrence()">
                <i class="fa fa-angle-left" aria-hidden="true"></i>
              </button>
            </div>
            <div class="input-group-btn">
              <button class="btn btn-default" ng-click="nextOccurrence()">
                <i class="fa fa-angle-right" aria-hidden="true"></i>
              </button>
            </div>
          </div>
          <div class="input-group input-group-sm search-group">
            <span class="input-group-addon" style="border-top-width: inherit">Replace</span>
            <input type="text" class="form-control" ng-model="search.replaceText" ng-trim="false"
                   style="border-top-width: inherit"/>
            <div class="input-group-btn">
              <button class="btn btn-default" ng-click="replace()"
                      style="border-top-width: inherit">Replace</button>
            </div>
            <div class="input-group-btn">
              <button class="btn btn-default" ng-click="replaceAll()"
                      style="border-top-width: inherit">All</button>
            </div>
          </div>
        </li>
      </ul>
    </span>

<!-- put the delete action by itself for your protection -->
      <span class="labelBtn" style="vertical-align:middle; display:inline-block;">
        <!-- if the note is in the trash, remove note permanently -->
        <button ng-if="isTrash(note)"
                type="button"
                class="btn btn-default btn-xs"
                ng-click="removeNote(note.id)"
                ng-hide="viewOnly"
                tooltip-placement="bottom" uib-tooltip="Remove this note permanently"
                ng-disabled="revisionView">
          <i class="icon-trash"></i>
        </button>
        <!-- if the note is not in the trash, move to trash -->
        <button ng-if="!isTrash(note)"
                type="button"
                class="btn btn-default btn-xs"
                ng-click="moveNoteToTrash(note.id)"
                ng-hide="viewOnly"
                tooltip-placement="bottom" uib-tooltip="Move this note to trash"
                ng-disabled="revisionView">
          <i class="icon-trash"></i>
        </button>
      </span>

      <span ng-hide="viewOnly">
      <div class="labelBtn btn-group" ng-if="note.config.isZeppelinNotebookCronEnable">
        <div class="btn btn-default btn-xs dropdown-toggle"
             type="button"
             data-toggle="dropdown"
             ng-class="{ 'btn-info' : note.config.cron, 'btn-danger' : note.info.cron, 'btn-default' : !note.config.cron}"
             tooltip-placement="bottom" uib-tooltip="Run scheduler"
             ng-disabled="revisionView || isTrash(note)">
          <span class="fa fa-clock-o"></span> {{getCronOptionNameFromValue(note.config.cron)}}
        </div>
        <ul class="dropdown-menu" role="menu" style="width:300px">
          <li>
            <div class="cron-preset-container">
              Run note with cron scheduler.
              Either choose from preset or write your own <a href="http://www.quartz-scheduler.org/documentation/quartz-2.1.x/tutorials/crontrigger" target="_blank">cron expression</a>.
              <div>
                <span>- Preset</span>
                <a class="cron-preset" ng-repeat="cr in cronOption"
                   type="button"
                   ng-click="setCronScheduler(cr.value)"
                   dropdown-input ng-class="{ 'selected' : cr.value == note.config.cron}">{{cr.name}}</a>
              </div>
              <div>
                <span>- Cron expression</span>
                <input type="text"
                       ng-model="note.config.cron"
                       ng-change="setCronScheduler(note.config.cron)"
                       dropdown-input ng-model-options="{ debounce: 1000 }" />
                <p ng-show="note.info.cron" class="text-danger cron-info">
                  {{note.info.cron}}
                </p>
              </div>
              <div>
                <span>- After execution close the interpreter </span>
                <input type="checkbox"
                       ng-model="note.config.releaseresource"
                       ng-click="setReleaseResource(note.config.releaseresource)"/>
              </div>
            </div>
          </li>
        </ul>
      </div>
    </span>
    </div>


    <div class="pull-right" style="margin-top:15px; margin-right:15px; margin-left: 15px; margin-bottom: 13px; font-size:15px;">
      <span ng-if="!revisionView">
        <span class="setting-btn"
              type="button"
              data-toggle="modal"
              data-target="#shortcutModal"
              tooltip-placement="bottom" uib-tooltip="List of shortcuts">
          <i class="fa fa-keyboard-o"></i>
        </span>
        <span class="setting-btn"
              type="button"
              ng-click="toggleSetting()"
              tooltip-placement="bottom" uib-tooltip="Interpreter binding">
          <i class="fa fa-cog" ng-style="{color: showSetting ? '#3071A9' : 'black' }"></i>
        </span>
        <span class="setting-btn"
              type="button"
              ng-click="togglePermissions()"
              tooltip-placement="bottom" uib-tooltip="Note permissions">
          <i class="fa fa-lock" ng-style="{color: showPermissions ? '#3071A9' : 'black' }"></i>
        </span>
      </span>

      <span class="btn-group">
        <button type="button" class="btn btn-default btn-xs dropdown-toggle"
                data-toggle="dropdown">
          {{note.config.looknfeel}} <span class="caret"></span>
        </button>
        <ul class="dropdown-menu pull-right" role="menu">
          <li ng-repeat="looknfeel in looknfeelOption">
            <a style="cursor:pointer" ng-click="setLookAndFeel(looknfeel)">{{looknfeel}}</a>
          </li>
        </ul>
      </span>
    </div>
  </h3>
</headroom>