externalize links properly (#7)

blocks/schedule/schedule.js

@@ -3,7 +3,7 @@ import { getScheduleData } from '../../scripts/services/ScheduleData.js';
 import { getSiteRootPath } from '../../scripts/utils/site.js';
 import { formatDateFull, formatTime } from '../../scripts/utils/datetime.js';
 import { isFullscreen } from '../../scripts/utils/fullscreen.js';
-import { externalizeXWalkPrefix } from '../../scripts/utils/path.js';
+import { externalizeXWalkPrefix, externalizeXWalkPrefixLink } from '../../scripts/utils/path.js';
 
 const dayIdPattern = /^#day-(\d)$/;
 
@@ -93,7 +93,7 @@ function buildDayEntryCells(tr, entry, colSpan, speakerColumn) {
   }
   if (entry.talkPath) {
     const link = append(tdTitle, 'a');
-    link.href = externalizeXWalkPrefix(entry.talkPath);
+    link.href = externalizeXWalkPrefixLink(entry.talkPath);
     link.textContent = entry.title;
   } else {
     tdTitle.textContent = entry.title;

blocks/speaker-detail/speaker-detail.js

@@ -2,7 +2,7 @@ import { getMetadata } from '../../scripts/aem.js';
 import { getQueryIndex } from '../../scripts/services/QueryIndex.js';
 import { append } from '../../scripts/utils/dom.js';
 import { buildTwitterHandle, buildTwitterUrl, removeTitleSuffix } from '../../scripts/utils/metadata.js';
-import { externalizeXWalkPrefix, getYearFromPath } from '../../scripts/utils/path.js';
+import { externalizeXWalkPrefixLink, getYearFromPath } from '../../scripts/utils/path.js';
 import { getSiteRootPathAlsoForSpeakerPath, getSpeakerOverviewPath } from '../../scripts/utils/site.js';
 
 /**
@@ -51,7 +51,7 @@ function addTalkList(parent, talkItems, title) {
   talkItems.forEach((item) => {
     const li = append(ul, 'li');
     const a = append(li, 'a');
-    a.href = externalizeXWalkPrefix(item.path);
+    a.href = externalizeXWalkPrefixLink(item.path);
     a.textContent = removeTitleSuffix(item.title);
     li.append(` (${getYearFromPath(item.path)})`);
   });

blocks/speaker-gallery/speaker-gallery.js

@@ -2,7 +2,7 @@ import { createOptimizedPicture, readBlockConfig } from '../../scripts/aem.js';
 import { getQueryIndex } from '../../scripts/services/QueryIndex.js';
 import { append } from '../../scripts/utils/dom.js';
 import { buildTwitterHandle, buildTwitterUrl, parseCSVArray } from '../../scripts/utils/metadata.js';
-import { externalizeXWalkPrefix } from '../../scripts/utils/path.js';
+import { externalizeXWalkPrefixLink } from '../../scripts/utils/path.js';
 import { getSiteRootPath, getSpeakerDetailPath } from '../../scripts/utils/site.js';
 
 /**
@@ -48,13 +48,13 @@ function addSpeaker(parent, speaker, speakerIndex, siteRootPath, queryIndex) {
   const div = append(parent, 'div', 'speaker');
 
   const imageAnchor = append(div, 'a');
-  imageAnchor.href = externalizeXWalkPrefix(speakerUrl);
+  imageAnchor.href = externalizeXWalkPrefixLink(speakerUrl);
   const eagerImage = (speakerIndex <= 3); // use eager loading for first 4 speaker images
   imageAnchor.append(createSpeakerImage(speakerItem, eagerImage));
 
   const nameDiv = append(div, 'div', 'name');
   const a = append(nameDiv, 'a');
-  a.href = externalizeXWalkPrefix(speakerUrl);
+  a.href = externalizeXWalkPrefixLink(speakerUrl);
   a.textContent = speakerItem.title;
 
   if (speakerItem.twitter) {

blocks/talk-detail-after-outline/talk-detail-after-outline.js

@@ -4,7 +4,7 @@ import { getQueryIndex } from '../../scripts/services/QueryIndex.js';
 import { parseCSVArray } from '../../scripts/utils/metadata.js';
 import { getSiteRootPath, getSpeakerDetailPath } from '../../scripts/utils/site.js';
 import { decorateAnchors } from '../../scripts/services/LinkHandler.js';
-import { externalizeXWalkPrefix } from '../../scripts/utils/path.js';
+import { externalizeXWalkPrefixLink } from '../../scripts/utils/path.js';
 
 /**
  * List talk speakers.
@@ -28,7 +28,7 @@ function buildSpeakers(parent, siteRootPath, queryIndex) {
     const speakerUrl = getSpeakerDetailPath(speakerItem, siteRootPath);
 
     const imageAnchor = append(li, 'a');
-    imageAnchor.href = externalizeXWalkPrefix(speakerUrl);
+    imageAnchor.href = externalizeXWalkPrefixLink(speakerUrl);
     if (speakerItem.image) {
       imageAnchor.append(createOptimizedPicture(
         speakerItem.image,
@@ -43,7 +43,7 @@ function buildSpeakers(parent, siteRootPath, queryIndex) {
     }
 
     const a = append(li, 'a');
-    a.href = externalizeXWalkPrefix(speakerUrl);
+    a.href = externalizeXWalkPrefixLink(speakerUrl);
     a.textContent = speakerItem.title;
 
     if (speakerItem.affiliation) {

blocks/talk-detail-before-outline/talk-detail-before-outline.js

@@ -3,7 +3,7 @@ import { getScheduleData } from '../../scripts/services/ScheduleData.js';
 import { formatDateFull, formatTime } from '../../scripts/utils/datetime.js';
 import { append } from '../../scripts/utils/dom.js';
 import { parseCSVArray } from '../../scripts/utils/metadata.js';
-import { externalizeXWalkPrefix } from '../../scripts/utils/path.js';
+import { externalizeXWalkPrefix, externalizeXWalkPrefixLink } from '../../scripts/utils/path.js';
 import { getArchivePath, getSiteRootPath } from '../../scripts/utils/site.js';
 
 /**
@@ -20,7 +20,7 @@ function buildTalkTags(parent) {
   tags.forEach((tag) => {
     const li = append(ul, 'li');
     const a = append(li, 'a');
-    a.href = `${externalizeXWalkPrefix(getArchivePath(document.location.pathname))}#tags=${encodeURIComponent(tag)}`;
+    a.href = `${externalizeXWalkPrefixLink(getArchivePath(document.location.pathname))}#tags=${encodeURIComponent(tag)}`;
     a.textContent = tag;
   });
 }

blocks/talk-detail-footer/talk-detail-footer.js

@@ -1,5 +1,5 @@
 import { append } from '../../scripts/utils/dom.js';
-import { externalizeXWalkPrefix } from '../../scripts/utils/path.js';
+import { externalizeXWalkPrefixLink } from '../../scripts/utils/path.js';
 import { getParentPath, getSchedulePath } from '../../scripts/utils/site.js';
 
 /**
@@ -13,7 +13,7 @@ export default async function decorate(block) {
   const schedulePath = getSchedulePath(document.location.pathname);
 
   const backLink = append(p, 'a');
-  backLink.href = externalizeXWalkPrefix(parentPath);
+  backLink.href = externalizeXWalkPrefixLink(parentPath);
   if (parentPath === schedulePath) {
     backLink.textContent = 'Back to schedule';
   } else {

scripts/services/LinkHandler.js

@@ -1,4 +1,4 @@
-import { externalizeXWalkPrefix } from '../utils/path.js';
+import { externalizeXWalkPrefixLink } from '../utils/path.js';
 import Link from './Link.js';
 
 /**
@@ -11,7 +11,7 @@ export function rewriteUrl(url) {
   if (url) {
     const link = new Link(url);
     if (link.isAdaptToSiteUrl()) {
-      return externalizeXWalkPrefix(link.getAdaptToSiteUrlPath());
+      return externalizeXWalkPrefixLink(link.getAdaptToSiteUrlPath());
     }
   }
   return url;
@@ -30,7 +30,7 @@ export function decorateAnchor(a) {
   if (url) {
     const link = new Link(url);
     if (link.isAdaptToSiteUrl()) {
-      a.href = externalizeXWalkPrefix(link.getAdaptToSiteUrlPath());
+      a.href = externalizeXWalkPrefixLink(link.getAdaptToSiteUrlPath());
       if (link.isDownload()) {
         a.setAttribute('download', '');
       }

scripts/utils/path.js

@@ -99,6 +99,27 @@ export function externalizeXWalkPrefix(pathName) {
   return prefix + pathNameWithoutPrefix;
 }
 
+/**
+ * Externalizes URL path by adding X-Walk prefix if current location has X-Walk prefix
+ * and - if in author environment - adding html extension.
+ * @param {string} pathName Path name with our withour X-Walk prefix.
+ * @returns Path name with X-Walk prefix if current location has X-Walk prefix, and .html extension.
+ */
+export function externalizeXWalkPrefixLink(pathName) {
+  const externalized = externalizeXWalkPrefix(pathName);
+  if (externalized.startsWith(xwalkPrefix)) {
+    const url = new URL(externalized, window.location);
+    if (url.pathname.endsWith('/')) {
+      url.pathname = `${url.pathname}index.html`;
+    }
+    if (!url.pathname.endsWith('.html')) {
+      url.pathname = `${url.pathname}.html`;
+    }
+    return url.toString();
+  }
+  return externalized;
+}
+
 /**
  * Gets year from given path.
  * @param {string} pathName Path name.

scripts/utils/site.js

@@ -1,6 +1,6 @@
 import { append } from './dom.js';
 import { getQueryIndex } from '../services/QueryIndex.js';
-import { externalizeXWalkPrefix, getYearFromPath, splitXWalkPrefix } from './path.js';
+import { externalizeXWalkPrefixLink, getYearFromPath, splitXWalkPrefix } from './path.js';
 
 const siteRootRegex = /^(\/\d\d\d\d\/)(.+)?$/;
 const speakerPathRegex = /^\/speakers\/[^/]+$/;
@@ -151,8 +151,7 @@ export async function addArchiveLinks(nav) {
     queryIndex.getAllSiteRoots().forEach((siteRoot) => {
       const listItem = append(ul, 'li');
       const link = append(listItem, 'a');
-      const [prefix] = splitXWalkPrefix(document.location.pathname);
-      link.href = externalizeXWalkPrefix(siteRoot.path) + (prefix !== '' ? 'index.html' : '');
+      link.href = externalizeXWalkPrefixLink(siteRoot.path);
       link.textContent = siteRoot.title;
     });
   }