<div ng-controller='fullTextSearch' ng-init='init()'>
    <style>
    .table-doc-table {
        margin-left: 0px !important;
        overflow-y: auto;
        overflow-x: scroll;
    }
    ._even {
        display: none;
    }
    #myAccordion {
        width: 90%
    }
    .icon-chevron-down {
        float: right;
        text-decoration:none;
    }
    .icon-chevron-up {
        float: right;
        text-decoration:none;
    }
    .highlight-code {
        padding: 2px 4px;
        color: #d14;
        background-color: #f7f7f9;
        border: 1px solid #e1e1e8;
        white-space: nowrap;
        font-family: Monaco,Menlo,Consolas,"Courier New",monospace;
        border-radius: 3px;
    }
    .tab {
        margin-left: 10px;
    }
    .bold{
        font-weight: bold;
        background: #B8B8B8  ;
    }

    </style>
    <div class="row-fluid">
    </div>

    <div class="row-fluid">
        <div ng-class="{'span3':panel.field_list}" ng-show="panel.fields.length>0 && panel.field_list">
            <div class="sidebar-nav">
                <h5>Limit Your Search <i class=" icon-chevron-sign-left pointer " ng-click="panel.field_list = !panel.field_list" bs-tooltip="'Hide field list'" ng-show="panel.field_list"></i>
                </h5>
                <div id="myAccordion" class="accordion">
                    <div class="accordion-group" ng-repeat="field in panel.fields">
                        <div class="accordion-heading">
                            <a href="#collapse_{{field | safeFragment}}" data-parent="#myAccordion" data-toggle="collapse" class="accordion-toggle">
                            {{facet_label(field)}} <i class="icon-chevron-down"></i>
                            </a>
                        </div>
                        <div class="accordion-body collapse" id="collapse_{{field | safeFragment}}">
                            <div class="accordion-inner">
                                <div ng-repeat="item in facet_data[field]">
                                    <div ng-show="facet_data[field][$index]['count']>0 && $index < panel.facet_limit">
                                        <a href=""  ng-click="set_facet_filter(field,facet_data[field][$index]['value']);" class="tab">{{facet_data[field][$index]['value']}} ({{facet_data[field][$index]['count']}})</a>
                                        <a ng-show="filter_close(field)" ng-click="delete_filter('terms',field)" style="float:right;"><i class="icon-remove"></i></a>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>

            </div>
        </div>
        <div ng-show="!panel.foundResults" style="text-align:center"> <strong>Empty Results</strong></div>
        <div style="{{panel.overflow}}:{{panel.height || row.height}};" ng-class="{'span9':panel.fields.length>0&&panel.field_list ,'span12':panel.fields.length==0}" class="table-doc-table" ng-show="panel.foundResults">
            <i class="pull-left icon-chevron-sign-right pointer" ng-click="panel.field_list = !panel.field_list" bs-tooltip="'Show field list'" ng-show="!panel.field_list"></i>
            <div class="row-fluid" ng-show="panel.paging">
                <div class="span1 offset1" style="text-align:right">
                    <i ng-click="panel.offset = 0" ng-show="panel.offset > 0" class='icon-circle-arrow-left pointer'></i>
                    <i ng-click="panel.offset = (panel.offset - panel.size)" ng-show="panel.offset > 0" class='icon-arrow-left pointer'></i>
                </div>
                <div class="span8" style="text-align:center">
                    <strong>{{panel.offset + 1 }}</strong> to
                    <strong>{{dashboard.numberWithCommas(panel.offset + data.slice(panel.offset,panel.offset+panel.size).length)}}</strong>
                    <small>of {{dashboard.numberWithCommas(data.length)}} available for paging</small>
                </div>
                <div class="span1" style="text-align:left">
                    <i ng-click="panel.offset = (panel.offset + panel.size)" ng-show="data.length > panel.offset+panel.size" class='icon-arrow-right pointer'></i>
                </div>
            </div>
            <table class="table-hover table table-condensed" ng-style="panel.style">
                <thead ng-show="panel.header">
                </thead>
                <tbody ng-repeat="event in data | slice:panel.offset:panel.offset+panel.size" ng-class-odd="'odd'">
                    <tr>
                        <!--                         <td>
                            {{event.kibana._source|stringify|tableTruncate:panel.trimFactor:1}}
                        </td> -->
                        <td>
                            <i class=" icon-chevron-sign-down pointer " bs-tooltip="'Show document'" style="float: right;" ng-click="toggle_details(event)"></i>
                            <a href="{{event.kibana._source[panel.url_field]}}" target="_blank"> {{event.kibana._source[panel.header_field] | tableTruncate:panel.trimFactor:1}} </a>
                            <br>
                            <div ng-show="highlight_flag" ng-bind-html="(highlighting[highlightingKeys[panel.offset + $index]][panel.body_field]) | tableTruncate:panel.trimFactor:3 | tableHighlight"></div>
                            <div ng-show="!highlight_flag" ng-bind-html-unsafe="(event.kibana._source[panel.body_field]) | tableTruncate:panel.trimFactor:3"></div>
                            <br>
                        </td>
                        </td>

                    </tr>
                    <tr ng-show="event.kibana.details">
                        <td colspan={{panel.fields.length}} ng-switch="event.kibana.view">
                            <span>
                                View:
                                <a class="link" ng-class="{'strong':event.kibana.view == 'table'}" ng-click="event.kibana.view = 'table'">Table</a> /
                                <a class="link" ng-class="{'strong':event.kibana.view == 'json'}" ng-click="event.kibana.view = 'json'">JSON</a> /
                                <a class="link" ng-class="{'strong':event.kibana.view == 'raw'}" ng-click="event.kibana.view = 'raw'">Raw</a>
                                <i class="link pull-right icon-chevron-up" ng-click="toggle_details(event)"></i>
                            </span>
                            <table class='table table-bordered table-condensed' ng-switch-when="table">
                                <thead>
                                    <th>Field</th>
                                    <th>Action</th>
                                    <th>Value</th>
                                </thead>
                                <tr ng-repeat="(key,value) in event.kibana._source" ng-class-odd="'odd'">
                                    <td>{{facet_label(key)}}</td>
                                    <td style="white-space:nowrap">
                                        <i class='icon-search pointer' ng-click="build_search(key,value)" bs-tooltip="'Add filter to match this value'"></i>
                                        <i class='icon-ban-circle pointer' ng-click="build_search(key,value,true)" bs-tooltip="'Add filter to NOT match this value'"></i>
                                        <!-- <i class="pointer icon-th" ng-click="toggle_field(key)" bs-tooltip="'Toggle table column'"></i> -->
                                    </td>
                                    <!-- At some point we need to create a more efficient way of applying the filter pipeline
                                    -->
                                    <td style="white-space:pre-wrap" ng-bind-html-unsafe="value|noXml|urlLink|stringify|tablebody|tableTruncate:panel.trimFactor:1"></td>
                                </tr>
                            </table>
                            <pre style="white-space:pre-wrap" ng-bind-html="without_kibana(event)|tableJson:2" ng-switch-when="json"></pre>
                            <pre ng-bind-html="without_kibana(event)|tableJson:1" ng-switch-when="raw"></pre>
                        </td>
                    </tr>
                </tbody>
            </table>
            <div class="row-fluid" ng-show="panel.paging">
                <div class="span1 offset3" style="text-align:right">
                    <i ng-click="panel.offset = 0" ng-show="panel.offset > 0" class='icon-circle-arrow-left pointer'></i>
                    <i ng-click="panel.offset = (panel.offset - panel.size)" ng-show="panel.offset > 0" class='icon-arrow-left pointer'></i>
                </div>
                <div class="span4" style="text-align:center">
                    <strong>{{panel.offset+1}}</strong> to
                    <strong>{{dashboard.numberWithCommas(panel.offset + data.slice(panel.offset,panel.offset+panel.size).length)}}</strong>
                    <small>of {{dashboard.numberWithCommas(data.length)}} available for paging</small>
                </div>
                <div class="span1" style="text-align:left">
                    <i ng-click="panel.offset = (panel.offset + panel.size)" ng-show="data.length > panel.offset+panel.size" class='icon-arrow-right pointer'></i>
                </div>
            </div>
        </div>
    </div>
</div>
