fix: og url and image have dirname in path

webpro · Jul 11, 2024 · 2890d9b · 2890d9b
1 parent 88cdbc0
commit 2890d9b
Show file tree

Hide file tree

Showing 3 changed files with 11 additions and 8 deletions.
diff --git a/lib/featured-slide.js b/lib/featured-slide.js
@@ -25,7 +25,7 @@ const getSlideAnchor = featuredSlide => {
 export default async (initialUrl, targetDir) => {
   const { featuredSlide } = getOptions();
 
-  if (!featuredSlide || !puppeteer) {
+  if ((!featuredSlide && featuredSlide !== 0)  || !puppeteer) {
     return;
   }
 
@@ -34,7 +34,8 @@ export default async (initialUrl, targetDir) => {
   const snapshotFilename = `${targetDir}/featured-slide.jpg`;
 
   const url = `http://${host}:${port}/${initialUrl}${getSlideAnchor(featuredSlide.toString())}`;
-
+
+  console.log("🚀 ~ url:", url)
   debug({ url, snapshotFilename, puppeteerLaunchConfig });
 
   try {

diff --git a/lib/render.js b/lib/render.js
@@ -37,7 +37,7 @@ function sanitize(entry) {
  * @param {Object} extraOptions - Additional options (mostly used by tests)
  * @returns {string} The rendered HTML compatible with reveal.js
  */
-export const render = async (fullMarkdown, extraOptions = {}) => {
+export const render = async (fullMarkdown, extraOptions = {}, filePath = undefined) => {
   const { yamlOptions, markdown: contentOnlyMarkdown } = parseYamlFrontMatter(fullMarkdown);
   const options = Object.assign(getSlideOptions(yamlOptions), extraOptions);
 
@@ -46,7 +46,8 @@ export const render = async (fullMarkdown, extraOptions = {}) => {
   const highlightThemeUrl = getHighlightThemeUrl(options.highlightTheme);
   const scriptPaths = getScriptPaths(options.scripts, options.assetsDir, options.base);
   const cssPaths = getCssPaths(options.css, options.assetsDir, options.base);
-
+  const ogImage = filePath ? path.dirname(filePath) + '/featured-slide.jpg' : 'featured-slide.jpg'
+  const ogUrl = filePath.replace('.md', '.html')
   const revealOptions = Object.assign({}, getRevealOptions(options.revealOptions), yamlOptions.revealOptions);
 
   const slidifyOptions = _.pick(options, Object.keys(slidifyAttributeNames));
@@ -55,7 +56,6 @@ export const render = async (fullMarkdown, extraOptions = {}) => {
     const escaped_value = value.replace(/\n/g, '\\n').replace(/\r/g, '\\r');
     slidifyAttributes.push(`${slidifyAttributeNames[key]}="${escaped_value}"`);
   }
-
   const preprocessorFn = await getPreprocessor(options.preprocessor);
   const processedMarkdown = await preprocessorFn(contentOnlyMarkdown, options);
 
@@ -67,6 +67,8 @@ export const render = async (fullMarkdown, extraOptions = {}) => {
     title,
     slidifyAttributes: slidifyAttributes.join(' '),
     markdown: processedMarkdown,
+    ogImage,
+    ogUrl,
     themeUrl,
     highlightThemeUrl,
     scriptPaths,
@@ -83,7 +85,7 @@ export const render = async (fullMarkdown, extraOptions = {}) => {
 export const renderFile = async (filePath, extraOptions) => {
   try {
     const content = await readFile(filePath);
-    return render(content.toString(), extraOptions);
+    return render(content.toString(), extraOptions, filePath);
   } catch (e) {
     return render('File not found.', extraOptions);
   }

diff --git a/lib/template/reveal.html b/lib/template/reveal.html
@@ -8,8 +8,8 @@
     {{#absoluteUrl}}
     <meta property="og:title" content="{{{title}}}" />
     <meta property="og:type" content="website" />
-    <meta property="og:image" content="{{{absoluteUrl}}}/featured-slide.jpg" />
-    <meta property="og:url" content="{{{absoluteUrl}}}" />
+    <meta property="og:image" content="{{{absoluteUrl}}}/{{{ogImage}}}" />
+    <meta property="og:url" content="{{{absoluteUrl}}}/{{{ogUrl}}}" />
     {{/absoluteUrl}}
     <link rel="shortcut icon" href="{{{base}}}/favicon.ico" />
     <link rel="stylesheet" href="{{{base}}}/dist/reset.css" />