Merge pull request #260 from gopesht/add_banner_to_splash

Add banner to splash

app/assets/stylesheets/osem.css

@@ -92,22 +92,32 @@ body {
     padding-bottom: 20px;
 }
 
-#venue-banner-disp{
+.banner-disp{
  background-repeat: no-repeat;
  background-position: center center;
  width: 100%;
  background-size: cover;
  -webkit-background-size:cover;
 }
-#venue-banner-disp.with-background{
+
+#location .with-background {
     min-height: 500px;
 }
 
-#venue-banner-disp li{
+#splash-banner .with-background{
+    min-height: 700px;
+}
+
+.location-links li{
   display: inline-block;
   margin-right: 2em;
 }
 
+.banner-text{
+    padding-top: 10%;
+    color: #fff;
+}
+
 .pad{
     padding-top: 35px;
     padding-bottom: 35px;

app/models/conference.rb

@@ -20,7 +20,8 @@ class Conference < ActiveRecord::Base
                   :include_sponsors_in_splash, :include_tracks_in_splash,
                   :include_tickets_in_splash, :include_social_media_in_splash,
                   :include_program_in_splash, :make_conference_public,
-                  :photos_attributes
+                  :photos_attributes, :banner_photo,
+                  :include_banner_in_splash
 
   has_paper_trail
 
@@ -63,12 +64,18 @@ class Conference < ActiveRecord::Base
   accepts_nested_attributes_for :photos, allow_destroy: true
 
   has_attached_file :logo,
-                    :styles => {:thumb => "100x100>", :large => "300x300>" }
+                    styles: { thumb: '100x100>', large: '300x300>' }
 
   validates_attachment_content_type :logo,
-                                    :content_type => [/jpg/, /jpeg/, /png/, /gif/],
+                                    content_type: [/jpg/, /jpeg/, /png/, /gif/],
-                                    :size => { :in => 0..500.kilobytes }
+                                    size: { in: 0..500.kilobytes }
 
+  has_attached_file :banner_photo,
+                    styles: { thumb: '100x100>', large: '1300x700>' }
+
+  validates_attachment_content_type :banner_photo,
+                                    content_type: [/jpg/, /jpeg/, /png/, /gif/],
+                                    size: { in: 0..500.kilobytes }
   validates_presence_of :title,
                         :short_title,
                         :social_tag,

app/views/admin/conference/edit.html.haml

@@ -9,7 +9,10 @@
       = f.input :social_tag, :hint => "The hashtag you'll use on Twitter and Google+.  Don't include the '#' sign!'"
       = f.input :contact_email, :hint => "Contact email address for your conference. Will be used as reply-to address in emails sent out by the system."
       = f.input :color, :hint => "The color will be used eg for the dashboard.", :input_html => {:size => 6, :type => "color"}
-      = f.input :description, hint: 'This description will be shown in the program segement of the Splash'
+      = f.inputs name: 'Banner for Splash' do
+        = f.input :include_banner_in_splash, hint: 'This enable the Banner Photo with description to be displayed on the splash'
+        = f.input :banner_photo, hint: 'This will be the top most component of the splash.This background cover will contain start_date and end_date of the conference and the description'
+        = f.input :description, hint: 'This description will be shown at the bottom of the banner photo of the Splash'
 
       = f.inputs :name => "Scheduling" do
         = f.input :timezone, :as => :time_zone, :hint => "The conference time zone"

app/views/conference/_location.html.haml

@@ -3,7 +3,7 @@
     %a{ href: '#location' } Location
 
 
-%div#venue-banner-disp{ style: ("background-image: url(#{@conference.venue.photo})" unless @conference.venue.photo.blank?), class:('with-background' unless @conference.venue.photo.blank?) }
+%div.banner-disp{ style: ("background-image: url(#{@conference.venue.photo})" unless @conference.venue.photo.blank?), class:('with-background' unless @conference.venue.photo.blank?) }
   %div.container.text-center
     .div.row.col-md-12
       - unless @conference.venue.name.blank?
@@ -15,7 +15,7 @@
       - unless @conference.venue.description.blank?
         %p
           %strong #{ @conference.venue.description }
-      %ul
+      %ul.location-links
         - unless @conference.venue.address.blank?
           %li
             %b

app/views/conference/show.html.haml

@@ -1,8 +1,20 @@
 = content_for :brand do
   = link_to @conference.title, conference_url(@conference.short_title), class: 'navbar-brand'
 = content_for :splash do
-  - unless @conference.description.blank?
+  - if @conference.include_banner_in_splash?
-    %p= @conference.description
+    %section{ id: 'splash-banner' }
+      %div.banner-disp{ style: ("background-image: url(#{@conference.banner_photo})" unless @conference.banner_photo.blank?), class:('with-background' unless @conference.banner_photo.blank?) }
+        %div.container.text-center.banner-text
+          .row.col-md-12
+            %h1
+              = @conference.title
+          - if @conference.start_date && @conference.end_date
+            %h3
+              = conference_date_string(@conference)
+
+          - unless @conference.description.blank?
+            .row-fluid.col-md-12.lead
+              %p= @conference.description
 
   - if @conference.include_program_in_splash?
     %section{ id: 'program' }
@@ -11,32 +23,32 @@
 
   - if @conference.include_registrations_in_splash?
     %section{ id: 'registration' }
-    .pad
+      .pad
-      = render 'registration'
+        = render 'registration'
 
 
   -unless @conference.call_for_papers.blank?
     - if @conference.call_for_papers.include_cfp_in_splash?
       %section{ id:'callforpapers' }
-      .pad
+        .pad
-        = render 'call_for_papers'
+          = render 'call_for_papers'
 
   -unless @conference.venue.blank?
     - if @conference.venue.include_venue_in_splash?
       %section{ id: 'location' }
-      .pad
+        .pad
-        = render 'location'
+          = render 'location'
-    - unless @conference.venue.lodgings.empty?
+      - unless @conference.venue.lodgings.empty?
-      - if @conference.venue.include_lodgings_in_splash?
+        - if @conference.venue.include_lodgings_in_splash?
-        = render 'lodging'
+          = render 'lodging'
 
   - if @conference.include_sponsors_in_splash?
     %section{ id: 'sponsors' }
-    .pad
+      .pad
-      = render 'sponsor'
+        = render 'sponsor'
 
   - if @conference.include_social_media_in_splash?
     %section{ id: 'social-media' }
-    .pad
+      .pad
-      = render 'social_media'
+        = render 'social_media'
 

db/migrate/20140620130306_add_banner_photo_to_conference.rb

@@ -0,0 +1,8 @@
+class AddBannerPhotoToConference < ActiveRecord::Migration
+  def change
+    add_column :conferences, :banner_photo_file_name, :string
+    add_column :conferences, :banner_photo_content_type, :string
+    add_column :conferences, :banner_photo_file_size, :integer
+    add_column :conferences, :banner_photo_updated_at, :datetime
+  end
+end

db/migrate/20140620134535_add_include_banner_in_splash_to_conference.rb

@@ -0,0 +1,5 @@
+class AddIncludeBannerInSplashToConference < ActiveRecord::Migration
+  def change
+    add_column :conferences, :include_banner_in_splash, :boolean, default: false
+  end
+end

db/schema.rb

@@ -11,7 +11,7 @@
 #
 # It's strongly recommended that you check this file into your version control system.
 
-ActiveRecord::Schema.define(version: 20140618062623) do
+ActiveRecord::Schema.define(version: 20140620134535) do
 
   create_table "answers", force: true do |t|
     t.string   "title"
@@ -94,7 +94,12 @@ ActiveRecord::Schema.define(version: 20140618062623) do
     t.boolean  "include_tickets_in_splash",       default: false
     t.boolean  "include_social_media_in_splash",  default: false
     t.boolean  "include_program_in_splash",       default: false
-    t.boolean  "make_conference_public",   default: false
+    t.boolean  "make_conference_public",          default: false
+    t.string   "banner_photo_file_name"
+    t.string   "banner_photo_content_type"
+    t.integer  "banner_photo_file_size"
+    t.datetime "banner_photo_updated_at"
+    t.boolean  "include_banner_in_splash",        default: false
   end
 
   create_table "conferences_questions", id: false, force: true do |t|

spec/views/conference/show.html.haml_spec.rb

@@ -16,7 +16,8 @@ describe 'conference/show.html.haml' do
                                       include_sponsors_in_splash: true,
                                       include_social_media_in_splash: true,
                                       include_tracks_in_splash: true,
-                                      include_tickets_in_splash: true)
+                                      include_tickets_in_splash: true,
+                                      include_banner_in_splash: true)
     @conference.call_for_papers = create(:call_for_papers, conference: @conference,
                                                            include_cfp_in_splash: true)
     @conference.sponsorship_levels << create(:sponsorship_level, conference: @conference)
@@ -30,8 +31,12 @@ describe 'conference/show.html.haml' do
     render
   end
 
-  it 'renders program partial' do
+  it 'renders banner component' do
     expect(view.content_for(:splash)).to include("#{@conference.description}")
+    expect(view.content_for(:splash)).to include("#{@conference.title}")
+  end
+
+  it 'renders program partial' do
     expect(view).to render_template(partial: 'conference/_program')
   end