<div ng-controller="Log.LogController">
  <div ng-hide="inDashboard" class="logbar">
    <div class="logbar-container">
      <div class="control-group inline-block log-filter">
        <input class="search-query" type="text" id="logSearch" ng-model="searchText" placeholder="Filter logs...">
      </div>

      <div class="control-group inline-block">
        <form class="form-inline no-bottom-margin">
          <label>Level: </label>

          <select ng-model="filter.logLevelQuery" id="logLevelQuery">
            <option value="" selected="selected">None...</option>
            <option value="TRACE">TRACE</option>
            <option value="DEBUG">DEBUG</option>
            <option value="INFO">INFO</option>
            <option value="WARN">WARN</option>
            <option value="ERROR">ERROR</option>
          </select>
          &nbsp;
          <label>Exact:
            <input type="checkbox" ng-model="filter.logLevelExactMatch"
                   title="Only match exact logging levels rather than using ranges"/>
          </label>
          &nbsp;
          <label>Message Only:
            <input type="checkbox" ng-model="filter.messageOnly"
                   title="Only search inside the message field"/>
          </label>
        </form>
      </div>

      <div class="pull-right">
        <div class="control-group inline-block">
          <a class="btn" ng-href="{{addToDashboardLink()}}" title="Add this view to a dashboard">
            <i class="icon-share"></i>
          </a>
        </div>
      </div>
    </div>
  </div>

  <div class="controller-section log-main" ng-show="logs.length > 0">

    <!--
    <div class="gridStyle" hawtio-datatable="gridOptions"></div>
    -->

    <ul class="log-table" ng-class="isInDashboardClass()">
      <li class="table-head">
        <div>
          <div></div>
          <div><span><i ng-class="sortIcon"></i> Timestamp</span></div>
          <div>Level</div>
          <div>Logger</div>
          <div>Message</div>
        </div>
      </li>
      <li class="table-row" ng-repeat="log in logs" ng-show="filterLogMessage(log)" ng-class="selectedClass($index)">
        <div ng-click="selectRow($index)">
          <div class="title">
            <i class="expandable-indicator"></i>
          </div>
          <!-- we may have the timestamp with milli seconds (not available in all containers) -->
          <div class="title">{{log | logDateFilter}}</div>
          <div class="title"><span class="text-{{logClass(log)}}"><i class="{{logIcon(log)}}"></i> {{log.level}}</span></div>
          <div title="{{log.logger}}" ng-switch="hasLogSourceHref(log)">
            <a ng-href="{{logSourceHref(log)}}" ng-switch-when="true">{{log.logger}}</a>
            <span ng-switch-default>{{log.logger}}</span>
          </div>
          <div class="title" ng-bind-html-unsafe="log.message | highlight:searchText:caseSensitive"></div>
          <!--
          <div class="expandable-body well">
            {{log.message}}
            <dl class="log-stack-trace" ng-hide="!log.exception">
              <dt>Stack Trace:</dt>
              <dd ng-bind-html-unsafe="formatStackTrace(log.exception)"></dd>
            </dl>

          </div>
          -->
        </div>
      </li>
    </ul>

  </div>

  <div ng-show="showRowDetails" class="log-info-panel">
    <div class="log-info-panel-frame">
      <div class="log-info-panel-header">

        <div class="row-fluid">
          <button class="btn" ng-click="showRowDetails = false"><i class="icon-remove"></i> Close</button>
          <div class="btn-group"
             style="margin-top: 9px;"
             hawtio-pager="logs"
             on-index-change="selectRow"
             row-index="selectedRowIndex">
             </div>
          <span>{{selectedRow | logDateFilter}}</span>
          <span class="text-{{logClass(selectedRow)}}"><i class="{{logIcon(selectedRow)}}"></i> <strong>{{selectedRow.level}}</strong></span>
        </div>

        <div class="row-fluid">
          <span title="{{selectedRow.logger}}" ng-switch="hasLogSourceHref(selectedRow)">
            <strong>Logger:</strong>
            <a ng-href="{{logSourceHref(selectedRow)}}" ng-switch-when="true">{{selectedRow.logger}}</a>
            <span ng-switch-default>{{selectedRow.logger}}</span>
          </span>
        </div>
      </div>

      <div class="log-info-panel-body">

        <div class="row-fluid" ng-show="hasLogSourceLineHref(selectedRow)">
          <span><strong>Class:</strong> <span class="green">{{selectedRow.className}}</span></span>
          <span><strong>Method:</strong> {{selectedRow.methodName}}</span>
          <span><strong>File:</strong> <span class="blue">{{selectedRow.fileName}}</span>:<span class="green">{{selectedRow.lineNumber}}</span></span>
        </div>

        <div class="row-fluid">
          <span ng-show="selectedRow.host"><strong>Host:</strong> {{selectedRow.host}}</span>
          <span><strong>Thread:</strong> {{selectedRow.thread}}</span>
        </div>

        <div class="row-fluid" ng-show="hasOSGiProps(selectedRow)">
          <span ng-show="selectedRow.properties['bundle.name']">
            <strong>Bundle Name:</strong> <span class="green">{{selectedRow.properties['bundle.name']}}</span>
          </span>
          <span ng-show="selectedRow.properties['bundle.id']">
            <strong>Bundle ID:</strong> {{selectedRow.properties['bundle.id']}}
          </span>
          <span ng-show="selectedRow.properties['bundle.version']">
            <strong>Bundle Version:</strong> {{selectedRow.properties['bundle.version']}}
          </span>
         </div>

        <div class="row-fluid">
          <dl class="log-message">
            <dt>
              <span>Message:</span>
              <button class="btn"
                      zero-clipboard
                      data-clipboard-text="{{selectedRow.message}}"
                      title="Click to copy this message to the clipboard">
                <i class="icon-copy"></i>
              </button>
            </dt>
            <dd><div hawtio-editor="selectedRow.message" read-only="true"></div></dd>
          </dl>
          <dl class="log-stack-trace" ng-hide="!selectedRow.exception">
            <dt>
              <span>Stack Trace:</span>
              <button class="btn"
                      zero-clipboard
                      data-clipboard-text="{{selectedRow.exception}}"
                      title="Click to copy this stacktrace to the clipboard">
                <i class="icon-copy"></i>
              </button>
            </dt>
            <dd ng-bind-html-unsafe="formatStackTrace(selectedRow.exception)"></dd>
          </dl>
        </div>

        <!--
        <div class="expandable" model="showRaw">
          <div class="title">
            <i class="expandable-indicator"></i><span> Show JSON</span>
          </div>
          <div class="expandable-body">
            <div hawtio-editor="getSelectedRowJson()" read-only="true" mode="javascript"></div>
          </div>
        </div>
        -->

      </div>
    </div>
  </div>

  <div class="controller-section no-log" ng-show="logs.length == 0">
    Loading...
  </div>

  <!--
  <script type="text/ng-template" id="logDetailTemplate">
    <div class="title">
      {{row.message}}
    </div>

    <dl ng-hide="!row.exception">
      <dt>Stack Trace:</dt>
      <dd>
        <ul class="unstyled" ng-repeat="line in row.exception">

          <li class="stacktrace" ng-bind-html-unsafe="formatException(line)"></li>
        </ul>
      </dd>
    </dl>

  </script>
  -->

</div>
