diff --git a/javascripts/all-articles.js b/javascripts/all-articles.js
new file mode 100644
index 000000000000..45fddf6605b6
--- /dev/null
+++ b/javascripts/all-articles.js
@@ -0,0 +1,18 @@
+/**
+ * Handles the client-side events for `includes/all-articles.html`.
+ */
+export default function allArticles () {
+ const buttons = document.querySelectorAll('button.js-all-articles-show-more')
+
+ for (const btn of buttons) {
+ btn.addEventListener('click', evt => {
+ // Show all hidden links
+ const hiddenLinks = evt.currentTarget.parentElement.querySelectorAll('li.d-none')
+ for (const link of hiddenLinks) {
+ link.classList.remove('d-none')
+ }
+ // Remove the button, since we don't need it anymore
+ evt.currentTarget.parentElement.removeChild(evt.currentTarget)
+ })
+ }
+}
diff --git a/javascripts/index.js b/javascripts/index.js
index a6d6f4649ebf..803d7a155380 100644
--- a/javascripts/index.js
+++ b/javascripts/index.js
@@ -16,6 +16,7 @@ import copyCode from './copy-code'
import { fillCsrf } from './get-csrf'
import initializeEvents from './events'
import filterCodeExamples from './filter-code-examples'
+import allArticles from './all-articles'
document.addEventListener('DOMContentLoaded', async () => {
displayPlatformSpecificContent()
@@ -34,4 +35,5 @@ document.addEventListener('DOMContentLoaded', async () => {
copyCode()
initializeEvents()
filterCodeExamples()
+ allArticles()
})
diff --git a/layouts/product-landing.html b/layouts/product-landing.html
index 4ffcedfc368d..b1f258f67c73 100644
--- a/layouts/product-landing.html
+++ b/layouts/product-landing.html
@@ -98,6 +98,10 @@
Guides
{% endif %}
+
+ {% include all-articles %}
+
+
{% include small-footer %}
diff --git a/lib/render-content.js b/lib/render-content.js
index a9a482811e8e..ff18773c5d41 100644
--- a/lib/render-content.js
+++ b/lib/render-content.js
@@ -18,4 +18,15 @@ for (const tag in tags) {
renderContent.liquid.registerTag(tag, ExtendedMarkdown)
}
+renderContent.liquid.registerFilters({
+ /**
+ * Like the `size` filter, but specifically for
+ * getting the number of keys in an object
+ */
+ obj_size: (input) => {
+ if (!input) return 0
+ return Object.keys(input).length
+ }
+})
+
module.exports = renderContent