gunghogeoduck/osem-fcy
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Implement simplified commercials workflow

Browse source 
It's now possible to simply enter the url of the third party provider to enter a commercial.
This commit is contained in:
chrisbr 2015-04-22 21:30:32 +02:00 • committed by Christian Bruckmayer
parent fb7ebab5a0
commit 23664119bd
25 changed files with 220 additions and 194 deletions
Download patch file Download diff file Expand all files Collapse all files

1
app/assets/javascripts/application.js
View file

@ -37,6 +37,7 @@
//= require bootstrap-switch
//= require osem-switch
//= require osem-bootstrap
//= require osem-commercials
$(document).ready(function() {
$('a[disabled=disabled]').click(function(event){

33
app/assets/javascripts/osem-commercials.js Normal file
View file

@ -0,0 +1,33 @@
$(function () {
$(document).ready(function() {
$("#commercial_url").bind('paste keyup', function() {
clearTimeout($(this).data('timeout'));
$(this).data('timeout', setTimeout(function () {
var url = $('#new_commercial').attr('action');
url = url + '/render_commercial'
$.ajax({
method: 'GET',
url: url,
data: { url: $('#commercial_url').val() },
error: function(xhr, status, error) {
$('#commercial_submit_action').prop('disabled', true);
$('#resource-content').hide();
$('#resource-placeholder').show();
$('#commercial_error').hide();
$('#commercial_url_input').addClass('has-error error');
$('<span id="commercial_error" class="help-block">' + xhr.responseText + '</span>').insertAfter('#commercial_url');
},
success: function(msg) {
$('#commercial_submit_action').prop('disabled', false);
$('#commercial_url_input').removeClass('has-error error');
$('#commercial_error').hide();
$('#resource-placeholder').hide();
$('#resource-content').html(msg).show();
}
})
}, 200)
);
});
});
});

20
app/controllers/admin/commercials_controller.rb
View file

@ -5,15 +5,11 @@ module Admin
def index
@commercials = @conference.commercials
end
def new
@commercial = @conference.commercials.build
authorize! :create, @conference.commercials.new
end
def edit; end
def create
@commercial = @conference.commercials.build(commercial_params)
authorize! :create, @commercial
@ -23,7 +19,8 @@ module Admin
notice: 'Commercial was successfully created.'
else
flash[:error] = "An error prohibited this Commercial from being saved: #{@commercial.errors.full_messages.join('. ')}."
render :new
redirect_to admin_conference_commercials_path
end
end
@ -33,7 +30,7 @@ module Admin
notice: 'Commercial was successfully updated.'
else
flash[:error] = "An error prohibited this Commercial from being saved: #{@commercial.errors.full_messages.join('. ')}."
render :edit
redirect_to admin_conference_commercials_path
end
end
@ -42,10 +39,19 @@ module Admin
redirect_to admin_conference_commercials_path, notice: 'Commercial was successfully destroyed.'
end
def render_commercial
result = Commercial.render_from_url(params[:url])
if result[:error]
render text: result[:error], status: 400
else
render text: result[:html]
end
end
private
def commercial_params
params.require(:commercial).permit(:commercial_id, :commercial_type)
params.require(:commercial).permit(:url)
end
end
end

24
app/controllers/commercials_controller.rb
View file

@ -3,13 +3,6 @@ class CommercialsController < ApplicationController
before_action :set_event
load_and_authorize_resource through: :event
def new
@commercial = @event.commercials.build
authorize! :new, @commercial
end
def edit; end
def create
@commercial = @event.commercials.build(commercial_params)
authorize! :create, @commercial
@ -19,7 +12,7 @@ class CommercialsController < ApplicationController
notice: 'Commercial was successfully created.'
else
flash[:error] = "An error prohibited this Commercial from being saved: #{@commercial.errors.full_messages.join('. ')}."
render :new
redirect_to edit_conference_proposal_path(conference_id: @conference.short_title, id: @event.id, anchor: 'commercials-content')
end
end
@ -29,16 +22,25 @@ class CommercialsController < ApplicationController
notice: 'Commercial was successfully updated.'
else
flash[:error] = "An error prohibited this Commercial from being saved: #{@commercial.errors.full_messages.join('. ')}."
render :edit
redirect_to edit_conference_proposal_path(conference_id: @conference.short_title, id: @event.id, anchor: 'commercials-content')
end
end
def destroy
@commercial.destroy
redirect_to edit_conference_proposal_path(conference_id: @conference.short_title, id: @event.id),
redirect_to edit_conference_proposal_path(conference_id: @conference.short_title, id: @event.id, anchor: 'commercials-content'),
notice: 'Commercial was successfully destroyed.'
end
def render_commercial
result = Commercial.render_from_url(params[:url])
if result[:error]
render text: result[:error], status: 400
else
render text: result[:html]
end
end
private
def set_event
@ -46,6 +48,6 @@ class CommercialsController < ApplicationController
end
def commercial_params
params.require(:commercial).permit(:commercial_id, :commercial_type)
params.require(:commercial).permit(:url)
end
end

42
app/models/commercial.rb
View file

@ -1,8 +1,44 @@
class Commercial < ActiveRecord::Base
require 'oembed'
belongs_to :commercialable, polymorphic: true
validates :commercial_id, presence: true
validates :commercial_type, presence: true
validates :url, presence: true
validates :url, format: URI::regexp(%w(http https))
validates :commercial_type, inclusion: { in: CONFIG['commercial_types'].values }
validate :valid_url
def self.render_from_url(url)
register_provider
begin
resource = OEmbed::Providers.get(url, maxwidth: 560, maxheight: 315)
{ html: resource.html.html_safe }
rescue StandardError => exception
{ error: exception.message }
end
end
private
def valid_url
result = Commercial.render_from_url(url)
if result[:error]
errors.add(:base, result[:error])
end
end
def self.register_provider
speakerdeck = OEmbed::Provider.new('http://speakerdeck.com/oembed.json')
speakerdeck << 'https://speakerdeck.com/*'
speakerdeck << 'http://speakerdeck.com/*'
OEmbed::Providers.register(
OEmbed::Providers::Youtube,
OEmbed::Providers::Vimeo,
OEmbed::Providers::Slideshare,
OEmbed::Providers::Flickr,
OEmbed::Providers::Instagram,
speakerdeck
)
end
end

15
app/views/admin/commercials/_form.html.haml
View file

@ -1,15 +0,0 @@
.row
.col-md-12
.page-header
%h1
-if @commercial.new_record?
New
Commercial
.row
.col-md-8
= semantic_form_for(@commercial, :url => (@commercial.new_record? ? admin_conference_commercials_path : admin_conference_commercial_path(@conference.short_title, @commercial))) do |f|
= f.input :commercial_type, as: :select, label: 'Conference Promo Media Type', input_html: { class: 'select-help-toggle' }, 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
= render partial: 'commercials/commercial_help'
%p.text-right
= f.action :submit, as: :button, button_html: { class: 'btn btn-primary' }

42
app/views/admin/commercials/index.html.haml
View file

@ -6,22 +6,32 @@
Conference commercials will be displayed on the events in the
= link_to "schedule,", schedule_conference_path(@conference.short_title)
if the event speaker didn't add an event commercial.
- if can? :create, @conference.commercials.new
.row
.col-md-6
#resource-content
#resource-placeholder{ style: 'background-color:#d3d3d3; float: left; width: 400px; height: 250px; margin: 5px; border-width: 1px; border-style: solid; border-color: rgba(0,0,0,.2);' }
.row
.col-md-6
= semantic_form_for(@commercial, url: admin_conference_commercials_path(conference_id: @conference.short_title)) do |f|
= f.input :url, label: 'URL', as: :string, input_html: { required: 'required' },
hint: 'Just paste the url of your video/photo provider. YouTube, Vimeo, SpeakerDeck, SlideShare, Instagram, Flickr.'
= f.action :submit, as: :button, button_html: { class: 'btn btn-primary pull-right', disabled: true }
%hr
- @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 }
.caption
- if can? :update, commercial
= link_to 'Edit', edit_admin_conference_commercial_path(@conference.short_title, commercial.id), class: 'btn btn-primary'
- if can? :destroy, commercial
= link_to 'Delete', admin_conference_commercial_path(@conference.short_title, commercial.id),
method: :delete, data: { confirm: 'Are you sure?' }, class: 'btn btn-danger'
.row
.col-md-12.text-right
- if can? :create, @conference.commercials.new
= link_to 'Add Commercial', new_admin_conference_commercial_path, class: 'btn btn-primary'
- if commercial.persisted?
.col-md-4
.thumbnail
.flexvideo{ id: "resource-content-#{commercial.id}"}
= render partial: 'shared/media_item', locals: { commercial: commercial }
.caption
- if can? :update, commercial
= semantic_form_for commercial, url: admin_conference_commercial_path(conference_id: @conference.short_title, id: commercial) do |f|
= f.input :url, label: 'URL', as: :string, input_html: { id: "commercial_url_#{commercial.id}", required: 'required' }, hint: 'Just paste the url of your video/photo provider'
= f.action :submit, as: :button, button_html: { class: 'btn btn-success' }, label: 'Update'
- if can? :destroy, commercial
= link_to 'Delete', admin_conference_commercial_path(@conference.short_title, commercial.id),
method: :delete, data: { confirm: 'Are you sure?' }, class: 'btn btn-danger'

6
app/views/commercials/_commercial_help.html.haml
View file

@ -1,6 +0,0 @@
%p{ class: 'help-block commercial_commercial_type collapse in', id: 'YouTube-help' } Go to your YouTube video, click on "share" and copy everything behind http://youtu.be/"
%p{ class: 'help-block commercial_commercial_type collapse', id: 'SlideShare-help' } Go to your SlideShare, click on "share" -> "embed" and copy the id
%p{ class: 'help-block commercial_commercial_type collapse', id: 'Flickr-help' } 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 commercial_commercial_type collapse', id: 'Vimeo-help' } Go to your vimeo video, click on "share" and copy everything behind http://vimeo.com/
%p{ class: 'help-block commercial_commercial_type collapse', id: 'Speakerdeck-help' } Go to your SpeakerDeck, click on "share" -> "embed" and copy the data-id
%p{ class: 'help-block commercial_commercial_type collapse', id: 'Instagram-help' } Go to your Instagram photo page and copy everything behind instagram.com/p/ (without trailing /# hash symbol)

4
app/views/commercials/_form.html.haml
View file

@ -1,4 +0,0 @@
= f.input :commercial_type, as: :select, label: 'Type', input_html: { class: 'form-control select-help-toggle' }, 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: 'ID', as: :string, input_html: { required: 'required' }
= render partial: 'commercial_help'
= f.action :submit, as: :button, button_html: { class: 'btn btn-primary pull-right' }

9
app/views/commercials/edit.html.haml
View file

@ -1,9 +0,0 @@
.container
.row
.col-md-12
.page-header
%h1 Editing Commercial
.row
.col-md-12
= 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

9
app/views/commercials/new.html.haml
View file

@ -1,9 +0,0 @@
.container
.row
.col-md-12
.page-header
%h1 New Commercial
.row
.col-md-12
= semantic_form_for @commercial, url: conference_proposal_commercials_path(conference_id: @conference.short_title, proposal_id: @event.id) do |f|
= render 'form', f: f

40
app/views/proposal/_form.html.haml
View file

@ -15,21 +15,31 @@
You can add commercials for your proposal. These commercials will be displayed on the
= link_to 'public proposal page.', conference_proposal_path(@conference.short_title, @event)
If you don't add a commercial, the conference commercial will be displayed!
- if can? :create, @event.commercials.new
.row
.col-md-6
#resource-content
#resource-placeholder{ style: 'background-color:#d3d3d3; float: left; width: 400px; height: 250px; margin: 5px; border-width: 1px; border-style: solid; border-color: rgba(0,0,0,.2);' }
.row
.col-md-6
= semantic_form_for(@event.commercials.build, url: conference_proposal_commercials_path(conference_id: @conference.short_title, proposal_id: @event)) do |f|
= f.input :url, label: 'URL', as: :string, input_html: { required: 'required', type: 'url' },
hint: 'Just paste the url of your video/photo provider. Currently supported: YouTube, Vimeo, SpeakerDeck, SlideShare, Instagram, Flickr.'
= f.action :submit, as: :button, button_html: { class: 'btn btn-primary pull-right', disabled: true }
%hr
- @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 }
- if can? :update, commercial
= link_to 'Edit', edit_conference_proposal_commercial_path(@conference.short_title, @event.id, commercial.id), class: 'btn btn-primary'
- if can? :destroy, commercial
= 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'
- if can? :create, @event.commercials.new
%hr
= link_to 'Add Commercial', new_conference_proposal_commercial_path(@conference.short_title, @event.id), class: 'btn btn-primary'
- if commercial.persisted?
.col-md-4
.thumbnail
.flexvideo{ id: "resource-content-#{commercial.id}"}
= render partial: 'shared/media_item', locals: { commercial: commercial }
.caption
- if can? :update, commercial
= semantic_form_for commercial, url: conference_proposal_commercial_path(conference_id: @conference.short_title, proposal_id: @event, id: commercial) do |f|
= f.input :url, label: 'URL', as: :string, input_html: { id: "commercial_url_#{commercial.id}", required: 'required', type: 'url' }
= f.action :submit, as: :button, button_html: { class: 'btn btn-success' }, label: 'Update'
- if can? :destroy, commercial
= 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'

2
app/views/proposal/_tooltip.html.haml
View file

@ -26,7 +26,7 @@
- if progress_status['commercials']
= link_to 'Edit the commercials', edit_conference_proposal_path(event.conference.short_title, event, anchor: 'commercials-content')
- else
= link_to 'Add a commercial', new_conference_proposal_commercial_path(event.conference.short_title, event)
= link_to 'Add a commercial', edit_conference_proposal_path(event.conference.short_title, event, anchor: 'commercials-content')
%li{'class'=>class_for_todo(progress_status['difficulty_level'])}
%span{'class'=>icon_for_todo(progress_status['difficulty_level'])}

27
app/views/shared/_media_item.html.haml
View file

@ -1,12 +1,15 @@
-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/#{commercial_id}?rel=0"}
- if commercial.url
= Commercial.render_from_url(commercial.url)[:html]
- else
- if commercial.commercial_type == 'SlideShare'
%iframe{:width=>"560", :height=>"315", :frameborder=>"0", :allowfullscreen=>"true", :src=> "https://www.slideshare.net/slideshow/embed_code/#{commercial.commercial_id}"}
- elsif commercial.commercial_type == 'Flickr'
%iframe{:width=>"560", :height=>"315", :frameborder=>"0", :allowfullscreen=>"true", :src=> "https://flic.kr/p/#{commercial.commercial_id}/player/268a054da2"}
- elsif commercial.commercial_type == 'Vimeo'
%iframe{:width=>"560", :height=>"315", :frameborder=>"0", :allowfullscreen=>"true", :src=> "//player.vimeo.com/video/#{commercial.commercial_id}"}
- elsif commercial.commercial_type == 'Speakerdeck'
%iframe{:width=>"560", :height=>"315", :frameborder=>"0", :allowfullscreen=>"true", :src=> "//speakerdeck.com/player/#{commercial.commercial_id}?"}
- elsif commercial.commercial_type == 'Instagram'
%iframe{:width=>"560", :height=>"315", :frameborder=>"0", :allowfullscreen=>"true", :scrolling =>"no", :allowtransparency=>"true", :src=> "//instagram.com/p/#{commercial.commercial_id}/embed/"}
- else
%iframe{:width=>"560", :height=>"315", :frameborder=>"0", :allowfullscreen=>"true", :src=> "https://www.youtube.com/embed/#{commercial.commercial_id}?rel=0"}

18
app/views/shared/_media_items.html.haml
View file

@ -1,25 +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 }
= render partial: 'shared/media_item', locals: { commercial: commercials.first }
- else
%ul.nav.nav-tabs{ 'role'=>'tablist' }
- commercials.each_with_index do |commercial, index|
- if index == 0
- commercials.each.with_index(1) do |commercial, index|
- if index == 1
%li.active
%a{ 'href'=>"##{index}", 'role'=>'tab', 'data-toggle'=>'tab' }
= commercial.commercial_type
= index
- else
%li
%a{ 'href'=>"##{index}",' "role"'=>'tab', 'data-toggle'=>'tab' }
= commercial.commercial_type
= index
.tab-content
- commercials.each_with_index do |commercial, index|
- if index == 0
- commercials.each.with_index(1) do |commercial, index|
- if index == 1
%div.tab-pane.active{'id'=>"#{index}"}
.flexvideo
= render partial: 'shared/media_item', locals: { commercial_type: commercial.commercial_type, commercial_id: commercial.commercial_id }
= render partial: 'shared/media_item', locals: { commercial: commercial }
- else
%div.tab-pane{'id'=>"#{index}"}
.flexvideo
= render partial: 'shared/media_item', locals: { commercial_type: commercial.commercial_type, commercial_id: commercial.commercial_id }
= render partial: 'shared/media_item', locals: { commercial: commercial }