Always show an ad even if there are no page subheadings (#299)

See the 'sidebar' section for pages that show the following examples:

- A page with no headings, and no ad
- A page with no headings, but there is an ad
- A page with headings, but there's no ad
- A page with both headings and an ad

Author: recrwplay

preview-src/sidebar-headings-ad.adoc

@@ -0,0 +1,14 @@
+= Page with ad and subheadings
+:page-ad-icon: mortarboard
+:page-ad-title: Free, Hands-on training with Neo4j GraphAcademy
+:page-ad-description: We're here to guide you on a fun and engaging journey to mastering Neo4j with free, hands-on courses.
+:page-ad-link: https://graphacademy.neo4j.com/?ref=promo-generic
+:page-ad-underline-role: button
+:page-ad-underline: Enroll now
+
+
+== Section 1
+This page has subheadings, so `toc-menu` is generated.
+
+== Section 2
+This page also has an ad, which should be displayed below the page contents.

preview-src/sidebar-headings-no-ad.adoc

@@ -0,0 +1,8 @@
+= Page with subheadings but no ad
+
+
+== Section 1
+This page has subheadings, so page contents is displayed.
+
+== Section 2
+There is no ad for this page.

preview-src/sidebar-no-headings-ad.adoc

@@ -0,0 +1,11 @@
+= Page with ad and no subheadings
+:page-ad-icon: mortarboard
+:page-ad-title: Free, Hands-on training with Neo4j GraphAcademy
+:page-ad-description: We're here to guide you on a fun and engaging journey to mastering Neo4j with free, hands-on courses.
+:page-ad-link: https://graphacademy.neo4j.com/?ref=promo-generic
+:page-ad-underline-role: button
+:page-ad-underline: Enroll now
+
+This page has no subheadings.
+
+But we still want the `toc-ad` to be displayed.

preview-src/sidebar-no-headings-no-ad.adoc

@@ -0,0 +1,5 @@
+= Page with no subheadings and no ad
+
+This page has no subheadings.
+
+It has no ad to display so there should be no `<aside class="toc sidebar">...</aside>` in the HTML.

preview-src/ui-model.yml

@@ -164,6 +164,20 @@ page:
       - content: warning
         url: banner-warning.html
         urlType: internal
+    - content: Sidebar
+      items:
+      - content: No headings, no ad
+        url: sidebar-no-headings-no-ad.html
+        urlType: internal
+      - content: No headings, with ad
+        url: sidebar-no-headings-ad.html
+        urlType: internal
+      - content: Headings, no ad
+        url: sidebar-headings-no-ad.html
+        urlType: internal
+      - content: Headings, with ad
+        url: sidebar-headings-ad.html
+        urlType: internal
     - content: Labels
       url: labels.html
       urlType: internal

src/js/02-on-this-page.js

@@ -11,10 +11,19 @@
   var article = document.querySelector('article.doc')
   var selectors = document.querySelector('.nav-container .selectors')
   var selectorsHeight = selectors ? selectors.getBoundingClientRect().height : 0
-  var headings
   var headingSelector = []
   for (var l = 0; l <= levels; l++) headingSelector.push(l ? '.sect' + l + '>h' + (l + 1) + '[id]' : 'h1[id].sect0')
-  if (!(headings = find(headingSelector.join(','), article)).length) return sidebar.parentNode.removeChild(sidebar) // remove sidebar if there are no headings
+  var headings = find(headingSelector.join(','), article)
+
+  var menu = sidebar.querySelector('.toc-menu-placeholder')
+  if (!menu) (menu = document.createElement('div')).className = 'toc-menu-placeholder'
+  var ad = document.querySelector('.toc-ad')
+
+  // display an ad or nothing if there are no headings
+  if (!(headings.length)) {
+    if (!ad) return sidebar.parentNode.removeChild(sidebar) // remove sidebar if there is no ad
+    return menu.parentNode.removeChild(menu) // remove toc menu if there are no headings but still display ad
+  }
 
   var lastActiveFragment
   var links = {}
@@ -29,9 +38,6 @@
     return accum
   }, document.createElement('ul'))
 
-  var menu = sidebar.querySelector('.toc-menu-placeholder')
-  if (!menu) (menu = document.createElement('div')).className = 'toc-menu-placeholder'
-
   if (document.querySelector('body.has-banner')) {
     document.querySelector('.toc-menu').style.top = 'calc(var(--toc-top) + var(--banner-height))'
   }