{% extends "base.html" %}

{% block title %}Tailon{% end %}
{% block description %}Log Viewer{% end %}

{% block body %}
<div id='toolbar'>
    <div class='toolbar-item' id='file-select'>
        <select tabindex='1'></select>
    </div>

    <div class='toolbar-item' id='command-select'>
        <select tabindex='2'></select>
    </div>

    <div class='toolbar-item toolbar-item-fill'>
        <div id='script-input' tabindex='3'>
            <input type='text' name='script' placeholder='script' disabled>
            <div><i class='icon-bookmark'></i></div>
            <div><i class='icon-code'></i></div>
        </div>
    </div>

    <div class='toolbar-item' tabindex='4'>
        <div class='button-group' id='action-bar'>
            <a class='action-download'       title='Download File'>   <i class='fa fa-download'></i></a>
            <a class='action-configure'      title='Configure'>       <i class='fa fa-wrench'></i></a>
            <a class='action-clear-logview'  title='Clear Logview'>   <i class='fa fa-eraser'></i></a>
            <a class='action-hide-toolbar'   title='Hide Toolbar'>    <i class='fa fa-chevron-circle-up'></i></a>
        </div>
    </div>
</div>

<div id='minimized-action-bar' class='hidden'>
    <div class='button-group'>
        <a class='action-show-toolbar' title='Show Toolbar'><i class='fa fa-chevron-circle-down'></i></a>
    </div>
</div>

<div id="configuration">
    <form>
        <p>
            <label for="history-lines">Scrollback lines:</label>
            <input type="number" name="history-lines" id="history-lines", min="0", value="2000">
        </p>
        <p>
            <label for="tail-lines">Tail lines:</label>
            <input type="number" name="tail-lines" id="tail-lines", min="1", value="60">
        </p>
        <p>
            <label for="wrap-lines">Wrap lines:</label>
            <input type="checkbox" name="wrap-lines" id="wrap-lines" checked>
        </p>
    </form>
</div>

<div class='scrollable'>
    <div id='logviewer' class='log-view'></div>
</div>
{% end %}