Merge pull request #6454 from OCHA-DAP/dev

dev into prod

ckanext-hdx_theme/ckanext/hdx_theme/fanstatic/landing_pages/hdx_hapi.js

@@ -0,0 +1,27 @@
+$(document).ready(function () {
+  var IFRAME_ID = 'hapi-availability-iframe';
+  var IFRAME_MIN_HEIGHT = 866;
+  var $iframe = $('#' + IFRAME_ID);
+
+  $iframe.on('load', function () {
+    delayExecution(3000).then(function () {
+      adjustIframeHeight($iframe);
+    });
+  });
+
+  function delayExecution(milliseconds) {
+    return $.Deferred(function (defer) {
+      setTimeout(function () {
+        defer.resolve();
+      }, milliseconds);
+    }).promise();
+  }
+
+  function adjustIframeHeight($iframe) {
+    var frameDocument = $iframe[0].contentWindow.document;
+    var bodyHeight = $(frameDocument).find('body').outerHeight() + 50 || 0;
+    if (bodyHeight >= IFRAME_MIN_HEIGHT) {
+      $iframe.attr('height', bodyHeight);
+    }
+  }
+});

ckanext-hdx_theme/ckanext/hdx_theme/fanstatic/webassets.yml

@@ -215,6 +215,12 @@ hdx-signals-scripts:
     - bs_tooltip.js
     - landing_pages/hdx_signals.js
 
+hdx-hapi-scripts:
+  <<: *common-js
+  output: ckanext-hdx_theme/%(version)s_hdx-hapi-scripts.js
+  contents:
+    - landing_pages/hdx_hapi.js
+
 hdx-signals-styles:
   output: ckanext-hdx_theme/%(version)s_hdx-signals-styles.css
   <<: *common-css

ckanext-hdx_theme/ckanext/hdx_theme/helpers/ui_constants/landing_pages/hapi.py

@@ -2,10 +2,6 @@
     'HERO_SECTION_TITLE': '''The HDX Humanitarian API (HAPI) is a way to access standardised indicators from multiple sources to automate workflows and visualisations''',
     'HERO_SECTION_DESCRIPTION': '''HDX HAPI is in beta phase, and we are seeking feedback. To share your thoughts or join our slack channel, send an email to <a href="{0}" title="Contact us">[email protected]</a>.''',
 
-    'DATA_COVERAGE_SECTION_TITLE': '''Data Coverage''',
-    'DATA_COVERAGE_SECTION_DESCRIPTION': '''Our initial coverage aligns with the data included in the <a href="{0}" target="_blank" data-module="hdx_click_stopper" data-module-link_type="hapi data coverage description" title="HDX Data Grids">HDX Data Grids</a>, which places the most important crisis data into six categories and 20 sub-categories. Our beta version of HDX HAPI covers 51 indicators across 25 locations that have a <a href="{1}" target="_blank" title="Humanitarian Response Plan" data-module="hdx_click_stopper" data-module-link_type="hapi data coverage description">Humanitarian Response Plan</a>. This data has been shared by ten different contributing organisations.''',
-    'DATA_COVERAGE_SECTION_PARAGRAPH': '''Refer to the <a href="{0}" target="_blank" data-module="hdx_click_stopper" data-module-link_type="hapi data coverage description" title="HAPI - The Humanitarian API">documentation</a> for the latest coverage. <a href="{1}" data-module="hdx_click_stopper" data-module-link_type="hapi data coverage description" title="Contact us">Contact us</a> to request additional indicators in future versions of HDX HAPI.''',
-
     'BE_INSPIRED_SECTION_TITLE': '''Be Inspired''',
     'BE_INSPIRED_SECTION_DESCRIPTION': '''Take a look at visualisations and code examples''',
 
@@ -110,7 +106,7 @@
 ]
 
 SECTIONS_CONSTANTS = [
-    {'name': 'Data Coverage', 'url': '#data-coverage'},
+    {'name': 'Data Availability', 'url': '#data-availability'},
     {'name': 'Be Inspired', 'url': '#be-inspired'},
     {'name': 'FAQ', 'url': '#faq'},
     {'name': 'Read the documentation', 'url': 'https://hdx-hapi.readthedocs.io/'},

ckanext-hdx_theme/ckanext/hdx_theme/templates/landing_pages/hapi.html

@@ -1,5 +1,10 @@
 {% extends "landing_pages/page.html" %}
 
+{% block scripts %}
+  {{ super() }}
+  {% asset 'hdx_theme/hdx-hapi-scripts' %}
+{% endblock %}
+
 {% set CONST = h.HDX_CONST('UI_CONSTANTS')['LANDING_PAGES']['HAPI_LANDING_PAGE'] %}
 
 {% block subtitle %}{{ _('HDX HAPI Beta') }}{% endblock %}
@@ -13,60 +18,17 @@
 
   <div class="container">
 
-    <div class="row" id="data-coverage">
+    <div class="row" id="data-availability">
       <div class="col-12 mx-auto my-3">
-        <div class="text-center mb-4">
-          {{ h.snippet('bem.blocks/heading.html', title=CONST.DATA_COVERAGE_SECTION_TITLE, heading_type=3, spacing_class="mb-1") }}
-          {{ h.snippet('bem.blocks/paragraph.html', text=CONST.DATA_COVERAGE_SECTION_DESCRIPTION.format('https://data.humdata.org/dashboards/overview-of-data-grids', 'https://humanitarianaction.info/document/global-humanitarian-overview-2024/article/response-plans-overview-2024'), paragraph_classes=["paragraph__text_font-size-medium", "mt-4"]) }}
-        </div>
         <div class="row">
-          <div class="col-12 col-lg-10 mx-auto">
-            <div class="bem-table bem-table_state_bordered">
-              <div class="bem-table__thead d-none d-md-block">
-                <div class="bem-table__row mb-3 mb-md-0">
-                  <div class="row g-0">
-                    <div class="col-12 col-md-3">
-                      <div class="bem-table__cell p-0 p-md-3">Category</div>
-                    </div>
-                    <div class="col-12 col-md-3">
-                      <div class="bem-table__cell p-0 p-md-3">Sub-category</div>
-                    </div>
-                    <div class="col-12 col-md-3">
-                      <div class="bem-table__cell p-0 p-md-3">Contributor</div>
-                    </div>
-                    <div class="col-12 col-md-3">
-                      <div class="bem-table__cell p-0 p-md-3"></div>
-                    </div>
-                  </div>
-                </div>
-              </div>
-              <div class="bem-table__tbody">
-                {% for entry in data_coverage %}
-                  <div class="bem-table__row mb-3 mb-md-0">
-                    <div class="row g-0">
-                      <div class="col-12 col-md-3">
-                        <div class="bem-table__cell p-0 p-md-3">{{ entry.category }}</div>
-                      </div>
-                      <div class="col-12 col-md-3">
-                        <div class="bem-table__cell p-0 p-md-3">{{ entry.subcategory }}</div>
-                      </div>
-                      <div class="col-12 col-md-3">
-                        <div class="bem-table__cell p-0 p-md-3">{{ entry.contributor }}</div>
-                      </div>
-                      <div class="col-12 col-md-3">
-                        <div class="bem-table__cell p-0 p-md-3">
-                          <a href="{{ entry.link }}" target="_blank" data-module="hdx_click_stopper"
-                             data-module-link_type="hapi data coverage" data-module-label="{{ entry.subcategory }}">Learn
-                            more <i class="fa-solid fa-arrow-right ms-2"></i></a>
-                        </div>
-                      </div>
-                    </div>
-                  </div>
-                {% endfor %}
-              </div>
-            </div>
-            <div class="mt-4">
-              {{ h.snippet('bem.blocks/paragraph.html', text=CONST.DATA_COVERAGE_SECTION_PARAGRAPH.format('https://hdx-hapi.readthedocs.io/en/latest/', 'mailto:[email protected]'), paragraph_classes=["paragraph__text_font-size-medium"]) }}
+          <div class="col-12">
+            <div class="row">
+              <iframe
+                class="col-12"
+                height="866"
+                id="hapi-availability-iframe"
+                src="/visualization/hapi-availability/"
+              ></iframe>
             </div>
           </div>
         </div>

ckanext-hdx_theme/ckanext/hdx_theme/version.py

@@ -1 +1 @@
-hdx_version = 'v1.83.8'
+hdx_version = 'v1.83.9'