ubilabs · pmast · Aug 31, 2020 · Aug 27, 2020 · Aug 27, 2020 · Aug 27, 2020
diff --git a/data/layers-config.json b/data/layers-config.json
@@ -24,7 +24,8 @@
     "basemap": "ocean",
     "timeFormat": {
       "year": "numeric",
-      "month": "long"
+      "month": "long",
+      "day": "numeric"
     },
     "flyTo": {
       "position": {
@@ -226,7 +227,8 @@
     "basemap": "blue",
     "timeFormat": {
       "year": "numeric",
-      "month": "long"
+      "month": "long",
+      "day": "numeric"
     },
     "flyTo": {
       "position": {
@@ -246,7 +248,8 @@
     "basemap": "blue",
     "timeFormat": {
       "year": "numeric",
-      "month": "long"
+      "month": "long",
+      "day": "numeric"
     },
     "flyTo": {
       "position": {

diff --git a/i18n/en.json b/i18n/en.json
@@ -40,7 +40,7 @@
   "dataInfo": "Data Information",
   "storiesSelected": "{numberSelected, number} {numberSelected, plural, one {Story} other {Stories}} selected",
   "resetFilters": "Reset Filters",
-  "projectDescription": "# About the project\n\nClimate from Space application for ESAs CCI program.\n\nLorem ipsum dolor, sit amet consectetur adipisicing elit. Reiciendis natus praesentium reprehenderit veritatis mollitia quisquam distinctio nihil voluptate rerum ut placeat sint tenetur, tempora facere, velit in sed. Ex, sapiente.",
+  "projectDescription": "# About the project\n\nThe European Space Agency (ESA) [Climate Change Initiative (CCI)](https://climate.esa.int/) programme aims to provide stable, long-term, satellite-based Essential Climate Variable (ECV) data products to the scientific community and general public. Based on Earth Observation (EO) archives that ESA together with its member states have established over the last 30 years, the CCI programme adds significant and timely contributions to the ECV databases required by United Nations Framework Convention on Climate Change ([UNFCCC](https://unfccc.int/)).\n\nESA's Climate Change initiative is organised in different themes:\n- Development of Essential Climate Variables\n- Cross-ECV scientific exploitation of the data products\n- Knowledge Exchange\n\nThe objective for Knowledge Exchange activities within CCI is to maximise awareness, access, use\nand understanding of satellite data for climate research with an emphasis on promoting the CCI\nProgramme as a whole.\n\nThe role of the Climate from Space application (this application) within those objectives is to increase the visibility of the CCI programme and the role of ESA satellite data in climate science. It addresses a general public and educational audience as well as representing ESA climate office at exhibition environments.",
   "tags.nature": "Nature",
   "tags.biomass": "Biomass",
   "tags.university": "University",

diff --git a/scripts/md-converter.html b/scripts/md-converter.html
@@ -0,0 +1,37 @@
+<html>
+    <head>
+        <title>Mark Down Converter</title>
+        <style>
+            input, textarea {
+                width: 80%;
+            }
+        </style>
+    </head>
+    <body>
+        <h1>Prepare Mark Down for config files by stringifying multiline content</h1>
+        Markdown:<br>
+        <textarea id="rawInput" cols="100" rows="30"></textarea><br>
+        <br>
+        Stringified:<br>
+        <input id="processedContent"/><br>
+        (Clicking or giving focus will copy into clipboard.)
+        <script>
+            document.getElementById('rawInput').value = '# Hello\nworld!';
+            document.getElementById('rawInput').focus();
+            document.getElementById('rawInput').select();
+
+            function copyToClipboard(){
+                document.getElementById('processedContent').select();
+                document.execCommand('copy');
+                console.log('copied!');
+            }
+
+            document.getElementById('rawInput').addEventListener('keyup', ()=> {
+                const rawContent = document.getElementById('rawInput').value;
+                document.getElementById('processedContent').value = JSON.stringify(rawContent).slice(1, -1).trim();
+            });
+            document.getElementById('processedContent').addEventListener('click', copyToClipboard);
+            document.getElementById('processedContent').addEventListener('focus', copyToClipboard);
+        </script>
+    </body>
+</html>
diff --git a/src/scripts/components/layers/layer-info/layer-info.tsx b/src/scripts/components/layers/layer-info/layer-info.tsx
@@ -1,5 +1,5 @@
 import React, {FunctionComponent} from 'react';
-import ReactMarkdown from 'react-markdown';
+import ReactMarkdown from 'react-markdown/with-html';
 
 import {LayerListItem} from '../../../types/layer-list';
 
@@ -17,6 +17,7 @@ const LayerInfo: FunctionComponent<Props> = ({layer}) => (
       <ReactMarkdown
         source={layer.description}
         linkTarget="_blank"
+        escapeHtml={false}
         allowedTypes={[
           'heading',
           'text',
@@ -26,7 +27,8 @@ const LayerInfo: FunctionComponent<Props> = ({layer}) => (
           'emphasis',
           'list',
           'listItem',
-          'link'
+          'link',
+          'html'
         ]}
       />
     </div>

diff --git a/src/scripts/components/main/about-project/about-project.styl b/src/scripts/components/main/about-project/about-project.styl
@@ -12,3 +12,7 @@
     display: flex
     justify-content: space-between
     color: $textDefault
+
+  a
+    color: $textColor
+    text-decoration: none
diff --git a/src/scripts/components/main/about-project/about-project.tsx b/src/scripts/components/main/about-project/about-project.tsx
@@ -22,7 +22,8 @@ const AboutProject: FunctionComponent = () => {
           'image',
           'imageReference',
           'list',
-          'listItem'
+          'listItem',
+          'link'
         ]}
       />
     </div>

diff --git a/storage/layers/layers-en.json b/storage/layers/layers-en.json
@@ -20,7 +20,7 @@
     "type": "Layertype",
     "name": "Sea Surface Temperature",
     "shortName": "Sea Surface Temperature",
-    "description": "**Variable Shown:** Analysed Sea Surface Temperature in Kelvin  \n**Time Span:** 1981-08 – 2016-12  \n**Temporal resolution:** monthly  \n**Geographic Extent:** global  \n**Spatial Resolution:** 0.05 degrees  \n**Version:** 2.1  \n\n[ESA CCI Sea Surface Temperature ECV Project website](http://www.esa-sst-cci.org/)  \n[Data in the Open Data Portal](https://catalogue.ceda.ac.uk/uuid/62c0f97b1eac4e0197a674870afe1ee6)",
+    "description": "Sea surface temperature is the temperature the ocean surface presents to the atmosphere and influences weather and climate around the globe. The wind, warmth and water content of the atmosphere are all strongly determined by the distribution of sea surface temperature as the ocean interacts with the air above it. As well as the cycle of warming and cooling with the seasons, ocean currents and circulations can be seen, and even on occasion the cooling effect of passing hurricanes.\n\nThis CCI record covers 1981 to recent years, exploiting four trillion observations from many satellites, all brought together to make a valuable detailed picture of how this influential climate variable has evolved over almost 40 years.\n\n**Variable Shown:** Analysed Sea Surface Temperature in kelvin  \n**Time Span:** September 1981 – December 2016  \n**Temporal Resolution (Dataset):** daily (visualisation is monthly)  \n**Geographic Extent:** global  \n**Spatial Resolution:** 0.05 degrees  \n**Version:** 2.1  \n**DOI:** [10.5285/62c0f97b1eac4e0197a674870afe1ee6](http://dx.doi.org/10.5285/62c0f97b1eac4e0197a674870afe1ee6)  \n\n[ESA CCI Sea Surface Temperature ECV Project website](http://www.esa-sst-cci.org/)  \n[Data in the Open Data Portal](https://catalogue.ceda.ac.uk/uuid/62c0f97b1eac4e0197a674870afe1ee6)",
     "link": "http://..."
   },
   {
@@ -66,7 +66,7 @@
   {
     "id": "sea_state.swh_mean",
     "type": "Layertype",
-    "name": "Sea State",
+    "name": "Sea State – Mean Significant Wave Height",
     "shortName": "Sea State",
     "description": "Sea states are relevant for all activities at sea and on the coast, and their climatology is the main driver for the design and maintenance of marine structures. Sea states also modify air-sea exchanges of heat and momentum, and contribute to coastal sea level and sea ice properties. The Sea State CCI is processing altimeter and Synthetic Aperture Radar data from 2002 onward in order to consistently calibrate and validate these datasets and investigate the variability of sea states in our changing climate. One of the most noticeable change occurs in the Arctic region, where receding sea ice gives more open water over which wind generates waves. Extreme sea states also have a profound impact on the coasts, as they may increase substantially the water level and cause flooding in low lying lands, or severely erode sandy beaches.\n\n**Variable Shown:** Mean of Median Significant Wave Height Values in Meters  \n**Time Span:** 1991-07 – 2018-12  \n**Temporal resolution:** monthly  \n**Geographic Extent:** global  \n**Spatial Resolution:** 1 degree\n**Version:** 1.1  \n\n[ESA CCI Sea State ECV Project website](http://cci.esa.int/seastate)  \n[Data in the Open Data Portal](https://catalogue.ceda.ac.uk/uuid/47140d618dcc40309e1edbca7e773478)",
     "link": "http://..."
@@ -108,7 +108,7 @@
     "type": "Layertype",
     "name": "Land Cover",
     "shortName": "Land Cover",
-    "description": "**Variable Shown:** Land cover class defined in LCCS  \n**Time Span:** 1992-01 – 2015-12  \n**Temporal resolution:** yearly  \n**Geographic Extent:** global\n**Spatial Resolution:** 300m \n**Version:** 2.0.7  \n\n[ESA CCI Landcover ECV Project website](https://www.esa-landcover-cci.org/)  \n[Data in the Open Data Portal](https://catalogue.ceda.ac.uk/uuid/b382ebe6679d44b8b0e68ea4ef4b701c)",
+    "description": "**Variable Shown:** Land cover class defined in LCCS  \n**Time Span:** 1992-01 – 2015-12  \n**Temporal resolution:** yearly  \n**Geographic Extent:** global  \n**Spatial Resolution:** 300m  \n**Version:** 2.0.7  \n\n[ESA CCI Landcover ECV Project website](https://www.esa-landcover-cci.org/)  \n[Data in the Open Data Portal](https://catalogue.ceda.ac.uk/uuid/b382ebe6679d44b8b0e68ea4ef4b701c)\n\n**Detailed Legend:**  \n<style>\n    .dot {\n        height: 10px;\n        width: 10px;\n        border-radius: 50%;\n        display: inline-block;\n        margin-right: 5px;\n        vertical-align: middle;\n    }\n</style>\n<div class=\"dot\" style=\"background: rgb(0, 0, 0);\"></div>No data<br>\n<div class=\"dot\" style=\"background: rgb(255, 255, 100);\"></div>Cropland, rainfed<br>\n<div class=\"dot\" style=\"background: rgb(255, 255, 100);\"></div>Herbaceous cover<br>\n<div class=\"dot\" style=\"background: rgb(255, 255, 0);\"></div>Tree or shrub cover<br>\n<div class=\"dot\" style=\"background: rgb(170, 240, 240);\"></div>Cropland, irrigated or post-flooding<br>\n<div class=\"dot\" style=\"background: rgb(220, 240, 100);\"></div>Mosaic cropland (&gt;50%) / natural vegetation (tree, shrub, herbaceous cover) (&lt;50%)<br>\n<div class=\"dot\" style=\"background: rgb(200, 200, 100);\"></div>Mosaic natural vegetation (tree, shrub, herbaceous cover) (&gt;50%) / cropland (&lt;50%) <br>\n<div class=\"dot\" style=\"background: rgb(0, 100, 0);\"></div>Tree cover, broadleaved, evergreen, closed to open (&gt;15%)<br>\n<div class=\"dot\" style=\"background: rgb(0, 160, 0);\"></div>Tree cover, broadleaved, deciduous, closed to open (&gt;15%)<br>\n<div class=\"dot\" style=\"background: rgb(0, 160, 0);\"></div>Tree cover, broadleaved, deciduous, closed (&gt;40%)<br>\n<div class=\"dot\" style=\"background: rgb(170, 200, 0);\"></div>Tree cover, broadleaved, deciduous, open (15-40%)<br>\n<div class=\"dot\" style=\"background: rgb(0, 60, 0);\"></div>Tree cover, needleleaved, evergreen, closed to open (&gt;15%)<br>\n<div class=\"dot\" style=\"background: rgb(0, 60, 0);\"></div>Tree cover, needleleaved, evergreen, closed (&gt;40%)<br>\n<div class=\"dot\" style=\"background: rgb(0, 80, 0);\"></div>Tree cover, needleleaved, evergreen, open (15-40%)<br>\n<div class=\"dot\" style=\"background: rgb(40, 80, 0);\"></div>Tree cover, needleleaved, deciduous, closed to open (&gt;15%)<br>\n<div class=\"dot\" style=\"background: rgb(40, 80, 0);\"></div>Tree cover, needleleaved, deciduous, closed (&gt;40%)<br>\n<div class=\"dot\" style=\"background: rgb(40, 100, 0);\"></div>Tree cover, needleleaved, deciduous, open (15-40%)<br>\n<div class=\"dot\" style=\"background: rgb(120, 130, 0);\"></div>Tree cover, mixed leaf type (broadleaved and needleleaved)<br>\n<div class=\"dot\" style=\"background: rgb(140, 160, 0);\"></div>Mosaic tree and shrub (&gt;50%) / herbaceous cover (&lt;50%)<br>\n<div class=\"dot\" style=\"background: rgb(190, 150, 0);\"></div>Mosaic herbaceous cover (&gt;50%) / tree and shrub (&lt;50%)<br>\n<div class=\"dot\" style=\"background: rgb(150, 100, 0);\"></div>Shrubland<br>\n<div class=\"dot\" style=\"background: rgb(120, 75, 0);\"></div>Shrubland evergreen<br>\n<div class=\"dot\" style=\"background: rgb(150, 100, 0);\"></div>Shrubland deciduous<br>\n<div class=\"dot\" style=\"background: rgb(255, 180, 50);\"></div>Grassland<br>\n<div class=\"dot\" style=\"background: rgb(255, 220, 210);\"></div>Lichens and mosses<br>\n<div class=\"dot\" style=\"background: rgb(255, 235, 175);\"></div>Sparse vegetation (tree, shrub, herbaceous cover) (&lt;15%)<br>\n<div class=\"dot\" style=\"background: rgb(255, 200, 100);\"></div>Sparse tree (&lt;15%)<br>\n<div class=\"dot\" style=\"background: rgb(255, 210, 120);\"></div>Sparse shrub (&lt;15%)<br>\n<div class=\"dot\" style=\"background: rgb(255, 235, 175);\"></div>Sparse herbaceous cover (&lt;15%)<br>\n<div class=\"dot\" style=\"background: rgb(0, 120, 90);\"></div>Tree cover, flooded, fresh or brakish water<br>\n<div class=\"dot\" style=\"background: rgb(0, 150, 120);\"></div>Tree cover, flooded, saline water<br>\n<div class=\"dot\" style=\"background: rgb(0, 220, 130);\"></div>Shrub or herbaceous cover, flooded, fresh/saline/brakish water<br>\n<div class=\"dot\" style=\"background: rgb(195, 20, 0);\"></div>Urban areas<br>\n<div class=\"dot\" style=\"background: rgb(255, 245, 215);\"></div>Bare areas<br>\n<div class=\"dot\" style=\"background: rgb(220, 220, 220);\"></div>Consolidated bare areas<br>\n<div class=\"dot\" style=\"background: rgb(255, 245, 215);\"></div>Unconsolidated bare areas<br>\n<div class=\"dot\" style=\"background: rgb(0, 70, 200);\"></div>Water bodies<br>\n<div class=\"dot\" style=\"background: rgb(255, 255, 255);\"></div>Permanent snow and ice<br>\n",
     "link": "http://..."
   },
   {
@@ -132,7 +132,7 @@
     "type": "Layertype",
     "name": "Above Ground Biomass",
     "shortName": "Biomass",
-    "description": "Biomass is the weight of living material in vegetation, which for forests is mainly contained in the\nwoody parts of the trees. Only above-ground biomass (AGB) can be measured from space (and in\npractice also for most on-ground measurements). Quantitative information on forest AGB is crucial\nfor understanding climate change, since loss of AGB caused by deforestation and forest degradation\nis second only to fossil fuel burning as a source of greenhouse gases, while CO&#8322; taken from the\natmosphere by forest growth and stored in woody biomass helps to slow climate warming.\n\nThe map shows estimated forest AGB in 2017 derived mainly from the combination of the ALOS\nPALSAR-2 L-band radar and the Sentinel-1 C-band radars, with support from a range of other sensors\nand environmental datasets.\n\n**Variable Shown:** Above-ground biomass in Mg/ha  \n**Time Span:** 2017  \n**Temporal resolution:** yearly  \n**Geographic Extent:** global  \n**Spatial Resolution:** 100m  \n**Version:** 1  \n**DOI:** [doi:10.5285/bedc59f37c9545c981a839eb552e4084](http://dx.doi.org/10.5285/bedc59f37c9545c981a839eb552e4084)\n\n[ESA CCI Biomass ECV Project website](http://cci.esa.int/biomass)  \n[Data in the Open Data Portal](https://catalogue.ceda.ac.uk/uuid/bedc59f37c9545c981a839eb552e4084)",
+    "description": "Biomass is the weight of living material in vegetation, which for forests is mainly contained in the\nwoody parts of the trees. Only above-ground biomass (AGB) can be measured from space (and in\npractice also for most on-ground measurements). Quantitative information on forest AGB is crucial\nfor understanding climate change, since loss of AGB caused by deforestation and forest degradation\nis second only to fossil fuel burning as a source of greenhouse gases, while CO&#8322; taken from the\natmosphere by forest growth and stored in woody biomass helps to slow climate warming.\n\nThe map shows estimated forest AGB in 2017 derived mainly from the combination of the ALOS\nPALSAR-2 L-band radar and the Sentinel-1 C-band radars, with support from a range of other sensors\nand environmental datasets.\n\n**Variable Shown:** Above-ground biomass in Mg/ha  \n**Time Span:** 2017  \n**Temporal resolution:** yearly  \n**Geographic Extent:** global  \n**Grid Spacing:** 100m  \n**Version:** 1  \n**DOI:** [doi:10.5285/bedc59f37c9545c981a839eb552e4084](http://dx.doi.org/10.5285/bedc59f37c9545c981a839eb552e4084)\n\n[ESA CCI Biomass ECV Project website](http://cci.esa.int/biomass)  \n[Data in the Open Data Portal](https://catalogue.ceda.ac.uk/uuid/bedc59f37c9545c981a839eb552e4084),
     "link": "http://..."
   },
   {