{% extends 'base_software.html' %}

{% block title %}
    <center><h4><b>Session Logs - Hostname: {{ hostname }}</b></h4></center>
{% endblock %}

{% block head %}
<script>
    $(function() {
        var spinner = $('#spinner');
        spinner.hide()

        $("#session-log-datatable").dataTable({
            "sDom": 'ft',
        });

        $(".hide-header").hide();

        var session_logs_table = $("#session-logs-datatable").dataTable({
            "pageLength": 100,
            "scrollY": 250,
            "columnDefs": [{
                "sortable": false,
                "targets": 0,
                "data": 'filepath',
                "render": function ( data, type, row ) {
                    return '<center><input type="checkbox" value="' + data + '" class="check" name="files"></center>';
                }
            }, {
                "targets": 1,
                "data" : 'filename'
            } ]
        });

        $('#session-logs-check-all').click(function () {
            toggle_check_all(session_logs_table, this);
        });

        function toggle_check_all(data_table, this_instance) {
            var filtered_rows = data_table.$('tr', {"filter": "applied"});
            for (var i = 0; i < filtered_rows.length; i++) {
              $(filtered_rows[i]).find('.check').prop('checked', this_instance.checked);
            }
        }

        $("#download-session-logs").on("click", function() {
            session_logs_table.api().ajax.url("/log/api/get_session_logs/table/{{ table }}?record_id=" + {{ record_id }}).load();
            $('#session-logs-dialog').modal({show:true, backdrop:'static'});
        });

        $(".open-file-diff-dialog").on("click", function() {
            get_file_diff($(this).attr('data-diff-file-path'));
        });

        function get_file_diff(diff_file_path) {
            spinner.show();

            $.ajax({
                url: "{{ url_for('log.api_get_session_log_file_diff') }}",
                dataType: 'json',
                data: { diff_file_path: diff_file_path } ,
                success: function(response) {
                    if (response.status != null) {
                        bootbox.alert("<img src=\"{{ url_for('static', filename='error.png') }}\">&nbsp;" + response.status);
                    } else {
                        $.each(response, function(index, element) {

                            $('#file-diff-results').html(element[0].file_diff_contents);
                            $('#diff-download').attr("href", "{{ url_for('log.download_session_log') }}?file_path=" + diff_file_path);
                            $('#file-diff-dialog').modal({show:true, backdrop:'static'});
                        });
                    }
                    spinner.hide();
                }
            });
        }

        $('#session-logs-done').on('click', function(e) {
            var file_list = [];
            $('.check').each(function(index) {
                if (this.checked) {
                    file_list.push($(this).val());
                }
            });

            if(file_list == ''){
                console.log("file_list is empty");
                bootbox.alert("No files were selected.");
                return false;
            }
            $('#download-session-logs-form').attr('action', "{{ url_for('log.api_download_session_logs') }}?file_list[]=" + file_list);
            $('#download-session-logs-form').submit();
        });


    });
</script>

<style>
    .modal-dialog {
        width: 850px;
    }
    div#file-diff-results{
        width: 800px;
        height: 450px;
        overflow: scroll;
    }
</style>
{% endblock %}

{% block main %}

<div id="file-diff-dialog" class="modal" role="dialog">
    <div class="modal-dialog">
        <form method="post" class="form-horizontal">
            <div class="modal-content">
                <div class="modal-header">
                    <div class="pull-right">
                    <a id="diff-download" href="javascript://">
                        <img title="Download File" src="{{ url_for('static', filename='download.png') }}"></a> &nbsp;&nbsp;
                    <button type="button" class="close" data-dismiss="modal">x</button></div>
                    <span class="pull-right" id="spinner">
                         <img src="/static/spinner.gif"> &nbsp;&nbsp;
                    </span>
                    <h4>File Compare</h4>
                </div>
                <div class="modal-body">
                    <div id="file-diff-results"></div>
                </div>
            </div>
        </form>
    </div>
</div>

<div id="session-logs-dialog" class="modal" role="dialog">
    <div class="modal-dialog">
        <form id="download-session-logs-form" name="download-session-logs-form" method="post" class="form-horizontal" action="{{ url_for('log.api_download_session_logs') }}">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal">x</button>
                    <h4>Session Logs</h4>
                </div>
                <div class="modal-body">
                    <table id="session-logs-datatable">
                        <thead>
                            <tr>
                                <th>
                                    <center><input type='checkbox' id='session-logs-check-all'></center>
                                </th>
                                <th>File Name</th>
                            </tr>
                        </thead>
                    </table>
                    <div class="wizard-footer">
                        <div align="center">
                            <input id='session-logs-done' data-dismiss="modal" type='submit' class='btn btn-fill btn-primary btn-wd btn-sm' name='session-logs-done' value='Download' />
                            <input type="button" id="cancel" class="btn btn-fill btn-wd btn-sm" data-dismiss="modal" value="Cancel" />
                        </div>
                        <div class="clearfix"></div>
                    </div>
                </div>
            </div>
        </form>
    </div>
</div>

{% if is_file %}
    <div class="container" style="margin-top: 10px">
        <table cellpadding="0" cellspacing="0" border="0" class="table table-striped table-bordered">
            <thead>
                <tr>
                    <th>Contents</th>
                </tr>
            </thead>
            <tbody>
                <tr>
                    <td>
                        <pre>{{ log_file_contents | replace("^J", '') }}</pre>
                    </td>
                </tr>
            </tbody>
        </table>
    </div>
{% else %}
    <div class="container" style="margin-top: 10px">
        <div class=" col-sm-offset-1 col-sm-10">
        <div class="panel-group" id="accordion" >
            {% if job_info %}
                <div id="panel-job-info" class="panel panel-info">
                    <div class="panel-heading">
                        <div class="panel-title">
                            <a href="#collapse-one" data-toggle="collapse" data-parent="#accordion">
                            <span style="font-size:14px;">Warnings / Errors</span>
                            <i class="glyphicon glyphicon-plus-sign pull-right"></i>
                            </a>
                        </div>
                    </div>
                    <div id="collapse-one" class="panel-collapse collapse in">
                        <div class="panel-body" style="max-height:200px; overflow-y:scroll; overflow-y:scroll; word-wrap:break-word;">
                            <pre>{{ job_info }}</pre>
                        </div>
                    </div>
                </div>
            {% endif %}

            <div id="panel-session-logs" class="panel panel-info">
                <div class="panel-heading">
                    <div class="panel-title">
                        <a href="#collapse-two" data-toggle="collapse" data-parent="#accordion">
                        <span style="font-size:14px;">Session Logs</span>
                        <i class="glyphicon glyphicon-plus-sign pull-right"></i>
                        </a>
                    </div>
                </div>
                <div id="collapse-two" class="panel-collapse collapse in">
                    <div class="panel-body pull-center">
                        <table  class="table table-striped">
                            <thead>
                                <th>
                                    <a id="download-session-logs" href="javascript://">
                                        <img title="Download Session Logs" src="/static/download.png">
                                    </a>
                                </th>
                                <th>Log Files</th>
                            </thead>
                            <tbody>
                                {% for entry, diff_file_path in file_pairs.iteritems() %}
                                <tr>
                                    <td>
                                        <a href="{{ url_for('log.download_session_log') }}?file_path={{ entry }}">
                                            <img title="Download File" src="{{ url_for('static', filename='download.png') }}">
                                        </a>
                                    </td>
                                    <td>
                                        <a href="{{ url_for('log.host_session_log', hostname=hostname, table=table, id=record_id) }}?file_path={{ entry }}" >{{ entry }}</a>
                                    </td>

                                    {% if diff_file_path | length > 0 %}
                                    <td>
                                        <a class="open-file-diff-dialog" data-diff-file-path="{{ diff_file_path }}" href="javascript://">
                                            <img title="View Comparison" src="{{ url_for('static', filename='file_diff.png') }}">
                                        </a>
                                    </td>
                                    {% else %}
                                    <td>&nbsp;</td>
                                    {% endif %}
                                </tr>
                                {% endfor %}
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
        </div>
        </div>
    </div>

{% endif %}

{% endblock %}