Merge branch 'master' into 3-ui

# Conflicts: # src/main/resources/templates/index.html # src/main/resources/templates/papers.html
2018-09-27 10:02:49 +04:00 · 2018-09-27 10:02:49 +04:00 · 948305e4d9
commit 948305e4d9
parent 885c553153 f00a156c45
13 changed files with 571 additions and 158 deletions
--- a/.gitlab-ci.yml
+++ b/.gitlab-ci.yml
@ -1,4 +1,4 @@
-image: gradle:alpine
+image: ubuntu:18.04

 cache:
  key: "$CI_PROJECT_ID"
@ -8,10 +8,17 @@ cache:
 variables:
  GRADLE_OPTS: "-Dorg.gradle.daemon=false"

-#before_script:
+before_script:
+    - 'which ssh-agent || ( apt-get update -y && apt-get install openssh-client -y )'
+    - apt-get install openjdk-8-jdk git -y
+    - eval $(ssh-agent -s)
+    - echo "$SSH_PRIVATE_KEY" | tr -d '\r' | ssh-add - > /dev/null
+    - mkdir -p ~/.ssh
+    - chmod 700 ~/.ssh
+
 build:
  stage: build
-  script: gradle --build-cache assemble
+  script: ./gradlew assemble
  cache:
    key: "$CI_PROJECT_ID"
    policy: push
@ -19,13 +26,15 @@ build:
      - build
      - .gradle

-
-#test:
-#  stage: test
-#  script: gradle check
-#  cache:
-#    key: "$CI_PROJECT_ID"
-#    policy: pull
-#    paths:
-#      - build
-#      - .gradle
+deploy:
+  stage: deploy
+  script:
+    - sh deploy/gdccloud/deploy.sh
+  only:
+    - master
+  cache:
+    key: "$CI_PROJECT_ID"
+    policy: pull
+    paths:
+      - build
+      - .gradle
--- a/README.md
+++ b/README.md
@ -1,3 +1,6 @@
-landing
+https://212.8.234.87:8443 demo
+
+
+Developer mode

 --ng-tracker.dev-mode=true
--- a/deploy/gdccloud/deploy.sh
+++ b/deploy/gdccloud/deploy.sh
@ -0,0 +1,23 @@
+#!/bin/bash
+
+USERSERVER="root@212.8.234.87"
+
+ARTIFACT_NAME="ng-tracker"
+PROCESS_NAME="java -jar $ARTIFACT_NAME"
+
+PROCESS_RUNNING=`ssh -oStrictHostKeyChecking=no $USERSERVER "pgrep -f '$PROCESS_NAME' > /dev/null"`
+
+if $PROCESS_RUNNING
+then
+    ssh $USERSERVER "pkill -f '$PROCESS_NAME'"
+else
+    echo "not running"
+fi
+
+./gradlew assemble
+
+ssh $USERSERVER "cd /tmp && rm -rf $ARTIFACT_NAME*.jar && echo `date` 'killed' >> log_$ARTIFACT_NAME"
+scp build/libs/$ARTIFACT_NAME-0.1.0-SNAPSHOT.jar $USERSERVER:/tmp/$ARTIFACT_NAME-0.1.0-SNAPSHOT.jar
+ssh $USERSERVER -f "cd /tmp/ && /opt/jdk1.8.0_144/bin/java -jar $ARTIFACT_NAME-0.1.0-SNAPSHOT.jar -Xms 512m -Xmx 1024m  --server.port=8443 --server.http.port=8080 >> /home/user/logfile_$ARTIFACT_NAME" &
+sleep 10
+echo "is deployed"
--- a/src/main/java/ru/ulstu/paper/model/Paper.java
+++ b/src/main/java/ru/ulstu/paper/model/Paper.java
@ -12,7 +12,7 @@ import java.util.List;
@Entity
 public class Paper extends BaseEntity {
    public enum PaperStatus {
-        DRAFT("Черновик"), ON_PREPARATION("На подготовке"), COMPLETED("Завершена"), ATTENTION("Обратить внимание");
+        ATTENTION("Обратить внимание"), ON_PREPARATION("На подготовке"), DRAFT("Черновик"), COMPLETED("Завершена");

        private String name;

--- a/src/main/java/ru/ulstu/paper/repository/PaperRepository.java
+++ b/src/main/java/ru/ulstu/paper/repository/PaperRepository.java
@ -3,5 +3,7 @@ package ru.ulstu.paper.repository;
 import org.springframework.data.jpa.repository.JpaRepository;
 import ru.ulstu.paper.model.Paper;

+import java.util.List;
+
 public interface PaperRepository extends JpaRepository<Paper, Integer> {
 }
--- a/src/main/java/ru/ulstu/paper/service/PaperService.java
+++ b/src/main/java/ru/ulstu/paper/service/PaperService.java
@ -8,7 +8,9 @@ import ru.ulstu.paper.model.PaperDto;
 import ru.ulstu.paper.repository.PaperRepository;

 import java.io.IOException;
+import java.util.Arrays;
 import java.util.List;
+import java.util.stream.Collectors;

 import static ru.ulstu.core.util.StreamApiUtils.convert;

@ -25,7 +27,17 @@ public class PaperService {
    }

    public List<PaperDto> findAll() {
-        return convert(paperRepository.findAll(), PaperDto::new);
+        List<Paper> allPapers = paperRepository.findAll();
+        allPapers = allPapers.stream().sorted((paper1, paper2) -> {
+            int statusCompareResult =
+                    Integer.valueOf(Arrays.asList(Paper.PaperStatus.values()).indexOf(paper1.getStatus()))
+                            .compareTo(Integer.valueOf(Arrays.asList(Paper.PaperStatus.values()).indexOf(paper2.getStatus())));
+            if (statusCompareResult != 0) {
+                return statusCompareResult;
+            }
+            return paper1.getTitle().compareTo(paper2.getTitle());
+        }).collect(Collectors.toList());
+        return convert(allPapers, PaperDto::new);
    }

    @Transactional
--- a/src/main/resources/public/css/agency.css
+++ b/src/main/resources/public/css/agency.css
@ -1,6 +1,6 @@
 body {
  overflow-x: hidden;
-  font-family: 'Roboto Slab', 'Helvetica Neue', Helvetica, Arial, sans-serif;
+  font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
 }

 p {
@ -15,6 +15,10 @@ a:hover {
  color: #fec503;
 }

+.text-draft {
+  color: rgba(0, 0, 0, 0.48) !important;
+}
+
 .text-primary {
  color: #fed136 !important;
 }
--- a/src/main/resources/public/js/core.js
+++ b/src/main/resources/public/js/core.js
@ -0,0 +1,249 @@
+// from config.js
+/* global urlVersions */
+
+/* exported MessageTypesEnum */
+var MessageTypesEnum = {
+    INFO: "info",
+    SUCCESS: "success",
+    WARNING: "warning",
+    DANGER: "danger"
+};
+Object.freeze(MessageTypesEnum);
+
+function isEmpty(value) {
+    if (typeof  value === "function") {
+        return false;
+    }
+    return (value == null || value.length === 0);
+}
+
+/* exported showFeedbackMessage */
+function showFeedbackMessage(message, type) {
+    var drawMessage = function (message, type) {
+        var li = $(
+            "<li class=\"alert alert-" + type + "\">" +
+            "<span>" + message + "</span>" +
+            "</li>"
+        );
+        li.click(function () {
+            $(this).remove();
+        });
+        messageDiv.append(li);
+    };
+
+    var liveTimeMs = 15000;
+    var messageDiv = $("#messages");
+    if (isEmpty(message)) {
+        messageDiv.html("");
+        return;
+    }
+    drawMessage(message, (isEmpty(type) || isEmpty(MessageTypesEnum[type.toUpperCase()]) ?
+        MessageTypesEnum.INFO : type));
+    setTimeout(function () {
+        messageDiv.find("li").first().remove();
+    }, liveTimeMs);
+}
+
+/* exported errorHandler */
+function errorHandler(response, callBack, errorCallBack) {
+    if (isEmpty(response)) {
+        showFeedbackMessage("Empty response", MessageTypesEnum.DANGER);
+        return;
+    }
+    if (!isEmpty(response.error)) {
+        // TODO: add l10n
+        // showFeedbackMessage(response.error.code + ": " + response.error.message, MessageTypesEnum.DANGER);
+        if (!isEmpty(errorCallBack)) {
+            errorCallBack(response.data);
+        }
+        throw response.error.code + ": " + response.error.message +
+        " / Details: " + response.error.data;
+    }
+    if (!isEmpty(callBack)) {
+        if (isLoginPageResponse(response)) {
+            window.location.href = "/";
+        } else {
+            callBack(response.data);
+        }
+    }
+}
+
+function isLoginPageResponse(response) {
+    return (typeof response) === 'string' && response.indexOf("<!DOCTYPE html>") >= 0;
+}
+
+/* exported getFromRest */
+function getFromRest(url, callBack, errorCallBack) {
+    $.ajax({
+        url: url,
+        cache: false,
+        success: function (response) {
+            errorHandler(response, callBack, errorCallBack);
+        }
+    });
+}
+
+/* exported getFromRestWithVersion */
+function getFromRestWithVersion(url, callBack, errorCallBack) {
+    getFromRestWithVersionAndParams(url, "", callBack, errorCallBack);
+}
+
+/* exported getFromRestWithVersionAndParams */
+function getFromRestWithVersionAndParams(url, params, callBack, errorCallBack) {
+    getCurrentVersion(function (version) {
+        $.ajax({
+            url: url + "?versionId=" + version + params,
+            cache: false,
+            success: function (response) {
+                errorHandler(response, callBack, errorCallBack);
+            }
+        });
+    });
+}
+
+/* exported postToRest */
+function postToRest(url, postData, callBack, completeCallback, errorCallBack) {
+    $.ajax({
+        url: url,
+        cache: false,
+        dataType: "json",
+        data: postData,
+        contentType: "application/json; charset=utf-8",
+        processData: false,
+        method: "POST",
+        success: function (response) {
+            errorHandler(response, callBack, errorCallBack);
+        },
+        complete: function () {
+            if (isEmpty(completeCallback)) {
+                return;
+            }
+            completeCallback();
+        }
+    });
+}
+
+/* exported postToRestWithVersion */
+function postToRestWithVersion(url, postData, callBack, errorCallBack) {
+    postToRestWithVersionAndParams(url, postData, "", callBack, errorCallBack);
+}
+
+/* exported postToRestWithVersionAndParams */
+function postToRestWithVersionAndParams(url, postData, params, callBack, errorCallBack) {
+    getCurrentVersion(function (version) {
+        $.ajax({
+            url: url + "?versionId=" + version + params,
+            cache: false,
+            dataType: "json",
+            data: postData,
+            contentType: "application/json; charset=utf-8",
+            processData: false,
+            method: "POST",
+            success: function (response) {
+                errorHandler(response, callBack, errorCallBack);
+            }
+        });
+    });
+}
+
+/* exported putToRestWithVersion */
+function putToRestWithVersion(url, putData, callBack, errorCallBack) {
+    putToRestWithVersionAndParams(url, putData, "", callBack, errorCallBack);
+}
+
+/* exported putToRestWithVersionAndParams */
+function putToRestWithVersionAndParams(url, putData, params, callBack, errorCallBack) {
+    getCurrentVersion(function (version) {
+        $.ajax({
+            url: url + "?versionId=" + version + params,
+            cache: false,
+            dataType: "json",
+            data: putData,
+            contentType: "application/json; charset=utf-8",
+            processData: false,
+            method: "PUT",
+            success: function (response) {
+                errorHandler(response, callBack, errorCallBack);
+            }
+        });
+    });
+}
+
+/* exported deleteFromRest */
+function deleteFromRest(url, callBack, completeCallback, errorCallBack) {
+    $.ajax({
+        url: url,
+        cache: false,
+        method: "DELETE",
+        success: function (response) {
+            errorHandler(response, callBack, errorCallBack);
+        },
+        complete: function () {
+            if (isEmpty(completeCallback)) {
+                return;
+            }
+            completeCallback();
+        }
+    });
+}
+
+/* exported getCurrentVersion */
+function getCurrentVersion(callBack, errorCallBack) {
+    var version = localStorage.getItem("currentVersion");
+
+    if (($("#select-versions")[0].options.length > 0)
+        && ($("#select-versions option[value='" + version + "']").length === 0)) {
+        localStorage.removeItem("currentVersion");
+        version = "";
+    }
+
+    if (isEmpty(version)) {
+        getFromRest(urlVersions,
+            function (versions) {
+                if (isEmpty(versions) || versions.count === 0) {
+                    return;
+                }
+                var currentVersion = versions.items[0];
+                localStorage.setItem("currentVersion", currentVersion.id);
+                callBack(currentVersion.id);
+            },
+            errorCallBack);
+    } else {
+        callBack(version);
+    }
+}
+
+/* exported fillSelect */
+function fillSelect(selectElement, values) {
+    $(selectElement).html("");
+    $.each(values, function (key, value) {
+        $(selectElement).append(
+            "<option value=\"" + value.id + "\">" + value.name + "</option>"
+        );
+    });
+}
+
+/* exported isUrlVarExists */
+function isUrlVarExists(key) {
+    var URL = window.location.href;
+    if (URL.indexOf("?" + key + "=") !== -1) {
+        return true;
+    } else if (URL.indexOf("&" + key + "=") !== -1) {
+        return true;
+    } else if (URL.indexOf("?" + key + "&") !== -1) {
+        return true;
+    } else if (URL.indexOf("&" + key + "&") !== -1) {
+        return true;
+    } else if (URL.endsWith("?" + key)) {
+        return true;
+    } else if (URL.endsWith("&" + key)) {
+        return true;
+    }
+    return false;
+}
+
+/* exported getUrlVar */
+function getUrlVar(key) {
+    var result = new RegExp(key + "=([^&]*)", "i").exec(window.location.search);
+    return result && decodeURIComponent(result[1]) || "";
+}
--- a/src/main/resources/public/js/papers.js
+++ b/src/main/resources/public/js/papers.js
@ -0,0 +1,44 @@
+var urlPapers = "https://localhost:8443/api/1.0/papers";
+
+function showPapers(papersElement) {
+    getFromRest(urlPapers, function (paperList) {
+        paperList.forEach(function (paper, index) {
+            $(papersElement).parent().append("<div class='row text-left'>" +
+                "                <div class='col-md-12'>" +
+                "                <span class='fa-stack fa-1x'>\n" +
+                "                  <i class='fa fa-circle fa-stack-2x " + getPaperStatusClass(paper.status) + "'></i>" +
+                "                  <i class='fa fa-file-text-o fa-stack-1x fa-inverse'></i>" +
+                "                </span>" +
+                "                    <a href='paper.html?id=" + paper.id + "" +
+                "'><span>" + paper.title + "</span></a>" +
+                "                </div></div>");
+        });
+    });
+}
+
+function addPaper(title, status, comment, locked) {
+    var paperData = JSON.stringify({
+        "title": title,
+        "status": status,
+        "comment": comment,
+        "locked": locked
+    });
+    postToRest(urlPapers, paperData, function (data) {
+        alert(data);
+    });
+}
+
+function getPaperStatusClass(status) {
+    switch (status) {
+        case 'DRAFT':
+            return "text-draft"
+        case 'ON_PREPARATION':
+            return "text-primary";
+        case 'COMPLETED':
+            return "text-success";
+        case 'ATTENTION':
+            return "text-warning";
+        default:
+            return "";
+    }
+}
--- a/src/main/resources/templates/AlyonaTest.html
+++ b/src/main/resources/templates/AlyonaTest.html
@ -0,0 +1,42 @@
+<!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="papers">
+        <div class="container">
+            <div class="row" id="paper-list">
+                <div class="col-lg-12 text-center">
+                    <h2 class="section-heading text-uppercase">Тестовая страница</h2>
+                </div>
+            </div>
+        </div>
+    </section>
+
+    <!-- Bootstrap core JavaScript -->
+    <script src="vendor/jquery/jquery.min.js"></script>
+    <script src="vendor/bootstrap/js/bootstrap.bundle.min.js"></script>
+
+    <!-- Plugin JavaScript -->
+    <script src="vendor/jquery-easing/jquery.easing.min.js"></script>
+
+    <!-- Contact form JavaScript -->
+    <script src="js/jqBootstrapValidation.js"></script>
+    <script src="js/contact_me.js"></script>
+
+    <!-- Custom scripts for this template -->
+    <script src="js/agency.js"></script>
+    <script src="js/core.js"></script>
+    <script src="js/papers.js"></script>
+    <script>
+        showPapers($("#paper-list"));
+        // only for demo
+        //addPaper("название", "DRAFT", "comment", false);
+    </script>
+</div>
+
+</body>
--- a/src/main/resources/templates/index.html
+++ b/src/main/resources/templates/index.html
@ -7,145 +7,145 @@
 <body>

 <div layout:fragment="content">
-    <!-- Portfolio Grid -->
-    <section class="bg-light" id="portfolio">
-        <div class="container">
-            <div class="row">
-                <div class="col-lg-12 text-center">
-                    <h2 class="section-heading text-uppercase">Work hard</h2>
-                    <h3 class="section-subheading text-muted">sometimes</h3>
+<!-- Portfolio Grid -->
+<section class="bg-light" id="portfolio">
+    <div class="container">
+        <div class="row">
+            <div class="col-lg-12 text-center">
+                <h2 class="section-heading text-uppercase">Work hard</h2>
+                <h3 class="section-subheading text-muted">sometimes</h3>
+            </div>
+        </div>
+        <div class="row">
+            <div class="col-md-4 col-sm-6 portfolio-item">
+                <a class="portfolio-link" href="./papers">
+                    <div class="portfolio-hover">
+                        <div class="portfolio-hover-content">
+                            <i class="fa fa-arrow-right fa-3x"></i>
+                        </div>
+                    </div>
+                    <img class="img-fluid" src="img/main/papers.jpg" alt=""/>
+                </a>
+                <div class="portfolio-caption">
+                    <h4>Статьи</h4>
+                    <p class="text-muted"></p>
                </div>
            </div>
-            <div class="row">
-                <div class="col-md-4 col-sm-6 portfolio-item">
-                    <a class="portfolio-link" href="/papers">
-                        <div class="portfolio-hover">
-                            <div class="portfolio-hover-content">
-                                <i class="fa fa-arrow-right fa-3x"></i>
-                            </div>
+            <div class="col-md-4 col-sm-6 portfolio-item">
+                <a class="portfolio-link" data-toggle="modal" href="/grants">
+                    <div class="portfolio-hover">
+                        <div class="portfolio-hover-content">
+                            <i class="fa fa-arrow-right fa-3x"></i>
                        </div>
-                        <img class="img-fluid" src="img/main/papers.jpg" alt=""/>
-                    </a>
-                    <div class="portfolio-caption">
-                        <h4>Статьи</h4>
-                        <p class="text-muted"></p>
                    </div>
+                    <img class="img-fluid" src="img/main/grants.jpg" alt=""/>
+                </a>
+                <div class="portfolio-caption">
+                    <h4>Гранты</h4>
+                    <p class="text-muted"></p>
                </div>
-                <div class="col-md-4 col-sm-6 portfolio-item">
-                    <a class="portfolio-link" data-toggle="modal" href="/grants">
-                        <div class="portfolio-hover">
-                            <div class="portfolio-hover-content">
-                                <i class="fa fa-arrow-right fa-3x"></i>
-                            </div>
+            </div>
+            <div class="col-md-4 col-sm-6 portfolio-item">
+                <a class="portfolio-link" data-toggle="modal" href="/projects">
+                    <div class="portfolio-hover">
+                        <div class="portfolio-hover-content">
+                            <i class="fa fa-arrow-right fa-3x"></i>
                        </div>
-                        <img class="img-fluid" src="img/main/grants.jpg" alt=""/>
-                    </a>
-                    <div class="portfolio-caption">
-                        <h4>Гранты</h4>
-                        <p class="text-muted"></p>
                    </div>
+                    <img class="img-fluid" src="img/main/projects.jpg" alt=""/>
+                </a>
+                <div class="portfolio-caption">
+                    <h4>Проекты</h4>
+                    <p class="text-muted"></p>
                </div>
-                <div class="col-md-4 col-sm-6 portfolio-item">
-                    <a class="portfolio-link" data-toggle="modal" href="/projects">
-                        <div class="portfolio-hover">
-                            <div class="portfolio-hover-content">
-                                <i class="fa fa-arrow-right fa-3x"></i>
-                            </div>
+            </div>
+            <div class="col-md-4 col-sm-6 portfolio-item">
+                <a class="portfolio-link" data-toggle="modal" href="./conferences.html">
+                    <div class="portfolio-hover">
+                        <div class="portfolio-hover-content">
+                            <i class="fa fa-arrow-right fa-3x"></i>
                        </div>
-                        <img class="img-fluid" src="img/main/projects.jpg" alt=""/>
-                    </a>
-                    <div class="portfolio-caption">
-                        <h4>Проекты</h4>
-                        <p class="text-muted"></p>
                    </div>
+                    <img class="img-fluid" src="img/main/conf.jpg" alt=""/>
+                </a>
+                <div class="portfolio-caption">
+                    <h4>Конференции</h4>
+                    <p class="text-muted"></p>
                </div>
-                <div class="col-md-4 col-sm-6 portfolio-item">
-                    <a class="portfolio-link" data-toggle="modal" href="/conferences">
-                        <div class="portfolio-hover">
-                            <div class="portfolio-hover-content">
-                                <i class="fa fa-arrow-right fa-3x"></i>
-                            </div>
+            </div>
+            <div class="col-md-4 col-sm-6 portfolio-item">
+                <a class="portfolio-link" data-toggle="modal" href="/team">
+                    <div class="portfolio-hover">
+                        <div class="portfolio-hover-content">
+                            <i class="fa fa-arrow-right fa-3x"></i>
                        </div>
-                        <img class="img-fluid" src="img/main/conf.jpg" alt=""/>
-                    </a>
-                    <div class="portfolio-caption">
-                        <h4>Конференции</h4>
-                        <p class="text-muted"></p>
                    </div>
+                    <img class="img-fluid" src="img/main/team.jpg" alt=""/>
+                </a>
+                <div class="portfolio-caption">
+                    <h4>Команда</h4>
+                    <p class="text-muted"></p>
                </div>
-                <div class="col-md-4 col-sm-6 portfolio-item">
-                    <a class="portfolio-link" data-toggle="modal" href="/team">
-                        <div class="portfolio-hover">
-                            <div class="portfolio-hover-content">
-                                <i class="fa fa-arrow-right fa-3x"></i>
-                            </div>
+            </div>
+            <div class="col-md-4 col-sm-6 portfolio-item">
+                <a class="portfolio-link" data-toggle="modal" href="/students">
+                    <div class="portfolio-hover">
+                        <div class="portfolio-hover-content">
+                            <i class="fa fa-arrow-right fa-3x"></i>
                        </div>
-                        <img class="img-fluid" src="img/main/team.jpg" alt=""/>
-                    </a>
-                    <div class="portfolio-caption">
-                        <h4>Команда</h4>
-                        <p class="text-muted"></p>
                    </div>
+                    <img class="img-fluid" src="img/main/students.jpg" alt=""/>
+                </a>
+                <div class="portfolio-caption">
+                    <h4>Работа со студентами</h4>
+                    <p class="text-muted"></p>
                </div>
-                <div class="col-md-4 col-sm-6 portfolio-item">
-                    <a class="portfolio-link" data-toggle="modal" href="/students">
-                        <div class="portfolio-hover">
-                            <div class="portfolio-hover-content">
-                                <i class="fa fa-arrow-right fa-3x"></i>
-                            </div>
+            </div>
+            <div class="col-md-4 col-sm-6 portfolio-item">
+                <a class="portfolio-link" data-toggle="modal" href="./timeline">
+                    <div class="portfolio-hover">
+                        <div class="portfolio-hover-content">
+                            <i class="fa fa-arrow-right fa-3x"></i>
                        </div>
-                        <img class="img-fluid" src="img/main/students.jpg" alt=""/>
-                    </a>
-                    <div class="portfolio-caption">
-                        <h4>Работа со студентами</h4>
-                        <p class="text-muted"></p>
                    </div>
+                    <img class="img-fluid" src="img/main/tasks.jpg" alt=""/>
+                </a>
+                <div class="portfolio-caption">
+                    <h4>Задачи</h4>
+                    <p class="text-muted"></p>
                </div>
-                <div class="col-md-4 col-sm-6 portfolio-item">
-                    <a class="portfolio-link" data-toggle="modal" href="/tasks">
-                        <div class="portfolio-hover">
-                            <div class="portfolio-hover-content">
-                                <i class="fa fa-arrow-right fa-3x"></i>
-                            </div>
+            </div>
+            <div class="col-md-4 col-sm-6 portfolio-item">
+                <a class="portfolio-link" data-toggle="modal" href="./career.html">
+                    <div class="portfolio-hover">
+                        <div class="portfolio-hover-content">
+                            <i class="fa fa-arrow-right fa-3x"></i>
                        </div>
-                        <img class="img-fluid" src="img/main/tasks.jpg" alt=""/>
-                    </a>
-                    <div class="portfolio-caption">
-                        <h4>Задачи</h4>
-                        <p class="text-muted"></p>
                    </div>
+                    <img class="img-fluid" src="img/main/career.jpg" alt=""/>
+                </a>
+                <div class="portfolio-caption">
+                    <h4>Карьера</h4>
+                    <p class="text-muted"></p>
                </div>
-                <div class="col-md-4 col-sm-6 portfolio-item">
-                    <a class="portfolio-link" data-toggle="modal" href="/career">
-                        <div class="portfolio-hover">
-                            <div class="portfolio-hover-content">
-                                <i class="fa fa-arrow-right fa-3x"></i>
-                            </div>
+            </div>
+            <div class="col-md-4 col-sm-6 portfolio-item">
+                <a class="portfolio-link" data-toggle="modal" href="/other">
+                    <div class="portfolio-hover">
+                        <div class="portfolio-hover-content">
+                            <i class="fa fa-arrow-right fa-3x"></i>
                        </div>
-                        <img class="img-fluid" src="img/main/career.jpg" alt=""/>
-                    </a>
-                    <div class="portfolio-caption">
-                        <h4>Карьера</h4>
-                        <p class="text-muted"></p>
-                    </div>
-                </div>
-                <div class="col-md-4 col-sm-6 portfolio-item">
-                    <a class="portfolio-link" data-toggle="modal" href="/other">
-                        <div class="portfolio-hover">
-                            <div class="portfolio-hover-content">
-                                <i class="fa fa-arrow-right fa-3x"></i>
-                            </div>
-                        </div>
-                        <img class="img-fluid" src="img/main/templates.jpg" alt=""/>
-                    </a>
-                    <div class="portfolio-caption">
-                        <h4>Прочее</h4>
-                        <p class="text-muted"></p>
                    </div>
+                    <img class="img-fluid" src="img/main/templates.jpg" alt=""/>
+                </a>
+                <div class="portfolio-caption">
+                    <h4>Прочее</h4>
+                    <p class="text-muted"></p>
                </div>
            </div>
        </div>
-    </section>
+    </div>
+</section>
 </div>
 </body>

--- a/src/main/resources/templates/myPaper.html
+++ b/src/main/resources/templates/myPaper.html
@ -0,0 +1,42 @@
+<!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="papers">
+        <div class="container">
+            <div class="row" id="paper-list">
+                <div class="col-lg-12 text-center">
+                    <h2 class="section-heading text-uppercase">Пустая страница</h2>
+                </div>
+            </div>
+        </div>
+    </section>
+
+    <!-- Bootstrap core JavaScript -->
+    <script src="vendor/jquery/jquery.min.js"></script>
+    <script src="vendor/bootstrap/js/bootstrap.bundle.min.js"></script>
+
+    <!-- Plugin JavaScript -->
+    <script src="vendor/jquery-easing/jquery.easing.min.js"></script>
+
+    <!-- Contact form JavaScript -->
+    <script src="js/jqBootstrapValidation.js"></script>
+    <script src="js/contact_me.js"></script>
+
+    <!-- Custom scripts for this template -->
+    <script src="js/agency.js"></script>
+    <script src="js/core.js"></script>
+    <script src="js/papers.js"></script>
+    <script>
+        showPapers($("#paper-list"));
+
+    </script>
+</div>
+</body>
+
+</html>
--- a/src/main/resources/templates/papers.html
+++ b/src/main/resources/templates/papers.html
@ -7,42 +7,25 @@
 <body>

 <div class="container" layout:fragment="content">
-    <section id="services">
+    <section id="papers">
        <div class="container">
-            <div class="row">
+            <div class="row" id="paper-list">
                <div class="col-lg-12 text-center">
                    <h2 class="section-heading text-uppercase">Статьи</h2>
-                </div>
-            </div>
-            <div class="row text-left">
-                <div class="col-md-12">
-                <span class="fa-stack fa-1x">
-                  <i class="fa fa-circle fa-stack-2x text-warning"></i>
-                  <i class="fa fa-file-text-o fa-stack-1x fa-inverse"></i>
-                </span>
-                    <a href="/paper?id=1"><span>А.А. Романов, И.А. Тимина. Обзор методов оценки трудоемкости производства</span></a>
-                </div>
-            </div>
-            <div class="row text-left">
-                <div class="col-md-12">
-                <span class="fa-stack fa-1x">
-                  <i class="fa fa-circle fa-stack-2x text-primary"></i>
-                  <i class="fa fa-file-text-o fa-stack-1x fa-inverse"></i>
-                </span>
-                    <a href="/paper?id=2"><span>А.А. Филиппов, В.С.Мошкин, Н.Г. Ярушкина. Построение онтологии предметной ...</span></a>
-                </div>
-            </div>
-            <div class="row text-left">
-                <div class="col-md-12">
-                <span class="fa-stack fa-1x">
-                  <i class="fa fa-circle fa-stack-2x text-success"></i>
-                  <i class="fa fa-file-text-o fa-stack-1x fa-inverse"></i>
-                </span>
-                    <a href="/paper?id=2"><span>А.А. Филиппов, В.С.Мошкин, Н.Г. Ярушкина. Построение онтологии предметной ...</span></a>
+                    <a href = "./AlyonaTest"><h5>Перейти на тестовую страницу Алёны</h5></a>
+                    <a href ="./myPaper"><h4>Ссылка на пустую страницу</h4></a>
                </div>
            </div>
        </div>
    </section>
+
+    <script src="js/core.js"></script>
+    <script src="js/papers.js"></script>
+    <script>
+        showPapers($("#paper-list"));
+        // only for demo
+        //addPaper("название", "DRAFT", "comment", false);
+    </script>
 </div>
 </body>