Merge pull request #231 from JasonHHouse/improvement/UI_updates

Improvement/UI updates
JasonHHouse · May 31, 2021 · ee25711 · ee25711
2 parents 4b168f8 + cabe103
commit ee25711
Show file tree

Hide file tree

Showing 25 changed files with 120 additions and 56 deletions.
diff --git a/Core/pom.xml b/Core/pom.xml
@@ -5,7 +5,7 @@
     <parent>
         <artifactId>Gaps</artifactId>
         <groupId>com.jasonhhouse</groupId>
-        <version>0.9.2</version>
+        <version>0.9.3</version>
     </parent>
     <modelVersion>4.0.0</modelVersion>
 

diff --git a/Core/src/main/java/com/jasonhhouse/gaps/BasicMovie.java b/Core/src/main/java/com/jasonhhouse/gaps/BasicMovie.java
@@ -48,11 +48,14 @@ public final class BasicMovie implements Comparable<BasicMovie> {
     @NotNull
     private Integer collectionId;
     @NotNull
+    private String backdropPathUrl;
+    @NotNull
     private Integer tmdbId;
 
     private BasicMovie(@NotNull String name,
                        @NotNull Integer year,
                        @NotNull String posterUrl,
+                       @NotNull String backdropPathUrl,
                        @NotNull String collectionTitle,
                        @NotNull Integer collectionId,
                        @NotNull Integer tmdbId,
@@ -66,6 +69,7 @@ private BasicMovie(@NotNull String name,
         this.nameWithoutBadCharacters = name.replaceAll("[<>`~\\[\\]()*&^%$#@!|{}.,?\\-_=+:;]", "");
         this.year = year;
         this.posterUrl = posterUrl;
+        this.backdropPathUrl = backdropPathUrl;
         this.collectionTitle = collectionTitle;
         this.collectionId = collectionId;
         this.tmdbId = tmdbId;
@@ -133,6 +137,14 @@ public void setTmdbId(@NotNull Integer tmdbId) {
         return moviesInCollection;
     }
 
+    public void setBackdropPathUrl(@NotNull String backdropPathUrl) {
+        this.backdropPathUrl = backdropPathUrl;
+    }
+
+    public @NotNull String getBackdropPathUrl() {
+        return backdropPathUrl;
+    }
+
     @JsonIgnore
     public @NotNull String getNameWithoutBadCharacters() {
         return nameWithoutBadCharacters;
@@ -181,20 +193,21 @@ public int hashCode() {
 
     @Override
     public String toString() {
-        return "Movie{" +
+        return "BasicMovie{" +
                 "name='" + name + '\'' +
                 ", year=" + year +
                 ", nameWithoutBadCharacters='" + nameWithoutBadCharacters + '\'' +
                 ", posterUrl='" + posterUrl + '\'' +
-                ", imdbId='" + imdbId + '\'' +
+                ", backdropPathUrl='" + backdropPathUrl + '\'' +
                 ", language='" + language + '\'' +
                 ", overview='" + overview + '\'' +
                 ", moviesInCollection=" + moviesInCollection +
-                ", collection='" + collectionTitle + '\'' +
-                ", collectionId=" + collectionId +
-                ", tmdbId=" + tmdbId +
                 ", ratingKey=" + ratingKey +
                 ", key='" + key + '\'' +
+                ", imdbId='" + imdbId + '\'' +
+                ", collectionTitle='" + collectionTitle + '\'' +
+                ", collectionId=" + collectionId +
+                ", tmdbId=" + tmdbId +
                 '}';
     }
 
@@ -215,6 +228,10 @@ public static class Builder {
         @JsonProperty
         private String posterUrl;
 
+        @NotNull
+        @JsonProperty
+        private String backdropPathUrl;
+
         @NotNull
         @JsonProperty
         private String collectionTitle;
@@ -260,6 +277,7 @@ public Builder(@JsonProperty(value = "name") @NotNull String name,
             this.imdbId = "";
             this.collectionTitle = "";
             this.posterUrl = "";
+            this.backdropPathUrl = "";
             this.collectionId = -1;
             this.language = "en";
             this.overview = "";
@@ -269,14 +287,19 @@ public Builder(@JsonProperty(value = "name") @NotNull String name,
         }
 
         public @NotNull BasicMovie build() {
-            return new BasicMovie(name, year, posterUrl, collectionTitle, collectionId, tmdbId, imdbId, language, overview, moviesInCollection, ratingKey, key);
+            return new BasicMovie(name, year, posterUrl, backdropPathUrl, collectionTitle, collectionId, tmdbId, imdbId, language, overview, moviesInCollection, ratingKey, key);
         }
 
         public @NotNull Builder setPosterUrl(@NotNull String posterUrl) {
             this.posterUrl = posterUrl;
             return this;
         }
 
+        public @NotNull Builder setBackdropPathUrl(@NotNull String backdropPathUrl) {
+            this.backdropPathUrl = backdropPathUrl;
+            return this;
+        }
+
         public @NotNull Builder setCollectionTitle(@NotNull String collectionTitle) {
             this.collectionTitle = collectionTitle;
             return this;

diff --git a/Dockerfile b/Dockerfile
@@ -32,7 +32,7 @@ RUN mkdir -p /usr/app && chmod 777 /usr/data
 
 WORKDIR /usr/app
 
-COPY GapsWeb/target/GapsWeb-0.9.2.jar /usr/app/gaps.jar
+COPY GapsWeb/target/GapsWeb-0.9.3.jar /usr/app/gaps.jar
 
 COPY start.sh /usr/app/
 

diff --git a/Dockerfile.arm64 b/Dockerfile.arm64
@@ -36,7 +36,7 @@ RUN mkdir -p /usr/app && chmod 777 /usr/data
 
 WORKDIR /usr/app
 
-COPY GapsWeb/target/GapsWeb-0.9.2.jar /usr/app/gaps.jar
+COPY GapsWeb/target/GapsWeb-0.9.3.jar /usr/app/gaps.jar
 
 COPY start.sh /usr/app/
 

diff --git a/Dockerfile.ppc64le b/Dockerfile.ppc64le
@@ -32,7 +32,7 @@ RUN mkdir -p /usr/app && chmod 777 /usr/data
 
 WORKDIR /usr/app
 
-COPY GapsWeb/target/GapsWeb-0.9.2.jar /usr/app/gaps.jar
+COPY GapsWeb/target/GapsWeb-0.9.3.jar /usr/app/gaps.jar
 
 COPY start.sh /usr/app/
 

diff --git a/Dockerfile.raspbian b/Dockerfile.raspbian
@@ -32,7 +32,7 @@ RUN mkdir -p /usr/app && chmod 777 /usr/data
 
 WORKDIR /usr/app
 
-COPY GapsWeb/target/GapsWeb-0.9.2.jar /usr/app/gaps.jar
+COPY GapsWeb/target/GapsWeb-0.9.3.jar /usr/app/gaps.jar
 
 COPY start.sh /usr/app/
 

diff --git a/Dockerfile.riscv64 b/Dockerfile.riscv64
@@ -36,7 +36,7 @@ RUN mkdir -p /usr/app && chmod 777 /usr/data
 
 WORKDIR /usr/app
 
-COPY GapsWeb/target/GapsWeb-0.9.2.jar /usr/app/gaps.jar
+COPY GapsWeb/target/GapsWeb-0.9.3.jar /usr/app/gaps.jar
 
 COPY start.sh /usr/app/
 

diff --git a/GapsAsJar/gaps.nsi b/GapsAsJar/gaps.nsi
@@ -48,4 +48,4 @@ RMDIR /r $INSTDIR
 SectionEnd
 
 # name the installer
-OutFile "gaps-0.9.2-installer.exe"
+OutFile "gaps-0.9.3-installer.exe"
diff --git a/GapsWeb/pom.xml b/GapsWeb/pom.xml
@@ -5,7 +5,7 @@
     <parent>
         <artifactId>Gaps</artifactId>
         <groupId>com.jasonhhouse</groupId>
-        <version>0.9.2</version>
+        <version>0.9.3</version>
     </parent>
     <modelVersion>4.0.0</modelVersion>
 

diff --git a/GapsWeb/src/main/java/com/jasonhhouse/gaps/service/GapsSearchService.java b/GapsWeb/src/main/java/com/jasonhhouse/gaps/service/GapsSearchService.java
@@ -70,6 +70,7 @@
 public class GapsSearchService implements GapsSearch {
 
     public static final String COLLECTION_ID = "belongs_to_collection";
+    public static final String BACKDROP_PATH = "backdrop_path";
     public static final String TITLE = "title";
     public static final String NAME = "name";
     public static final String ID = "id";
@@ -391,21 +392,25 @@ private void searchMovieDetails(PlexProperties plexProperties, String machineIde
 
             int collectionId = movieDetails.get(COLLECTION_ID).get(ID).intValue();
             String collectionName = movieDetails.get(COLLECTION_ID).get(NAME).textValue();
+            String backdropPath = movieDetails.get(COLLECTION_ID).get(BACKDROP_PATH).textValue();
             basicMovie.setCollectionId(collectionId);
             basicMovie.setCollectionTitle(collectionName);
+            basicMovie.setBackdropPathUrl(backdropPath);
 
             int indexOfMovie = everyBasicMovie.indexOf(basicMovie);
             if (indexOfMovie != -1) {
                 LOGGER.info("Merging movie data");
                 everyBasicMovie.get(indexOfMovie).setTmdbId(basicMovie.getTmdbId());
                 everyBasicMovie.get(indexOfMovie).setCollectionId(basicMovie.getCollectionId());
                 everyBasicMovie.get(indexOfMovie).setCollectionTitle(basicMovie.getCollectionTitle());
+                everyBasicMovie.get(indexOfMovie).setBackdropPathUrl(basicMovie.getBackdropPathUrl());
             } else {
                 BasicMovie newBasicMovie = new BasicMovie.Builder(basicMovie.getName(), basicMovie.getYear())
                         .setTmdbId(basicMovie.getTmdbId())
                         .setImdbId(basicMovie.getImdbId())
                         .setCollectionTitle(basicMovie.getCollectionTitle())
                         .setCollectionId(basicMovie.getCollectionId())
+                        .setBackdropPathUrl(basicMovie.getBackdropPathUrl())
                         .build();
                 everyBasicMovie.add(newBasicMovie);
             }
@@ -500,6 +505,7 @@ private void handleCollection(PlexProperties plexProperties, String machineIdent
                         .setLanguage(basicMovie.getLanguage())
                         .setOverview(basicMovie.getOverview())
                         .setPosterUrl(basicMovie.getPosterUrl())
+                        .setBackdropPathUrl(basicMovie.getBackdropPathUrl())
                         .build();
                 everyBasicMovie.add(newBasicMovie);
 
@@ -540,6 +546,7 @@ private void handleCollection(PlexProperties plexProperties, String machineIdent
                         .setCollectionTitle(basicMovie.getCollectionTitle())
                         .setPosterUrl(posterUrl)
                         .setMoviesInCollection(moviesInCollection)
+                        .setBackdropPathUrl(basicMovie.getBackdropPathUrl())
                         .build();
 
                 if (ownedBasicMovies.contains(basicMovieFromCollection)) {
@@ -608,6 +615,7 @@ private void handleCollection(PlexProperties plexProperties, String machineIdent
                                 .setCollectionId(basicMovie.getCollectionId())
                                 .setCollectionTitle(basicMovie.getCollectionTitle())
                                 .setPosterUrl("https://image.tmdb.org/t/p/w185/" + movieDet.get("poster_path").textValue())
+                                .setBackdropPathUrl("https://image.tmdb.org/t/p/original/" + movieDet.get(COLLECTION_ID).get(BACKDROP_PATH).textValue())
                                 .setOverview(movieDet.get("overview").textValue())
                                 .setMoviesInCollection(moviesInCollection)
                                 .build();

diff --git a/GapsWeb/src/main/resources/application.yaml b/GapsWeb/src/main/resources/application.yaml
@@ -50,7 +50,7 @@ info:
   app:
     name: Gaps
     description: Gaps searches through your Plex Server or local folders for all movies, then queries for known movies in the same collection. If those movies don't exist in your library, Gaps will recommend getting those movies, legally of course.
-    version: 0.9.2
+    version: 0.9.3
     storageFolder: /usr/data
     properties:
       rssFeed: rssFeed.json

diff --git a/GapsWeb/src/main/resources/static/js/page/recommended.js b/GapsWeb/src/main/resources/static/js/page/recommended.js
@@ -121,6 +121,9 @@ jQuery(($) => {
     isNotOwned(value) {
       return !value;
     },
+    isEqual(a, b) {
+      return a === b;
+    },
   });
 
   libraryTitle = $('#libraryTitle');

diff --git a/GapsWeb/src/main/resources/templates/about.html b/GapsWeb/src/main/resources/templates/about.html
@@ -29,7 +29,7 @@
     <img loading="lazy" th:src="@{/images/final-2.svg}" alt="Gaps Logo" style="width:50%;height:50%;" class="center">
 
     <h3 class="top-margin">About</h3>
-    <h4 class="top-margin text-primary">v0.9.2</h4>
+    <h4 class="top-margin text-primary">v0.9.3</h4>
 
     <p class="text-muted">Gaps searches through your Plex Server. It then queries
         for known

diff --git a/GapsWeb/src/main/resources/templates/index.html b/GapsWeb/src/main/resources/templates/index.html
@@ -27,7 +27,7 @@
 <div class="container bottom-margin">
     <img loading="lazy" th:src="@{/images/final-2.svg}" alt="Gaps Logo" style="width:50%;height:50%;" class="center">
 
-    <h3 class="top-margin">v0.9.2</h3>
+    <h3 class="top-margin">v0.9.3</h3>
 
     <p class="text-muted">Gaps searches through your Plex Server. It then queries
         for known

diff --git a/GapsWeb/src/main/resources/templates/recommended.html b/GapsWeb/src/main/resources/templates/recommended.html
@@ -122,40 +122,65 @@ <h2 class="top-margin" id="searchTitle">Searching for Movies</h2>
 
 <script id="movieCard" type="text/x-handlebars-template">
     <div class="card">
-        <div class="row no-gutters">
-            <div class="col-12 col-md-auto">
-                <img loading="lazy" style="height: auto; width: 225px; display: block;"
-                     data-cy="{{imdbId}}"
-                     src="{{posterUrl}}"
-                     class="card-img" alt="Plex Poster">
+        <img loading="lazy" style="height: 450px;width: auto;display: block;filter: brightness(0.20);"
+             src="{{backdropPathUrl}}" class="card-img" alt="Backdrop Poster">
+        <div class="card-img-overlay">
+            <div class="row no-gutters">
+                <div class="col-12 col-md-auto">
+                    <img loading="lazy" style="height: auto; width: 225px; display: block;"
+                         data-cy="{{imdbId}}"
+                         src="{{posterUrl}}"
+                         class="card-img" alt="Plex Poster">
+                </div>
+                <div class="col-12 col-md">
+                    <div class="card-body">
+                        <h5 class="card-title">{{name}} ({{year}})</h5>
+                        <h6 class="card-title">{{collectionTitle}}</h6>
+                        <p class="card-text">{{overview}}</p>
+                        <p class="card-text"><small class="text-info">English</small></p>
+                    </div>
+                </div>
             </div>
-            <div class="col-12 col-md">
-                <div class="card-body">
-                    <h5 class="card-title">{{name}} ({{year}})</h5>
-                    <h6 class="card-title">{{collectionTitle}}</h6>
-                    <p class="card-text text-muted long-text">{{overview}}</p>
-                    <p class="card-text"><small class="text-info">English</small></p>
-                    <div>
-                        <span class="card-text">Owned</span><br>
-                        {{#each moviesInCollection}}
+        </div>
+        <div class="row card-body">
+            <div class="col-6">
+                <h5 class="card-title">Owned</h5>
+                <div class="list-group">
+                    {{#each moviesInCollection}}
                         {{#if this.owned}}
-                        <a data-cy="{{@root.imdbId}}-{{this.tmdbId}}"
-                           href="https://www.themoviedb.org/movie/{{this.tmdbId}}" class="card-link" target="_blank"
-                           rel="noopener noreferrer">{{this.title}}</a>
+                            {{#if (isEqual this.tmdbId @root.tmdbId)}}
+                            <a data-cy="{{@root.imdbId}}-{{this.tmdbId}}"
+                               href="https://www.themoviedb.org/movie/{{this.tmdbId}}" target="_blank"
+                               class="list-group-item list-group-item-action active"
+                               rel="noopener noreferrer">{{this.title}}</a>
+                            {{else}}
+                            <a data-cy="{{@root.imdbId}}-{{this.tmdbId}}"
+                               href="https://www.themoviedb.org/movie/{{this.tmdbId}}" target="_blank"
+                               class="list-group-item list-group-item-action"
+                               rel="noopener noreferrer">{{this.title}}</a>
+                            {{/if}}
                         {{/if}}
-                        {{/each}}
-                    </div>
-                    <br>
-                    <div>
-                        <span class="card-text">Missing</span><br>
-                        {{#each moviesInCollection}}
+                    {{/each}}
+                </div>
+            </div>
+            <div class="col-6">
+                <h5 class="card-title">Missing</h5>
+                <div class="list-group">
+                    {{#each moviesInCollection}}
                         {{#if (isNotOwned this.owned)}}
-                        <a data-cy="{{@root.imdbId}}-{{this.tmdbId}}"
-                           href="https://www.themoviedb.org/movie/{{this.tmdbId}}" class="card-link" target="_blank"
-                           rel="noopener noreferrer">{{this.title}}</a>
+                            {{#if (isEqual this.tmdbId @root.tmdbId)}}
+                            <a data-cy="{{@root.imdbId}}-{{this.tmdbId}}"
+                               class="list-group-item list-group-item-action active"
+                               href="https://www.themoviedb.org/movie/{{this.tmdbId}}" target="_blank"
+                               rel="noopener noreferrer">{{this.title}}</a>
+                            {{else}}
+                            <a data-cy="{{@root.imdbId}}-{{this.tmdbId}}"
+                               class="list-group-item list-group-item-action"
+                               href="https://www.themoviedb.org/movie/{{this.tmdbId}}" target="_blank"
+                               rel="noopener noreferrer">{{this.title}}</a>
+                            {{/if}}
                         {{/if}}
-                        {{/each}}
-                    </div>
+                    {{/each}}
                 </div>
             </div>
         </div>

diff --git a/GapsWeb/src/main/resources/templates/updates.html b/GapsWeb/src/main/resources/templates/updates.html
@@ -28,6 +28,11 @@
     <img loading="lazy" th:src="@{/images/final-2.svg}" alt="Gaps Logo" style="width:50%;height:50%;" class="center">
 
     <h3 class="top-margin">Updates</h3>
+    <h4 class="top-margin text-primary">v0.9.3</h4>
+    <ul class="text-muted">
+        <li>Improved UI for recommended movies</li>
+    </ul>
+
     <h4 class="top-margin text-primary">v0.9.2</h4>
     <ul class="text-muted">
         <li>Updated to Spring Boot 2.5.0</li>

diff --git a/Plex/pom.xml b/Plex/pom.xml
@@ -5,7 +5,7 @@
     <parent>
         <artifactId>Gaps</artifactId>
         <groupId>com.jasonhhouse</groupId>
-        <version>0.9.2</version>
+        <version>0.9.3</version>
     </parent>
     <modelVersion>4.0.0</modelVersion>
 

diff --git a/RadarrV3/pom.xml b/RadarrV3/pom.xml
@@ -5,7 +5,7 @@
     <parent>
         <artifactId>Gaps</artifactId>
         <groupId>com.jasonhhouse</groupId>
-        <version>0.9.2</version>
+        <version>0.9.3</version>
     </parent>
     <modelVersion>4.0.0</modelVersion>