diff --git a/lib/librarix/assets/application.scss b/lib/librarix/assets/application.scss index 834a6ff..f9d2014 100644 --- a/lib/librarix/assets/application.scss +++ b/lib/librarix/assets/application.scss @@ -26,11 +26,13 @@ body > form #search-main { } } -ul { +ul#movies { list-style-type: none; margin: 0; padding: 0; +} +.default, .compact { li { padding: 10px 0; } @@ -38,20 +40,29 @@ ul { li:nth-child(even) { background-color: #f4f4f4; } + + .movie { + display: flex; + flex-flow: row wrap; + align-items: center; + justify-content: center; + + .poster { + margin-right: 10px; + } + + .informations { + align-self: flex-start; + flex: 1 1 300px; + } + } } -.movie { +.poster { display: flex; flex-flow: row wrap; - align-items: center; - justify-content: center; - .poster { - margin-right: 10px; - } - - .informations { - align-self: flex-start; - flex: 1 1 300px; + .movie { + width: 160px; } } diff --git a/lib/librarix/helpers.rb b/lib/librarix/helpers.rb index c98da80..e13e285 100644 --- a/lib/librarix/helpers.rb +++ b/lib/librarix/helpers.rb @@ -1,7 +1,11 @@ module Librarix module Helpers - def compact? - params.key?('compact') + def template + if %w{default compact poster}.include?(params['template']) + params['template'] + else + 'default' + end end end end diff --git a/lib/librarix/public/application.css b/lib/librarix/public/application.css index 1389cf0..b5854e9 100644 --- a/lib/librarix/public/application.css +++ b/lib/librarix/public/application.css @@ -1 +1 @@ -body{margin:10px}h2{margin-top:0}body>form #search-main{display:flex}body>form #search-main input{border-radius:0.4em;border:solid 3px #f4f4f4}body>form #search-main input[type="submit"]{background-color:#f4f4f4}body>form #search-main input[type="text"]{flex-grow:1;min-width:50px;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 #search-main{display:flex}body>form #search-main input{border-radius:0.4em;border:solid 3px #f4f4f4}body>form #search-main input[type="submit"]{background-color:#f4f4f4}body>form #search-main input[type="text"]{flex-grow:1;min-width:50px;font-size:1.4em;padding:5px}ul#movies{list-style-type:none;margin:0;padding:0}.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} diff --git a/lib/librarix/views/index.slim b/lib/librarix/views/index.slim index 6343e8e..273c51a 100644 --- a/lib/librarix/views/index.slim +++ b/lib/librarix/views/index.slim @@ -9,8 +9,10 @@ form method="get" action="/" id="filter" option value="all" selected=(params['view_state'].nil? || params['view_state'] == '' || params['view_state'] == 'all') All movies option value="viewed" selected=(params['view_state'] == 'viewed') Only viewed option value="not_viewed" selected=(params['view_state'] == 'not_viewed') Not viewed - input type="checkbox" name="compact" id="compact" checked=(params['compact']) - label for="compact" Compact view + select name="template" + option value="default" selected=(template == 'default') Default + option value="compact" selected=(template == 'compact') Compact + option value="poster" selected=(template == 'poster') Poster == slim :list, locals: {movies: movies} diff --git a/lib/librarix/views/list.slim b/lib/librarix/views/list.slim index 2062ac1..23e0080 100644 --- a/lib/librarix/views/list.slim +++ b/lib/librarix/views/list.slim @@ -1,4 +1,4 @@ -ul#movies +ul#movies class="#{template}" - movies.each do |movie| li == slim :movie, locals: {movie: movie} diff --git a/lib/librarix/views/movie.slim b/lib/librarix/views/movie.slim index 656c93f..45c179f 100644 --- a/lib/librarix/views/movie.slim +++ b/lib/librarix/views/movie.slim @@ -1,23 +1,2 @@ .movie data-id="#{movie.id}" - .poster - - if movie.poster_path - img src="#{poster_url(movie.poster_path, compact? ? 'w92' : 'w154')}" - .informations - h2 - a href="https://www.themoviedb.org/movie/#{movie.id}" #{movie.original_title} - p = movie.release_date - - unless compact? - p = movie.overview - .actions - - if movie.added? - - unless movie.viewed? - form method="post" action="/view" - input type="hidden" name="id" value="#{movie.id}" - button type="submit" data-action="view-movie" View - form method="post" action="/remove" - input type="hidden" name="id" value="#{movie.id}" - button type="submit" data-action="remove-movie" Remove - - else - form method="post" action="/add" - input type="hidden" name="id" value="#{movie.id}" - button type="submit" data-action="add-movie" Add + == slim :"movie/#{template}", locals: {movie: movie} diff --git a/lib/librarix/views/movie/compact.slim b/lib/librarix/views/movie/compact.slim new file mode 100644 index 0000000..7b903b7 --- /dev/null +++ b/lib/librarix/views/movie/compact.slim @@ -0,0 +1,19 @@ +.poster + - if movie.poster_path + img src="#{poster_url(movie.poster_path, 'w92')}" +.informations + h2 + a href="https://www.themoviedb.org/movie/#{movie.id}" #{movie.original_title} +.actions + - if movie.added? + - unless movie.viewed? + form method="post" action="/view" + input type="hidden" name="id" value="#{movie.id}" + button type="submit" data-action="view-movie" View + form method="post" action="/remove" + input type="hidden" name="id" value="#{movie.id}" + button type="submit" data-action="remove-movie" Remove + - else + form method="post" action="/add" + input type="hidden" name="id" value="#{movie.id}" + button type="submit" data-action="add-movie" Add diff --git a/lib/librarix/views/movie/default.slim b/lib/librarix/views/movie/default.slim new file mode 100644 index 0000000..39a6f99 --- /dev/null +++ b/lib/librarix/views/movie/default.slim @@ -0,0 +1,21 @@ +.poster + - if movie.poster_path + img src="#{poster_url(movie.poster_path, 'w154')}" +.informations + h2 + a href="https://www.themoviedb.org/movie/#{movie.id}" #{movie.original_title} + p = movie.release_date + p = movie.overview +.actions + - if movie.added? + - unless movie.viewed? + form method="post" action="/view" + input type="hidden" name="id" value="#{movie.id}" + button type="submit" data-action="view-movie" View + form method="post" action="/remove" + input type="hidden" name="id" value="#{movie.id}" + button type="submit" data-action="remove-movie" Remove + - else + form method="post" action="/add" + input type="hidden" name="id" value="#{movie.id}" + button type="submit" data-action="add-movie" Add diff --git a/lib/librarix/views/movie/poster.slim b/lib/librarix/views/movie/poster.slim new file mode 100644 index 0000000..3ee9fb2 --- /dev/null +++ b/lib/librarix/views/movie/poster.slim @@ -0,0 +1,6 @@ +.poster + - if movie.poster_path + img src="#{poster_url(movie.poster_path, 'w154')}" +.informations + h2 + a href="https://www.themoviedb.org/movie/#{movie.id}" #{movie.original_title}