feat(url): add language to url

ubilabs · Aug 3, 2021 · 86e116a · 86e116a
1 parent aac41d3
commit 86e116a
Show file tree

Hide file tree

Showing 5 changed files with 65 additions and 30 deletions.
diff --git a/src/scripts/components/layers/layer-selector/layer-selector.tsx b/src/scripts/components/layers/layer-selector/layer-selector.tsx
@@ -72,6 +72,7 @@ const LayerSelector: FunctionComponent = () => {
               selectedLayerIds={selectedLayerIds}
               onSelect={(layerId, isMain) => {
                 dispatch(setSelectedLayerIdsAction(layerId, isMain));
+                dispatch(showLayerSelectorAction(false));
 
                 const name = layers.find(layer => layer.id === layerId)?.name;
 

diff --git a/src/scripts/components/main/icons/ubilabs-logo.tsx b/src/scripts/components/main/icons/ubilabs-logo.tsx
@@ -1,32 +1,45 @@
 import React, {FunctionComponent} from 'react';
 
 export const Ubilabslogo: FunctionComponent = () => (
-  <svg viewBox="4 4 61 21" fill="none" xmlns="http://www.w3.org/2000/svg">
-    <path d="M9.74922 12.5325C10.04 12.3387 10.3818 12.2353 10.7314 12.2353C11.2002 12.2357 11.6497 12.4216 11.9812 12.7522C12.3126 13.0828 12.499 13.531 12.4994 13.9985C12.4994 14.3472 12.3957 14.6881 12.2015 14.978C12.0072 15.268 11.7311 15.494 11.408 15.6274C11.085 15.7609 10.7295 15.7958 10.3865 15.7278C10.0436 15.6597 9.72856 15.4918 9.4813 15.2452C9.23404 14.9986 9.06566 14.6845 8.99745 14.3425C8.92923 14.0004 8.96423 13.6459 9.09805 13.3237C9.23187 13.0016 9.45848 12.7262 9.74922 12.5325Z" />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M8.45623 5.68531C10.1053 4.58649 12.0439 4 14.0272 4C16.6866 4 19.2371 5.05357 21.1177 6.92893C22.9981 8.8043 24.0546 11.3479 24.0546 14C24.0546 15.9778 23.4664 17.9113 22.3647 19.5557C21.2628 21.2002 19.6969 22.482 17.8646 23.2388C16.0322 23.9957 14.0161 24.1937 12.0709 23.8079C10.1258 23.422 8.33908 22.4697 6.93671 21.0711C5.53437 19.6726 4.57934 17.8908 4.19243 15.9509C3.80553 14.0111 4.00409 12.0004 4.76304 10.1732C5.52201 8.34592 6.80725 6.78413 8.45623 5.68531ZM9.14849 16.3612C9.61706 16.6735 10.168 16.84 10.7315 16.84C11.487 16.8393 12.2112 16.5397 12.7454 16.0069C13.2796 15.4741 13.5801 14.7518 13.5809 13.9985C13.5809 13.4365 13.4138 12.8871 13.1007 12.4198C12.7876 11.9525 12.3426 11.5883 11.8219 11.3732C11.3013 11.1581 10.7284 11.1018 10.1756 11.2115C9.62291 11.3211 9.1152 11.5918 8.71671 11.9892C8.31822 12.3866 8.04684 12.8929 7.9369 13.4441C7.82695 13.9953 7.88338 14.5667 8.09904 15.0859C8.3147 15.6051 8.67992 16.0489 9.14849 16.3612ZM14.6794 16.8322H15.7717V11.1491H14.6794V16.8322ZM16.864 16.8322H17.9563V11.1491H16.864V16.8322ZM19.0487 16.8322H20.141V11.1491H19.0487V16.8322Z"
-    />
-    <path d="M29.0683 9.83333H30.6113V14.6831C30.608 14.9633 30.6387 15.2429 30.7025 15.5159C30.7554 15.7455 30.8577 15.9609 31.0025 16.1474C31.1479 16.3267 31.3381 16.4648 31.5541 16.5482C32.102 16.7347 32.697 16.7347 33.2449 16.5482C33.461 16.4648 33.6511 16.3266 33.7964 16.1474C33.9414 15.9609 34.0438 15.7455 34.0967 15.5159C34.1607 15.2429 34.1913 14.9634 34.1879 14.6831V9.83333H35.7309V14.956C35.7347 15.3875 35.6598 15.816 35.5093 16.2207C35.3681 16.601 35.1469 16.9472 34.8603 17.236C34.5623 17.532 34.2061 17.7641 33.8138 17.9173C32.9007 18.2498 31.8985 18.2498 30.9854 17.9173C30.5929 17.7641 30.2367 17.532 29.9388 17.236C29.6523 16.9472 29.431 16.601 29.2899 16.2207C29.1401 15.8158 29.0655 15.3873 29.0699 14.956L29.0683 9.83333Z" />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M38.1963 9.83333H36.7506L36.7492 17.944C37.5163 18.0815 38.2951 18.1467 39.0747 18.1389C39.5609 18.1452 40.0439 18.0606 40.4984 17.8893C40.8802 17.7347 41.2277 17.5076 41.5213 17.2203C41.8035 16.94 42.0243 16.605 42.1703 16.2363C42.3229 15.851 42.3997 15.4402 42.3966 15.0262C42.3988 14.6423 42.3388 14.2606 42.219 13.8956C42.1103 13.5563 41.9333 13.2422 41.699 12.9724C41.4691 12.7107 41.1879 12.4984 40.8723 12.3487C40.5254 12.1897 40.1466 12.1108 39.7645 12.1179C39.4207 12.1089 39.0789 12.1711 38.7604 12.3003C38.5552 12.378 38.3646 12.4892 38.1963 12.6294V9.83333ZM38.5514 16.8663C38.4305 16.8463 38.3117 16.8155 38.1963 16.7744L38.1979 14.6192C38.1888 14.4515 38.2138 14.2837 38.2716 14.1259C38.3294 13.9681 38.4188 13.8235 38.5342 13.7007C38.7584 13.4782 39.0909 13.367 39.5319 13.367C39.7499 13.3615 39.966 13.4097 40.1605 13.5073C40.3332 13.5979 40.4822 13.7271 40.5958 13.8847C40.7126 14.0482 40.7978 14.2316 40.8472 14.4258C40.901 14.6326 40.928 14.8454 40.9274 15.059C40.9276 15.2925 40.8882 15.5245 40.8111 15.7451C40.7363 15.963 40.6175 16.1636 40.4623 16.3346C40.304 16.5069 40.1121 16.6454 39.8982 16.7416C39.6554 16.8487 39.3922 16.902 39.1267 16.8976C38.9344 16.9014 38.7422 16.8909 38.5514 16.8663Z"
-    />
-    <path d="M44.6241 9.83333H43.1791V11.268H44.6241V9.83333Z" />
-    <path d="M43.1791 12.2395H44.6241V17.9407H43.1791V12.2395Z" />
-    <path d="M45.6417 9.83333H47.0867V17.9423H45.6417V9.83333Z" />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M55.4816 9.83333H54.036V17.9407C54.8026 18.0793 55.5807 18.1456 56.36 18.1389C56.8461 18.1452 57.3291 18.0606 57.7836 17.8893C58.1654 17.7347 58.513 17.5076 58.8067 17.2202C59.0886 16.94 59.3095 16.605 59.4556 16.2363C59.6081 15.851 59.6849 15.4402 59.6818 15.0262C59.6838 14.6424 59.6238 14.2607 59.5043 13.8956C59.3954 13.5562 59.2185 13.2422 58.9841 12.9725C58.7545 12.7106 58.4733 12.4984 58.1575 12.3487C57.8106 12.1897 57.432 12.1108 57.0499 12.1179C56.706 12.1089 56.3641 12.1711 56.0456 12.3003C55.8404 12.378 55.6498 12.4892 55.4816 12.6294V9.83333ZM55.8368 16.8663C55.7158 16.8463 55.5969 16.8155 55.4816 16.7744L55.4831 14.6192C55.474 14.4515 55.4991 14.2837 55.557 14.1259C55.6146 13.9681 55.704 13.8235 55.8194 13.7007C56.0436 13.4782 56.3763 13.367 56.8173 13.367C57.0353 13.3615 57.2512 13.4097 57.4458 13.5073C57.6184 13.5979 57.7674 13.7271 57.881 13.8847C57.9979 14.0481 58.0831 14.2316 58.1325 14.4258C58.1863 14.6326 58.2132 14.8454 58.2126 15.059C58.213 15.2925 58.1736 15.5245 58.0964 15.7451C58.0216 15.9631 57.9029 16.1637 57.7475 16.3346C57.5892 16.5068 57.3973 16.6454 57.1834 16.7416C56.9408 16.8487 56.6774 16.902 56.4118 16.8976C56.2196 16.9014 56.0274 16.8909 55.8368 16.8663Z"
-    />
-    <path d="M60.9105 16.3112C61.1069 16.5003 61.3378 16.6507 61.591 16.7541C61.8896 16.8771 62.2106 16.9371 62.5338 16.9302C62.7882 16.94 63.0421 16.8985 63.2802 16.8087C63.3639 16.7802 63.4363 16.7261 63.4868 16.654C63.5375 16.5819 63.5636 16.4956 63.5614 16.4079C63.5654 16.3196 63.5432 16.2322 63.4972 16.1565C63.4514 16.0807 63.3841 16.0201 63.3037 15.9821C63.1638 15.9022 63.0157 15.8369 62.8621 15.7872C62.613 15.7052 62.3596 15.636 62.1032 15.5798C61.8952 15.5272 61.6904 15.4621 61.4903 15.3849C61.2769 15.3035 61.0767 15.191 60.8965 15.0512C60.7144 14.9111 60.5608 14.7381 60.4439 14.5412C60.3208 14.3245 60.2595 14.0788 60.2663 13.8301C60.2617 13.5626 60.3336 13.2993 60.4737 13.0707C60.6126 12.8473 60.7987 12.6563 61.019 12.5109C61.2523 12.357 61.5084 12.2402 61.778 12.1647C62.0547 12.0843 62.3414 12.0434 62.6296 12.0431C63.0655 12.0335 63.5005 12.086 63.9213 12.199C64.2671 12.2978 64.5925 12.4562 64.883 12.6668L64.135 13.6758C63.9461 13.5444 63.74 13.4395 63.5222 13.3639C63.2349 13.265 62.9322 13.2174 62.6281 13.2235C62.2856 13.2235 62.0466 13.2755 61.9115 13.3795C61.8498 13.4203 61.7991 13.4755 61.7639 13.5401C61.7285 13.6048 61.7096 13.677 61.7088 13.7506C61.7088 13.9294 61.8208 14.0693 62.0452 14.1701C62.3839 14.3076 62.7341 14.4156 63.0916 14.4929C63.3602 14.5507 63.6232 14.6321 63.8773 14.7362C64.096 14.8248 64.2987 14.948 64.4776 15.1011C64.6426 15.2433 64.7745 15.4194 64.8641 15.6173C64.9591 15.8422 65.0053 16.0845 64.9992 16.3283C65.0027 16.5904 64.9348 16.8483 64.8028 17.0753C64.67 17.3011 64.488 17.4943 64.2702 17.6414C64.0298 17.8027 63.7642 17.9239 63.4844 18C63.1777 18.0862 62.8605 18.1291 62.5416 18.1279C62.0463 18.1349 61.5533 18.059 61.0834 17.9034C60.6843 17.7753 60.3256 17.5469 60.0416 17.2405L60.9105 16.3112Z" />
-    <path
-      fillRule="evenodd"
-      clipRule="evenodd"
-      d="M51.6316 17.4059C51.4352 17.6224 51.1924 17.7929 50.9214 17.9048C50.5865 18.0539 50.223 18.1284 49.856 18.1231C49.6171 18.1229 49.3796 18.0862 49.152 18.0141C48.9211 17.9425 48.7053 17.8295 48.5156 17.6804C48.3168 17.5257 48.1558 17.3284 48.0441 17.1034C47.9207 16.8454 47.8599 16.5623 47.8667 16.2769C47.8614 15.9773 47.9241 15.6804 48.0505 15.4083C48.1696 15.1572 48.3455 14.9368 48.5643 14.7642C48.8013 14.582 49.0719 14.448 49.361 14.3697C49.6961 14.277 50.0426 14.2319 50.3903 14.2356H50.7706C50.9099 14.2356 51.0445 14.2418 51.1744 14.2543L51.6269 14.2792V14.1451C51.6311 14.014 51.6019 13.884 51.5421 13.767C51.4823 13.6501 51.3936 13.55 51.2844 13.4761C51.0195 13.3037 50.7067 13.2186 50.3903 13.2329C50.0561 13.2193 49.7229 13.2723 49.4097 13.3888C49.1843 13.484 48.9672 13.5977 48.7608 13.7288L48.0992 12.7572C48.2134 12.6761 48.3438 12.593 48.4905 12.5077C48.6548 12.4152 48.8273 12.3379 49.0059 12.2769C49.2271 12.2019 49.4542 12.145 49.6848 12.107C49.9824 12.0594 50.2836 12.037 50.5851 12.0399C50.9241 12.0367 51.2614 12.0894 51.5829 12.1958C51.8651 12.2853 52.1272 12.4283 52.3545 12.6169C52.565 12.7969 52.7326 13.0211 52.8447 13.2734C52.9606 13.5359 53.0189 13.8197 53.016 14.1061V17.936H51.6694L51.6316 17.4059ZM51.6316 15.3646L51.2027 15.3396C51.0885 15.3313 50.9681 15.3251 50.8413 15.3209H50.5176C50.0525 15.3209 49.7256 15.4119 49.537 15.5938C49.4493 15.6729 49.3791 15.7692 49.3307 15.8765C49.2822 15.9839 49.2567 16.1 49.2558 16.2176C49.2509 16.3267 49.2724 16.4355 49.3183 16.5346C49.3641 16.6338 49.4333 16.7208 49.5197 16.7884C49.7486 16.9413 50.0224 17.0137 50.2976 16.9942C50.6305 16.9951 50.9541 16.8851 51.2169 16.6824C51.3369 16.588 51.4387 16.4728 51.5169 16.3424C51.593 16.2177 51.6331 16.0748 51.6333 15.9291L51.6316 15.3646Z"
-    />
+  <svg
+    width="70"
+    height="15"
+    viewBox="0 0 70 15"
+    fill="none"
+    xmlns="http://www.w3.org/2000/svg">
+    <g clipPath="url(#clip0)">
+      <path
+        d="M28.5158 4.35986H26.529C26.4452 4.35986 26.3616 4.44365 26.3616 4.52743V14.7032C26.3616 14.787 26.4452 14.8292 26.529 14.8292H28.5158C28.5995 14.8292 28.6616 14.787 28.6616 14.7032V4.52743C28.6616 4.44365 28.5995 4.35986 28.5158 4.35986Z"
+        fill="white"
+      />
+      <path
+        d="M27.554 0.00486342C26.655 -0.0158861 25.9434 0.654349 25.9434 1.55441C25.9434 2.45523 26.6335 3.12469 27.5332 3.12469C28.3901 3.12469 29.1017 2.45523 29.1017 1.57517C29.1017 0.675104 28.4116 0.00486342 27.554 0.00486342Z"
+        fill="white"
+      />
+      <path
+        d="M19.0007 4.2345C17.7247 4.2345 16.5739 4.73718 15.926 5.44893V1.15694C15.926 1.07239 15.863 1.01013 15.7793 1.01013H13.7717C13.7088 1.01013 13.6259 1.07239 13.6259 1.15694V14.6824C13.6259 14.7662 13.7088 14.8292 13.7717 14.8292H15.7793C15.863 14.8292 15.926 14.7662 15.926 14.6824V13.7608C16.5954 14.3895 17.6411 14.9544 19.0007 14.9544C22.1376 14.9544 24.2496 12.8607 24.2496 9.5941C24.2496 6.32823 22.1376 4.2345 19.0007 4.2345ZM18.8748 12.7355C17.076 12.7355 15.9052 11.395 15.9052 9.5941C15.9052 7.77247 17.076 6.47426 18.8748 6.47426C20.7151 6.47426 21.9073 7.77247 21.9073 9.5941C21.9073 11.395 20.7151 12.7355 18.8748 12.7355Z"
+        fill="white"
+      />
+      <path
+        d="M10.6349 4.35986H8.85759C8.77391 4.35986 8.71095 4.40214 8.66874 4.4644L4.36103 12.1483C4.13072 12.5472 3.85895 12.7355 3.35685 12.7355C2.70889 12.7355 2.31121 12.3589 2.31121 11.6672V4.52743C2.31121 4.44365 2.22752 4.35986 2.14384 4.35986H0.156976C0.0947918 4.35986 0.0111084 4.44365 0.0111084 4.52743V11.6887C0.0111084 13.6356 1.36998 14.9546 3.33612 14.9546C4.67427 14.9546 5.53181 14.3896 6.09686 13.3428C6.09686 13.322 8.50137 9.13377 8.50137 9.13377V14.7032C8.50137 14.787 8.58582 14.8292 8.66874 14.8292H10.6349C10.7186 14.8292 10.8022 14.787 10.8022 14.7032V4.50668C10.8022 4.42289 10.7186 4.35986 10.6349 4.35986Z"
+        fill="white"
+      />
+      <path
+        d="M66.537 8.69422C64.6545 8.27532 63.9851 8.12929 63.9851 7.39602C63.9851 6.66353 64.5294 6.32841 65.6579 6.32841C66.7044 6.32841 67.8329 6.7888 68.2936 7.08165C68.3557 7.12393 68.4609 7.10317 68.5031 7.01862L69.3384 5.51135C69.3806 5.42757 69.3806 5.34456 69.2977 5.28154C68.398 4.65281 67.0383 4.23468 65.595 4.23468C63.0025 4.23468 61.6634 5.55363 61.6634 7.39602C61.6634 9.09237 62.6254 10.0339 64.8633 10.4736C66.7044 10.8295 67.3315 11.0808 67.3315 11.814C67.3315 12.5258 66.7872 12.9032 65.5328 12.9032C64.5079 12.9032 63.2742 12.505 62.4166 11.9401C62.3544 11.8978 62.2699 11.9186 62.2285 11.9809L61.3295 13.5734C61.2873 13.6564 61.2873 13.761 61.3503 13.8025C62.6047 14.6195 64.1533 14.9961 65.6579 14.9961C68.2099 14.9961 69.6532 13.6772 69.6532 11.7303C69.6532 10.097 68.7327 9.17614 66.537 8.69422Z"
+        fill="white"
+      />
+      <path
+        d="M33.6189 1.01031H31.6322C31.5691 1.01031 31.4855 1.07258 31.4855 1.15636V14.7026C31.4855 14.7871 31.5691 14.8294 31.6322 14.8294H33.6189C33.7027 14.8294 33.7864 14.7871 33.7864 14.7026V1.15636C33.7864 1.07258 33.7027 1.01031 33.6189 1.01031Z"
+        fill="white"
+      />
+      <path
+        d="M54.7207 4.2345C53.4241 4.2345 52.3154 4.73718 51.6467 5.44893V1.15694C51.6467 1.07239 51.5839 1.01013 51.4993 1.01013H49.4717C49.4089 1.01013 49.3458 1.07239 49.3458 1.15694V14.6824C49.3458 14.7662 49.4089 14.8292 49.4717 14.8292H51.4993C51.5839 14.8292 51.6467 14.7662 51.6467 14.6824V13.7608C52.3362 14.3895 53.3611 14.9544 54.7207 14.9544C57.8361 14.9544 59.9704 12.8607 59.9704 9.5941C59.9704 6.32823 57.8361 4.2345 54.7207 4.2345ZM54.6163 12.7355C52.7761 12.7355 51.6252 11.395 51.6252 9.5941C51.6252 7.77247 52.7761 6.47426 54.6163 6.47426C56.4558 6.47426 57.6273 7.77247 57.6273 9.5941C57.6273 11.395 56.4558 12.7355 54.6163 12.7355Z"
+        fill="white"
+      />
+      <path
+        d="M46.3759 4.35984H44.3891C44.2854 4.35984 44.2216 4.44362 44.2216 4.5274V5.49049C43.8041 4.90402 42.5902 4.23456 41.2107 4.23456C38.1989 4.23456 35.8988 6.45356 35.8988 9.59416C35.8988 12.7355 38.1989 14.9546 41.2107 14.9546C42.6117 14.9546 43.8041 14.2851 44.2216 13.7193V14.6824C44.2216 14.7662 44.2854 14.8293 44.3891 14.8293H46.3759C46.4604 14.8293 46.5226 14.7662 46.5226 14.6824V4.5274C46.5226 4.44362 46.4604 4.35984 46.3759 4.35984ZM41.2943 12.7355C39.5578 12.7355 38.2404 11.3113 38.2404 9.59416C38.2404 7.85631 39.5578 6.47432 41.2943 6.47432C43.0087 6.47432 44.2639 7.85631 44.2639 9.59416C44.2639 11.3113 43.0087 12.7355 41.2943 12.7355Z"
+        fill="white"
+      />
+    </g>
   </svg>
 );
diff --git a/src/scripts/config/main.ts b/src/scripts/config/main.ts
@@ -80,7 +80,7 @@ export default {
       'http://twitter.com/intent/tweet?text=ESA%20Climate%20From%20Space&url={currentUrl}'
   },
   planeratyVisionsLogo: 'assets/images/planetary-visions.png',
-  ubilabsWebsite: 'https://ubilabs.net',
+  ubilabsWebsite: 'https://ubilabs.com',
   planetaryVisionsWebsite: 'http://planetaryvisions.com/',
   githubRepo: 'https://github.com/ubilabs/esa-climate-from-space',
   cciWebsite: 'https://climate.esa.int/',

diff --git a/src/scripts/libs/language-url-parameter.ts b/src/scripts/libs/language-url-parameter.ts
@@ -0,0 +1,19 @@
+import {Language} from '../types/language';
+// parses window.location and reads the story tags from query params
+//
+// note: we do not use the location.search prop here because the HashRouter
+
+// stores the query parameters in the location.hash prop
+export function parseUrl(): Language | null {
+  const {hash} = location;
+
+  const queryString = hash.substr(hash.indexOf('?'));
+  const urlParams = new URLSearchParams(queryString);
+  const languageParam = urlParams.get('lng') as Language;
+
+  if (!languageParam) {
+    return null;
+  }
+
+  return languageParam;
+}
diff --git a/src/scripts/reducers/language.ts b/src/scripts/reducers/language.ts
@@ -1,11 +1,13 @@
 import {SET_LANGUAGE, SetLanguageAction} from '../actions/set-language';
 import getBrowserLanguage from '../libs/get-browser-language';
 import getLocalStorageLanguage from '../libs/get-local-storage-language';
+import { parseUrl } from '../libs/language-url-parameter';
 
 import {Language} from '../types/language';
 
-const initialState: Language =
-  getLocalStorageLanguage() || getBrowserLanguage() || Language.EN;
+
+
+const initialState: Language = parseUrl() || getLocalStorageLanguage() || getBrowserLanguage() || Language.EN;
 
 function languageReducer(
   state: Language = initialState,