<!DOCTYPE html>
<html lang="en"
      xmlns:layout="http://www.ultraq.net.nz/thymeleaf/layout"
      layout:decorator="default">
<head>

</head>
<body>

<div class="container" layout:fragment="content">

    <section id="paper">
        <div class="container">
            <div class="row">
                <div class="col-lg-12 text-center">
                    <h2 class="section-heading text-uppercase">Редактирование статьи</h2>
                </div>
            </div>
            <div class="row">
                <div class="col-lg-10 text-center">
                </div>
                <div class="col-lg-2 text-center">

                </div>
            </div>
            <div class="row">
                <div class="col-lg-12">
                    <form id="contactForm" name="sentMessage" novalidate="">
                        <div class="row">
                            <div class="col-md-6 col-sm-12">
                                <div class="form-group">
                                    <label for="name">Название:</label>
                                    <input class="form-control" id="name" type="text" placeholder="Название статьи"
                                           required="" data-validation-required-message="Введите название статьи"/>
                                    <p class="help-block text-danger"></p>
                                </div>

                                <div class="form-group">
                                    <label for="status">Статус:</label>
                                    <select class="form-control" id="status">

                                    </select>
                                </div>

                                <div class="form-group">
                                    <label for="comment">Комментарий:</label>
                                    <textarea class="form-control" rows="5" id="comment"></textarea>
                                </div>

                                <div class="form-group">
                                    <label>Дедлайн:</label>
                                    <input type="date" class="form-control" name="deadline"/>
                                </div>

                                <div class="form-check">
                                    <input type="checkbox" class="form-check-input" id="locked"/>
                                    <label class="form-check-label" for="locked">Заблокирована</label>
                                </div>
                                <div class="form-group">
                                    <label for="loader">Загрузить статью:</label>
                                    <div id="loader">

                                    </div>
                                </div>
                                <div class="form-group">
                                    <label>Дата публикации:</label>
                                    <input type="date" class="form-control" name="date-publish"/>
                                </div>
                                <div class="form-group">
                                    <label>Последнее изменение:</label>
                                    <input type="date" class="form-control" name="date-update"/>
                                </div>
                                <p><a href="#myModal1" class="btn btn-primary" data-toggle="modal">Редактировать авторов
                                    статьи</a></p>
                                <div id="myModal1" class="modal fade">
                                    <div class="modal-dialog">
                                        <div class="modal-content">
                                            <div class="modal-header">
                                                <button type="button" class="close" data-dismiss="modal"
                                                        aria-hidden="true">×
                                                </button>
                                                <h4 class="modal-title">Авторы статьи</h4>
                                            </div>
                                            <div class="modal-body">
                                                <table class="table">
                                                    <thead>
                                                    <tr>
                                                        <th>Фамилия</th>
                                                        <th>Имя</th>
                                                        <th>Отчество</th>
                                                    </tr>
                                                    </thead>
                                                    <tbody>
                                                    <tr>
                                                        <td>Иванов</td>
                                                        <td>Иван</td>
                                                        <td>Иванович</td>
                                                        <td>
                                                            <span class="table-remove"><button type="button"
                                                                                               class="btn btn-danger btn-rounded btn-sm my-0">Remove</button></span>
                                                        </td>
                                                    </tr>
                                                    <tr>
                                                        <td>text</td>
                                                        <td>text</td>
                                                        <td>text</td>
                                                        <td>
                                                            <span class="table-remove"><button type="button"
                                                                                               class="btn btn-danger btn-rounded btn-sm my-0">Remove</button></span>
                                                        </td>

                                                        <div class="dropdown">
                                                            <button class="btn btn-primary dropdown-toggle"
                                                                    type="button" data-toggle="dropdown">Выберите автора
                                                                <span class="caret"></span></button>
                                                            <ul class="dropdown-menu">
                                                                <input class="form-control" id="myInput" type="text"
                                                                       placeholder="Search.."/>
                                                                <li><a href="#">Иванов</a></li>
                                                                <li><a href="#">Смирнов</a></li>
                                                                <li><a href="#">Кузнецов</a></li>
                                                            </ul>
                                                        </div>

                                                    </tr>
                                                    </tbody>
                                                </table>
                                            </div>
                                            <div class="modal-footer">
                                                <button type="button" class="btn btn-primary">Сохранить изменения
                                                </button>
                                                <button type="button" class="btn btn-default" data-dismiss="modal">
                                                    Отмена
                                                </button>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="col-md-3 offset-md-3 col-sm-12 offset-sm-0">
                                <div class="form-group">
                                    <button id="pingButton" class="btn btn-primary text-uppercase" type="button">
                                        Ping авторам
                                    </button>
                                </div>
                            </div>

                            <div class="clearfix"></div>
                            <div class="col-lg-12">
                                <div class="form-group">
                                    <button id="sendMessageButton" class="btn btn-success text-uppercase"
                                            type="submit">
                                        Сохранить
                                    </button>
                                    <button id="cancelButton" class="btn btn-default text-uppercase" type="button">
                                        Отмена
                                    </button>
                                </div>
                            </div>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </section>
    <script type="text/javascript" src="/js/file-loader.js"></script>
    <script src="/js/papers.js"></script>
    <script>
        /*<![CDATA[*/
        $(document).ready(function () {
            new FileLoader({
                div: "loader",
                url: urlFileUpload,
                maxSize: 1.5,
                extensions: ["doc", "docx", "xls", "jpg", "pdf", "txt", "png"],
                callback: function (response) {
                    showFeedbackMessage("Файл успешно загружен");
                    console.debug(response);
                }
            });

            getFromRest(urlPaperStatuses, function (response) {
                fillSelect($("#status"), response);
            });
        });
        /*]]>*/
    </script>
</div>

</body>

</html>
