Add filter form for movies

lib/librarix/application.rb

@@ -1,3 +1,4 @@
+require 'librarix/filter'
 require 'librarix/menu'
 require 'librarix/the_movie_db'
 
@@ -22,7 +23,7 @@ module Librarix
     helpers Librarix::Menu::Helper
 
     get '/' do
-      slim :index, locals: {movies: Librarix::Redis::Movie.all.sort_by(&:release_date).reverse}
+      slim :index, locals: {movies: Librarix::Filter.new(params).movies}
     end
 
     get '/search' do

lib/librarix/assets/application.scss

@@ -6,7 +6,7 @@ h2 {
   margin-top: 0;
 }
 
-#search {
+body > form {
   display: flex;
 
   input {

lib/librarix/filter.rb

@@ -0,0 +1,23 @@
+module Librarix
+  class Filter
+    attr_reader :movies, :params
+
+    def initialize(params)
+      @params = params
+      filter
+    end
+
+    private
+
+    def filter
+      @movies = Librarix::Redis::Movie.all
+      by_title if @params.key?('title')
+
+      @movies.sort_by!(&:release_date).reverse!
+    end
+
+    def by_title
+      movies.select! { |movie| movie.title.downcase.include?(params['title']) }
+    end
+  end
+end

lib/librarix/public/application.css

@@ -1 +1 @@
-body{margin:10px}h2{margin-top:0}#search{display:flex}#search input{border-radius:0.4em;border:solid 3px #f4f4f4}#search input[type="submit"]{background-color:#f4f4f4}#search input[type="text"]{flex-grow:1;font-size:1.4em;padding:5px}ul{list-style-type:none;margin:0;padding:0}ul li{padding:10px 0}ul li:nth-child(even){background-color:#f4f4f4}.movie{display:flex;flex-flow:row wrap;align-items:center;justify-content:center}.movie .poster{margin-right:10px}.movie .informations{align-self:flex-start;flex:1 1 300px}
+body{margin:10px}h2{margin-top:0}body>form{display:flex}body>form input{border-radius:0.4em;border:solid 3px #f4f4f4}body>form input[type="submit"]{background-color:#f4f4f4}body>form input[type="text"]{flex-grow:1;font-size:1.4em;padding:5px}ul{list-style-type:none;margin:0;padding:0}ul li{padding:10px 0}ul li:nth-child(even){background-color:#f4f4f4}.movie{display:flex;flex-flow:row wrap;align-items:center;justify-content:center}.movie .poster{margin-right:10px}.movie .informations{align-self:flex-start;flex:1 1 300px}

lib/librarix/views/index.slim

@@ -1,3 +1,7 @@
 - content_for(:title) { 'Index' }
 
+form method="get" action="/" id="filter"
+  input type="text" name="title" value="#{params['title']}" autocomplete="off"
+  input type="submit" value="Filter"
+
 == slim :list, locals: {movies: movies}