Increased size of modal, added description as caption to photos

app/assets/stylesheets/splash.css.scss

@@ -145,7 +145,17 @@ a:after {
   }
 }
 #gallery{
-   min-height: 500px;
+  min-height: 600px;
+  .item{
+    img {
+      height: 600px;
+      background-repeat: no-repeat;
+      background-position: center center;
+      width: 100%;
+      background-size: cover;
+      -webkit-background-size:cover;
+    }
+  }
   .modal-body{
     i{
       margin-top: 35%;

app/controllers/conference_controller.rb

@@ -4,8 +4,8 @@ class ConferenceController < ApplicationController
     not_found unless @conference.make_conference_public?
   end
 
-  def fetch_gallery_photos
-    @photos = Conference.find(params[:id].to_i).photos
+  def gallery_photos
+    @photos = Conference.find_by_short_title(params[:id]).photos
     render "photos", formats: [:js]
   end
 end

app/models/photo.rb

@@ -3,7 +3,7 @@ class Photo < ActiveRecord::Base
   belongs_to :conference
   validates_presence_of :picture
   has_attached_file :picture,
-                    styles: { thumb: "100x100>", large: "300x300>", banner: "500x300>" }
+                    styles: { thumb: "100x100>", large: "300x300>", banner: "600x300>" }
 
   validates_attachment_content_type :picture,
                                     content_type: [/jpg/, /jpeg/, /png/, /gif/],

app/views/conference/_gallery.html.haml

@@ -1,6 +1,6 @@
 <!-- Modal -->
-%div{ class: "modal fade", id: "gallery", tabindex: "-1", role: "dialog", "aria-labelledby" => "myModalLabel", "aria-hidden"=> "true" }
-  %div{ class: "modal-dialog" }
+%div{ class: "modal fade", id: "gallery", tabindex: "-1", role: "dialog", "aria-labelledby" => "myLargeModalLabel", "aria-hidden"=> "true" }
+  %div{ class: "modal-dialog modal-lg" }
     %div{ class: "modal-content" }
       %div{ class: "modal-body" }
         %div{ id: "carousel-example-generic", class: "carousel slide", "data-ride" => "carousel" }

app/views/conference/_gallery_photo.html.haml

@@ -1,3 +1,7 @@
 - photos.each_with_index do |photo,index|
   %div.item{ class: (index==0? 'active' : '') }
     = image_tag(photo.picture(:banner))
+    - unless photo.description.blank?
+      %div.carousel-caption
+        %p.lead
+          = photo.description

app/views/conference/show.html.haml

@@ -18,7 +18,7 @@
               .col-md-12.lead
                 %p= @conference.description
           -unless @conference.photos.blank?
-            = link_to 'Gallery', fetch_gallery_photos_conference_path(@conference.id), class: 'btn btn-primary btn-lg', id: 'gallery-btn', remote: true
+            = link_to 'Gallery', gallery_photos_conference_path(@conference.short_title), class: 'btn btn-primary btn-lg', id: 'gallery-btn', remote: true
             = render 'gallery'
   - if @conference.include_program_in_splash?
     %section{ id: 'program' }

config/routes.rb

@@ -92,7 +92,7 @@ Osem::Application.routes.draw do
       get "/register" => "conference_registration#register"
       patch "/register" => "conference_registration#update"
       delete "/register" => "conference_registration#unregister"
-      get "fetch_gallery_photos"
+      get "gallery_photos"
     end
   end