Feature: Add portals configuration tooltip in homepage

Gemfile.lock

@@ -1,6 +1,6 @@
 GIT
   remote: https://github.com/ontoportal-lirmm/ontologies_api_ruby_client.git
-  revision: 15ad7d41d9a414ed3570c073c2b75a3fb4cc19cf
+  revision: 670ce6adfe77aeda97974414ab0ed4b6c5dc9469
   branch: development
   specs:
     ontologies_api_client (2.2.0)
@@ -302,7 +302,7 @@ GEM
       time
     net-http (0.3.2)
       uri
-    net-imap (0.4.16)
+    net-imap (0.4.15)
       date
       net-protocol
     net-pop (0.1.2)
@@ -458,7 +458,7 @@ GEM
       rubocop-ast (>= 1.32.2, < 2.0)
       ruby-progressbar (~> 1.7)
       unicode-display_width (>= 2.4.0, < 3.0)
-    rubocop-ast (1.32.3)
+    rubocop-ast (1.32.2)
       parser (>= 3.3.1.0)
     ruby-progressbar (1.13.0)
     ruby2_keywords (0.0.5)

app/assets/stylesheets/application.css.scss.erb

@@ -58,6 +58,7 @@
 @import "agent_tooltip";
 @import "content_finder";
 @import "tools";
+@import "portal_configuration";
 @import "taxonomy";
 
 /* Bootstrap and Font Awesome */

app/assets/stylesheets/portal_configuration.scss

@@ -0,0 +1,68 @@
+
+.portal-configuration{
+  padding: 10px;
+  .portal-configuration-title{
+    h3{
+      font-size: 20px;
+      font-weight: 600;
+      margin-bottom: 0;
+    }
+    span{
+      font-size: 16px;
+    }
+  }
+
+  h4, .home-section-title .text{
+    font-size: 15px !important;
+  }
+
+  p {
+    font-size: 14px;
+  }
+  .home-support-items div {
+    font-size: 12px;
+  }
+  .home-support-items a img {
+    height: 48px;
+    width: 48px;
+  }
+  .home-logo-instances-small{
+    padding: 7px;
+    margin: 2px 5px !important;
+    border-radius: 50%;
+    display: inline-block;
+    width: 38px;
+    height: 38px;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+  }
+  .portal-config-ontologies{
+    display: flex;
+    align-items: center;
+    margin-top: 2px;
+  }
+  .portal-config-ontologies svg{
+    width: 14px;
+    height: 14px;
+    margin-right: 4px;
+  }
+  .portal-config-ontologies svg path{
+    fill: var(--primary-color);
+  }
+  .portal-description{
+    font-size: 15px;
+    padding: 11px 0;
+  }
+  .portal-config-federated-with{
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+    align-items: center;
+    margin-right: 15px;
+  }
+  .portal-config-title-text{
+    font-weight: 500;
+    font-size: 15px !important;
+  }
+}

app/controllers/home_controller.rb

@@ -51,6 +51,15 @@ def set_cookies
     render 'cookies', layout: nil
   end
 
+  def portal_config
+    @config = $PORTALS_INSTANCES.select { |x| x[:name].downcase.eql?((params[:portal] || helpers.portal_name).downcase) }.first
+    if @config && @config[:api]
+      @portal_config = LinkedData::Client::Models::Ontology.top_level_links(@config[:api]).to_h
+    else
+      @portal_config = {}
+    end
+  end
+
   def tools
     @tools = {
       search: {

app/helpers/home_helper.rb

@@ -22,6 +22,13 @@ def format_number_abbreviated(number)
     end
   end
 
+  def portal_config_tooltip(portal_name, &block)
+    title = render TurboFrameComponent.new(id: "portal_config_tooltip_#{portal_name&.downcase}", src: "/config?portal=#{portal_name&.downcase}", style: "width: 600px !important; max-height: 300px; overflow: scroll")
+    render Display::InfoTooltipComponent.new(text: title, interactive: true) do
+      capture(&block)
+    end
+  end
+
   def discover_ontologies_button
     render Buttons::RegularButtonComponent.new(id: 'discover-ontologies-button', value: t('home.discover_ontologies_button'), variant: "secondary", state: "regular", href: "/ontologies") do |btn|
       btn.icon_right do

app/views/home/index.html.haml

@@ -22,17 +22,17 @@
     .home-bubble.home-bubble-one
       %a.h5{href:"/ontologies/#{@anal_ont_names[0]}", style: "color: white !important"}
         = @anal_ont_names[0]
-      %p 
+      %p
         = @anal_ont_numbers[0].to_s + " " + t('visits.visits')
     .home-bubble.home-bubble-two
       %a.h5{href:"/ontologies/#{@anal_ont_names[1]}", style: "color: white !important"}
         = @anal_ont_names[1]
-      %p 
+      %p
         = @anal_ont_numbers[1].to_s + " " + t('visits.visits')
     .home-bubble.home-bubble-three
       %a.h5{href:"/ontologies/#{@anal_ont_names[2]}", style: "color: white !important"}
         = @anal_ont_names[2]
-      %p 
+      %p
         = @anal_ont_numbers[2].to_s + " " + t('visits.visits')
     %a.home-bubble.home-bubble-four{:href => "/visits"}
       .h5 ...
@@ -44,7 +44,7 @@
       %p
         = t('home.index.tagline')
       = ontologies_content_autocomplete
- 
+
 .home-body-container
   .home-section
     %h4= t('home.ontology_upload')
@@ -115,13 +115,13 @@
             %a{:href => "/landscape#fairness_assessment"}
               %div.home-fair-details
                 %p= t('home.fair_details')
-         
+
       .home-sub-section-right
         %h4= t('home.twitter_news')
         %hr.home-section-line
         .home-card.home-twitter-news
           %a.twitter-timeline{"data-height" => "360", :href => "https://twitter.com/lagroportal?ref_src=twsrc%5Etfw"}
-            .home-twitter-loader 
+            .home-twitter-loader
               = render LoaderComponent.new(type: 'pulsing')
           %script{:async => "", :charset => "utf-8", :src => "https://platform.twitter.com/widgets.js"}
 
@@ -182,7 +182,7 @@
         .text
           = "#{portal_name} slices"
         %hr.home-section-line/
-      .home-section-description 
+      .home-section-description
         .div
           = t('home.slices_description')
       .home-slices-container
@@ -194,8 +194,8 @@
                 .home-slice-ontologies
                   = slice.ontologies.length
                 = inline_svg 'icons/slices.svg', width: "70", height: "70"
-              
-              .home-slice-name 
+
+              .home-slice-name
                 = "#{slice.name} (#{slice.acronym})"
         = render Buttons::RegularButtonComponent.new(id:'regular-button', value: t('home.suggest_slice'), variant: "secondary", state: "regular", href: '/feedback') do |btn|
           - btn.icon_right do
@@ -208,17 +208,18 @@
           = t('home.ontoportal_instances')
         %hr.home-section-line/
 
-      .home-section-description 
+      .home-section-description
         .div
           = home_ontoportal_description
       .home-support-items
         - $PORTALS_INSTANCES&.each do |portal|
-          %div.text-center
-            = link_to portal[:ui], target: '_blank', class: 'home-logo-instances', style: "background-color: #{portal[:color]}" do
-              = inline_svg 'logo-white.svg', width: "35", height: "26"
-            %p{style: "color: #{portal[:color]}"} 
-              = portal[:name]
-
+          = portal_config_tooltip(portal[:name]) do
+            %div.text-center
+              = link_to portal[:ui], target: '_blank', class: 'home-logo-instances', style: "background-color: #{portal[:color]}" do
+                = inline_svg('logo-white.svg', width: "35", height: "26")
+              %p{style: "color: #{portal[:color]}"}
+                = portal[:name]
+
   .home-section
     .home-section-title
       .text

app/views/home/portal_config.html.haml

@@ -0,0 +1,42 @@
+= turbo_frame_tag "portal_config_tooltip_#{params[:portal]}" do
+  .portal-configuration
+    .home-section-description.mb-1
+      .div.d-flex.align-items-center
+        %div
+          %div.text-center
+            = link_to @portal_config[:ui] || @config[:ui], target: '_blank', class: 'home-logo-instances mr-1 m-0', style: "background-color: #{@portal_config[:color] || @config[:color]}" do
+              = inline_svg 'logo-white.svg', width: "35", height: "26"
+        %div
+          %div.portal-configuration-title{style: "color: #{@portal_config[:color] || @config[:color]}"}
+            %h3
+              = @portal_config[:title] || @config[:name]
+            - if  @portal_config[:numberOfArtefacts]
+              .portal-config-ontologies
+                = inline_svg_tag 'icons/ontology.svg'
+                %span
+                  = "#{@portal_config[:numberOfArtefacts]} ontologies"
+    - if @portal_config[:description]
+      .portal-description
+        = @portal_config[:description]
+    - if @portal_config[:federated_portals]
+      %div.mb-1
+        .home-section-title
+          .text
+            Federated with
+        .d-flex.flex-wrap.my-1
+          - @portal_config[:federated_portals].to_h.values.compact.each do |portal|
+            .portal-config-federated-with
+              = link_to portal[:ui], target: '_blank', class: 'home-logo-instances-small', style: "background-color: #{portal[:color]};" do
+                = inline_svg 'logo-white.svg', width: "18", height: "13"
+              %p{style: "color: #{portal[:color]}"}
+                = portal[:name]
+
+    - if @portal_config[:fundedBy]
+      %div.mb-1
+        .home-section-title
+          .portal-config-title-text
+            = t('home.support_and_collaborations')
+        .home-support-items.d-flex.flex-wrap.my-1
+          - @portal_config[:fundedBy]&.each do |logo|
+            %a.mx-2.my-1{href:logo[:url], target: "_blanc"}
+              %img{src: asset_path(logo[:img_src]),  width: "18", height: "13"}

config/routes.rb

@@ -8,6 +8,7 @@
   get 'auth/:provider/callback', to: 'login#create_omniauth'
   get 'locale/:language', to: 'language#set_locale_language'
   get 'metadata_export/index'
+  get '/config', to: 'home#portal_config'
 
   get '/notes/new_comment', to: 'notes#new_comment'
   get '/notes/new_proposal', to: 'notes#new_proposal'