Add a filter by genres

lib/librarix/application.rb

@@ -30,7 +30,12 @@ module Librarix
 
     get '/movie/:id' do |id|
       movie = Librarix::Redis::Movie.new(id).fetch
-      slim :movie, layout: !request.xhr?, locals: {movie: movie}
+
+      if request.xhr?
+        slim :'partials/movie', layout: false, locals: {movie: movie}
+      else
+        slim :movie, locals: {movie: movie}
+      end
     end
 
     get '/search' do

lib/librarix/assets/application.scss

@@ -20,7 +20,7 @@ h2 {
   font-family: Verdana,Arial,sans-serif;
 }
 
-ul.movies, ul#menu {
+ul {
   list-style-type: none;
   margin: 0;
   padding: 0;
@@ -36,6 +36,31 @@ ul#menu {
   }
 }
 
+#search-genres ul {
+  display: flex;
+  flex-flow: row wrap;
+
+  li {
+    margin-right: 0.5em;
+  }
+}
+
+ul.genres {
+  display: flex;
+
+  li {
+    margin-right: 0.4em;
+  }
+
+  li:last-child::after {
+    content: '';
+  }
+
+  li::after {
+    content: ',';
+  }
+}
+
 form #search-main {
   display: flex;
 
@@ -57,11 +82,11 @@ form #search-main {
 }
 
 .default, .compact {
-  li {
+  & > li {
     padding: 10px 0;
   }
 
-  li:nth-child(even) {
+  & > li:nth-child(even) {
     background-color: #f4f4f4;
   }
 

lib/librarix/filter.rb

@@ -1,5 +1,12 @@
 module Librarix
   class Filter
+    def self.filter_by_genre(movies, genres)
+      return movies if genres.empty?
+      movies.reject do |movie|
+        (movie.genres.map { |genre| genre['name'] } & genres).empty?
+      end
+    end
+
     def self.filter_by_title(movies, title)
       return movies unless title
       movies.select { |movie| movie.title.downcase.include?(title) }
@@ -43,6 +50,7 @@ module Librarix
       @movies ||= begin
         movies = Librarix::Redis::Movie.all
 
+        movies = self.class.filter_by_genre(movies, genres)
         movies = self.class.filter_by_title(movies, params['title'])
         movies = self.class.filter_by_view_state(movies, params['view_state'])
 
@@ -55,6 +63,10 @@ module Librarix
       @group ||= params.key?('group') && params['group']
     end
 
+    def genres
+      @genres ||= params.key?('genres') ? params['genres'].keys : []
+    end
+
     def view_state
       @view_state ||= if %w{all viewed not_viewed}.include?(params['view_state'])
         params['view_state']

lib/librarix/public/application.css

@@ -1 +1 @@
-body{margin:10px}a{text-decoration:none;color:#666}a:hover{color:#888}h2{margin-top:0;overflow:hidden;text-overflow:ellipsis;font-size:1.2em;font-family:Verdana,Arial,sans-serif}ul.movies,ul#menu{list-style-type:none;margin:0;padding:0}ul#menu{display:flex;flex-flow:row wrap;justify-content:flex-end}ul#menu li{margin:5px}form #search-main{display:flex}form #search-main input{border-radius:0.4em;border:solid 3px #f4f4f4}form #search-main input[type="submit"]{background-color:#f4f4f4}form #search-main input[type="text"]{flex-grow:1;min-width:50px;font-size:1.4em;padding:5px}.default li,.compact li{padding:10px 0}.default li:nth-child(even),.compact li:nth-child(even){background-color:#f4f4f4}.default .movie,.compact .movie{display:flex;flex-flow:row wrap;align-items:center;justify-content:center}.default .movie .poster,.compact .movie .poster{margin-right:10px}.default .movie .informations,.compact .movie .informations{align-self:flex-start;flex:1 1 300px}.poster{display:flex;flex-flow:row wrap}.poster .movie{width:160px}
+body{margin:10px}a{text-decoration:none;color:#666}a:hover{color:#888}h2{margin-top:0;overflow:hidden;text-overflow:ellipsis;font-size:1.2em;font-family:Verdana,Arial,sans-serif}ul{list-style-type:none;margin:0;padding:0}ul#menu{display:flex;flex-flow:row wrap;justify-content:flex-end}ul#menu li{margin:5px}#search-genres ul{display:flex;flex-flow:row wrap}#search-genres ul li{margin-right:0.5em}ul.genres{display:flex}ul.genres li{margin-right:0.4em}ul.genres li:last-child::after{content:''}ul.genres li::after{content:','}form #search-main{display:flex}form #search-main input{border-radius:0.4em;border:solid 3px #f4f4f4}form #search-main input[type="submit"]{background-color:#f4f4f4}form #search-main input[type="text"]{flex-grow:1;min-width:50px;font-size:1.4em;padding:5px}.default>li,.compact>li{padding:10px 0}.default>li:nth-child(even),.compact>li:nth-child(even){background-color:#f4f4f4}.default .movie,.compact .movie{display:flex;flex-flow:row wrap;align-items:center;justify-content:center}.default .movie .poster,.compact .movie .poster{margin-right:10px}.default .movie .informations,.compact .movie .informations{align-self:flex-start;flex:1 1 300px}.poster{display:flex;flex-flow:row wrap}.poster .movie{width:160px}

lib/librarix/redis/movie.rb

@@ -7,13 +7,28 @@ module Librarix
         Array(Librarix.redis.smembers('movies_id')).map { |id| new(id).fetch }
       end
 
+      def self.genres
+        fetch_genres unless Librarix.redis.exists('genres')
+        Librarix.redis.smembers('genres').sort
+      end
+
+      def self.fetch_genres
+        Tmdb::Genre.list['genres'].each do |genre|
+          Librarix.redis.sadd('genres', genre['name'])
+        end
+      end
+
       def initialize(id)
         @id = id.to_i
       end
 
+      def movie
+        @movie ||= fetch
+      end
+
       def add
         Librarix.redis.sadd('movies_id', id)
-        fetch
+        movie
       end
 
       def added?

lib/librarix/the_movie_db.rb

@@ -15,6 +15,10 @@ module Librarix
     end
 
     module Movie
+      def genres
+        super || []
+      end
+
       def release_date
         @_release_date ||= Date.parse(super) unless super.nil? || super.empty?
       end

lib/librarix/views/index.slim

@@ -19,6 +19,12 @@ form method="get" action="/" id="filter"
       option value="default" selected=(template == 'default') Default
       option value="compact" selected=(template == 'compact') Compact
       option value="poster" selected=(template == 'poster') Poster
+  div id="search-genres"
+    ul
+      - Librarix::Redis::Movie.genres.each do |genre|
+        li
+          input type="checkbox" name="genres[#{genre}]" id="#{genre}" checked=(filter.genres.include?(genre))
+          label for="#{genre}" = genre
 
 
 - filter.movies.each do |group, movies|