Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with
or
.
Download ZIP
Browse files

added ajaxy image uploading

  • Loading branch information...
commit 1ae3f4c7f5bf4499bba4d975d2380d8406b4ef5a 1 parent 3223ad9
jipiboily authored parndt committed
View
144 images/app/assets/javascript/refinery/images.js.coffee.erb
@@ -0,0 +1,144 @@
+$(document).ready ->
+ images = new Images
+ $("#new_image").submit (e) ->
+ if window.FileList && FormData
+ e.preventDefault()
+ images.upload_all()
+ $("#image_image").change (e) ->
+ images.file_list = e.target.files
+
+
+class Images
+ # TODO:
+ # - add a progress bar for each file maybe?
+ # - refresh images index after closing the dialog box...
+ constructor: ->
+ @authenticity_token = $("meta[name=\"csrf-token\"]").attr("content")
+ @form_action = $("#new_image").attr("action")
+ @cache_dom()
+
+ cache_dom: ->
+ @error_list = $("#error_list")
+ @success_list = $("#flash")
+ @error_explanation = $("#errorExplanation")
+ @upload_progress = $("#upload_progress")
+
+ before_upload_all: ->
+ @files = []
+ @errors = []
+ @total_files = @file_list.length
+ @uploaded = 0
+ @error_explanation.hide()
+
+ upload_all: ->
+ @before_upload_all()
+ for file in @file_list
+ @validate(file)
+ @files.push file
+ return @render_errors() if @errors.length > 0
+ $("#submit_button").hide()
+ $(".field").hide()
+ @progress "<%= ::I18n.t("refinery.admin.images.form.uploading")%>"
+ @upload_next()
+
+ after_upload_all: ->
+ $(".save-loader").hide()
+ @upload_progress.hide()
+ @success_list.show()
+ if @errors.length > 0
+ @render_errors()
+ else
+ if getParameterByName("modal") == "true"
+ window.parent.document.getElementById("dialog_frame").contentDocument.location.reload(true);
+ else
+ @set_flash_and_reload($("#inner_flash_container").html())
+
+ validate: (file) ->
+ max_file_size = <%= Refinery::Images.max_image_size %>
+ if file.size > max_file_size
+ @errors.push "#{file.name} <%= ::I18n.t("refinery.admin.images.form.should_be_smaller")%> #{max_file_size} <%= ::I18n.t("refinery.admin.images.form.bytes_in_size")%>"
+ # TODO: set valid file types based on image model validation
+ valid_file_types = ["image/jpeg", "image/png", "image/gif", "image/tiff"]
+ if valid_file_types.indexOf(file.type) == -1
+ @errors.push "#{file.name} <%= ::I18n.t("refinery.admin.images.form.image_type")%>"
+
+ upload_next: ->
+ @do_upload(@files[0]) unless @files.length == 0
+ if @total_files > 0 && @files.length == 0
+ @after_upload_all()
+
+ do_upload: (file) =>
+ form = new FormData();
+ form.append "image[image]", file
+ form.append "authenticity_token", @authenticity_token
+ _this = @ # save current scope so we can use current object methods within $.ajax
+ $.ajax
+ type: 'POST'
+ url: @form_action
+ data: form
+ contentType: false
+ processData: false
+ success: (data) ->
+ _this.post_success(file)
+ error: (data) ->
+ _this.post_error(file, data.responseText)
+
+ set_flash_and_reload: (message) ->
+ form = new FormData();
+ form.append "notice", message
+ _this = @ # save current scope so we can use current object methods within $.ajax
+ $.ajax
+ type: 'POST'
+ url: "/refinery/images/set_flash"
+ data: form
+ contentType: false
+ processData: false
+ success: (data) ->
+ window.parent.location.reload(true)
+ error: (data) ->
+ window.parent.location.reload(true)
+
+ after_do_upload: (file) ->
+ @files.remove file
+ @upload_next()
+
+ post_success: (file) ->
+ @progress file.name + " <%= ::I18n.t("refinery.admin.images.form.uploaded")%>"
+ @success_list.append("#{file.name} <br />")
+ @update_progress file
+ @after_do_upload file
+
+ post_error: (file, errors) ->
+ errors = JSON.parse(errors).image
+ @update_progress file, errors
+ for e in errors
+ @errors.push "#{file.name}: #{e}"
+ @after_do_upload file
+
+ render_errors: ->
+ $(".save-loader").hide()
+ @error_list.html("")
+ for error in @errors
+ @error_list.append("<li>#{error}</li>")
+ @error_explanation.show()
+
+ update_progress: (file, error = null) ->
+ @uploaded++
+ message = error || "<%= ::I18n.t("refinery.admin.images.form.last_complete")%>: #{file.name}"
+ @progress "#{@uploaded}/#{@total_files} <%= ::I18n.t("refinery.admin.images.form.uploaded")%> | #{message}"
+
+ progress: (text) ->
+ @upload_progress.html(text);
+
+# adds a remove method to Array
+Array::remove = (e) -> @[t..t] = [] if (t = @indexOf(e)) > -1
+
+getParameterByName = (name) ->
+ name = name.replace(/[\[]/, "\\[").replace(/[\]]/, "\\]")
+ regexS = "[\\?&]" + name + "=([^&#]*)"
+ regex = new RegExp(regexS)
+ results = regex.exec(window.location.search)
+ unless results?
+ ""
+ else
+ decodeURIComponent results[1].replace(/\+/g, " ")
View
6 images/app/controllers/refinery/admin/images_controller.rb
@@ -54,7 +54,6 @@ def create
unless params[:insert]
if @images.all?(&:valid?)
- flash.notice = t('created', :scope => 'refinery.crudify', :what => "'#{@images.map(&:title).join("', '")}'")
if from_dialog?
@dialog_successful = true
render :nothing => true, :layout => true
@@ -113,6 +112,11 @@ def update
end
end
+ def set_flash
+ flash.notice = t('uploaded_successfully', :scope => 'refinery.admin.images.form')
+ render :nothing => true, :layout => false
+ end
+
protected
def init_dialog
View
19 images/app/views/refinery/admin/images/_form.html.erb
@@ -1,3 +1,4 @@
+<% content_for :after_javascript_libraries, javascript_include_tag('refinery/images') %>
<%= form_for @image, :url => (@url_override or @image.persisted? ? refinery.admin_image_path(@image) : refinery.admin_images_path),
:html => { :multipart => true } do |f| %>
@@ -5,6 +6,24 @@
:object => @image,
:include_object_name => false %>
+ <% if @image.errors.empty? %>
+ <div id="upload_progress"></div>
+
+ <div class="errorExplanation" id="errorExplanation" style="display:none;">
+ <p><%= t("refinery.admin.error_messages.problems_in_following_fields")%></p>
+ <ul id="error_list">
+
+ </ul>
+ </div>
+
+ <div id="inner_flash_container">
+ <div id="flash" class="flash flash_notice" style="width: auto; display:none; padding-top: 0px;">
+ <h3><%= t(".uploaded_successfully") %>:</h3>
+
+ </div>
+ </div>
+ <% end %>
+
<div class='field'>
<% if action_name =~ /(edit)|(update)/ %>
<p>
View
9 images/config/locales/en.yml
@@ -15,6 +15,15 @@ en:
replace_image: " replace it with this one..."
current_image: Current Image
maximum_image_size: The maximum image size is %{bytes}.
+ uploading: "Uploading..."
+ there_was: "There was"
+ error: "error"
+ should_be_smaller: "should be smaller than"
+ bytes_in_size: "bytes in size"
+ image_type: "should be either a JPG, PNG or GIF"
+ uploaded: "uploaded"
+ last_complete: "Last upload complete"
+ uploaded_successfully: "Uploaded successfully"
actions:
create_new_image: Add new image
records:
View
9 images/config/locales/fr.yml
@@ -15,6 +15,15 @@ fr:
replace_image: " la remplacer par celle-ci..."
current_image: Image actuelle
maximum_image_size: "La taille de l'image ne doit pas excéder %{bytes}."
+ uploading: "Transfert en cours..."
+ there_was: "Il y a"
+ error: "erreur"
+ should_be_smaller: "devrait être plus petit que"
+ bytes_in_size: "octets"
+ image_type: "devrait être un fichier JPG, PNG ou GIF"
+ uploaded: "transféré"
+ last_complete: "Dernier transfert complété"
+ uploaded_successfully: "Transféré avec succès"
actions:
create_new_image: Ajouter une image
records:
View
1  images/config/routes.rb
@@ -5,5 +5,6 @@
resources :images, :except => :show do
get :insert, :on => :collection
end
+ post "images/set_flash" => "images#set_flash"
end
end
View
4 images/spec/requests/refinery/admin/images_spec.rb
@@ -30,8 +30,8 @@ module Refinery
join("spec/fixtures/image-with-dashes.jpg")
click_button ::I18n.t('save', :scope => 'refinery.admin.form_actions')
end
-
- page.should have_content(::I18n.t('created', :scope => 'refinery.crudify', :what => "'Image With Dashes'"))
+ page.should have_content(::I18n.t("uploaded_successfully", :scope => "refinery.admin.images.form"))
+ page.should have_content("image-with-dashes.jpg")
Refinery::Image.count.should == 1
end
Please sign in to comment.
Something went wrong with that request. Please try again.