diff --git a/app/assets/javascripts/experiments/dropdown_actions.js b/app/assets/javascripts/experiments/dropdown_actions.js index b752370ee..7659d8e9a 100644 --- a/app/assets/javascripts/experiments/dropdown_actions.js +++ b/app/assets/javascripts/experiments/dropdown_actions.js @@ -44,7 +44,6 @@ // click on buttonClass summons modalName dialog modals = { '.edit-experiment': '#edit-experiment-modal-', - '.clone-experiment': '#clone-experiment-modal-', '.move-experiment': '#move-experiment-modal-' }; @@ -118,16 +117,25 @@ initializeModal($(this), id); }); } - // Bind modal to new-experiment action - initializeModal($("#new-experiment"), '#new-experiment-modal'); - // Bind modal to big-plus new experiment actions - initializeModal('.big-plus', '#new-experiment-modal'); + $(document).on('turbolinks:load', function() { + // Bind modal to new-experiment action + initializeModal($("#new-experiment"), '#new-experiment-modal'); - // Bind modal to all actions listed on dropdown accesible from experiment - // panel - initializeDropdownActions(); + // Bind modal to big-plus new experiment actions + initializeModal('.big-plus', '#new-experiment-modal'); - // init - initEditNoDescription(); + // Bind modals to all clone-experiment actions + $.each($('.clone-experiment'), function() { + var id = $(this).closest('.experiment-panel').data('id') + initializeModal($(this), '#clone-experiment-modal-' + id); + }); + + // Bind modal to all actions listed on dropdown accesible from experiment + // panel + initializeDropdownActions(); + + // init + initEditNoDescription(); + } ); })(); diff --git a/app/assets/stylesheets/projects.scss b/app/assets/stylesheets/projects.scss index cfe1820cd..7ec42d923 100644 --- a/app/assets/stylesheets/projects.scss +++ b/app/assets/stylesheets/projects.scss @@ -463,10 +463,19 @@ li.module-hover { } } + +#project-show { + @media (min-width: 1400px) { + .col-md-6 { + width: 33.3333333333%;; + } + } +} + // EXPERIMENT PANEL .experiment-panel { @include box-shadow(0 4px 8px 0 $color-dove-gray); - height: 550px; + height: 400px; margin: 0 auto; margin-bottom: 35px; margin-top: 45px; @@ -474,6 +483,37 @@ li.module-hover { display: flex; flex-direction: column; + .panel-title { + margin-bottom: 14px; + } + + .panel-heading .clone-experiment, + .panel-heading .dropdown { + display: none; + } + + &:hover .clone-experiment, + &:hover .dropdown { + display: block; + } + + .panel-date { + color: $color-silver-chalice; + } + + .clone-experiment { + color: $color-silver-chalice; + padding-top: 2px; + padding-left: 4px; + } + + .dropdown { + color: $color-silver-chalice; + button { + padding-left: 6px; + } + } + .panel-body { display: flex; flex: 1 1 auto; @@ -481,20 +521,21 @@ li.module-hover { } .experiment-description { - border: 1px solid $color-alto; - border-radius: 4px; - height: 100px; + max-height: 86px; margin-top: 10px; overflow-x: hidden; - overflow-y: scroll; - padding: 10px; + + p { + margin: 0; + } } .experiment-no-description { color: $color-alto; display: block; - font-size: $font-size-h4; + font-size: $font-size-large; font-weight: bold; + margin-top: 10px; text-align: center; a { @@ -508,9 +549,9 @@ li.module-hover { display: block; font-size: 26px; font-weight: bold; - height: 300px; + max-height: 200px; margin: 15px 0; - padding-top: 150px; + padding-top: 50px; text-align: center; a { @@ -521,11 +562,11 @@ li.module-hover { } .workflowimg-container { - height: 300px; + max-height: 200px; margin: 15px 0; img { - max-height: 300px; + max-height: 190px; max-width: 100%; } } @@ -540,7 +581,7 @@ li.module-hover { .big-plus { color: $color-gainsboro; display: block; - font-size: 250px; + font-size: 180px; margin: 20px 0; text-align: center; diff --git a/app/assets/stylesheets/themes/scinote.scss b/app/assets/stylesheets/themes/scinote.scss index 4eca577ba..aa465ab8e 100644 --- a/app/assets/stylesheets/themes/scinote.scss +++ b/app/assets/stylesheets/themes/scinote.scss @@ -652,7 +652,7 @@ ul.double-line > li { } .panel-default > .panel-heading { - background-color: $color-gainsboro; + background-color: $color-white; &>.panel-title { overflow: hidden; diff --git a/app/views/experiments/_dropdown_actions.html.erb b/app/views/experiments/_dropdown_actions.html.erb index 4bab9f357..6863b1204 100644 --- a/app/views/experiments/_dropdown_actions.html.erb +++ b/app/views/experiments/_dropdown_actions.html.erb @@ -11,16 +11,6 @@ class: 'edit-experiment' %> <% end %>
  • - <% if can_clone_experiment?(experiment) %> -
  • <%= link_to t('experiments.clone.label_title'), - clone_modal_experiment_url(experiment), - remote: true, type: 'button', - class: 'clone-experiment help_tooltips', - data: { - tooltiplink: I18n.t('tooltips.link.experiment.copy'), - tooltipcontent: I18n.t('tooltips.text.experiment.copy') - } %>
    • - <% end %> <% if can_move_experiment?(experiment) %>
  • <%= link_to t('experiments.move.label_title'), move_modal_experiment_url(experiment), diff --git a/app/views/projects/show.html.erb b/app/views/projects/show.html.erb index ff4a036f1..89c689ad9 100644 --- a/app/views/projects/show.html.erb +++ b/app/views/projects/show.html.erb @@ -44,8 +44,6 @@ <% @project.sorted_active_experiments(@current_sort).each_with_index do |experiment, index| %> <%= render partial: 'projects/show/experiment', locals: { experiment: experiment } %> - - <%= content_tag(:div, '', class: 'clearfix visible-lg-block') if (index + 1) % 2 == 0 %> <% end %> <% if can_create_experiments?(@project) %> <%= render 'projects/show/new_experiment' %> diff --git a/app/views/projects/show/_experiment.html.erb b/app/views/projects/show/_experiment.html.erb index 8cfc517e0..0353809af 100644 --- a/app/views/projects/show/_experiment.html.erb +++ b/app/views/projects/show/_experiment.html.erb @@ -17,32 +17,27 @@ <%= render partial: 'experiments/dropdown_actions.html.erb', locals: { project: @project, experiment: experiment } %> - <% end %> -

    <%= link_to experiment.name, canvas_experiment_path(experiment) %>

    - - -
    - <% if experiment.active_modules.length > 0 %> -
    -
    - <% else %> -
    - <% if can_manage_experiment?(experiment) %> -

    <%= link_to( t('experiments.edit.add_task'), - canvas_experiment_path(experiment, - editMode: true)) %>

    - <% else %> -

    <%= t('experiments.edit.no_workflowimg') %>

    + <% if can_clone_experiment?(experiment) %> + <%= link_to clone_modal_experiment_url(experiment), + remote: true, type: 'button', + class: 'clone-experiment help_tooltips pull-right', + data: { + tooltiplink: I18n.t('tooltips.link.experiment.copy'), + tooltipcontent: I18n.t('tooltips.text.experiment.copy') + } do %> +   + <%= t('experiments.clone.label_title') %> <% end %> -
    + <% end %> <% end %> - + +
    <%= link_to experiment.name, canvas_experiment_path(experiment) %>
    + + <%= l(experiment.created_at, format: :full_date) %> - <%= l(experiment.updated_at, format: :full_date) %> +
    <% if experiment.description? %>
    @@ -62,5 +57,26 @@ <% end %>
    + +
    + <% if experiment.active_modules.length > 0 %> +
    +
    + <% else %> +
    + <% if can_manage_experiment?(experiment) %> +

    <%= link_to( t('experiments.edit.add_task'), + canvas_experiment_path(experiment, + editMode: true)) %>

    + <% else %> +

    <%= t('experiments.edit.no_workflowimg') %>

    + <% end %> +
    + <% end %> + +
    diff --git a/config/locales/en.yml b/config/locales/en.yml index 191d786ea..57eee0d70 100644 --- a/config/locales/en.yml +++ b/config/locales/en.yml @@ -769,7 +769,7 @@ en: label_title: 'Archive' clone: modal_title: 'Copy experiment %{experiment} as template' - label_title: 'Copy as template (only Protocols steps copied)' + label_title: 'Copy as template' modal_submit: 'Copy' success_flash: 'Successfully copied experiment %{experiment} as template.' error_flash: 'Could not copy the experiment as template.'