" +
+ "
" + data.filename + "
" ); } else { @@ -41,15 +39,15 @@ function setupAssetsLoading() { animateSpinner(null, false); initPreviewModal(); }, - error: function (ev) { - if (ev.status == 403) { + error: function(data) { + if (data.status == 403) { $el.find('img').hide(); $el.next().hide(); // Image/file exists, but user doesn't have // rights to download it if (type === "image") { $el.html( - "" +
+ "
" + data.filename + "
" ); } else { diff --git a/app/assets/javascripts/protocols/steps.js.erb b/app/assets/javascripts/protocols/steps.js.erb index bd84f7770..715b4071b 100644 --- a/app/assets/javascripts/protocols/steps.js.erb +++ b/app/assets/javascripts/protocols/steps.js.erb @@ -3,7 +3,6 @@ //= require canvas-to-blob.min //= require assets //= require comments -//= require my_modules/image_preview // Sets callbacks for toggling checkboxes function applyCheckboxCallBack() { @@ -80,6 +79,7 @@ function applyCancelCallBack() { setTimeout(function() { initStepsComments(); + initPreviewModal(); }, 1000); }) @@ -104,6 +104,7 @@ function applyEditCallBack() { toggleButtons(false); initializeCheckboxSorting(); animateSpinner(null, false); + initPreviewModal(); $("#new-step-checklists fieldset.nested_step_checklists ul").each(function () { enableCheckboxSorting(this); diff --git a/app/assets/javascripts/results/result_assets.js b/app/assets/javascripts/results/result_assets.js index 65a6dd87f..e489f02cc 100644 --- a/app/assets/javascripts/results/result_assets.js +++ b/app/assets/javascripts/results/result_assets.js @@ -1,5 +1,3 @@ -//= require my_modules/image_preview - // New result asset behaviour $("#new-result-asset").on("ajax:success", function(e, data) { var $form = $(data.html); @@ -39,6 +37,7 @@ function applyEditResultAssetCallback() { $form.remove(); applyEditResultAssetCallback(); toggleResultEditButtons(true); + initPreviewModal(); }); toggleResultEditButtons(false); diff --git a/app/assets/javascripts/my_modules/image_preview.js b/app/assets/javascripts/sitewide/image_preview.js similarity index 78% rename from app/assets/javascripts/my_modules/image_preview.js rename to app/assets/javascripts/sitewide/image_preview.js index 69b65d4ba..c761bfc00 100644 --- a/app/assets/javascripts/my_modules/image_preview.js +++ b/app/assets/javascripts/sitewide/image_preview.js @@ -3,7 +3,7 @@ function initPreviewModal() { $('.image-preview-link').click(function(e) { e.preventDefault(); var name = $(this).find('p').text(); - var url = $(this).find('img').data('get-preview-url'); + var url = $(this).find('img').data('preview-url'); var downloadUrl = $(this).attr('href'); var description = $(this).data('description'); openPreviewModal(name, url, downloadUrl, description); @@ -16,7 +16,7 @@ function openPreviewModal(name, url, downloadUrl, description) { url: url, type: 'GET', dataType: 'json', - success: function (data) { + success: function(data) { modal.find('.image-name').text(name); var link = modal.find('.image-download-link'); link.attr('href', downloadUrl); @@ -25,12 +25,17 @@ function openPreviewModal(name, url, downloadUrl, description) { var image = modal.find('.modal-body img'); image.attr('src', data['large-preview-url']); image.attr('alt', name); + image.click(function(ev) { + ev.stopPropagation(); + }); modal.find('.modal-footer .image-description').text(description); + modal.find('.modal-body').click(function() { + modal.modal('hide'); + }); modal.modal(); }, - error: function (ev) { + error: function(ev) { // TODO } }); - } diff --git a/app/controllers/assets_controller.rb b/app/controllers/assets_controller.rb index 0e51af23f..9c0ff9c18 100644 --- a/app/controllers/assets_controller.rb +++ b/app/controllers/assets_controller.rb @@ -19,8 +19,8 @@ class AssetsController < ApplicationController # If check permission passes, return :ok render json: { - 'preview-url' => @asset.url(:medium), - 'get-preview-url' => large_image_url_asset_path(@asset), + 'image-tag-url' => @asset.url(:medium), + 'preview-url' => large_image_url_asset_path(@asset), 'filename' => truncate(@asset.file_file_name, length: Constants::FILENAME_TRUNCATION_LENGTH), @@ -32,14 +32,6 @@ class AssetsController < ApplicationController end end - def preview - if @asset.is_image? - redirect_to @asset.url(:medium), status: 307 - else - render_400 - end - end - def large_image_url respond_to do |format| format.json do diff --git a/app/models/asset.rb b/app/models/asset.rb index 263f9f8e4..1ff696c60 100644 --- a/app/models/asset.rb +++ b/app/models/asset.rb @@ -7,8 +7,8 @@ class Asset < ActiveRecord::Base # Paperclip validation has_attached_file :file, - styles: { medium: [Constants::MEDIUM_PIC_FORMAT, :jpg], - large: [Constants::LARGE_PIC_FORMAT, :jpg] }, + styles: { large: [Constants::LARGE_PIC_FORMAT, :jpg], + medium: [Constants::MEDIUM_PIC_FORMAT, :jpg] }, convert_options: { medium: '-quality 70 -strip' } validates_attachment :file, @@ -29,7 +29,7 @@ class Asset < ActiveRecord::Base %r{^image/#{ Regexp.union( Constants::WHITELISTED_IMAGE_TYPES ) }} - [:medium, :large] + [:large, :medium] else {} end diff --git a/app/views/results/_result_asset.html.erb b/app/views/results/_result_asset.html.erb index 73eee0edb..fc85525b1 100644 --- a/app/views/results/_result_asset.html.erb +++ b/app/views/results/_result_asset.html.erb @@ -1,17 +1,24 @@ <% if can_view_or_download_result_assets(result.my_module) %> - <%= link_to download_asset_path(result.asset), - class: 'image-preview-link', - id: "modal_link#{result.asset.id}", - data: {no_turbolink: true, description: "#{result.name}"} do %> - <% if result.asset.file.processing? %> - - <%= image_tag 'medium/processing.gif' %> - - <% else %> - <%= image_tag result.asset.url(:medium), data: {'get-preview-url': large_image_url_asset_path(result.asset)} if result.asset.is_image? %> -<%= truncate(result.asset.file_file_name, + <% if result.asset.file.processing? %> + + <%= image_tag 'medium/processing.gif' %> + + <% else %> + <% if result.asset.is_image? %> + <%= link_to download_asset_path(result.asset), + class: 'image-preview-link', + id: "modal_link#{result.asset.id}", + data: {no_turbolink: true, description: "#{result.name}"} do %> + <%= image_tag result.asset.url(:medium), data: {'preview-url': large_image_url_asset_path(result.asset)} %> +
<%= truncate(result.asset.file_file_name, length: Constants::FILENAME_TRUNCATION_LENGTH) %>
+ <% end %> + <% else %> + <%= link_to download_asset_path(result.asset), data: {no_turbolink: true} do %> +<%= truncate(result.asset.file_file_name, + length: Constants::FILENAME_TRUNCATION_LENGTH) %>
+ <% end %> <% end %> <% end %> <% else %> diff --git a/app/views/steps/_empty_step.html.erb b/app/views/steps/_empty_step.html.erb index d189c52ab..dd2c1c0a4 100644 --- a/app/views/steps/_empty_step.html.erb +++ b/app/views/steps/_empty_step.html.erb @@ -42,7 +42,7 @@<%= ff.object.file_file_name %>
+ <% if ff.object.is_image? %> + <%= link_to download_asset_path(ff.object), + class: 'image-preview-link', + id: "modal_link#{ff.object.id}", + data: {no_turbolink: true, id: true, status: "asset-present", description: "#{step.position + 1}. #{step.name}"} do %> + <%= image_tag ff.object.url(:medium), data: {'preview-url': large_image_url_asset_path(ff.object)} %> +<%= truncate(ff.object.file_file_name, + length: Constants::FILENAME_TRUNCATION_LENGTH) %>
+ <% end %> + <% else %> + <%= link_to download_asset_path(ff.object), data: {no_turbolink: true} do %> + <%= image_tag ff.object.url(:medium) if ff.object.is_image? %> +<%= truncate(ff.object.file_file_name, + length: Constants::FILENAME_TRUNCATION_LENGTH) %>
+ <% end %> <% end %> <% else %> - <%= image_tag(preview_asset_path ff.object) if ff.object.is_image? %> + <%= image_tag image_tag ff.object.url(:medium) if ff.object.is_image? %><%= ff.object.file_file_name %>
<% end %> <% else %> <%= ff.file_field :file %> <% end %><%= truncate(asset.file_file_name, + length: Constants::FILENAME_TRUNCATION_LENGTH) %>
+ <% end %> <% else %> - <%= image_tag asset.url(:medium), data: {'get-preview-url': large_image_url_asset_path(asset)} if asset.is_image? %> + <%= link_to download_asset_path(asset), data: {no_turbolink: true} do %> +<%= truncate(asset.file_file_name, + length: Constants::FILENAME_TRUNCATION_LENGTH) %>
+ <% end %> <% end %> -<%= truncate(asset.file_file_name, - length: Constants::FILENAME_TRUNCATION_LENGTH) %>
<% end %> <% else %> <% else %> - <%= image_tag preview_asset_path(asset) if asset.is_image? %> + <%= image_tag asset.url(:medium) if asset.is_image? %> <% end %><%= truncate(asset.file_file_name, length: Constants::FILENAME_TRUNCATION_LENGTH) %>
diff --git a/config/initializers/assets.rb b/config/initializers/assets.rb index 0c4e8e486..f8be48c9d 100644 --- a/config/initializers/assets.rb +++ b/config/initializers/assets.rb @@ -59,7 +59,6 @@ Rails.application.config.assets.precompile += %w(comments.js) Rails.application.config.assets.precompile += %w(projects/show.js) Rails.application.config.assets.precompile += %w(notifications.js) Rails.application.config.assets.precompile += %w(users/invite_users_modal.js) -Rails.application.config.assets.precompile += %w(my_modules/image_preview.js) # Libraries needed for Handsontable formulas Rails.application.config.assets.precompile += %w(lodash.js) diff --git a/config/initializers/constants.rb b/config/initializers/constants.rb index e784d00b6..f80545adf 100644 --- a/config/initializers/constants.rb +++ b/config/initializers/constants.rb @@ -72,8 +72,8 @@ class Constants #============================================================================= # Picture size formats - MEDIUM_PIC_FORMAT = '300x300>'.freeze LARGE_PIC_FORMAT = '800x600>'.freeze + MEDIUM_PIC_FORMAT = '300x300>'.freeze THUMB_PIC_FORMAT = '100x100>'.freeze ICON_PIC_FORMAT = '40x40>'.freeze ICON_SMALL_PIC_FORMAT = '30x30>'.freeze diff --git a/config/routes.rb b/config/routes.rb index 9c4b5d679..d40158a37 100644 --- a/config/routes.rb +++ b/config/routes.rb @@ -282,9 +282,10 @@ Rails.application.routes.draw do # We cannot use 'resources :assets' because assets is a reserved route # in Rails (assets pipeline) and causes funky behavior get "files/:id/present", to: "assets#file_present", as: "file_present_asset" - get "files/:id/large_url", to: "assets#large_image_url", as: "large_image_url_asset" + get 'files/:id/large_url', + to: 'assets#large_image_url', + as: 'large_image_url_asset' get "files/:id/download", to: "assets#download", as: "download_asset" - get "files/:id/preview", to: "assets#preview", as: "preview_asset" post 'asset_signature' => 'assets#signature' devise_scope :user do