{% extends 'layout.html' %}


{% block upload %}
    {{ super() }}
    {% if makedir %}
        <button onclick="mkdir('{{ path }}')" type="button" class="btn btn-secondary btn-primary">Mkdir
        </button>
    {% endif %}

    {% if upload %}
        <a href="/up88{{ path }}" class="btn btn-secondary btn-primary">Upload</a>
    {% endif %}

{% endblock %}


{% block body %}

    <div class="row table-responsive">

        <table class="table order-table">
            <thead>
            <tr>
                <th>Name</th>
                <th>Time</th>
                <th>Size</th>
                <th>Tools</th>

            </tr>
            </thead>
            <tbody>

            {% if nav %}
                <tr>
                    <td><a href="#" onclick="javascript :history.back(-1);" title="back"><span
                            class="glyphicon glyphicon-chevron-left"/>Back</a></td>
                    <td>-</td>
                    <td>-</td>
                    <td>-</td>
                </tr>
            {% endif %}

            {% for file in files %}
                <tr>
                    <td>
                        <a href="{{ file.path }}" title="{{ file.name }}">
                            {% if file.isfile %}
                                <span class="glyphicon glyphicon-file"/>
                            {% else %}
                                <span class="glyphicon glyphicon-folder-open"/>
                            {% endif %}
                            {{ file.name }}
                        </a>
                    </td>
                    <td>{{ file.time }}</td>
                    <td>{{ file.size }}</td>
                    <td>
                        {% if rm %}
                            <a style="cursor:pointer;" onclick="del('{{ file.path }}','{{ file.name }}')"><span
                                    class="glyphicon glyphicon-trash"/></a>
                        {% endif %}

                        {% if zip and not file.isfile %}
                            <a style="margin-left: 10px" href="/zip88{{ file.path }}">
                                <span class="glyphicon glyphicon-download-alt"/>
                            </a>
                        {% endif %}
                    </td>
                </tr>
            {% endfor %}

            </tbody>
        </table>

    </div>

{% endblock %}


{% block script %}
    <script>
        (function (document) {
            'use strict';

            var LightTableFilter = (function (Arr) {

                var _input;

                function _onInputEvent(e) {
                    _input = e.target;
                    var tables = document.getElementsByClassName(_input.getAttribute('data-table'));
                    Arr.forEach.call(tables, function (table) {
                        Arr.forEach.call(table.tBodies, function (tbody) {
                            Arr.forEach.call(tbody.rows, _filter);
                        });
                    });
                }

                function _filter(row) {
                    var text = row.textContent.toLowerCase(),
                        val = _input.value.toLowerCase();
                    row.style.display = text.indexOf(val) === -1 ? 'none' : 'table-row';
                }

                return {
                    init: function () {
                        var inputs = document.getElementsByClassName('light-table-filter');
                        Arr.forEach.call(inputs, function (input) {
                            input.oninput = _onInputEvent;
                        });
                    }
                };
            })(Array.prototype);

            document.addEventListener('readystatechange', function () {
                if (document.readyState === 'complete') {
                    LightTableFilter.init();
                }
            });

        })(document);

        //delete file
        function del(path, name) {
            BootstrapDialog.confirm('Delete ' + name + ' ?', function (result) {
                if (result) {
                    $.post("/delete", {path: path},
                        function (data, status) {
                            if ("success" == status) {
                                if ("1" == data) {
                                    document.location.reload()
                                } else {
                                    BootstrapDialog.alert('Delete Error!');
                                }
                            } else {
                                BootstrapDialog.alert('Server Error!');
                            }
                        });
                }
            });
        }

        //makedir
        function mkdir(path) {
            BootstrapDialog.show({
                title: 'New dir',
                message: '<input type="text" class="form-control">',
                size: BootstrapDialog.SIZE_SMALL,
                buttons: [{
                    label: 'mkdir',
                    action: function (dialogRef) {
                        var name = dialogRef.getModalBody().find('input').val();
                        if ("" != name) {
                            dialogRef.close();
                            $.post("/mkdir", {path: path, name: name},
                                function (data, status) {
                                    if ("success" == status) {
                                        if ("1" == data) {
                                            document.location.reload()
                                        } else {
                                            BootstrapDialog.alert('Mkdir Error!');
                                        }
                                    } else {
                                        BootstrapDialog.alert('Server Error!');
                                    }
                                });
                        }
                    }
                }, {
                    label: 'close',
                    action: function (dialogRef) {
                        dialogRef.close();
                    }
                }]
            });
        }

    </script>

{% endblock %}