Refactoring Conference/Event media to new media object

close #420

app/assets/javascripts/osem.js

@@ -82,12 +82,8 @@ $(function () {
         5)
     });
 
-    $("#event_media_type").change(function () {
-        $(".media-type").hide();
-        $('#' + $(this).val().toLowerCase() + '-help').show();
-    });
 
-    $("#conference_media_type").change(function () {
+    $("#commercial_commercial_type").change(function () {
         $(".media-type").hide();
         $('#' + $(this).val().toLowerCase() + '-help').show();
     });

app/controllers/admin/commercials_controller.rb

@@ -0,0 +1,57 @@
+class Admin::CommercialsController < ApplicationController
+  before_action :set_conference
+  before_action :set_commercial, only: [:edit, :update, :destroy]
+
+  def index
+    @commercials = @conference.commercials
+  end
+
+  def new
+    @commercial = @conference.commercials.build
+  end
+
+  def edit
+  end
+
+  def create
+    @commercial = @conference.commercials.build(commercial_params)
+
+    if @commercial.save
+      redirect_to admin_conference_commercials_path,
+                  notice: 'Commercial was successfully created.'
+    else
+      flash[:alert] = "A error prohibited this Commercial from being saved: #{@commercial.errors.full_messages.join('. ')}."
+      render :new
+    end
+  end
+
+  def update
+    if @commercial.update(commercial_params)
+      redirect_to admin_conference_commercials_path,
+                  notice: 'Commercial was successfully updated.'
+    else
+      flash[:alert] = "A error prohibited this Commercial from being saved: #{@commercial.errors.full_messages.join('. ')}."
+      render :edit
+    end
+  end
+
+  def destroy
+    @commercial.destroy
+    redirect_to admin_conference_commercials_path, notice: 'Commercial was successfully destroyed.'
+  end
+
+  private
+
+  def set_commercial
+    @commercial = @conference.commercials.find(params[:id])
+  end
+
+  def set_conference
+    @conference = Conference.find_by(short_title: params[:conference_id])
+  end
+
+  def commercial_params
+    #params.require(:commercial).permit(:commercial_id, :commercial_type)
+    params[:commercial]
+  end
+end

app/controllers/commercials_controller.rb

@@ -0,0 +1,59 @@
+class CommercialsController < ApplicationController
+  before_action :set_conference
+  before_action :set_event
+  before_action :set_commercial, only: [:edit, :update, :destroy]
+
+  def new
+    @commercial = @event.commercials.build
+  end
+
+  def edit
+  end
+
+  def create
+    @commercial = @event.commercials.build(commercial_params)
+
+    if @commercial.save
+      redirect_to edit_conference_proposal_path(conference_id: @conference.short_title, id: @event.id),
+                  notice: 'Commercial was successfully created.'
+    else
+      flash[:alert] = "A error prohibited this Commercial from being saved: #{@commercial.errors.full_messages.join('. ')}."
+      render :new
+    end
+  end
+
+  def update
+    if @commercial.update(commercial_params)
+      redirect_to edit_conference_proposal_path(conference_id: @conference.short_title, id: @event.id),
+                  notice: 'Commercial was successfully updated.'
+    else
+      flash[:alert] = "A error prohibited this Commercial from being saved: #{@commercial.errors.full_messages.join('. ')}."
+      render :edit
+    end
+  end
+
+  def destroy
+    @commercial.destroy
+    redirect_to edit_conference_proposal_path(conference_id: @conference.short_title, id: @event.id),
+                notice: 'Commercial was successfully destroyed.'
+  end
+
+  private
+
+  def set_commercial
+    @commercial = @event.commercials.find(params[:id])
+  end
+
+  def set_conference
+    @conference = Conference.find_by(short_title: params[:conference_id])
+  end
+
+  def set_event
+    @event = @conference.events.find(params[:proposal_id])
+  end
+
+  def commercial_params
+    #params.require(:commercial).permit(:commercial_id, :commercial_type)
+    params[:commercial]
+  end
+end

app/models/commercial.rb

@@ -0,0 +1,9 @@
+class Commercial < ActiveRecord::Base
+  belongs_to :commercialable, polymorphic: true
+
+  attr_accessible :commercial_id, :commercial_type
+
+  validates :commercial_id, :commercial_type, presence: true
+
+  validates :commercial_type, inclusion: { in: CONFIG['commercial_types'].values }, allow_blank: true
+end

app/models/conference.rb

@@ -12,7 +12,7 @@ class Conference < ActiveRecord::Base
                   :registration_start_date, :registration_end_date, :logo, :questions_attributes,
                   :question_ids, :answers_attributes, :answer_ids, :difficulty_levels_attributes,
                   :use_difficulty_levels, :use_vpositions, :use_vdays, :vdays_attributes,
-                  :vpositions_attributes, :use_volunteers, :media_id, :media_type, :color,
+                  :vpositions_attributes, :use_volunteers, :color,
                   :description, :registration_description, :ticket_description,
                   :sponsorship_levels_attributes, :sponsors_attributes,
                   :sponsor_description, :sponsor_email, :lodging_description,
@@ -48,6 +48,7 @@ class Conference < ActiveRecord::Base
   has_many :photos, dependent: :destroy
   has_many :targets, dependent: :destroy
   has_many :campaigns, dependent: :destroy
+  has_many :commercials, as: :commercialable, dependent: :destroy
   belongs_to :venue
 
   accepts_nested_attributes_for :rooms, reject_if: proc { |r| r['name'].blank? }, allow_destroy: true
@@ -94,12 +95,6 @@ class Conference < ActiveRecord::Base
   before_create :create_email_settings
   before_create :add_color
 
-  def self.media_types
-    media_types = { youtube: 'YouTube', slideshare: 'SlideShare', flickr: 'Flickr', vimeo: 'Vimeo',
-                    speakerdeck: 'Speakerdeck', instagram: 'Instagram' }
-    return media_types
-  end
-
   ##
   # Checks if the user is registered to the conference
   #

app/models/event.rb

@@ -2,7 +2,7 @@ class Event < ActiveRecord::Base
   include ActiveRecord::Transitions
   has_paper_trail
   attr_accessible :title, :subtitle, :abstract, :description, :event_type_id, :users_attributes,
-                  :user, :proposal_additional_speakers, :track_id, :media_id, :media_type,
+                  :user, :proposal_additional_speakers, :track_id,
                   :require_registration, :difficulty_level_id
 
   acts_as_commentable
@@ -15,6 +15,7 @@ class Event < ActiveRecord::Base
   has_many :speakers, through: :event_users, source: :user
   has_many :votes
   has_many :voters, through: :votes, source: :user
+  has_many :commercials, as: :commercialable, dependent: :destroy
   belongs_to :event_type
 
   has_and_belongs_to_many :registrations
@@ -36,7 +37,6 @@ class Event < ActiveRecord::Base
   validates :abstract, presence: true
   validates :event_type, presence: true
   validates :conference, presence: true
-  validates :media_type, inclusion: { in: Conference.media_types.values }, allow_blank: true
 
   scope :confirmed, -> { where(state: 'confirmed') }
 

app/views/admin/commercials/_form.html.haml

@@ -0,0 +1,9 @@
+= f.input :commercial_type, as: :select, label: 'Conference Promo Media Type', class: 'form-control', collection: CONFIG['commercial_types'].values, include_blank: false, hint: 'This media-item will be used to represent this conference at various places in OSEM.'
+= f.input :commercial_id, label: 'Conference Promo Media ID', as: :string
+%p{ class: 'help-block media-type', id: 'youtube-help' } Go to your YouTube video, click on "share" and copy everything behind http://youtu.be/"
+%p{ class: 'help-block media-type', id: 'slideshare-help', style: 'display:none' } Go to your SlideShare, click on "share" -> "embed" and copy the id
+%p{ class: 'help-block media-type', id: 'flickr-help', style: 'display:none' } Go to your flickr image, click on "Grab the link" -> "Show short url" and copy everything behind https://flic.kr/p/
+%p{ class: 'help-block media-type', id: 'vimeo-help', style: 'display:none' } Go to your vimeo video, click on "share" and copy everything behind http://vimeo.com/
+%p{ class: 'help-block media-type', id: 'speakerdeck-help', style: 'display:none' } Go to your SpeakerDeck, click on "share" -> "embed" and copy the data-id
+%p{ class: 'help-block media-type', id: 'instagram-help', style: 'display:none' } Go to your Instagram photo page and copy everything behind instagram.com/p/ (without trailing /# hash symbol)
+= f.action :submit, as: :button, button_html: { class: 'btn btn-primary' }

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

@@ -0,0 +1,8 @@
+%h1 Editing Commercial
+
+.row
+  .col-md-8
+    = semantic_form_for @commercial, url: admin_conference_commercial_path(conference_id: @conference.short_title, id: @commercial.id) do |f|
+      = render 'form', f: f
+
+= link_to 'Back', admin_conference_commercials_path

app/views/admin/commercials/index.html.haml

@@ -0,0 +1,21 @@
+%h1 Commercials
+
+%p.text-muted
+  You can add commercials for your conference. These commercials will be displayed on the event detail site if
+  the event submitter doesn't add a commercial. Currently supported commercial types are YouTube, Vimeo, Instagram
+  Flickr, Speakerdeck and SlideShare.
+
+- @commercials.each_slice(3) do |slice|
+  .row
+    - slice.each do |commercial|
+      .col-md-4
+        .thumbnail
+          %h3.text-center
+            = commercial.commercial_type
+          .flexvideo
+            = render partial: 'shared/media_item', locals: { commercial_type: commercial.commercial_type, commercial_id: commercial.commercial_id }
+          = link_to 'Edit', edit_admin_conference_commercial_path(@conference.short_title, commercial.id), class: 'btn btn-primary'
+          = link_to 'Delete', admin_conference_commercial_path(@conference.short_title, commercial.id),
+            method: :delete, data: { confirm: 'Are you sure?' }, class: 'btn btn-danger'
+%br
+  = link_to 'New Commercial', new_admin_conference_commercial_path, class: 'btn btn-primary'

app/views/admin/commercials/new.html.haml

@@ -0,0 +1,7 @@
+%h1 New Commercial
+.row
+  .col-md-8
+    = semantic_form_for @commercial, url: admin_conference_commercials_path(conference_id: @conference.short_title) do |f|
+      = render 'form', f: f
+
+= link_to 'Back', admin_conference_commercials_path

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

@@ -32,12 +32,4 @@
         - if !@conference.logo.blank?
           = image_tag @conference.logo(:thumb)
         = f.input :logo, :label => "Conference Logo", :hint => "This will be displayed on the front page."
-        = f.input :media_type, :as => :select, :label => "Conference Promo Media Type", :class=>"form-control", :collection => Conference.media_types.values, :include_blank => false, :hint => "This media-item will be used to represent this conference at various places in OSEM."
-        = f.input :media_id, :label => "Conference Promo Media ID", :as => :string
-        %p{:class => "help-block media-type", :id => "youtube-help"} Go to your YouTube video, click on "share" and copy everything behind http://youtu.be/"
-        %p{:class => "help-block media-type", :id => "slideshare-help", :style => "display:none"} Go to your SlideShare, click on "share" -> "embed" and copy the id
-        %p{:class => "help-block media-type", :id => "flickr-help", :style => "display:none"} Go to your flickr image, click on "Grab the link" -> "Show short url" and copy everything behind https://flic.kr/p/
-        %p{:class => "help-block media-type", :id => "vimeo-help", :style => "display:none"} Go to your vimeo video, click on "share" and copy everything behind http://vimeo.com/
-        %p{:class => "help-block media-type", :id => "speakerdeck-help", :style => "display:none"} Go to your SpeakerDeck, click on "share" -> "embed" and copy the data-id
-        %p{:class => "help-block media-type", :id => "instagram-help", :style => "display:none"} Go to your Instagram photo page and copy everything behind instagram.com/p/ (without trailing /# hash symbol)
       = f.action :submit, :as => :button, :button_html => {:class => "btn btn-primary"}

app/views/commercials/_form.html.haml

@@ -0,0 +1,9 @@
+= f.input :commercial_type, as: :select, label: 'Conference Promo Media Type', class: 'form-control', collection: CONFIG['commercial_types'].values, include_blank: false, hint: 'This media-item will be used to represent this conference at various places in OSEM.'
+= f.input :commercial_id, label: 'Conference Promo Media ID', as: :string
+%p{ class: 'help-block media-type', id: 'youtube-help' } Go to your YouTube video, click on "share" and copy everything behind http://youtu.be/"
+%p{ class: 'help-block media-type', id: 'slideshare-help', style: 'display:none' } Go to your SlideShare, click on "share" -> "embed" and copy the id
+%p{ class: 'help-block media-type', id: 'flickr-help', style: 'display:none' } Go to your flickr image, click on "Grab the link" -> "Show short url" and copy everything behind https://flic.kr/p/
+%p{ class: 'help-block media-type', id: 'vimeo-help', style: 'display:none' } Go to your vimeo video, click on "share" and copy everything behind http://vimeo.com/
+%p{ class: 'help-block media-type', id: 'speakerdeck-help', style: 'display:none' } Go to your SpeakerDeck, click on "share" -> "embed" and copy the data-id
+%p{ class: 'help-block media-type', id: 'instagram-help', style: 'display:none' } Go to your Instagram photo page and copy everything behind instagram.com/p/ (without trailing /# hash symbol)
+= f.action :submit, as: :button, button_html: { class: 'btn btn-primary' }

app/views/commercials/edit.html.haml

@@ -0,0 +1,8 @@
+%h1 Editing Commercial
+
+.row
+  .col-md-8
+    = semantic_form_for @commercial, url: conference_proposal_commercial_path(conference_id: @conference.short_title, proposal_id: @event.id, id: @commercial.id) do |f|
+      = render 'form', f: f
+
+= link_to 'Back', edit_conference_proposal_path(conference_id: @conference.short_title, id: @event.id)

app/views/commercials/new.html.haml

@@ -0,0 +1,7 @@
+%h1 New Commercial
+.row
+  .col-md-8
+    = semantic_form_for @commercial, url: conference_proposal_commercials_path(conference_id: @conference.short_title, proposal_id: @event.id) do |f|
+      = render 'form', f: f
+
+= link_to 'Back', edit_conference_proposal_path(conference_id: @conference.short_title, id: @event.id)

app/views/layouts/_admin_sidebar.html.haml

@@ -19,6 +19,11 @@
         = link_to(new_admin_conference_path) do
           %span.glyphicon.glyphicon-plus
           New Conference
+  %hr
+    %li{:class=> active_nav_li(admin_conference_commercials_path(@conference.short_title))}
+      = link_to(admin_conference_commercials_path(@conference.short_title)) do
+        %span.fa.fa-picture-o
+        Commercials
   %hr
   %li{:class=> "#{active_nav_li(admin_conference_path(@conference.short_title))} nav-header nav-header-bigger"}
     = link_to(admin_conference_path(@conference.short_title)) do

app/views/proposal/_form.html.haml

@@ -4,11 +4,34 @@
       %ul.nav.nav-tabs
         %li.active
           = link_to "Proposal", "#proposal-content", "data-toggle"=>"tab"
+        %li
+          = link_to 'Commercials', '#commercials-content', 'data-toggle'=>'tab'
         %li
           = link_to "Attachments", "#attachment-content", "data-toggle"=>"tab"
       .tab-content
         #proposal-content.tab-pane.active
           = render 'proposal/proposal_form'
+        #commercials-content.tab-pane
+          %p.text-muted
+            You can add commercials for your event. These commercials will be displayed on the event detail site.
+            If you don't add a commercial, the conference commercial will be displayed!
+            We currently support the following commercial types: YouTube, Vimeo, Instagram, Flickr, Speakerdeck and SlideShare.
+
+          - @event.commercials.each_slice(3) do |slice|
+            .row
+              - slice.each do |commercial|
+                .col-md-4
+                  .thumbnail
+                    %h3.text-center
+                      = commercial.commercial_type
+                    .flexvideo
+                      = render partial: 'shared/media_item', locals: { commercial_type: commercial.commercial_type, commercial_id: commercial.commercial_id }
+                    = link_to 'Edit', edit_conference_proposal_commercial_path(@conference.short_title, @event.id, commercial.id), class: 'btn btn-primary'
+                    = link_to 'Delete', conference_proposal_commercial_path(@conference.short_title, @event.id, commercial.id),
+                      :method => :delete, :data => { :confirm => 'Are you sure?' }, class: 'btn btn-danger'
+          %hr
+          = link_to 'Add Commercial', new_conference_proposal_commercial_path(@conference.short_title, @event.id), class: 'btn btn-primary'
+
         #attachment-content.tab-pane
           = form_for EventAttachment.new, :url => conference_proposal_event_attachment_index_path(@conference.short_title, @event), :html => { :multipart => true, :id => "fileupload"  } do |f|
             %table.table.table-striped

app/views/proposal/_proposal_form.html.haml

@@ -31,14 +31,6 @@
     %br
     %br
     = f.input :description, :input_html => {:rows => 5, :class=> "span11"}, :hint => "This will only be shown to organizers, not to attendees."
-    = f.input :media_type, :as => :select, :label => "Media Type", :collection => Conference.media_types.values, :include_blank => false
-    %p{:class => "help-block media-type", :id => "youtube-help"} Go to your YouTube video, click on "share" and copy everything behind http://youtu.be/"
-    %p{:class => "help-block media-type", :id => "slideshare-help", :style => "display:none"} Go to your SlideShare, click on "share" -> "embed" and copy the id
-    %p{:class => "help-block media-type", :id => "flickr-help", :style => "display:none"} Go to your flickr image, click on "Grab the link" -> "Show short url" and copy everything behind https://flic.kr/p/
-    %p{:class => "help-block media-type", :id => "vimeo-help", :style => "display:none"} Go to your vimeo video, click on "share" and copy everything behind http://vimeo.com/
-    %p{:class => "help-block media-type", :id => "speakerdeck-help", :style => "display:none"} Go to your SpeakerDeck, click on "share" -> "embed" and copy the data-id
-    %p{:class => "help-block media-type", :id => "instagram-help", :style => "display:none"} Go to your Instagram photo page and copy everything behind instagram.com/p/ (without trailing /# hash symbol)
-    = f.input :media_id, :label => "Media ID", :as => :string
 
   %section#information
   - if current_user.name.blank? || current_user.biography.blank?

app/views/proposal/show.html.haml

@@ -41,17 +41,16 @@
   .col-md-9
     .row
       .col-md-12
-        - if @event.media_id.blank?
+        - if @event.commercials.empty?
           %h5.text-warning
             No video of the event yet, sorry!
-            - unless @conference.media_id.blank?
+            - unless @conference.commercials.empty?
               Meanwhile...
-          - unless @conference.media_id.blank?
-            .flexvideo
-              = render partial: "shared/media_item", locals: {media_type: @conference.media_type, media_id: @conference.media_id}
+          - unless @conference.commercials.empty?
+            = render partial: 'shared/media_items', locals: { commercials: @conference.commercials }
         - else
-          .flexvideo
-            = render partial: "shared/media_item", locals: {media_type: @event.media_type, media_id: @event.media_id}
+          %p
+          = render partial: 'shared/media_items', locals: { commercials: @event.commercials }
     .row
       .speakerinfo
         .col-md-8

app/views/shared/_media_item.html.haml

@@ -1,12 +1,12 @@
--if media_type == Conference.media_types[:slideshare]
-  %iframe{:width=>"560", :height=>"315", :frameborder=>"0", :allowfullscreen=>"true", :src=> (request.ssl? ? "https://" : "http://") + "www.slideshare.net/slideshow/embed_code/#{media_id}"}
--elsif media_type == Conference.media_types[:flickr]
-  %iframe{:width=>"560", :height=>"315", :frameborder=>"0", :allowfullscreen=>"true", :src=> (request.ssl? ? "https://" : "http://") + "flic.kr/p/#{media_id}/player/268a054da2"}
--elsif media_type == Conference.media_types[:vimeo]
-  %iframe{:width=>"560", :height=>"315", :frameborder=>"0", :allowfullscreen=>"true", :src=> "//player.vimeo.com/video/#{media_id}"}
--elsif media_type == Conference.media_types[:speakerdeck]
-  %iframe{:width=>"560", :height=>"315", :frameborder=>"0", :allowfullscreen=>"true", :src=> "//speakerdeck.com/player/#{media_id}?"}
--elsif media_type == Conference.media_types[:instagram]
-  %iframe{:width=>"560", :height=>"315", :frameborder=>"0", :allowfullscreen=>"true", :scrolling =>"no", :allowtransparency=>"true", :src=> "//instagram.com/p/#{media_id}/embed/"}
+-if commercial_type == CONFIG['commercial_types']['slideshare']
+  %iframe{:width=>"560", :height=>"315", :frameborder=>"0", :allowfullscreen=>"true", :src=> (request.ssl? ? "https://" : "http://") + "www.slideshare.net/slideshow/embed_code/#{commercial_id}"}
+-elsif commercial_type == CONFIG['commercial_types']['flickr']
+  %iframe{:width=>"560", :height=>"315", :frameborder=>"0", :allowfullscreen=>"true", :src=> (request.ssl? ? "https://" : "http://") + "flic.kr/p/#{commercial_id}/player/268a054da2"}
+-elsif commercial_type == CONFIG['commercial_types']['vimeo']
+  %iframe{:width=>"560", :height=>"315", :frameborder=>"0", :allowfullscreen=>"true", :src=> "//player.vimeo.com/video/#{commercial_id}"}
+-elsif commercial_type == CONFIG['commercial_types']['speakerdeck']
+  %iframe{:width=>"560", :height=>"315", :frameborder=>"0", :allowfullscreen=>"true", :src=> "//speakerdeck.com/player/#{commercial_id}?"}
+-elsif commercial_type == CONFIG['commercial_types']['instagram']
+  %iframe{:width=>"560", :height=>"315", :frameborder=>"0", :allowfullscreen=>"true", :scrolling =>"no", :allowtransparency=>"true", :src=> "//instagram.com/p/#{commercial_id}/embed/"}
 -else
-  %iframe{:width=>"560", :height=>"315", :frameborder=>"0", :allowfullscreen=>"true", :src=> (request.ssl? ? "https://" : "http://") + "www.youtube.com/embed/#{media_id}?rel=0"}
+  %iframe{:width=>"560", :height=>"315", :frameborder=>"0", :allowfullscreen=>"true", :src=> (request.ssl? ? "https://" : "http://") + "www.youtube.com/embed/#{commercial_id}?rel=0"}

app/views/shared/_media_items.html.haml

@@ -0,0 +1,25 @@
+- unless commercials.empty?
+  - if commercials.length == 1
+    .flexvideo
+      = render partial: 'shared/media_item', locals: { commercial_type: commercials.first.commercial_type, commercial_id: commercials.first.commercial_id }
+  - else
+    %ul.nav.nav-tabs{ 'role'=>'tablist' }
+      - commercials.each_with_index do  |commercial, index|
+        - if index == 0
+          %li.active
+            %a{ 'href'=>"##{index}", 'role'=>'tab', 'data-toggle'=>'tab' }
+              = commercial.commercial_type
+        - else
+          %li
+            %a{ 'href'=>"##{index}",' "role"'=>'tab', 'data-toggle'=>'tab' }
+              = commercial.commercial_type
+    .tab-content
+      - commercials.each_with_index do  |commercial, index|
+        - if index == 0
+          %div.tab-pane.active{'id'=>"#{index}"}
+            .flexvideo
+              = render partial: 'shared/media_item', locals: { commercial_type: commercial.commercial_type, commercial_id: commercial.commercial_id }
+        - else
+          %div.tab-pane{'id'=>"#{index}"}
+            .flexvideo
+              = render partial: 'shared/media_item', locals: { commercial_type: commercial.commercial_type, commercial_id: commercial.commercial_id }