From 5eb5b74de3ef08081b3bb0debd9a978cf48b0b6c Mon Sep 17 00:00:00 2001 From: Elliott Marquez <5981958+e111077@users.noreply.github.com> Date: Sat, 11 Nov 2023 11:27:28 -0800 Subject: [PATCH] centralize articles, video, and external data into global 11ty data (#1265) * centralize articles, video, and external data into global 11ty data * Delete tutorials index.html and tutorials.11tydata.js * Update .prettierignore file. * address PR suggestions * update screenshot golden * Remove gray-matter from devDependencies. --- package-lock.json | 1 - package.json | 1 - .../site/_data/externalSearchData.json | 13 ++ .../tutorials.js} | 18 +- packages/lit-dev-content/site/_data/videos.js | 98 +++++++++ .../site/articles/article/article.11tydata.js | 9 +- .../site/learn/learn.11tydata.js | 199 +++--------------- .../lit-dev-content/site/tutorials/index.html | 94 --------- .../learnCatalog-darwin.png | Bin 386453 -> 405279 bytes 9 files changed, 158 insertions(+), 275 deletions(-) create mode 100644 packages/lit-dev-content/site/_data/externalSearchData.json rename packages/lit-dev-content/site/{tutorials/tutorials.11tydata.js => _data/tutorials.js} (93%) create mode 100644 packages/lit-dev-content/site/_data/videos.js delete mode 100644 packages/lit-dev-content/site/tutorials/index.html diff --git a/package-lock.json b/package-lock.json index 620727567..0d6ca15b3 100644 --- a/package-lock.json +++ b/package-lock.json @@ -12,7 +12,6 @@ "packages/*" ], "devDependencies": { - "gray-matter": "^4.0.3", "playground-elements": "^0.18.0", "prettier": "^2.1.2", "typescript": "~4.7.4", diff --git a/package.json b/package.json index 244de3588..862d93795 100644 --- a/package.json +++ b/package.json @@ -61,7 +61,6 @@ } }, "devDependencies": { - "gray-matter": "^4.0.3", "playground-elements": "^0.18.0", "prettier": "^2.1.2", "typescript": "~4.7.4", diff --git a/packages/lit-dev-content/site/_data/externalSearchData.json b/packages/lit-dev-content/site/_data/externalSearchData.json new file mode 100644 index 000000000..659d2e4ca --- /dev/null +++ b/packages/lit-dev-content/site/_data/externalSearchData.json @@ -0,0 +1,13 @@ +[ + { + "relativeUrl": "https://developer.mozilla.org/en-US/docs/Web/API/ElementInternals", + "title": "ElementInternals", + "heading": "", + "text": "The ElementInternals interface of the Document Object Model gives web developers a way to allow custom elements to fully participate in HTML forms. It provides utilities for working with these elements in the same way you would work with any standard HTML form element, and also exposes the Accessibility Object Model to the element.", + "docType": { + "type": "MDN", + "tag": "other" + }, + "isExternal": true + } +] diff --git a/packages/lit-dev-content/site/tutorials/tutorials.11tydata.js b/packages/lit-dev-content/site/_data/tutorials.js similarity index 93% rename from packages/lit-dev-content/site/tutorials/tutorials.11tydata.js rename to packages/lit-dev-content/site/_data/tutorials.js index 3ad04160d..68147ccf6 100644 --- a/packages/lit-dev-content/site/tutorials/tutorials.11tydata.js +++ b/packages/lit-dev-content/site/_data/tutorials.js @@ -18,7 +18,7 @@ const path = require('path'); * @typedef {{ * featured: FeaturedOptions, * }} LoadDataOptions -*/ + */ /** @type{LoadDataOptions} */ const defaultOptions = {featured: {position: undefined}}; @@ -33,7 +33,7 @@ const defaultOptions = {featured: {position: undefined}}; * /tutorials/index.html */ const loadTutorialData = async (dirname, options = defaultOptions) => { - options = {...defaultOptions, ...options} + options = {...defaultOptions, ...options}; const tutorialDir = path.resolve( __dirname, '../../samples/tutorials', @@ -63,7 +63,11 @@ const loadTutorialData = async (dirname, options = defaultOptions) => { * To be consumed by the tutorials catalog (/tutorials/index.html). */ module.exports = async () => { - const tutorials = await Promise.all([ + /* + * tutorial data in order of rendering on the page plus stringified JSON for + * search indexing. + */ + return await Promise.all([ // Learn loadTutorialData('intro-to-lit', {featured: {position: 0}}), loadTutorialData('working-with-lists', {featured: {position: 1}}), @@ -71,7 +75,6 @@ module.exports = async () => { loadTutorialData('custom-attribute-converter'), loadTutorialData('async-directive'), - // Build loadTutorialData('svg-templates'), loadTutorialData('tooltip'), @@ -79,11 +82,6 @@ module.exports = async () => { loadTutorialData('word-viewer'), // Draft - loadTutorialData('wc-to-lit'), + // loadTutorialData('wc-to-lit'), ]); - /* - * tutorial data in order of rendering on the page plus stringified JSON for - * search indexing. - */ - return {eleventyComputed: {tutorials}}; }; diff --git a/packages/lit-dev-content/site/_data/videos.js b/packages/lit-dev-content/site/_data/videos.js new file mode 100644 index 000000000..0e8c09a8f --- /dev/null +++ b/packages/lit-dev-content/site/_data/videos.js @@ -0,0 +1,98 @@ +/** + * @license + * Copyright 2023 Google LLC + * SPDX-License-Identifier: BSD-3-Clause + */ + +const fs = require('fs').promises; +const path = require('path'); +const matter = require('gray-matter'); +const {existsSync} = require('fs'); + +const rootSiteDir = path.resolve(__dirname, '..'); + +// Note: YouTube thumbnail images can be obtained with +// https://i.ytimg.com/vi/