hadoop-yarn-project/hadoop-yarn/hadoop-yarn-ui/src/main/webapp/app/templates/yarn-app/logs.hbs

{{!
 * Licensed to the Apache Software Foundation (ASF) under one
 * or more contributor license agreements.  See the NOTICE file
 * distributed with this work for additional information
 * regarding copyright ownership.  The ASF licenses this file
 * to you 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.
}}

<div class="row">
  <div class="col-md-12">
    <div class="panel panel-default">
      <div class="panel-heading">
        Logs {{collapsible-panel targetId="logFilesCollapsablePanel"}}
      </div>
      <div class="panel-body" id="logFilesCollapsablePanel">
        <label>Log aggregation status:</label>&nbsp;
        <span class={{model.app.logAggregationStatusStyle}}>
          {{model.app.logAggregationStatus}}
        </span>
        {{#if _isLoadingTopPanel}}
          <div class="text-center" style="z-index: 100; position: absolute; left: 46%; top: 45px;">
            <img src="assets/images/spinner.gif" alt="Loading...">
          </div>
        {{/if}}
        {{#if areJHSandATSUnhealthy}}
          <div class="row">
            <div class="col-md-8 col-md-offset-2 alert alert-warning text-center">
              <span class="glyphicon glyphicon-warning-sign" style="padding-right: 10px"></span>
              <span>Logs are unavailable because Application Timeline Service seems unhealthy and could not connect to the JobHistory server.</span>
            </div>
          </div>
        {{else}}
            {{#if attemptList}}
                <div class="row">
                    <div class="col-md-6">
                        <label>Choose attempt to fetch containers</label>
                        <div>
                            <select class="js-fetch-attempt-containers" onchange={{action "showContainersForAttemptId" value="target.value"}} style="max-width:350px;">
                                <option value="" selected={{eq selectedAttemptId ''}}>None</option>
                                {{#each attemptList as |attempt|}}
                                    <option value="{{attempt.id}}" selected={{eq selectedAttemptId attempt.id}}>{{attempt.id}}</option>
                                {{/each}}
                            </select>
                        </div>
                    </div>
                    {{#if attemptContainerList}}
                        <div class="col-md-6">
                            <label>Choose container to fetch logs</label>
                            <div>
                                <select class="js-fetch-logs-containers" onchange={{action "showLogFilesForContainerId" value="target.value"}} style="max-width:350px">
                                    <option value="" selected={{eq selectedContainerId ''}}>None</option>
                                    {{#each attemptContainerList as |container|}}
                                        <option value="{{container.id}}" selected={{eq selectedContainerId container.id}}>{{container.id}}</option>
                                    {{/each}}
                                </select>
                            </div>
                        </div>
                    {{else}}
                        {{#if (and selectedAttemptId (not _isLoadingTopPanel))}}
                            <div class="col-md-4">
                                <h4 class="text-center" style="margin-top:25px;">No container data available!</h4>
                            </div>
                        {{/if}}
                    {{/if}}
                </div>
            {{else}}
                <div class="col-md-12">
                    <h4 class="text-center">No data available!</h4>
                </div>
            {{/if}}
        {{/if}}
      </div>
    </div>
  </div>
</div>
{{#if selectedContainerId}}
  <div class="row">
    <div class="col-md-12">
      <div class="panel panel-default" style="min-height:150px;">
        <div class="panel-heading">
          Log: {{selectedLogFileName}} [ {{selectedContainerId}} &amp; {{selectedAttemptId}} ]
          {{collapsible-panel targetId="logContentCollapsablePanel"}}
        </div>
        <div class="panel-body" id="logContentCollapsablePanel">
          {{#if _isLoadingBottomPanel}}
            <div class="text-center" style="z-index: 100; position: absolute; left: 46%;">
              <img src="assets/images/spinner.gif" alt="Loading...">
            </div>
          {{/if}}
          {{#if containerLogFiles}}
            <div class="row">
              <div class="col-md-6" style="margin-bottom:20px;">
                <label>Choose log for {{selectedContainerId}}</label>
                <div>
                  <select class="js-fetch-log-for-container" onchange={{action "showContentForLogFile" value="target.value"}} style="max-width:350px">
                    <option value="" selected={{eq selectedLogFileName ''}}>None</option>
                    {{#each containerLogFiles as |file|}}
                      <option value="{{file.fileName}}" selected={{eq selectedLogFileName file.fileName}}>{{file.fileName}} - {{file.fileSize}} bytes</option>
                    {{/each}}
                  </select>
                </div>
              </div>
              {{#if selectedLogFileName}}
                <div class="col-md-6">
                  <label>Find in log</label>
                  <div class="input-group" style="max-width:350px;">
                    {{input
                      class="form-control"
                      value=""
                      enter="searchTextInLogContent"
                      id="logSeachInput98765"
                    }}
                    <span class="input-group-btn">
                      <button class="btn btn-default" {{action "findNextTextInLogContent"}}>Find</button>
                    </span>
                  </div>
                </div>
              {{/if}}
            </div>
            <div>
              {{#if selectedLogFileContent}}
                {{#unless showFullLog}}
                  <div>
                    <strong>Showing last 10 lines of log. Click <a href="#" {{action "showFullLogFileContent"}}>here</a> for full log.</strong>
                  </div>
                {{/unless}}
                <pre id="logContentTextArea1234554321" class="log-content-area">{{showLastFewLinesOfLogContent}}</pre>
              {{/if}}
            </div>
          {{else}}
            {{#unless _isLoadingBottomPanel}}
              <div class="col-md-12" style="margin-top:20px;">
                <h4 class="text-center">Logs are not available!</h4>
                {{#if isLogAggregationNotSucceeded}}
                  <h4 class="text-center">Log aggregation may not be complete, check back later!</h4>
                {{/if}}
              </div>
            {{/unless}}
          {{/if}}
        </div>
      </div>
    </div>
  </div>
{{/if}}