Changeset f25e8dd in Git for src/main/resources


Ignore:
Timestamp:
02/05/22 22:48:19 (3 years ago)
Author:
Petar Partaloski <ppartaloski@…>
Branches:
main
Children:
2efe93e
Parents:
5b447b0
Message:

Fixed and added a better front end, improved clarity

Location:
src/main/resources
Files:
3 added
11 edited

Legend:

Unmodified
Added
Removed

  • src/main/resources/static/js/sharedScript.js

    r5b447b0 rf25e8dd  
    44    var elements = $(".elements")
    55    var elementGrade;
     6
    67
    78    $("#dialog-rating").dialog({
    … …  
    145146                let movieId=$(button).attr("movie-id")
    146147                if (type==='like') {
    147                     $(button).parent().append("<a class='btn btn-primary button-remove-favourite-list' movie-id=" + movieId + " user-id=" + userId + ">Избриши од омилена листа</a>")
     148                    $(button).parent().append("<a class='btn btn-warning button-remove-favourite-list' movie-id=" + movieId + " user-id=" + userId + ">Избриши од омилена листа</a>")
    148149                    console.log("da")
    149150                }
    150151                else{
    151                     $(button).parent().append("<a class='btn btn-primary button-add-favourite-list' movie-id=" + movieId + " user-id=" + userId + ">Додади во омилена листа</a>")
     152                    $(button).parent().append("<a class='btn btn-success button-add-favourite-list' movie-id=" + movieId + " user-id=" + userId + ">Додади во омилена листа</a>")
    152153
    153154                }

  • src/main/resources/templates/discussion.html

    r5b447b0 rf25e8dd  
    11<div xmlns:th="http://www.thymeleaf.org" xmlns:sec="http://www.w3.org/1999/xhtml">
    2     <div th:text="${disc.getMovie() != null ? disc.getMovie().getTitle() : disc.getPerson().getName() + ' ' + disc.getPerson().getSurname()}"></div>
    3     <div th:text="${disc.getTitle()}"></div>
    4     <div th:text="${disc.getText()}"></div>
    5     <div th:text="${disc.getDate()}"></div>
    6     <div th:text="${disc.getUser().getUsername()}"></div>
    7     <div th:if="${disc.getUser().equals(user)}"><a class="btn btn-primary" th:href="@{'/discussions/add/{id}' (id=${disc.getDiscussionId()})}">Промени</a> </div>
    8     <div th:if="${disc.getUser().equals(user)}"><a class="btn btn-primary button-delete-discussion" th:discussion-id="${disc.getDiscussionId()}">Избриши</a> </div>
    9     <table class="table table-striped">
     2    <div style="width: 85%; text-align: justify; margin: auto; clear: both">
     3        <div>
     4            <h1 th:text="${disc.getTitle()}" style="width: 80%; float: left"></h1>
     5        </div>
     6        <hr><br><br>
     7        <div>
     8            <h5 th:text="${disc.getText()}" style="width: 90%; margin: auto; background-color: lightblue; border-radius: 4px; padding: 20px"></h5>
     9        </div>
     10        <br><br><br>
     11        <h6 style="width: 60%; float:left;">
     12            <span th:text="${'Поставено од: '+disc.getUser().getUsername()}"></span>
     13            <span th:text="${', на датум '+ disc.getDate()}"></span>
     14            <br>
     15            <span>Поставено за </span>
     16            <span th:text="${disc.getMovie() != null ? 'Филмот ' + disc.getMovie().getTitle() : 'Актерот ' + disc.getPerson().getName() + ' ' + disc.getPerson().getSurname()}" ></span>
     17        </h6>
     18        <div style="float: right"  sec:authorize="isAuthenticated()">
     19        <a th:if="${disc.getUser().equals(user)}" class="btn btn-warning" th:href="@{'/discussions/add/{id}' (id=${disc.getDiscussionId()})}">Промени</a>
     20        <a th:if="${disc.getUser().equals(user)}" class="btn btn-danger button-delete-discussion" th:discussion-id="${disc.getDiscussionId()}">Избриши</a>
     21        <a class="btn btn-success" th:href="@{'/replies/add/{discussionId}' (discussionId=${disc.getDiscussionId()})}">Реплицирај</a>
     22        </div>
     23    </div>
     24    <table class="table table-striped" style="width: 70%; margin: auto;">
    1025        <thead>
    1126        <tr>
    12 
    13             <th scope="col">Опис</th>
    14             <th scope="col">Датум</th>
    15             <th scope="col">Корисник</th>
     27            <th scope="col">Реплика</th>
     28            <th scope="col">Поставена на</th>
     29            <th scope="col">Поставена од</th>
    1630            <th:block  sec:authorize="isAuthenticated()">
    17 
    1831                <th scope="col"></th>
    1932                <th scope="col"></th>
    2033            </th:block>
    21 
    2234        </tr>
    2335        </thead>
    … …  
    2739            <td th:text="${reply.getDate()}"></td>
    2840            <td th:text="${reply.getUser().getUsername()}"></td>
    29             <td th:if="${reply.getUser().equals(user)}"><a class="btn btn-primary" th:href="@{'/replies/edit/{discussionId}/{replyId}' (discussionId=${disc.getDiscussionId()},replyId=${reply.getReplyId()})}">Промени</a> </td>
    30             <td th:if="${reply.getUser().equals(user)}"><a class="btn btn-primary button-delete-reply" th:reply-id="${reply.getReplyId()}" th:dicsussion-id="${disc.getDiscussionId()}">Избриши</a> </td>
    31 
     41            <td th:if="${reply.getUser().equals(user)}"><a class="btn btn-warning" th:href="@{'/replies/edit/{discussionId}/{replyId}' (discussionId=${disc.getDiscussionId()},replyId=${reply.getReplyId()})}">Промени</a> </td>
     42            <td th:if="${reply.getUser().equals(user)}"><a class="btn btn-danger button-delete-reply" th:reply-id="${reply.getReplyId()}" th:dicsussion-id="${disc.getDiscussionId()}">Избриши</a> </td>
    3243            <th:block sec:authorize="isAuthenticated()">
    33                 <td th:if="${!reply.getUser().equals(user)}"><a class="btn btn-primary" th:href="@{'/replies/add/{discussionId}' (discussionId=${disc.getDiscussionId()})}">Реплицирај</a> </td>
    3444                <td th:if="${!reply.getUser().equals(user)}">
    35                     <a class="btn btn-primary">Ми се допаѓа</a>
    36                     <a class="btn btn-primary">Не ми се допаѓа</a>
     45                    <a class="btn btn-success">👍 </a>
     46                    <a class="btn btn-danger">👎</a>
    3747                </td>
    3848            </th:block>
    39 
    40 
    4149        </tr>
    4250        </tbody>

  • src/main/resources/templates/discussionForType.html

    r5b447b0 rf25e8dd  
    88                        <thead>
    99                        <tr>
    10                             <th scope="col">Наменета</th>
    1110                            <th scope="col">Наслов</th>
    1211                            <th scope="col">Опис</th>
    … …  
    2625                        <tbody>
    2726                        <tr th:each="disc : ${discussions}" class="movie">
    28                             <td th:text="${disc.getMovie() != null ? disc.getMovie().getTitle() : disc.getPerson().getName() + ' ' + disc.getPerson().getSurname()}"></td>
    29                             <td th:text="${disc.getTitle()}"></td>
     27                            <td>
     28                                <a th:text="${disc.getTitle()}" th:href="@{'/discussions/{id}' (id=${disc.getDiscussionId()})}"></a>
     29                            </td>
    3030                            <td th:text="${disc.getText()}"></td>
    3131                            <td th:text="${disc.getDate()}"></td>
    3232                            <td th:text="${disc.getUser().getUsername()}"></td>
    33                             <td th:if="${disc.getUser().equals(user)}"><a class="btn btn-primary" th:href="@{'/discussions/add/{id}' (id=${disc.getDiscussionId()})}">Промени</a> </td>
    34                             <td th:if="${disc.getUser().equals(user)}"><a class="btn btn-primary button-delete-discussion" th:discussion-id="${disc.getDiscussionId()}">Избриши</a> </td>
     33                            <td th:if="${disc.getUser().equals(user)}"><a class="btn btn-warning" th:href="@{'/discussions/add/{id}' (id=${disc.getDiscussionId()})}">Измени</a> </td>
     34                            <td th:if="${disc.getUser().equals(user)}"><a class="btn btn-danger button-delete-discussion" th:discussion-id="${disc.getDiscussionId()}">Избриши</a> </td>
    3535
    3636                            <th:block sec:authorize="isAuthenticated()">
    37                                 <td th:if="${!disc.getUser().equals(user)}"><a class="btn btn-primary" th:href="@{'/replies/add/{discussionId}' (discussionId=${disc.getDiscussionId()})}">Реплицирај</a> </td>
     37                                <td th:if="${!disc.getUser().equals(user)}"><a class="btn btn-success" th:href="@{'/replies/add/{discussionId}' (discussionId=${disc.getDiscussionId()})}">Реплицирај</a> </td>
    3838                                <td th:if="${!disc.getUser().equals(user)}">
    39                                     <a class="btn btn-primary">Ми се допаѓа</a>
    40                                     <a class="btn btn-primary">Не ми се допаѓа</a>
     39                                    <a class="btn btn-success">👍 </a>
     40                                    <a class="btn btn-danger">👎</a>
    4141                                </td>
    4242                            </th:block>

  • src/main/resources/templates/discussionsList.html

    r5b447b0 rf25e8dd  
    1010                        <thead>
    1111                        <tr>
    12                             <th scope="col">Наменета</th>
    1312                            <th scope="col">Наслов</th>
    1413                            <th scope="col">Опис</th>
    … …  
    2928                        <tr th:each="disc : ${discussions}" class="movie">
    3029                            <td th:text="${disc.getMovie() != null ? disc.getMovie().getTitle() : disc.getPerson().getName() + ' ' + disc.getPerson().getSurname()}"></td>
    31                             <td th:text="${disc.getTitle()}"></td>
     30                            <td>
     31                                <a th:text="${disc.getTitle()}" th:href="@{'/discussions/{id}' (id=${disc.getDiscussionId()})}"></a>
     32                            </td>
    3233                            <td th:text="${disc.getText()}"></td>
    3334                            <td th:text="${disc.getDate()}"></td>
    3435                            <td th:text="${disc.getUser().getUsername()}"></td>
    35                             <td th:if="${disc.getUser().equals(user)}"><a class="btn btn-primary" th:href="@{'/discussions/add/{id}' (id=${disc.getDiscussionId()})}">Промени</a> </td>
    36                             <td th:if="${disc.getUser().equals(user)}"><a class="btn btn-primary button-delete-discussion" th:discussion-id="${disc.getDiscussionId()}">Избриши</a> </td>
     36                            <td th:if="${disc.getUser().equals(user)}"><a class="btn btn-warning" th:href="@{'/discussions/add/{id}' (id=${disc.getDiscussionId()})}">Измени</a> </td>
     37                            <td th:if="${disc.getUser().equals(user)}"><a class="btn btn-danger button-delete-discussion" th:discussion-id="${disc.getDiscussionId()}">Избриши</a> </td>
    3738
    3839                            <th:block sec:authorize="isAuthenticated()">
    39                             <td th:if="${!disc.getUser().equals(user)}"><a class="btn btn-primary" th:href="@{'/replies/add/{discussionId}' (discussionId=${disc.getDiscussionId()})}">Реплицирај</a> </td>
     40                            <td th:if="${!disc.getUser().equals(user)}"><a class="btn btn-success" th:href="@{'/replies/add/{discussionId}' (discussionId=${disc.getDiscussionId()})}">Реплицирај</a> </td>
    4041                            <td th:if="${!disc.getUser().equals(user)}">
    41                                 <a class="btn btn-primary">Ми се допаѓа</a>
    42                                 <a class="btn btn-primary">Не ми се допаѓа</a>
     42                                <a class="btn btn-success">👍 </a>
     43                                <a class="btn btn-danger">👎</a>
    4344                            </td>
    4445                            </th:block>

  • src/main/resources/templates/favoriteList.html

    r5b447b0 rf25e8dd  
    1 <div class="container mb-4">
     1<style>
     2    .card{
     3        background-size: 200px 300px;
     4        background-repeat: no-repeat;
     5        float:left;
     6        margin: 7px;
     7        min-height: 270px;
     8        border-radius: 10px;
     9        padding: 20px;
     10        color: white;
     11        -webkit-text-stroke-width: 1px;
     12        -webkit-text-stroke-color: black;
     13    }
     14
     15    .card h4{
     16        text-align: center;
     17        background-color: rgba(255,255,255,0.7);
     18        border-radius: 5px;
     19    }
     20
     21    .card h3{
     22        position: absolute;
     23        top: 85%;
     24        margin:auto;
     25        width: 100%;
     26        left: 0%;
     27        border-radius: 10px;
     28        text-align: center;
     29        background-color: rgba(255,255,255,0.7);
     30    }
     31</style>
     32
     33
     34<div class="container mb-4" xmlns:th="http://www.thymeleaf.org" xmlns:sec="http://www.w3.org/1999/xhtml">
    235    <div class="row">
    336        <div class="col-12" th:if="${movies.size() > 0}">
    437            <div class="table-responsive">
     38                <a th:each="movie: ${movies}" th:href="@{'/movies/{id}' (id=${movie.getMovieId()})}" >
     39                    <div class="col-2 card" th:style="'background:url(' + ${movie.getImageUrl()} + ');'">
     40                        <h4 th:text="${movie.getTitle()}"></h4>
     41                        <h3 th:text="${movie.getImdbRating()}"></h3>
     42                    </div>
     43                </a>
    544                <table class="table table-striped">
    645                    <thead>

  • src/main/resources/templates/fragments/header.html

    r5b447b0 rf25e8dd  
    22    <nav class="navbar navbar-expand-md navbar-dark bg-dark">
    33        <div class="container">
    4             <a class="navbar-brand" href="/">Форум за филмови</a>
     4            <a class="navbar-brand" href="/movies">Форум за филмови</a>
    55            <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarsExampleDefault"
    66                    aria-controls="navbarsExampleDefault" aria-expanded="false" aria-label="Toggle navigation">
    … …  
    1616                    </li>
    1717                    <li class="nav-item m-auto">
    18                         <a class="nav-link active" href="/directors">Директори</a>
     18                        <a class="nav-link active" href="/directors">Режисери</a>
    1919                    </li>
    2020                    <li class="nav-item m-auto">

  • src/main/resources/templates/fragments/searchBarGenre.html

    r5b447b0 rf25e8dd  
    11<div>
    2       <label for="searchGenre">жанр</label>
     2      <label for="searchGenre" style="width: 150px;">Пребарај по жанр</label>
    33        <input id="searchGenre" type="text" placeholder="жанр">
    44        <button class="search-button">Пребарај</button>

  • src/main/resources/templates/fragments/searchBarName.html

    r5b447b0 rf25e8dd  
    11<div>
    2     <label for="searchTitle">Прабарај по име</label>
     2    <label for="searchTitle" style="width: 150px;">Прабарај по име</label>
    33    <input id="searchTitle" type="text" placeholder="име">
    44    <button class="search-button-title">Пребарај</button>

  • src/main/resources/templates/moviesList.html

    r5b447b0 rf25e8dd  
    11<div xmlns:th="http://www.thymeleaf.org" xmlns:sec="http://www.w3.org/1999/xhtml">
    2     <div th:replace="fragments/searchBarGenre">
    32
     3    <div style="width: 70%; margin: auto">
     4        <div th:replace="fragments/searchBarName"></div>
     5        <div th:replace="fragments/searchBarGenre"></div>
    46    </div>
    57
    … …  
    1618                        <tr>
    1719                            <th scope="col">Наслов</th>
    18                             <th scope="col">Опис</th>
     20                            <!--<th scope="col">Опис</th>-->
    1921                            <th scope="col">Датум издавање</th>
    2022                            <th scope="col">Допаѓања</th>
    21                             <th scope="col">Занрови</th>
     23                            <th scope="col">Жанрови</th>
    2224                            <th scope="col">Актери</th>
    2325                            <th scope="col">Режисер</th>
    … …  
    3739                        <tbody>
    3840                        <tr th:each="movie : ${movies}" class="elements">
    39                             <td th:text="${movie.getTitle()}"></td>
    40                             <td th:text="${movie.getDescription()}"></td>
     41                            <td><a th:text="${movie.getTitle()}" th:href="@{'/movies/{id}' (id=${movie.getMovieId()})}"></a></td>
     42                            <!--<td th:text="${movie.getDescription()}"></td>-->
    4143                            <td th:text="${movie.getAiringDate()}"></td>
    4244                            <td th:text="${movie.getLikes() != null  ? movie.getLikes().size() : 0}">
    … …  
    4749                            </td>
    4850                            <td>
    49                                 <div th:each="a: ${movie.getActors()}" th:text="${a.getPerson().getName()} "></div>
     51                                <div th:each="ac: ${movie.getActors()}">
     52                                    <a th:href="@{'/persons/{id}' (id=${ac.getPerson().getPersonId()})}" th:text="${ac.getPerson().getName() + ' ' + ac.getPerson().getSurname()}"></a>
     53                                </div>
    5054                            </td>
    51                             <td th:text="${movie.getDirector() != null ? movie.getDirector()?.getName() + ' '+ movie.getDirector()?.getSurname() : 'Не е додаен директор'}"></td>
     55                            <td th:if="${movie.getDirector() != null}">
     56                                <a th:href="@{'/persons/{id}' (id=${movie.getDirector().getPersonId()})}" th:text="${movie.getDirector().getName() + ' ' + movie.getDirector().getSurname()}"></a>
     57                            </td>
     58                            <td th:if="${movie.getDirector() == null}">
     59                                Филмот нема режисер.
     60                            </td>
    5261                            <td>
    5362                                <a class="btn btn-primary" th:href="@{'discussions/all/{id}?type=M' (id=${movie.getMovieId()})}" >Прегледај дискусии</a>
    … …  
    5564                            <th:block sec:authorize="isAuthenticated()">
    5665                            <td>
    57                                 <a class="btn btn-primary button-add-favourite-list" th:movie-id="${movie.getMovieId()}" th:user-id="${user.getUserId()}" th:if="${!likedMovies.contains(movie)}">Додади во омилена листа</a>
    58                                 <a class="btn btn-primary button-remove-favourite-list" th:movie-id="${movie.getMovieId()}" th:user-id="${user.getUserId()}" th:if="${likedMovies.contains(movie)}">Избриши од омилена листа</a>
     66                                <a class="btn btn-success button-add-favourite-list" th:movie-id="${movie.getMovieId()}" th:user-id="${user.getUserId()}" th:if="${!likedMovies.contains(movie)}">Додади во омилена листа</a>
     67                                <a class="btn btn-warning button-remove-favourite-list" th:movie-id="${movie.getMovieId()}" th:user-id="${user.getUserId()}" th:if="${likedMovies.contains(movie)}">Избриши од омилена листа</a>
    5968
    6069                            </td>
    6170                            <td>
    62                                 <a class="btn btn-primary button-add-grade-movie" th:movie-id="${movie.getMovieId()}">Остави оценка</a>
     71                                <a class="btn btn-success button-add-grade-movie" th:movie-id="${movie.getMovieId()}">Остави оценка</a>
    6372                            </td>
    6473                            <td>
    65                                 <a class="btn btn-primary" th:href="@{'/movies/{id}/edit' (id=${movie.getMovieId()})}">Промени</a>
     74                                <a class="btn btn-warning" th:href="@{'/movies/{id}/edit' (id=${movie.getMovieId()})}">Измени</a>
    6675                            </td>
    6776                            <td>
    68                                 <a class="btn btn-primary button-delete-movie" th:movie-id="${movie.getMovieId()}">Избриши филм</a>
     77                                <a class="btn btn-danger button-delete-movie" th:movie-id="${movie.getMovieId()}">Избриши филм</a>
    6978                            </td>
    7079                            </th:block>

  • src/main/resources/templates/personsList.html

    r5b447b0 rf25e8dd  
    1212                        <tr>
    1313                            <th scope="col">Име</th>
    14                             <th scope="col">Презиме</th>
     14                            <!--<th scope="col">Презиме</th>-->
    1515                            <th scope="col">Датум рагање</th>
    16                             <th scope="col">Опис</th>
     16                            <!--<th scope="col">Опис</th>-->
    1717<!--                            <th scope="col">Занрови</th>-->
    1818                            <th scope="col">Слика</th>
    … …  
    3131                        <tbody>
    3232                        <tr th:each="person : ${persons}" class="elements">
    33                             <td th:text="${person.getName()}"></td>
    34                             <td th:text="${person.getSurname()}"></td>
     33                            <td><a th:href="@{'/persons/{id}' (id=${person.getPersonId()})}" th:text="${person.getName() + ' ' + person.getSurname()}"></a></td>
     34                            <!--<td th:text="${person.getSurname()}"></td>-->
    3535                            <td th:text="${person.getDateOfBirth()}"></td>
    36                             <td th:text="${person.getDescription()}"></td>
     36                            <!--<td th:text="${person.getDescription()}"></td>-->
    3737
    3838<!--                            <td>-->

  • src/main/resources/templates/template.html

    r5b447b0 rf25e8dd  
    33<head>
    44    <meta charset="UTF-8"/>
    5     <title>Products</title>
     5    <title>weDiscussMovies</title>
    66    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
    77    <script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
    … …  
    1818<section class="jumbotron text-center">
    1919    <div class="container">
    20         <h1 class="jumbotron-heading">WEB PROGRAMMING SHOP</h1>
    21         <h3 class="jumbotron-heading">All products</h3>
     20        <!--<img th:src="@{/img/logo.png}" style="opacity: 0.3; z-index: 5; position: absolute; margin: auto; height: 225px; width: auto; left: 42%; top: 2%">-->
     21        <h1 class="jumbotron-heading" style="z-index: -1">weDiscussMovies</h1>
    2222    </div>
    2323</section>
    … …  
    2727    <h1 class="danger" th:text="${error?.toString()}"></h1>
    2828</div>
    29 <div th:replace="fragments/searchBarName"></div>
    3029<section th:include="${contentTemplate}"></section>
    3130<div id="dialog-rating" style="display: none">
Note: See TracChangeset for help on using the changeset viewer.