moved breadcrumbs to pages

Geonovum · Sep 8, 2024 · 80f2260 · 80f2260
1 parent 342f550
commit 80f2260
Show file tree

Hide file tree

Showing 16 changed files with 278 additions and 53 deletions.
diff --git a/src/controllers/processes/processes.js b/src/controllers/processes/processes.js
@@ -12,12 +12,10 @@ export function get(req, res) {
   var queryParams = ["f"];
   var rejected = utils.checkForAllowedQueryParams(req.query, queryParams);
   if (rejected.length > 0) {
-    res
-      .status(400)
-      .json({
-        code: `The following query parameters are rejected: ${rejected}`,
-        description: "Valid parameters for this request are " + queryParams,
-      });
+    res.status(400).json({
+      code: `The following query parameters are rejected: ${rejected}`,
+      description: "Valid parameters for this request are " + queryParams,
+    });
     return;
   }
 
@@ -44,18 +42,22 @@ export function get(req, res) {
         res.status(200).json(content);
         break;
       case `html`:
+        let linkSelf = content.links.find(i => i.rel == 'self').href.split('?')[0]
+        let links = [linkSelf];
+        while (links[0] != serviceUrl) {
+          links.unshift(links[0].substr(0, links[0].lastIndexOf("/")));
+        }
+
         // Recommendations 10, Links included in payload of responses SHOULD also be
         // included as Link headers in the HTTP response according to RFC 8288, Clause 3.
         res.set("link", utils.makeHeaderLinks(content.links));
         res.status(200).render(`processes`, { content, serviceUrl });
         break;
       default:
-        res
-          .status(400)
-          .json({
-            code: "InvalidParameterValue",
-            description: `${accept} is an invalid format`,
-          });
+        res.status(400).json({
+          code: "InvalidParameterValue",
+          description: `${accept} is an invalid format`,
+        });
     }
   });
 }
diff --git a/src/models/common/collections/collections.js b/src/models/common/collections/collections.js
@@ -62,9 +62,9 @@ function get(neutralUrl, format, callback) {
   content.description = global.config.description
   content.links = []
   // (OAPIC P2) Requirement 2B. The API SHALL support the HTTP GET operation on all links to a Collections Resource that have the relation type
-  content.links.push({ href: urlJoin(neutralUrl, `f=${format}`), rel: `self`, type: utils.getTypeFromFormat(format), title: `This document` })
+  content.links.push({ href: urlJoin(neutralUrl, `?f=${format}`), rel: `self`, type: utils.getTypeFromFormat(format), title: `This document` })
   utils.getAlternateFormats(format, ['json', 'html']).forEach(altFormat => {
-    content.links.push({ href: urlJoin(neutralUrl, `f=${altFormat}`), rel: `alternate`, type: utils.getTypeFromFormat(altFormat), title: `This document as ${altFormat}` })
+    content.links.push({ href: urlJoin(neutralUrl, `?f=${altFormat}`), rel: `alternate`, type: utils.getTypeFromFormat(altFormat), title: `This document as ${altFormat}` })
   })
 
   content.collections = [];

diff --git a/src/models/processes/job.js b/src/models/processes/job.js
@@ -11,9 +11,9 @@ function getLinks(neutralUrl, format, jobId, links) {
     return _encodings[i];
   }
 
-  links.push({ href: urlJoin(neutralUrl,), rel: `self`, type: getTypeFromFormat(format), title: `Job information as ${format}` })
+  links.push({ href: urlJoin(neutralUrl, jobId, `?f=${format}`), rel: `self`, type: getTypeFromFormat(format), title: `Job information as ${format}` })
   utils.getAlternateFormats(format, ['json', 'html']).forEach(altFormat => {
-    links.push({ href: urlJoin(neutralUrl, `?f=${altFormat}`), rel: `alternate`, type: getTypeFromFormat(altFormat), title: `Job information as ${altFormat}` })
+    links.push({ href: urlJoin(neutralUrl, jobId, `?f=${altFormat}`), rel: `alternate`, type: getTypeFromFormat(altFormat), title: `Job information as ${altFormat}` })
   })
 
   links.push({

diff --git a/src/models/processes/processes.js b/src/models/processes/processes.js
@@ -12,7 +12,7 @@ function getLinks(neutralUrl, format, name, links) {
     return _encodings[i]
   }
 
-  links.push({ href: urlJoin(neutralUrl, name, ), type: getTypeFromFormat(format), rel: `self`, title: `process description as ${format}` })
+  links.push({ href: urlJoin(neutralUrl, name ), type: getTypeFromFormat(format), rel: `self`, title: `process description as ${format}` })
   utils.getAlternateFormats(format, ['json', 'html']).forEach(altFormat => {
     links.push({ href: urlJoin(neutralUrl, name, `?f=${altFormat}`), rel: `alternate`, type: getTypeFromFormat(altFormat), title: `Process description as ${altFormat}` })
   })
@@ -48,9 +48,9 @@ function get(neutralUrl, format, callback) {
 
   content.links = []
   // (OAPIC P2) Requirement 2B. The API SHALL support the HTTP GET operation on all links to a Collections Resource that have the relation type
-  content.links.push({ href: urlJoin(neutralUrl, `f=${format}`), rel: `self`, type: utils.getTypeFromFormat(format), title: `This document` })
+  content.links.push({ href: urlJoin(neutralUrl, `?f=${format}`), rel: `self`, type: utils.getTypeFromFormat(format), title: `This document` })
   utils.getAlternateFormats(format, ['json', 'html']).forEach(altFormat => {
-    content.links.push({ href: urlJoin(neutralUrl, `f=${altFormat}`), rel: `alternate`, type: utils.getTypeFromFormat(altFormat), title: `This document as ${altFormat}` })
+    content.links.push({ href: urlJoin(neutralUrl, `?f=${altFormat}`), rel: `alternate`, type: utils.getTypeFromFormat(altFormat), title: `This document as ${altFormat}` })
   })
 
   content.processes = [];

diff --git a/src/models/processes/results.js b/src/models/processes/results.js
@@ -2,6 +2,40 @@ import urlJoin from "url-join";
 import utils from "../../utils/utils.js";
 import { getJobs } from "../../database/processes.js";
 
+function getLinks(neutralUrl, format, links) {
+  function getTypeFromFormat(format) {
+    var _formats = ["json", "html"];
+    var _encodings = ["application/json", "text/html"];
+
+    var i = _formats.indexOf(format);
+    return _encodings[i];
+  }
+
+  links.push({
+    href: urlJoin(neutralUrl, `?f=${format}`),
+    rel: `self`,
+    type: getTypeFromFormat(format),
+    title: `Results information as ${format}`,
+  });
+  utils.getAlternateFormats(format, ["json", "html"]).forEach((altFormat) => {
+    links.push({
+      href: urlJoin(neutralUrl, `?f=${altFormat}`),
+      rel: `alternate`,
+      type: getTypeFromFormat(altFormat),
+      title: `Results information as ${altFormat}`,
+    });
+  });
+}
+
+export function getContent(neutralUrl, format, job) {
+  var content = job.results
+  content.links = [];
+
+  getLinks(neutralUrl, format, content.links);
+
+  return content;
+}
+
 function get(neutralUrl, format, jobId, callback) {
   let jobs = getJobs();
   let job = jobs[jobId];
@@ -15,7 +49,9 @@ function get(neutralUrl, format, jobId, callback) {
       undefined
     );
 
-  return callback(undefined, job.results);
+  var content = getContent(neutralUrl, format, job);
+
+  return callback(undefined, content);
 }
 
 export default {

diff --git a/src/views/collection.pug b/src/views/collection.pug
@@ -1,5 +1,29 @@
 extends layout.pug
 
+block header
+
+  svg.d-none(xmlns='http://www.w3.org/2000/svg')
+    symbol#house-door-fill(viewbox='0 0 16 16')
+      path(d='M6.5 14.5v-3.505c0-.245.25-.495.5-.495h2c.25 0 .5.25.5.5v3.5a.5.5 0 0 0 .5.5h4a.5.5 0 0 0 .5-.5v-7a.5.5 0 0 0-.146-.354L13 5.793V2.5a.5.5 0 0 0-.5-.5h-1a.5.5 0 0 0-.5.5v1.293L8.354 1.146a.5.5 0 0 0-.708 0l-6 6A.5.5 0 0 0 1.5 7.5v7a.5.5 0 0 0 .5.5h4a.5.5 0 0 0 .5-.5z')
+
+  - let linkSelf = content.links.find(i => i.rel == 'self').href.split('?')[0]
+  - let links = [ linkSelf ]
+  - while (links[0] != serviceUrl) {
+  -  links.unshift(links[0].substr(0, links[0].lastIndexOf("/"))) }
+
+  nav(aria-label='breadcrumb')
+    ol.breadcrumb.breadcrumb-chevron.p-3.bg-body-tertiary.rounded-3
+      li.breadcrumb-item
+        a.link-body-emphasis(href=serviceUrl)
+          svg.bi(width='16' height='16')
+            use(xlink:href='#house-door-fill')
+          span.visually-hidden serviceUrl
+      li.breadcrumb-item
+        a.link-body-emphasis.fw-semibold.text-decoration-none(href=links[1]) Data
+      - let pathElement = linkSelf.substring(linkSelf.lastIndexOf("/") + 1);
+      li.breadcrumb-item.active(aria-current='page')
+        | #{pathElement}
+
 block content
 
   .container

diff --git a/src/views/collections.pug b/src/views/collections.pug
@@ -1,5 +1,21 @@
 extends layout.pug
 
+block header
+
+  svg.d-none(xmlns='http://www.w3.org/2000/svg')
+    symbol#house-door-fill(viewbox='0 0 16 16')
+      path(d='M6.5 14.5v-3.505c0-.245.25-.495.5-.495h2c.25 0 .5.25.5.5v3.5a.5.5 0 0 0 .5.5h4a.5.5 0 0 0 .5-.5v-7a.5.5 0 0 0-.146-.354L13 5.793V2.5a.5.5 0 0 0-.5-.5h-1a.5.5 0 0 0-.5.5v1.293L8.354 1.146a.5.5 0 0 0-.708 0l-6 6A.5.5 0 0 0 1.5 7.5v7a.5.5 0 0 0 .5.5h4a.5.5 0 0 0 .5-.5z')
+
+  nav(aria-label='breadcrumb')
+    ol.breadcrumb.breadcrumb-chevron.p-3.bg-body-tertiary.rounded-3
+      li.breadcrumb-item
+        a.link-body-emphasis(href=serviceUrl)
+          svg.bi(width='16' height='16')
+            use(xlink:href='#house-door-fill')
+          span.visually-hidden serviceUrl
+      li.breadcrumb-item.active(aria-current='page')
+        | Data
+
 block content
 
   .container

diff --git a/src/views/feature.pug b/src/views/feature.pug
@@ -4,6 +4,36 @@ block append scripts
   link(rel='stylesheet' href='https://unpkg.com/[email protected]/dist/leaflet.css')
   script(src='https://unpkg.com/[email protected]/dist/leaflet.js')
 
+block header
+
+  svg.d-none(xmlns='http://www.w3.org/2000/svg')
+    symbol#house-door-fill(viewbox='0 0 16 16')
+      path(d='M6.5 14.5v-3.505c0-.245.25-.495.5-.495h2c.25 0 .5.25.5.5v3.5a.5.5 0 0 0 .5.5h4a.5.5 0 0 0 .5-.5v-7a.5.5 0 0 0-.146-.354L13 5.793V2.5a.5.5 0 0 0-.5-.5h-1a.5.5 0 0 0-.5.5v1.293L8.354 1.146a.5.5 0 0 0-.708 0l-6 6A.5.5 0 0 0 1.5 7.5v7a.5.5 0 0 0 .5.5h4a.5.5 0 0 0 .5-.5z')
+
+  - let linkSelf = content.links.find(i => i.rel == 'self').href.split('?')[0]
+  - let links = [ linkSelf ]
+  - while (links[0] != serviceUrl) {
+  -  links.unshift(links[0].substr(0, links[0].lastIndexOf("/"))) }
+
+  nav(aria-label='breadcrumb')
+    ol.breadcrumb.breadcrumb-chevron.p-3.bg-body-tertiary.rounded-3
+      li.breadcrumb-item
+        a.link-body-emphasis(href=serviceUrl)
+          svg.bi(width='16' height='16')
+            use(xlink:href='#house-door-fill')
+          span.visually-hidden serviceUrl
+      li.breadcrumb-item
+        a.link-body-emphasis.fw-semibold.text-decoration-none(href=links[1]) Data
+      - let pathElement = links[2].substring(links[2].lastIndexOf("/") + 1);
+      li.breadcrumb-item
+        a.link-body-emphasis.fw-semibold.text-decoration-none(href=links[2]) #{pathElement}
+      li.breadcrumb-item
+        a.link-body-emphasis.fw-semibold.text-decoration-none(href=links[3]) Items
+      - let pathElement2 = links[4].substring(links[4].lastIndexOf("/") + 1);
+      li.breadcrumb-item.active(aria-current='page')
+        | #{pathElement2}
+
+
 block content
 
   .content
@@ -19,5 +49,5 @@ block content
     script.
       var map = L.map("map").setView([52.300, 4.867], 12);
       L.tileLayer('http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {attribution: '&copy; <a href="http://osm.org/copyright">OpenStreetMap</a> contributors'}).addTo(map);
-      var features = !{JSON.stringify(geometry)}
+      var features = !{JSON.stringify(content.geometry)}
       L.geoJSON(features).addTo(map);
diff --git a/src/views/items.pug b/src/views/items.pug
@@ -4,6 +4,32 @@ block append scripts
   link(rel='stylesheet' href='https://unpkg.com/[email protected]/dist/leaflet.css')
   script(src='https://unpkg.com/[email protected]/dist/leaflet.js')
 
+block header
+
+  svg.d-none(xmlns='http://www.w3.org/2000/svg')
+    symbol#house-door-fill(viewbox='0 0 16 16')
+      path(d='M6.5 14.5v-3.505c0-.245.25-.495.5-.495h2c.25 0 .5.25.5.5v3.5a.5.5 0 0 0 .5.5h4a.5.5 0 0 0 .5-.5v-7a.5.5 0 0 0-.146-.354L13 5.793V2.5a.5.5 0 0 0-.5-.5h-1a.5.5 0 0 0-.5.5v1.293L8.354 1.146a.5.5 0 0 0-.708 0l-6 6A.5.5 0 0 0 1.5 7.5v7a.5.5 0 0 0 .5.5h4a.5.5 0 0 0 .5-.5z')
+
+  - let linkSelf = content.links.find(i => i.rel == 'self').href.split('?')[0]
+  - let links = [ linkSelf ]
+  - while (links[0] != serviceUrl) {
+  -  links.unshift(links[0].substr(0, links[0].lastIndexOf("/"))) }
+
+  nav(aria-label='breadcrumb')
+    ol.breadcrumb.breadcrumb-chevron.p-3.bg-body-tertiary.rounded-3
+      li.breadcrumb-item
+        a.link-body-emphasis(href=serviceUrl)
+          svg.bi(width='16' height='16')
+            use(xlink:href='#house-door-fill')
+          span.visually-hidden serviceUrl
+      li.breadcrumb-item
+        a.link-body-emphasis.fw-semibold.text-decoration-none(href=links[1]) Data
+      - let pathElement = links[2].substring(links[2].lastIndexOf("/") + 1);
+      li.breadcrumb-item
+        a.link-body-emphasis.fw-semibold.text-decoration-none(href=links[2]) #{pathElement}
+      li.breadcrumb-item.active(aria-current='page')
+        | Items
+
 block content
 
   .content

diff --git a/src/views/job.pug b/src/views/job.pug
@@ -1,5 +1,29 @@
 extends layout.pug
 
+block header
+
+  svg.d-none(xmlns='http://www.w3.org/2000/svg')
+    symbol#house-door-fill(viewbox='0 0 16 16')
+      path(d='M6.5 14.5v-3.505c0-.245.25-.495.5-.495h2c.25 0 .5.25.5.5v3.5a.5.5 0 0 0 .5.5h4a.5.5 0 0 0 .5-.5v-7a.5.5 0 0 0-.146-.354L13 5.793V2.5a.5.5 0 0 0-.5-.5h-1a.5.5 0 0 0-.5.5v1.293L8.354 1.146a.5.5 0 0 0-.708 0l-6 6A.5.5 0 0 0 1.5 7.5v7a.5.5 0 0 0 .5.5h4a.5.5 0 0 0 .5-.5z')
+
+  - let linkSelf = content.links.find(i => i.rel == 'self').href.split('?')[0]
+  - let links = [ linkSelf ]
+  - while (links[0] != serviceUrl) {
+  -  links.unshift(links[0].substr(0, links[0].lastIndexOf("/"))) }
+
+  nav(aria-label='breadcrumb')
+    ol.breadcrumb.breadcrumb-chevron.p-3.bg-body-tertiary.rounded-3
+      li.breadcrumb-item
+        a.link-body-emphasis(href=serviceUrl)
+          svg.bi(width='16' height='16')
+            use(xlink:href='#house-door-fill')
+          span.visually-hidden serviceUrl
+      li.breadcrumb-item
+        a.link-body-emphasis.fw-semibold.text-decoration-none(href=links[1]) Jobs
+      - let pathElement = links[2].substring(links[2].lastIndexOf("/") + 1);
+      li.breadcrumb-item.active(aria-current='page')
+        | #{pathElement}
+
 block content
 
   .container

diff --git a/src/views/jobs.pug b/src/views/jobs.pug
@@ -1,5 +1,21 @@
 extends layout.pug
 
+block header
+
+  svg.d-none(xmlns='http://www.w3.org/2000/svg')
+    symbol#house-door-fill(viewbox='0 0 16 16')
+      path(d='M6.5 14.5v-3.505c0-.245.25-.495.5-.495h2c.25 0 .5.25.5.5v3.5a.5.5 0 0 0 .5.5h4a.5.5 0 0 0 .5-.5v-7a.5.5 0 0 0-.146-.354L13 5.793V2.5a.5.5 0 0 0-.5-.5h-1a.5.5 0 0 0-.5.5v1.293L8.354 1.146a.5.5 0 0 0-.708 0l-6 6A.5.5 0 0 0 1.5 7.5v7a.5.5 0 0 0 .5.5h4a.5.5 0 0 0 .5-.5z')
+
+  nav(aria-label='breadcrumb')
+    ol.breadcrumb.breadcrumb-chevron.p-3.bg-body-tertiary.rounded-3
+      li.breadcrumb-item
+        a.link-body-emphasis(href=serviceUrl)
+          svg.bi(width='16' height='16')
+            use(xlink:href='#house-door-fill')
+          span.visually-hidden serviceUrl
+      li.breadcrumb-item.active(aria-current='page')
+        | Jobs
+
 block content
 
   .container

diff --git a/src/views/landingPage.pug b/src/views/landingPage.pug
@@ -4,8 +4,20 @@ block append scripts
   link(rel='stylesheet' href='https://unpkg.com/[email protected]/dist/leaflet.css')
   script(src='https://unpkg.com/[email protected]/dist/leaflet.js')
 
-block content
+block header
+  svg.d-none(xmlns='http://www.w3.org/2000/svg')
+    symbol#house-door-fill(viewbox='0 0 16 16')
+      path(d='M6.5 14.5v-3.505c0-.245.25-.495.5-.495h2c.25 0 .5.25.5.5v3.5a.5.5 0 0 0 .5.5h4a.5.5 0 0 0 .5-.5v-7a.5.5 0 0 0-.146-.354L13 5.793V2.5a.5.5 0 0 0-.5-.5h-1a.5.5 0 0 0-.5.5v1.293L8.354 1.146a.5.5 0 0 0-.708 0l-6 6A.5.5 0 0 0 1.5 7.5v7a.5.5 0 0 0 .5.5h4a.5.5 0 0 0 .5-.5z')
 
+  nav(aria-label='breadcrumb')
+    ol.breadcrumb.breadcrumb-chevron.p-3.bg-body-tertiary.rounded-3
+      li.breadcrumb-item.active
+        a.link-body-emphasis(href=serviceUrl)
+          svg.bi(width='16' height='16')
+            use(xlink:href='#house-door-fill')
+          span.visually-hidden serviceUrl
+
+block content
   svg.d-none(xmlns='http://www.w3.org/2000/svg')
     symbol#arrow-right-circle(viewbox='0 0 16 16')
       path(d='M8 0a8 8 0 1 1 0 16A8 8 0 0 1 8 0zM4.5 7.5a.5.5 0 0 0 0 1h5.793l-2.147 2.146a.5.5 0 0 0 .708.708l3-3a.5.5 0 0 0 0-.708l-3-3a.5.5 0 1 0-.708.708L10.293 7.5H4.5z')

diff --git a/src/views/layout.pug b/src/views/layout.pug
@@ -13,33 +13,6 @@ html(lang='en')
 
   body
     block header
-      svg.d-none(xmlns='http://www.w3.org/2000/svg')
-        symbol#house-door-fill(viewbox='0 0 16 16')
-          path(d='M6.5 14.5v-3.505c0-.245.25-.495.5-.495h2c.25 0 .5.25.5.5v3.5a.5.5 0 0 0 .5.5h4a.5.5 0 0 0 .5-.5v-7a.5.5 0 0 0-.146-.354L13 5.793V2.5a.5.5 0 0 0-.5-.5h-1a.5.5 0 0 0-.5.5v1.293L8.354 1.146a.5.5 0 0 0-.708 0l-6 6A.5.5 0 0 0 1.5 7.5v7a.5.5 0 0 0 .5.5h4a.5.5 0 0 0 .5-.5z')
-
-      - let linkSelf = content.links.find(i => i.rel == 'self').href.split('?')[0]
-      - let links = [ linkSelf ]
-      - while (links[0] != serviceUrl) {
-      -  links.unshift(links[0].substr(0, links[0].lastIndexOf("/"))) }
-
-      nav(aria-label='breadcrumb')
-        ol.breadcrumb.breadcrumb-chevron.p-3.bg-body-tertiary.rounded-3
-          each link in links
-            - let pathElement = link.substring(link.lastIndexOf("/") + 1);
-            - if (link == serviceUrl)
-              li.breadcrumb-item
-                a.link-body-emphasis(href=link)
-                  svg.bi(width='16' height='16')
-                    use(xlink:href='#house-door-fill')
-                  span.visually-hidden linkSelf
-            - else if (link == linkSelf)
-              li.breadcrumb-item.active(aria-current='page')
-                | #{pathElement}
-            - else
-              li.breadcrumb-item
-                a.link-body-emphasis.fw-semibold.text-decoration-none(href=link) #{pathElement}
-
     block content
     block foot
-      #footer
-
+      #footer