diff --git a/app/assets/stylesheets/splash.css.scss b/app/assets/stylesheets/splash.css.scss index 5388e8a8..46bd2f8b 100644 --- a/app/assets/stylesheets/splash.css.scss +++ b/app/assets/stylesheets/splash.css.scss @@ -144,3 +144,24 @@ a:after { font-weight: 400; } } +#gallery{ + 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%; + } + } + #carousel-example-generic{ + visibility: hidden; + } +} diff --git a/app/controllers/conference_controller.rb b/app/controllers/conference_controller.rb index 2bfeee3c..b3f6dae2 100644 --- a/app/controllers/conference_controller.rb +++ b/app/controllers/conference_controller.rb @@ -3,4 +3,9 @@ class ConferenceController < ApplicationController @conference = Conference.find_by_short_title(params[:id]) not_found unless @conference.make_conference_public? end + + def gallery_photos + @photos = Conference.find_by_short_title(params[:id]).photos + render "photos", formats: [:js] + end end diff --git a/app/models/photo.rb b/app/models/photo.rb index 22a8d9c2..c7871db5 100644 --- a/app/models/photo.rb +++ b/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>' } + styles: { thumb: "100x100>", large: "300x300>", banner: "600x300>" } validates_attachment_content_type :picture, content_type: [/jpg/, /jpeg/, /png/, /gif/], diff --git a/app/views/conference/_gallery.html.haml b/app/views/conference/_gallery.html.haml new file mode 100644 index 00000000..0398cf45 --- /dev/null +++ b/app/views/conference/_gallery.html.haml @@ -0,0 +1,35 @@ + +%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" } + + %div{ class: "carousel-inner" } + + + %a{ class: "left carousel-control", href: "#carousel-example-generic", role: "button", "data-slide" => "prev" } + %span{ class: "glyphicon glyphicon-chevron-left" } + %a{ class: "right carousel-control", href: "#carousel-example-generic", role: "button", "data-slide" => "next" } + %span{ class: "glyphicon glyphicon-chevron-right" } + + +:javascript + $(document).ready(function(){ + var count = 0; + $('#gallery-btn').click(function(){ + if(count == 0){ + $('#gallery').modal('show'); + $('#gallery .modal-body').append(''); + count +=1; + } + else{ + $('#gallery').modal('show'); + return false; + } + }); + }); + + + + diff --git a/app/views/conference/_gallery_photo.html.haml b/app/views/conference/_gallery_photo.html.haml new file mode 100644 index 00000000..647cfb2d --- /dev/null +++ b/app/views/conference/_gallery_photo.html.haml @@ -0,0 +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 diff --git a/app/views/conference/photos.js.haml b/app/views/conference/photos.js.haml new file mode 100644 index 00000000..5e24851d --- /dev/null +++ b/app/views/conference/photos.js.haml @@ -0,0 +1,4 @@ +$('#gallery .carousel-inner').append("#{escape_javascript(render('gallery_photo', photos: @photos)) }"); +$('#gallery .modal-body').children('.fa').remove(); +$('#gallery #carousel-example-generic').css('visibility','visible'); + diff --git a/app/views/conference/show.html.haml b/app/views/conference/show.html.haml index ce120949..be839e6b 100644 --- a/app/views/conference/show.html.haml +++ b/app/views/conference/show.html.haml @@ -17,7 +17,9 @@ .row-fluid .col-md-12.lead %p= @conference.description - + -unless @conference.photos.blank? + = 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' } .pad diff --git a/config/routes.rb b/config/routes.rb index a907ff77..41cd31e8 100644 --- a/config/routes.rb +++ b/config/routes.rb @@ -92,6 +92,7 @@ Osem::Application.routes.draw do get "/register" => "conference_registration#register" patch "/register" => "conference_registration#update" delete "/register" => "conference_registration#unregister" + get "gallery_photos" end end