Merge branch 'main' into herbarium-form-modal

Gemfile

@@ -83,7 +83,7 @@ gem("blankslate")
 # Simple version models and tables for classes
 # Use our own fork, which stores enum attrs as integers in the db
 gem("mo_acts_as_versioned", ">= 0.6.6",
-    git: "https://github.com/MushroomObserver/acts_as_versioned/")
+    git: "https://github.com/MushroomObserver/acts_as_versioned")
 
 # Use ActiveModel has_secure_password
 gem("bcrypt")

Gemfile.lock

@@ -1,5 +1,5 @@
 GIT
-  remote: https://github.com/MushroomObserver/acts_as_versioned/
+  remote: https://github.com/MushroomObserver/acts_as_versioned
   revision: 56891f7f915610e9f884e3a932bfb6934303b3b8
   specs:
     mo_acts_as_versioned (0.6.6)

app/helpers/link_helper.rb

@@ -81,16 +81,17 @@ def modal_link_to(identifier, name, path, args)
   # Icon link with optional active state. (Tooltip title must be swapped in JS.)
   # Now also accepts active state options: active_icon, active_content
   # NOTE: Takes same args as link_to, e.g. *edit_description_tab(desc, type)
-  # icon_link_to(text, path, **args)
+  # icon_link_to(text, path, **args). Can also print a button_to.
   def icon_link_to(text = nil, path = nil, options = {}, &block)
     return unless text
 
-    link = block ? text : path # because positional
+    link_path = block ? text : path # because positional
     content = block ? capture(&block) : text
     opts = block ? path : options # because positional
     icon_type = opts[:icon]
     return link_to(link, opts) { content } if icon_type.blank?
 
+    # method = opts[:button] ? :button_to : :link_to
     active_icon = opts[:active_icon]
     active_content = options[:active_content]
     stateful = active_icon && active_content
@@ -106,14 +107,19 @@ def icon_link_to(text = nil, path = nil, options = {}, &block)
       data: { toggle: "tooltip", title: content, # needed for swapping only
               active_title: opts[:active_content] }
     }.deep_merge(opts.except(:class, :icon, :icon_class, :show_text,
-                             :active_icon, :active_content))
+                             :active_icon, :active_content, :button_to))
 
-    link_to(link, **link_opts) do
+    html = capture do
       concat(link_icon(icon_type, class: icon_class))
       concat(link_icon(active_icon, class: icon_active_class)) if stateful
       concat(tag.span(content, class: label_class))
       concat(tag.span(active_content, class: label_active_class)) if stateful
     end
+    if opts[:button_to]
+      button_to(html, link_path, **link_opts)
+    else
+      link_to(html, link_path, **link_opts)
+    end
   end
 
   # NOTE: above re: MO tabs
@@ -137,11 +143,11 @@ def link_icon(type, **args)
 
     if args[:title].present?
       title = args[:title]
-      args[:data] = { toggle: "tooltip", title: }.merge(args[:data] || {})
+      args[:data] = { toggle: "tooltip" }.merge(args[:data] || {})
       text = tag.span(title, class: "sr-only")
     end
 
-    tag.span(text, **args.except(:title))
+    tag.span(text, **args)
   end
 
   # NOTE: Specific to glyphicons
@@ -156,6 +162,12 @@ def link_icon(type, **args)
     x: "remove",
     remove: "remove-circle",
     send: "send",
+    log_in: "log-in",
+    log_out: "log-out",
+    admin: "text-background",
+    inbox: "inbox",
+    interests: "bullhorn",
+    settings: "cog",
     ban: "ban-circle",
     plus: "plus-sign",
     minus: "minus-sign",

app/helpers/tabs/projects_helper.rb

@@ -84,9 +84,8 @@ def add_project_banner(project)
     def add_background_image(image)
       return unless image
 
-      presenter = ImagePresenter.new(image, size: :large)
       content_for(:background_image) do
-        image_tag(presenter.img_src, class: "image-title")
+        image_tag(image.large_url, class: "image-title")
       end
     end
   end

app/javascript/controllers/form-exif_controller.js

@@ -13,7 +13,8 @@ const internalConfig = {
 // (formerly "observation_images" section of the form)
 // Connects to data-controller="form-exif"
 export default class extends Controller {
-  static targets = ["carousel", "item", "useExifBtn", "collapseFields"]
+  static targets = ["carousel", "item", "useExifBtn",
+    "collapseFields", "collapseCheck"]
   static outlets = ["autocompleter", "map"]
 
   connect() {
@@ -200,6 +201,7 @@ export default class extends Controller {
   showFields() {
     if (this.hasCollapseFieldsTarget) {
       $(this.collapseFieldsTarget).collapse('show');
+      this.collapseCheckTarget.checked = true
     }
   }
 

app/javascript/controllers/tooltip_controller.js

@@ -0,0 +1,15 @@
+import { Controller } from "@hotwired/stimulus"
+
+// Connects to data-controller="tooltip"
+// BS3 tooltips are "opt-in", so they require on-page activation
+export default class extends Controller {
+
+  connect() {
+    this.element.dataset.stimulus = "tooltip-connected";
+    this.activateTooltips();
+  }
+
+  activateTooltips() {
+    $('[data-toggle="tooltip"]').tooltip()
+  }
+}

app/views/controllers/application/top_nav/_user_nav.html.erb

@@ -1,45 +1,37 @@
+<%
+admin_title = in_admin_mode? ? :app_turn_admin_off.t : :app_turn_admin_on.t
+admin_mode_args = in_admin_mode? ? { turn_off: true } : { turn_on: true }
+%>
+
 <ul class="nav navbar-nav navbar-right hidden-xs mr-0">
   <% if @user.admin %>
     <li>
-      <%= button_to(
-        in_admin_mode? ?
-          admin_mode_path(turn_off: true) : admin_mode_path(turn_on: true),
-        { class: "btn btn-link navbar-btn",
-          id: "user_nav_admin_mode_link",
-          title: in_admin_mode? ? :app_turn_admin_off.t : :app_turn_admin_on.t,
-          data: { toggle: "tooltip", placement: "bottom" } }
-      ) do
-        tag.span("", class: "glyphicon glyphicon-text-background")
-      end %>
+      <%= icon_link_to(
+        admin_title, admin_mode_path(**admin_mode_args),
+        { icon: :admin, id: "user_nav_admin_mode_link", button_to: true,
+          class: "btn btn-link navbar-btn", data: { placement: "bottom" } }
+      ) %>
     </li>
   <% end %>
   <li>
-    <%= link_to(
-          "", comments_path(for_user: @user.id),
-          { class: "glyphicon glyphicon-inbox",
-            id: "user_nav_inbox_link",
-            title: :app_comments_for_you.t,
-            data: { toggle: "tooltip", placement: "bottom" } }
+    <%= icon_link_to(
+          :app_comments_for_you.l, comments_path(for_user: @user.id),
+          { icon: :inbox, id: "user_nav_inbox_link",
+            data: { placement: "bottom" } }
         ) %>
   </li>
   <li>
-    <%= link_to(
-          "",
-          interests_path,
-          { class: "glyphicon glyphicon-bullhorn",
-            id: "user_nav_interests_link",
-            title: :app_your_interests.t,
-            data: { toggle: "tooltip", placement: "bottom" } }
+    <%= icon_link_to(
+          :app_your_interests.l, interests_path,
+          { icon: :interests, id: "user_nav_interests_link",
+            data: { placement: "bottom" } }
         ) %>
   </li>
   <li>
-    <%= link_to(
-          "",
-          edit_account_preferences_path,
-          { class: "glyphicon glyphicon-cog",
-            id: "user_nav_preferences_link",
-            title: :app_preferences.t,
-            data: { toggle: "tooltip", placement: "bottom" } }
+    <%= icon_link_to(
+          :app_preferences.l, edit_account_preferences_path,
+          { icon: :settings, id: "user_nav_preferences_link",
+            data: { placement: "bottom" } }
         ) %>
   </li>
   <li id="user_drop_down" class="dropdown">
@@ -49,38 +41,33 @@
       <span class="caret"></span>
     </a>
     <ul class="dropdown-menu" role="menu">
-      <li><%= link_to(:app_your_observations.t,
+      <li><%= link_to(:app_your_observations.l,
                       observations_path(user: @user.id),
                       { class: "" } ) %></li>
-      <li><%= link_to(:app_your_projects.t,
-                      projects_path(member: @user.id),
+      <li><%= link_to(:app_your_projects.l, projects_path(member: @user.id),
                       { class: "", id: "user_drop_projects_link" }) %></li>
-      <li><%= link_to(:app_your_lists.t,
-                      species_lists_path(by_user: @user.id),
-                      { class: "", id: "user_drop_species_lists_link" } ) %></li>
-      <li><%= link_to(:app_your_interests.t,
-                      interests_path,
+      <li><%= link_to(:app_your_lists.l, species_lists_path(by_user: @user.id),
+                      { class: "",
+                        id: "user_drop_species_lists_link" } ) %></li>
+      <li><%= link_to(:app_your_interests.l, interests_path,
                       { class: "", id: "user_drop_interests_link" }) %></li>
-      <li><%= link_to(:app_your_summary.t,
-                      user_path(@user.id),
+      <li><%= link_to(:app_your_summary.l, user_path(@user.id),
                       { class: "", id: "user_drop_profile_link" }) %></li>
-      <li><%= link_to(:app_preferences.t,
-                      edit_account_preferences_path,
+      <li><%= link_to(:app_preferences.l, edit_account_preferences_path,
                       { class: "", id: "user_drop_preferences_link" }) %></li>
       <li class="divider"></li>
       <li><%= button_to(
-                :app_logout.t,
+                :app_logout.l,
                 account_logout_path,
                 { class: "btn btn-link", id: "user_drop_logout_link" }
               ) %><li>
     </ul>
   </li>
-  <li><%= button_to(
-            account_logout_path,
-            { class: "btn btn-link navbar-btn",
-              id: "user_nav_logout_link",
-              title: :app_logout.t }
-          ) do
-            tag.span("", class: "glyphicon glyphicon-log-out")
-          end %></li>
+  <li>
+    <%= icon_link_to(
+          :app_logout.l, account_logout_path,
+          { icon: :log_out, id: "user_nav_logout_link", button_to: true,
+            class: "btn btn-link navbar-btn", data: { placement: "bottom" } }
+        ) %>
+  </li>
 </ul>

app/views/controllers/layouts/application.html.erb

@@ -14,7 +14,7 @@ body_class = class_names(ctrlr_action, theme, location_format, logged_in)
   <%= render(partial: "application/app/head") %>
 </head>
 
-<body class="<%= body_class %>" data-controller="lazyload">
+<body class="<%= body_class %>" data-controller="lazyload tooltip">
   <% if Rails.env == "production" %>
     <%= render(partial: "application/app/gtm_iframe") %>
   <% end %>

app/views/controllers/observations/_form.html.erb

@@ -77,7 +77,7 @@ form_element_data = {
     id: "observation_naming_specimen", # @given_name.present?
     collapse: "observation_naming_specimen_inner", open: create
   ) do
-    tag.div(class: "row mt-3") do
+    tag.div(class: "row") do
       concat(tag.div(class: "col-xs-12 col-md-6") do
         render(partial: "observations/namings/fields", locals: naming_locals)
       end) if create

app/views/controllers/observations/form/_details.html.erb

@@ -12,7 +12,7 @@ t_s = {
 
 <%= tag.div(class: "panel-body border-top", id: "observation_details") do %>
 
-  <%= tag.div(class: "row mt-3") do %>
+  <%= tag.div(class: "row") do %>
     <%= tag.div(class: "col-xs-12 col-md-6") do %>
       <!-- WHEN -->
       <%= date_select_with_label(
@@ -72,7 +72,8 @@ t_s = {
           form: f, field: :has_geolocation, # field is ignored
           label: "#{:GEOLOCATION.l}:",
           help: :form_observations_lat_long_help.t,
-          data: { toggle: "collapse", target: "#observation_geolocation" },
+          data: { toggle: "collapse", target: "#observation_geolocation",
+                  form_exif_target: "collapseCheck" },
           aria: { controls: "observation_geolocation",
                   expanded: @observation.lat }
         ) %>

app/views/controllers/observations/form/_projects.html.erb

@@ -50,15 +50,7 @@ end
       ) %>
     <% end %>
 
-    <%= tag.div do
-      [
-        tag.strong("#{:PROJECTS.l}:", class: "mr-3"),
-        collapse_info_trigger("project_help"),
-        collapse_help_block(nil, id: "project_help") do
-          :form_observations_project_help.t
-        end
-      ].safe_join
-    end %>
+    <%= tag.p(:form_observations_project_help.t) %>
 
     <%= tag.div(class: "overflow-scroll-checklist") do %>
       <% @projects.each do |project| %>

app/views/controllers/observations/form/_species_lists.html.erb

@@ -3,15 +3,7 @@
 <%# tag.div(id: "observation_lists") do %>
   <%= fields_for(:list) do |f_l| %>
 
-    <%= tag.div do
-      [
-        tag.strong("#{:SPECIES_LISTS.l}:", class: "mr-3"),
-        collapse_info_trigger("species_lists_help"),
-        collapse_help_block(nil, id: "species_lists_help") do
-          :form_observations_list_help.t
-        end
-      ].safe_join
-    end %>
+    <%= tag.p(:form_observations_list_help.t) %>
 
     <%= tag.div(class: "overflow-scroll-checklist") do %>
       <% @lists.each do |list| %>

app/views/controllers/observations/form/_specimen_section.html.erb

@@ -5,9 +5,9 @@ herbarium_record. Fields hidden unless box checked. %>
 
 <%= tag.div(id: "observation_specimen_section") do %>
 
-  <%= tag.div(class: "mt-3") do %>
+  <%= tag.div do %>
     <%= check_box_with_label(
-      form: f, field: :specimen,
+      form: f, field: :specimen, class: "mt-0",
       label: :form_observations_specimen_available.t,
       help: :form_observations_specimen_available_help.t,
       data: { toggle: "collapse", target: "#specimen_fields" },

app/views/controllers/shared/_notes_fields.html.erb

@@ -25,7 +25,7 @@ end
 indent = form.object_name == "observation" ? "" : "ml-5"
 %>
 <!-- NOTES -->
-<%= tag.div(id: "#{form.object_name}_notes") do %>
+<%= tag.div(id: "#{form.object_name}_notes_fields") do %>
   <%= general_help %>
   <%= tag.div(class: indent) do %>
     <%= form.fields_for(:notes) do |f_n| %>