diff --git a/app/assets/javascripts/experiments/table.js b/app/assets/javascripts/experiments/table.js index a34aa77e9..977712d81 100644 --- a/app/assets/javascripts/experiments/table.js +++ b/app/assets/javascripts/experiments/table.js @@ -88,13 +88,13 @@ ExperimnetTable.render.assigned = function(data) { }; ExperimnetTable.render.tags = function(data) { - const value = parseInt(data, 10) === 0 ? I18n.t('experiments.table.add_tag') : data; - return `${value}`; + const value = parseInt(data.tags, 10) === 0 ? I18n.t('experiments.table.add_tag') : data.tags; + return `${value}`; }; ExperimnetTable.render.comments = function(data) { - return ` ${data.count > 0 ? data.count : '+'} ${data.count_unseen > 0 ? ` ${data.count_unseen} ` : ''} diff --git a/app/assets/javascripts/my_modules.js b/app/assets/javascripts/my_modules.js index 34fc4c5cc..85d02fb55 100644 --- a/app/assets/javascripts/my_modules.js +++ b/app/assets/javascripts/my_modules.js @@ -89,155 +89,6 @@ }); } - - // Bind ajax for editing tags - function bindEditTagsAjax() { - var manageTagsModal = null; - var manageTagsModalBody = null; - - // Initialize reloading of manage tags modal content after posting new - // tag. - function initAddTagForm() { - manageTagsModalBody.find('.add-tag-form') - .submit(function() { - var selectOptions = manageTagsModalBody.find('#new_my_module_tag .dropdown-menu li').length; - if (selectOptions === 0 && this.id === 'new_my_module_tag') return false; - return true; - }) - .on('ajax:success', function(e, data) { - var newTag; - initTagsModalBody(data); - newTag = $('#manage-module-tags-modal .list-group-item').last(); - dropdownSelector.addValue('#module-tags-selector', { - value: newTag.data('tag-id'), - label: newTag.data('name'), - params: { - color: newTag.data('color') - } - }, true); - }); - } - - // Initialize edit tag & remove tag functionality from my_module links. - function initTagRowLinks() { - manageTagsModalBody.find('.edit-tag-link') - .on('click', function() { - var $this = $(this); - var li = $this.parents('li.list-group-item'); - var editDiv = $(li.find('div.tag-edit')); - - // Revert all rows to their original states - manageTagsModalBody.find('li.list-group-item').each(function() { - var li2 = $(this); - li2.css('background-color', li2.data('color')); - li2.find('.edit-tag-form').clearFormErrors(); - li2.find('input[type=text]').val(li2.data('name')); - }); - - // Hide all other edit divs, show all show divs - manageTagsModalBody.find('div.tag-edit').hide(); - manageTagsModalBody.find('div.tag-show').show(); - - editDiv.find('input[type=text]').val(li.data('name')); - editDiv.find('.edit-tag-color').colorselector('setColor', li.data('color')); - - li.find('div.tag-show').hide(); - editDiv.show(); - }); - manageTagsModalBody.find('div.tag-edit .dropdown-colorselector > .dropdown-menu li a') - .on('click', function() { - // Change background of the
  • - var $this = $(this); - var li = $this.parents('li.list-group-item'); - li.css('background-color', $this.data('value')); - }); - manageTagsModalBody.find('.remove-tag-link') - .on('ajax:success', function(e, data) { - dropdownSelector.removeValue('#module-tags-selector', this.dataset.tagId, '', true); - initTagsModalBody(data); - }); - manageTagsModalBody.find('.delete-tag-form') - .on('ajax:success', function(e, data) { - dropdownSelector.removeValue('#module-tags-selector', this.dataset.tagId, '', true); - initTagsModalBody(data); - }); - manageTagsModalBody.find('.edit-tag-form') - .on('ajax:success', function(e, data) { - var newTag; - initTagsModalBody(data); - dropdownSelector.removeValue('#module-tags-selector', this.dataset.tagId, '', true); - newTag = $('#manage-module-tags-modal .list-group-item[data-tag-id=' + this.dataset.tagId + ']'); - dropdownSelector.addValue('#module-tags-selector', { - value: newTag.data('tag-id'), - label: newTag.data('name'), - params: { - color: newTag.data('color') - } - }, true); - }) - .on('ajax:error', function(e, data) { - $(this).renderFormErrors('tag', data.responseJSON); - }); - manageTagsModalBody.find('.cancel-tag-link') - .on('click', function() { - var $this = $(this); - var li = $this.parents('li.list-group-item'); - - li.css('background-color', li.data('color')); - li.find('.edit-tag-form').clearFormErrors(); - - li.find('div.tag-edit').hide(); - li.find('div.tag-show').show(); - }); - } - - // Initialize ajax listeners and elements style on modal body. This - // function must be called when modal body is changed. - function initTagsModalBody(data) { - manageTagsModalBody.html(data.html); - manageTagsModalBody.find('.selectpicker').selectpicker(); - initAddTagForm(); - initTagRowLinks(); - } - - manageTagsModal = $('#manage-module-tags-modal'); - manageTagsModalBody = manageTagsModal.find('.modal-body'); - - // Reload tags HTML element when modal is closed - manageTagsModal.on('hide.bs.modal', function() { - var tagsEl = $('#module-tags'); - - // Load HTML - $.ajax({ - url: tagsEl.attr('data-module-tags-url'), - type: 'GET', - dataType: 'json', - success: function(data) { - var newOptions = $(data.html_module_header).find('option'); - $('#module-tags-selector').find('option').remove(); - $(newOptions).appendTo('#module-tags-selector').change(); - }, - error: function() { - // TODO - } - }); - }); - - // Remove modal content when modal window is closed. - manageTagsModal.on('hidden.bs.modal', function() { - manageTagsModalBody.html(''); - }); - // initialize my_module tab remote loading - $('.edit-tags-link') - .on('ajax:before', function() { - manageTagsModal.modal('show'); - }) - .on('ajax:success', function(e, data) { - $('#manage-module-tags-modal-module').text(data.my_module.name); - initTagsModalBody(data); - }); - } - function checkStatusState() { $.getJSON($('.status-flow-dropdown').data('status-check-url'), (statusData) => { if (statusData.status_changing) { @@ -440,7 +291,6 @@ initTaskCollapseState(); applyTaskStatusChangeCallBack(); initTagsSelector(); - bindEditTagsAjax(); initStartDatePicker(); initDueDatePicker(); initAssignedUsersSelector(); diff --git a/app/assets/javascripts/my_modules/tags.js b/app/assets/javascripts/my_modules/tags.js new file mode 100644 index 000000000..ed1580ce2 --- /dev/null +++ b/app/assets/javascripts/my_modules/tags.js @@ -0,0 +1,158 @@ +/* global dropdownSelector I18n */ +/* eslint-disable no-use-before-define */ +(function() { + // Bind ajax for editing tags + function bindEditTagsAjax() { + var manageTagsModal = null; + var manageTagsModalBody = null; + + // Initialize reloading of manage tags modal content after posting new + // tag. + function initAddTagForm() { + manageTagsModalBody.find('.add-tag-form') + .submit(function() { + var selectOptions = manageTagsModalBody.find('#new_my_module_tag .dropdown-menu li').length; + if (selectOptions === 0 && this.id === 'new_my_module_tag') return false; + return true; + }) + .on('ajax:success', function(e, data) { + var newTag; + initTagsModalBody(data); + newTag = $('#manage-module-tags-modal .list-group-item').last(); + dropdownSelector.addValue('#module-tags-selector', { + value: newTag.data('tag-id'), + label: newTag.data('name'), + params: { + color: newTag.data('color') + } + }, true); + }); + } + // Initialize edit tag & remove tag functionality from my_module links. + function initTagRowLinks() { + manageTagsModalBody.find('.edit-tag-link') + .on('click', function() { + var $this = $(this); + var li = $this.parents('li.list-group-item'); + var editDiv = $(li.find('div.tag-edit')); + + // Revert all rows to their original states + manageTagsModalBody.find('li.list-group-item').each(function() { + var li2 = $(this); + li2.css('background-color', li2.data('color')); + li2.find('.edit-tag-form').clearFormErrors(); + li2.find('input[type=text]').val(li2.data('name')); + }); + + // Hide all other edit divs, show all show divs + manageTagsModalBody.find('div.tag-edit').hide(); + manageTagsModalBody.find('div.tag-show').show(); + + editDiv.find('input[type=text]').val(li.data('name')); + editDiv.find('.edit-tag-color').colorselector('setColor', li.data('color')); + + li.find('div.tag-show').hide(); + editDiv.show(); + }); + manageTagsModalBody.find('div.tag-edit .dropdown-colorselector > .dropdown-menu li a') + .on('click', function() { + // Change background of the
  • + var $this = $(this); + var li = $this.parents('li.list-group-item'); + li.css('background-color', $this.data('value')); + }); + manageTagsModalBody.find('.remove-tag-link') + .on('ajax:success', function(e, data) { + dropdownSelector.removeValue('#module-tags-selector', this.dataset.tagId, '', true); + initTagsModalBody(data); + }); + manageTagsModalBody.find('.delete-tag-form') + .on('ajax:success', function(e, data) { + dropdownSelector.removeValue('#module-tags-selector', this.dataset.tagId, '', true); + initTagsModalBody(data); + }); + manageTagsModalBody.find('.edit-tag-form') + .on('ajax:success', function(e, data) { + var newTag; + initTagsModalBody(data); + dropdownSelector.removeValue('#module-tags-selector', this.dataset.tagId, '', true); + newTag = $('#manage-module-tags-modal .list-group-item[data-tag-id=' + this.dataset.tagId + ']'); + dropdownSelector.addValue('#module-tags-selector', { + value: newTag.data('tag-id'), + label: newTag.data('name'), + params: { + color: newTag.data('color') + } + }, true); + }) + .on('ajax:error', function(e, data) { + $(this).renderFormErrors('tag', data.responseJSON); + }); + manageTagsModalBody.find('.cancel-tag-link') + .on('click', function() { + var $this = $(this); + var li = $this.parents('li.list-group-item'); + + li.css('background-color', li.data('color')); + li.find('.edit-tag-form').clearFormErrors(); + + li.find('div.tag-edit').hide(); + li.find('div.tag-show').show(); + }); + } + + // Initialize ajax listeners and elements style on modal body. This + // function must be called when modal body is changed. + function initTagsModalBody(data) { + manageTagsModalBody.html(data.html); + manageTagsModalBody.find('.selectpicker').selectpicker(); + initAddTagForm(); + initTagRowLinks(); + } + + manageTagsModal = $('#manage-module-tags-modal'); + manageTagsModalBody = manageTagsModal.find('.modal-body'); + + // Reload tags HTML element when modal is closed + manageTagsModal.on('hide.bs.modal', function() { + var tagsEl = $('#module-tags'); + + if ($('#experimentTable').length) { + let tags = $('.tag-show').length; + $(`#myModuleTags${$('#tags_modal_my_module_id').val()}`).html( + tags === 0 ? I18n.t('experiments.table.add_tag') : tags + ); + } + + // Load HTML + $.ajax({ + url: tagsEl.attr('data-module-tags-url'), + type: 'GET', + dataType: 'json', + success: function(data) { + var newOptions = $(data.html_module_header).find('option'); + $('#module-tags-selector').find('option').remove(); + $(newOptions).appendTo('#module-tags-selector').change(); + }, + error: function() { + // TODO + } + }); + }); + // Remove modal content when modal window is closed. + manageTagsModal.on('hidden.bs.modal', function() { + manageTagsModalBody.html(''); + }); + // initialize my_module tab remote loading + $('#experimentTable, .my-modules-protocols-index') + .on('ajax:before', '.edit-tags-link', function() { + manageTagsModal.modal('show'); + }) + .on('ajax:success', '.edit-tags-link', function(e, data) { + $('#manage-module-tags-modal-module').text(data.my_module.name); + initTagsModalBody(data); + }); + } + + bindEditTagsAjax(); +}()); diff --git a/app/services/experiments/table_view_service.rb b/app/services/experiments/table_view_service.rb index 7f832c1b1..56a34ed3a 100644 --- a/app/services/experiments/table_view_service.rb +++ b/app/services/experiments/table_view_service.rb @@ -114,7 +114,11 @@ module Experiments end def tags_presenter(my_module) - my_module.tags.length + { + my_module_id: my_module.id, + tags: my_module.tags.length, + edit_url: my_module_tags_edit_path(my_module, format: :json) + } end def comments_presenter(my_module) diff --git a/app/services/model_exporters/model_exporter.rb b/app/services/model_exporters/model_exporter.rb index 8845e4697..63a7d3623 100644 --- a/app/services/model_exporters/model_exporter.rb +++ b/app/services/model_exporters/model_exporter.rb @@ -3,7 +3,7 @@ require 'fileutils' module ModelExporters - class ModelExporter + class attr_accessor :assets_to_copy attr_accessor :tiny_mce_assets_to_copy diff --git a/app/views/experiments/table.html.erb b/app/views/experiments/table.html.erb index 0c7dd1ba6..997fd220d 100644 --- a/app/views/experiments/table.html.erb +++ b/app/views/experiments/table.html.erb @@ -34,5 +34,7 @@ +<%= render partial: "my_modules/modals/manage_module_tags_modal", locals: { my_module: nil } %> +<%= javascript_include_tag("my_modules/tags") %> <%= javascript_include_tag("experiments/table") %> diff --git a/app/views/my_module_tags/_index_edit.html.erb b/app/views/my_module_tags/_index_edit.html.erb index 18f742db1..737eb44e3 100644 --- a/app/views/my_module_tags/_index_edit.html.erb +++ b/app/views/my_module_tags/_index_edit.html.erb @@ -1,3 +1,4 @@ +<%= hidden_field_tag :tags_modal_my_module_id, @my_module.id %>
    <%=t "experiments.canvas.modal_manage_tags.subtitle", module: @my_module.name %>
    <% if @my_module_tags.size == 0 then %>
    <%= t 'experiments.canvas.modal_manage_tags.no_tags' %>
    diff --git a/app/views/my_modules/protocols.html.erb b/app/views/my_modules/protocols.html.erb index e057ec67c..35679efe1 100644 --- a/app/views/my_modules/protocols.html.erb +++ b/app/views/my_modules/protocols.html.erb @@ -171,6 +171,7 @@ <%= render partial: "shared/formulas_libraries.html.erb" %> <%= javascript_include_tag("my_modules/protocols") %> <%= javascript_include_tag("my_modules/status_flow") %> +<%= javascript_include_tag("my_modules/tags") %> <%= javascript_pack_tag 'emoji_button' %> <%= javascript_include_tag("my_modules/repositories") %> <%= javascript_include_tag("my_modules/pwa_mobile_app") %> diff --git a/config/initializers/assets.rb b/config/initializers/assets.rb index 4defcc5d2..8e6effe49 100644 --- a/config/initializers/assets.rb +++ b/config/initializers/assets.rb @@ -34,6 +34,7 @@ Rails.application.config.assets.precompile += %w(my_modules/status_flow.js) Rails.application.config.assets.precompile += %w(my_modules/protocols/protocol_status_bar.js) Rails.application.config.assets.precompile += %w(my_modules/results.js) Rails.application.config.assets.precompile += %w(my_modules/stock.js) +Rails.application.config.assets.precompile += %w(my_modules/tags.js) Rails.application.config.assets.precompile += %w(my_modules/archived.js) Rails.application.config.assets.precompile += %w(my_modules/pwa_mobile_app.js) Rails.application.config.assets.precompile += %w(assets/wopi/create_wopi_file.js)