<article id='list' class='panel panel-default' ng-controller="commandsCtrl">
    <header>
        <h2>Commands History
            <span class="glyphicon glyphicon-info-sign" uib-tooltip="Shows current WS executed commands"></span>
        </h2>
    </header>
    <div ng-if="commands.length == 0" class="alert alert-info alert-dismissible no-margin-bottom">
        <button type="button" class="close" data-dismiss="alert">
            <span aria-hidden="true">&times;</span>
            <span class="sr-only">Close</span>
        </button>
        <p>No commands found yet.</p>
    </div>
    <table id="commands" ng-if="commands.length > 0" class="tablesorter table table-striped">
        <thead>
            <tr>
                <th><a href="" ng-click="cmdToggleSort('user')">By</a></th>
                <th><a href="" ng-click="cmdToggleSort('command')">Command</a></th>
                <th><a href="" ng-click="cmdToggleSort('date')">Start Date</a></th>
                <th><a href="" ng-click="cmdToggleSort('duration')">Duration</a></th>
            </tr>
        </thead>
        <tbody>
            <tr ng-repeat="cmd in commands | orderObjectBy:cmdSortField:cmdSortReverse">
                <td><b><p uib-tooltip="{{cmd.ip}}">{{cmd.user}}@{{cmd.hostname}}</p></b></td>
                <td class="wrapword">{{cmd.command + ' ' + cmd.params}}</td>
                <td am-time-ago="cmd.date"/>
                <td ng-bind="cmd.duration || 'undefined'"></td>
            </tr>
        </tbody>
    </table>
</article>
