Permalink
Browse files

Add basic media form to project setup, including drag & drop support

  • Loading branch information...
1 parent 2b37570 commit b03d1f6d735a9a4545008e3b3a4b9750b1adf52b @lapluviosilla lapluviosilla committed Sep 30, 2013
View
@@ -10,6 +10,7 @@ capybara-*.html
/tmp/*
/db/*.sqlite3
/public/system/*
+/public/uploads
/coverage/
/spec/tmp/*
**.orig
View
@@ -15,6 +15,10 @@ gem 'enumerize'
gem 'foreigner'
gem 'activerecord-postgres-hstore'
+gem 'carrierwave'
+gem 'mini_magick'
+gem 'jquery-fileupload-rails'
+
gem 'unicorn' # Use unicorn as the app server
gem 'capistrano' # Deploy with Capistrano
View
@@ -49,6 +49,10 @@ GEM
rack (>= 1.0.0)
rack-test (>= 0.5.4)
xpath (~> 2.0)
+ carrierwave (0.9.0)
+ activemodel (>= 3.2.0)
+ activesupport (>= 3.2.0)
+ json (>= 1.7)
chunky_png (1.2.8)
client_side_validations (3.2.6)
client_side_validations-simple_form (2.1.0)
@@ -126,6 +130,9 @@ GEM
http_parser.rb (0.5.3)
i18n (0.6.1)
journey (1.0.4)
+ jquery-fileupload-rails (0.4.1)
+ actionpack (>= 3.1)
+ railties (>= 3.1)
jquery-rails (3.0.1)
railties (>= 3.0, < 5.0)
thor (>= 0.14, < 2.0)
@@ -148,6 +155,8 @@ GEM
treetop (~> 1.4.8)
method_source (0.8.2)
mime-types (1.23)
+ mini_magick (3.6.0)
+ subexec (~> 0.2.1)
mini_portile (0.5.0)
multi_json (1.7.7)
multipart-post (1.2.0)
@@ -252,6 +261,7 @@ GEM
multi_json (~> 1.0)
rack (~> 1.0)
tilt (~> 1.1, != 1.3.0)
+ subexec (0.2.3)
susy (1.0.9)
compass (>= 0.12.2)
sass (>= 3.2.0)
@@ -282,6 +292,7 @@ DEPENDENCIES
activerecord-postgres-hstore
capistrano
capybara
+ carrierwave
client_side_validations
client_side_validations-simple_form
coffee-rails (~> 3.2.1)
@@ -300,9 +311,11 @@ DEPENDENCIES
haml
hooves
http_accept_language
+ jquery-fileupload-rails
jquery-rails
jquery-ui-rails
letter_opener
+ mini_magick
pg
poltergeist
pry
@@ -13,6 +13,8 @@
//= require jquery
//= require jquery_ujs
//= require jquery.ui.datepicker
+//= require jquery-fileupload/basic
+//= require jquery-fileupload/vendor/tmpl
//= require rails.validations
//= require rails.validations.simple_form
//= require select2
@@ -40,4 +40,22 @@ ipo['projects_setup']['show'] = ->
$($(@).data('box')).show().siblings('.tab-box').first().hide()
$('#is_new_organization').val(($(@).data('box') == "#new-organization"))
+ $('#new_project_media').fileupload
+ dataType: "script"
+ dropZone: $("#drop_zone")
+ add: (e, data) ->
+ data.context = $(tmpl("template-upload", data.files[0]))
+ $('#drop_zone').append(data.context)
+ data.submit()
+ progress: (e, data) ->
+ if data.context
+ progress = parseInt(data.loaded / data.total * 100, 10)
+ data.context.find('.bar').css('width', progress + '%')
+ if progress == 100
+ data.context.remove()
+
+ $('.project_media').on "ajax:success", ".media form", (event, data, status, xhr) ->
+ $(event.target).parent().fadeOut "slow", () ->
+ $(this).remove()
+
ipo['projects_setup']['update'] = ipo['projects_setup']['show']
@@ -204,4 +204,38 @@ ul.weekly-cost {
.project_dining_location {
@include span-columns(3 omega, 8);
@include post(2, 8);
+}
+
+// ------
+// Step 5
+// ------
+#drop_zone {
+ height: 9em;
+ text-align: center;
+ background: #FFFFFF;
+ color: #DDDDDD;
+ border: 1px solid;
+}
+.upload {
+ border-top: solid 1px #CCC;
+ width: 100%;
+ padding-top: 10px;
+ margin-top: 10px;
+
+ .progress {
+ margin-top: 8px;
+ border: solid 1px #555;
+ border-radius: 3px;
+ -moz-border-radius: 3px;
+ .bar {
+ height: 10px;
+ background: $blue;
+ }
+ }
+}
+.add-images {
+ @include span-columns(6, 12);
+}
+.saved-images {
+ @include span-columns(6 omega, 12);
}
@@ -0,0 +1,15 @@
+class ProjectMediaController < ApplicationController
+ respond_to :js
+ def create
+ @project = Project.find(params[:project_id])
+ @project_media = @project.project_media.create(params[:project_media])
+ respond_with(@project_media)
+ end
+ def destroy
+ @project_media = ProjectMedia.find(params[:id])
+ @project_media.destroy
+ respond_to do |format|
+ format.js {render :nothing => true}
+ end
+ end
+end
View
@@ -5,6 +5,7 @@ class Project < ActiveRecord::Base
belongs_to :organization
belongs_to :field_host
+ has_many :project_media
serialize :properties, ActiveRecord::Coders::Hstore
@@ -0,0 +1,6 @@
+class ProjectMedia < ActiveRecord::Base
+ belongs_to :project
+
+ attr_accessible :image
+ mount_uploader :image, ProjectImageUploader
+end
@@ -0,0 +1,55 @@
+# encoding: utf-8
+
+class ProjectImageUploader < CarrierWave::Uploader::Base
+
+ # Include RMagick or MiniMagick support:
+ # include CarrierWave::RMagick
+ include CarrierWave::MiniMagick
+
+ # Choose what kind of storage to use for this uploader:
+ storage :file
+ # storage :fog
+
+ # Override the directory where uploaded files will be stored.
+ # This is a sensible default for uploaders that are meant to be mounted:
+ def store_dir
+ "uploads/#{model.class.to_s.underscore}/#{mounted_as}/#{model.id}"
+ end
+
+ # Provide a default URL as a default if there hasn't been a file uploaded:
+ # def default_url
+ # # For Rails 3.1+ asset pipeline compatibility:
+ # # ActionController::Base.helpers.asset_path("fallback/" + [version_name, "default.png"].compact.join('_'))
+ #
+ # "/images/fallback/" + [version_name, "default.png"].compact.join('_')
+ # end
+
+ # Process files as they are uploaded:
+ # process :scale => [200, 300]
+ #
+ # def scale(width, height)
+ # # do something
+ # end
+
+ # Create different versions of your uploaded files:
+ # version :thumb do
+ # process :scale => [50, 50]
+ # end
+ #
+ version :thumb do
+ process resize_to_fill: [78, 78]
+ end
+
+ # Add a white list of extensions which are allowed to be uploaded.
+ # For images you might use something like this:
+ def extension_white_list
+ %w(jpg jpeg gif png)
+ end
+
+ # Override the filename of the uploaded files:
+ # Avoid using model.id or version_name here, see uploader/store.rb for details.
+ # def filename
+ # "something.jpg" if original_filename
+ # end
+
+end
@@ -0,0 +1,3 @@
+.media
+ %img{:src => project_media.image.url(:thumb)}
+ = button_to "X", project_media, method: :delete, remote: true, class: 'delete-project-media'
@@ -0,0 +1,5 @@
+<% if @project_media.new_record? %>
+ alert("Failed to upload image");
+<% else %>
+ $('.project_media').append("<%= j render(@project_media) %>");
+<% end %>
@@ -0,0 +1,5 @@
+%script#template-upload(type="text/x-impl")
+ .upload
+ {%=o.name%}
+ .progress
+ .bar(style="width: 0%")
@@ -1,8 +1,20 @@
= render 'header', active_step: params[:id]
+%article
+ %h3.center Add Photos & Videos
+ .add-images
+ %h4 Add Images
+ = simple_form_for ProjectMedia.new, url: project_media_index_path(@project) do |f|
+ #drop_zone Drag & Drop Photos Here
+ = f.input :image
+ %h4 Add Third Party Image
+ %h4 Add a YouTube Video
+ .saved-images
+ %h4 Saved Project Photos and Videos
+ .project_media
+ = render @project.project_media
+
= simple_form_for @project, url: wizard_path, method: :put, validate: true do |f|
- %article
- %h3.center Add Photos & Videos
%article
%h3.center Publish Your Internship Opportunity
@@ -27,4 +39,6 @@
= f.input :typical_attire, label: "Describe a students typical attire:"
= f.input :guidelines_description, as: :text, label: false, placeholder: 'Describe your project and/or organization guidelines (such as dress, for personal/interns)...'
- = f.submit "Save & Continue to Step #5", class: "button button-orange"
+ = f.submit "Save & Continue to Step #5", class: "button button-orange"
+
+= render 'media_progress'
@@ -2,12 +2,13 @@
# Add new inflection rules using the following format
# (all these examples are active by default):
-# ActiveSupport::Inflector.inflections do |inflect|
-# inflect.plural /^(ox)$/i, '\1en'
-# inflect.singular /^(ox)en/i, '\1'
-# inflect.irregular 'person', 'people'
-# inflect.uncountable %w( fish sheep )
-# end
+ActiveSupport::Inflector.inflections do |inflect|
+ # inflect.plural /^(ox)$/i, '\1en'
+ # inflect.singular /^(ox)en/i, '\1'
+ # inflect.irregular 'person', 'people'
+ # inflect.uncountable %w( fish sheep )
+ inflect.irregular 'media', 'media'
+end
#
# These inflection rules are supported but not enabled by default:
# ActiveSupport::Inflector.inflections do |inflect|
View
@@ -1,6 +1,10 @@
IpoWeb::Application.routes.draw do
resources :projects_setup, path: "/projects/setup", only: [:index, :show, :update]
- resources :projects
+ resources :projects do
+ resources :project_media, as: 'media', path: 'media', only: [:create]
+ end
+ resources :project_media, only: [:show, :destroy]
+
root :to => "home#index"
end
@@ -0,0 +1,12 @@
+class AddProjectMedia < ActiveRecord::Migration
+ def change
+ create_table :project_media do |t|
+ t.string :image
+ t.integer :project_id
+ t.foreign_key :projects
+ t.integer :order
+
+ t.timestamps
+ end
+ end
+end
Oops, something went wrong.

0 comments on commit b03d1f6

Please sign in to comment.