diff --git a/app/assets/javascripts/application.js b/app/assets/javascripts/application.js index b198a0a89..0b3ee0201 100644 --- a/app/assets/javascripts/application.js +++ b/app/assets/javascripts/application.js @@ -63,7 +63,7 @@ //= require followable //= require flaggable //= require documentable -// require imageable +//= require imageable //= require tree_navigator //= require custom //= require tag_autocomplete diff --git a/app/assets/javascripts/documentable.js.coffee b/app/assets/javascripts/documentable.js.coffee index 563c317bf..08f8f6dce 100644 --- a/app/assets/javascripts/documentable.js.coffee +++ b/app/assets/javascripts/documentable.js.coffee @@ -28,7 +28,7 @@ App.Documentable = change: (e, data) -> $.each data.files, (index, file) -> - App.Documentable.setFilename(data, file) + App.Documentable.setFilename(inputData, file) fail: (e, data) -> $(data.cachedAttachmentField).val("") @@ -47,9 +47,9 @@ App.Documentable = App.Documentable.clearInputErrors(data) $(data.addAttachmentLabel).hide() - $(data.destroyAttachmentLinkContainer).html(data.result.destroy_link) - data.destroyAttachmentLinkContainer = $(data.wrapper).find('.action-remove .remove-cached-attachment') - $(data.destroyAttachmentLinkContainer).on 'click', (e) -> + destroyAttachmentLink = $(data.result.destroy_link) + $(data.destroyAttachmentLinkContainer).html(destroyAttachmentLink) + $(destroyAttachmentLink).on 'click', (e) -> e.preventDefault() e.stopPropagation() App.Documentable.doDeleteCachedAttachmentRequest(this.href, data) diff --git a/app/assets/javascripts/imageable.js.coffee b/app/assets/javascripts/imageable.js.coffee index 004d8a40f..62a013bf0 100644 --- a/app/assets/javascripts/imageable.js.coffee +++ b/app/assets/javascripts/imageable.js.coffee @@ -1,45 +1,173 @@ App.Imageable = initialize: -> - console.log 'App.Imageable initialize' - input_files = $('input.direct_upload_attachment[type=file]') + inputFiles = $('input.direct_upload_image_attachment[type=file]') - $.each input_files, (index, file) -> - wrapper = $(file).closest(".direct-upload") - App.Imageable.watchRemoveImagebutton(wrapper) + $.each inputFiles, (index, input) -> + App.Imageable.initializeDirectUploadInput(input) - $("#new_image_link").on 'click', -> - $(this).hide() + $("#new_image_link").on 'click', -> $(this).hide() + + initializeDirectUploadInput: (input) -> + + inputData = @buildData([], input) + + @initializeRemoveImageLink(input) + + @initializeRemoveCachedImageLink(input, inputData) + + $(input).fileupload + + paramName: "attachment" + + formData: null + + add: (e, data) -> + data = App.Imageable.buildFileUploadData(e, data) + App.Imageable.clearProgressBar(data) + App.Imageable.setProgressBar(data, 'uploading') + data.submit() + + change: (e, data) -> + $.each data.files, (index, file) -> + App.Imageable.setFilename(inputData, file.name) + + fail: (e, data) -> + $(data.cachedAttachmentField).val("") + App.Imageable.clearFilename(data) + App.Imageable.setProgressBar(data, 'errors') + App.Imageable.clearInputErrors(data) + App.Imageable.setInputErrors(data) + App.Imageable.clearPreview(data) + $(data.destroyAttachmentLinkContainer).find("a.delete:not(.remove-nested)").remove() + $(data.addAttachmentLabel).show() + + done: (e, data) -> + $(data.cachedAttachmentField).val(data.result.cached_attachment) + App.Imageable.setTitleFromFile(data, data.result.filename) + App.Imageable.setProgressBar(data, 'complete') + App.Imageable.setFilename(data, data.result.filename) + App.Imageable.clearInputErrors(data) + $(data.addAttachmentLabel).hide() + + App.Imageable.setPreview(data) + destroyAttachmentLink = $(data.result.destroy_link) + $(data.destroyAttachmentLinkContainer).html(destroyAttachmentLink) + $(destroyAttachmentLink).on 'click', (e) -> + e.preventDefault() + e.stopPropagation() + App.Imageable.doDeleteCachedAttachmentRequest(this.href, data) + + progress: (e, data) -> + progress = parseInt(data.loaded / data.total * 100, 10) + $(data.progressBar).find('.loading-bar').css 'width', progress + '%' + return + + buildFileUploadData: (e, data) -> + data = @buildData(data, e.target) + return data + + buildData: (data, input) -> + wrapper = $(input).closest('.direct-upload') + data.input = input + data.wrapper = wrapper + data.progressBar = $(wrapper).find('.progress-bar-placeholder') + data.preview = $(wrapper).find('.image-preview') + data.errorContainer = $(wrapper).find('.attachment-errors') + data.fileNameContainer = $(wrapper).find('p.file-name') + data.destroyAttachmentLinkContainer = $(wrapper).find('.action-remove') + data.addAttachmentLabel = $(wrapper).find('.action-add label') + data.cachedAttachmentField = $(wrapper).find("#" + $(input).data('cached-attachment-input-field')) + data.titleField = $(wrapper).find("#" + $(input).data('title-input-field')) + $(wrapper).find('.progress-bar-placeholder').css('display', 'block') + return data + + clearFilename: (data) -> + $(data.fileNameContainer).text('') + $(data.fileNameContainer).hide() + + clearInputErrors: (data) -> + $(data.errorContainer).find('small.error').remove() + + clearProgressBar: (data) -> + $(data.progressBar).find('.loading-bar').removeClass('complete errors uploading').css('width', "0px") + + clearPreview: (data) -> + $(data.wrapper).find('.image-preview').remove() + + setFilename: (data, file_name) -> + $(data.fileNameContainer).text(file_name) + $(data.fileNameContainer).show() + + setProgressBar: (data, klass) -> + $(data.progressBar).find('.loading-bar').addClass(klass) + + setTitleFromFile: (data, title) -> + if $(data.titleField).val() == "" + $(data.titleField).val(title) + + setInputErrors: (data) -> + errors = '' + data.jqXHR.responseJSON.errors + '' + $(data.errorContainer).append(errors) + + setPreview: (data) -> + image_preview = '