add dev-toc javascripts

javascripts/dev-toc.js

@@ -0,0 +1,23 @@
+const expandText = 'Expand All'
+const closeText = 'Close All'
+
+export default function devToc () {
+  const expandButton = document.querySelector('.js-expand')
+  if (!expandButton) return
+
+  expandButton.addEventListener('click', () => {
+    // on click, toggle the button text
+    expandButton.textContent === expandText
+      ? expandButton.textContent = closeText
+      : expandButton.textContent = expandText
+
+    // on click, toggle all the details elements open or closed
+    const detailsElements = document.querySelectorAll('details')
+
+    for (const detailsElement of detailsElements) {
+      detailsElement.open 
+        ? detailsElement.removeAttribute('open')
+        : detailsElement.open = true
+    }
+  })
+}

javascripts/index.js

@@ -17,23 +17,28 @@ import { fillCsrf } from './get-csrf'
 import initializeEvents from './events'
 import filterCodeExamples from './filter-code-examples'
 import allArticles from './all-articles'
+import devToc from './dev-toc'
 
-document.addEventListener('DOMContentLoaded', async () => {
-  displayPlatformSpecificContent()
-  explorer()
-  search()
-  nav()
-  browserDateFormatter()
-  deprecationBanner()
-  sidebar()
-  wrapCodeTerms()
-  print()
-  localization()
-  await fillCsrf() // this must complete before any POST calls
-  helpfulness()
-  experiment()
-  copyCode()
-  initializeEvents()
-  filterCodeExamples()
-  allArticles()
-})
+if (location.pathname.endsWith('/dev-toc')) {
+  devToc()
+} else {
+  document.addEventListener('DOMContentLoaded', async () => {
+    displayPlatformSpecificContent()
+    explorer()
+    search()
+    nav()
+    browserDateFormatter()
+    deprecationBanner()
+    sidebar()
+    wrapCodeTerms()
+    print()
+    localization()
+    await fillCsrf() // this must complete before any POST calls
+    helpfulness()
+    experiment()
+    copyCode()
+    initializeEvents()
+    filterCodeExamples()
+    allArticles()
+  })
+}