From 46f0e0c0c209cb25adde4b869470d09c49919d67 Mon Sep 17 00:00:00 2001 From: Anton Ignatov Date: Sat, 27 Apr 2019 12:46:45 +0200 Subject: [PATCH] Add marvin js assets to assets sort and name field --- app/assets/javascripts/protocols/steps.js.erb | 2 +- .../javascripts/sitewide/file_preview.js | 28 +- .../javascripts/sitewide/marvinjs_editor.js | 15 +- app/assets/stylesheets/marvinjs.scss | 12 + app/helpers/my_modules_helper.rb | 32 +- .../marvinjs/_marvin_sketch_card.html.erb | 25 +- app/views/shared/_marvinjs_modal.html.erb | 4 +- app/views/steps/attachments/_item.html.erb | 3 +- app/views/steps/attachments/_list.html.erb | 12 +- config/locales/marvinjs/en.yml | 3 + ...0427115413_add_name_to_marvin_js_assets.rb | 6 + db/schema.rb | 3 +- public/javascripts/i18n.js | 1067 +++++++++++++++++ public/javascripts/translations.js | 47 + 14 files changed, 1230 insertions(+), 29 deletions(-) create mode 100644 config/locales/marvinjs/en.yml create mode 100644 db/migrate/20190427115413_add_name_to_marvin_js_assets.rb create mode 100644 public/javascripts/i18n.js create mode 100644 public/javascripts/translations.js diff --git a/app/assets/javascripts/protocols/steps.js.erb b/app/assets/javascripts/protocols/steps.js.erb index cb23a530b..3592fce11 100644 --- a/app/assets/javascripts/protocols/steps.js.erb +++ b/app/assets/javascripts/protocols/steps.js.erb @@ -665,7 +665,7 @@ $("#dd-att-step-" + stepId + "-label").html(label_value); $('#att-' + stepId + ' a.file-preview-link').each(function(){ var elm = $(this) - elm.css('order', elm.attr('data-order-' + sortType)); + elm.parent().css('order', elm.attr('data-order-' + sortType)); }) } diff --git a/app/assets/javascripts/sitewide/file_preview.js b/app/assets/javascripts/sitewide/file_preview.js index e12929744..b49f677ef 100644 --- a/app/assets/javascripts/sitewide/file_preview.js +++ b/app/assets/javascripts/sitewide/file_preview.js @@ -18,9 +18,13 @@ var FilePreviewModal = (function() { $('.file-preview-link').off('click'); $('.file-preview-link').click(function(e) { e.preventDefault(); - name = $(this).find('p').text(); + name = $(this).find('.attachment-label').text(); url = $(this).data('preview-url'); downloadUrl = $(this).attr('href'); + if ($(this).data('asset-type') === 'marvin-sketch'){ + openMarvinPrevieModal(name,$(this).find('#description')) + return true + } openPreviewModal(name, url, downloadUrl); }); } @@ -421,8 +425,7 @@ var FilePreviewModal = (function() { dataType: 'json', success: function(data) { var link = modal.find('.file-download-link'); - modal.find('.file-preview-container').empty(); - modal.find('.file-wopi-controls').empty(); + clearPrevieModal() if (Object.prototype.hasOwnProperty.call(data, 'wopi-controls')) { modal.find('.file-wopi-controls').html(data['wopi-controls']); } @@ -520,6 +523,25 @@ var FilePreviewModal = (function() { }); } + function clearPrevieModal(){ + var modal = $('#filePreviewModal'); + modal.find('.file-preview-container').empty(); + modal.find('.file-wopi-controls').empty(); + modal.find('.file-edit-link').css('display', 'none'); + } + + function openMarvinPrevieModal(name,src){ + var modal = $('#filePreviewModal'); + clearPrevieModal() + + modal.modal('show') + modal.find('.file-preview-container') + .append($('').attr('src', '').attr('alt', '')); + target=modal.find('.file-preview-container').find('img') + MarvinJsEditor().create_preview(src,target) + modal.find('.file-name').text(name); + } + return Object.freeze({ init: initPreviewModal }); diff --git a/app/assets/javascripts/sitewide/marvinjs_editor.js b/app/assets/javascripts/sitewide/marvinjs_editor.js index 7383d82ca..87e75601e 100644 --- a/app/assets/javascripts/sitewide/marvinjs_editor.js +++ b/app/assets/javascripts/sitewide/marvinjs_editor.js @@ -14,25 +14,32 @@ var MarvinJsEditor = (function() { } function preloadActions(config) { + var sketchName = marvinJsModal.find('.file-name input') if (config.mode === 'new'){ loadEditor().then(function(sketcherInstance) { sketcherInstance.importStructure("mrv",emptySketch) + sketchName.val(I18n.t('marvinjs.new_sketch')) }) } } function createExporter(marvin,imageType) { var inputFormat = "mrv"; + var settings = { + 'width' : 900, + 'height' : 900 + }; + var params = { 'imageType': imageType, + 'settings': settings, 'inputFormat': inputFormat } return new marvin.ImageExporter(params); } function assignImage(target,data){ - console.log(data) - $(target).find('img').attr('src',data) + target.attr('src',data) } return Object.freeze({ @@ -77,11 +84,11 @@ var MarvinJsEditor = (function() { }) }, - create_preview: function(target){ + create_preview: function(source,target){ loadPackages().then(function (sketcherInstance) { sketcherInstance.onReady(function() { exporter = createExporter(sketcherInstance,'image/jpeg') - sketch_config = $(target).find('#description').val(); + sketch_config = source.val(); exporter.render(sketch_config).then(function(result){ assignImage(target,result) }); diff --git a/app/assets/stylesheets/marvinjs.scss b/app/assets/stylesheets/marvinjs.scss index bca33bd47..2d470f64c 100644 --- a/app/assets/stylesheets/marvinjs.scss +++ b/app/assets/stylesheets/marvinjs.scss @@ -40,6 +40,18 @@ .file-name { float: left; + + input { + border-radius: 5px; + box-shadow: none; + color: $color-black; + height: 40px; + outline: 0; + padding: 5px 10px; + position:relative; + top: -5px; + width: 350px; + } } } diff --git a/app/helpers/my_modules_helper.rb b/app/helpers/my_modules_helper.rb index 097cdd4a3..d111c5dcb 100644 --- a/app/helpers/my_modules_helper.rb +++ b/app/helpers/my_modules_helper.rb @@ -8,11 +8,21 @@ module MyModulesHelper end def ordered_assets(step) - step.assets.order(:file_updated_at) + assets=[] + assets += step.assets + assets += step.marvin_js_assets + assets.sort! { |a, b| + a[asset_date_sort_field(a)] <=> b[asset_date_sort_field(b)] + } end def az_ordered_assets_index(step, asset_id) - step.assets.order('LOWER(file_file_name)').pluck(:id).index(asset_id) + assets=[] + assets += step.assets + assets += step.marvin_js_assets + assets.sort! { |a, b| + (a[asset_name_sort_field(a)] || '').downcase <=> (b[asset_name_sort_field(b)] || '').downcase + }.pluck(:id).index(asset_id) end def number_of_samples(my_module) @@ -42,4 +52,22 @@ module MyModulesHelper action_name == "results" end + private + + def asset_date_sort_field(el) + result = { + 'Asset' => :file_updated_at, + 'MarvinJsAsset' => :updated_at + } + result[el.class.name] + end + + def asset_name_sort_field(el) + result = { + 'Asset' => :file_file_name, + 'MarvinJsAsset' => :name + } + result[el.class.name] + end + end diff --git a/app/views/assets/marvinjs/_marvin_sketch_card.html.erb b/app/views/assets/marvinjs/_marvin_sketch_card.html.erb index 27c9362cf..d8e7e1710 100644 --- a/app/views/assets/marvinjs/_marvin_sketch_card.html.erb +++ b/app/views/assets/marvinjs/_marvin_sketch_card.html.erb @@ -1,14 +1,15 @@ -
+
<%= link_to '', class: 'file-preview-link', - id: "modal_link_sketch_#{sketch.id}", - style: "order: 0", + id: "marvin_js_sketch_#{sketch.id}", data: { no_turbolink: true, id: true, status: 'asset-present', 'preview-url': '', - 'order-atoz': 0, - 'order-ztoa': 0, - 'order-old': 0, - 'order-new': 0, + 'order-atoz': az_ordered_assets_index(step, sketch.id), + 'order-ztoa': assets_count - az_ordered_assets_index(step, sketch.id), + 'order-old': i, + 'order-new': assets_count - i, + 'asset-type': 'marvin-sketch', + 'asset-id': sketch.id } do %>
@@ -16,12 +17,18 @@ <%= hidden_field_tag :description, sketch.description %>
-
<%= truncate('Empty name', +
<%= truncate(sketch.name, length: Constants::FILENAME_TRUNCATION_LENGTH) %>
<%= t('protocols.steps.attachments.modified_label') %> <%= l(sketch.updated_at, format: :full_date) if sketch.updated_at %>
<% end %> - +
\ No newline at end of file diff --git a/app/views/shared/_marvinjs_modal.html.erb b/app/views/shared/_marvinjs_modal.html.erb index 62146a53c..22196d324 100644 --- a/app/views/shared/_marvinjs_modal.html.erb +++ b/app/views/shared/_marvinjs_modal.html.erb @@ -9,7 +9,9 @@