const fs = require('fs');

let categoriesString = '';
let categoriesCounter = 0;
let examplesCounter = 0;
fs.readdir(`${__dirname}/src/examples/`, function (err, categories) {
    if (err) {
        return console.log('Unable to scan directory: ' + err);
    }
    categoriesCounter = categories.length;
    categories.forEach(function (category) {
        var dir = `dist/${category}`;
        if (!fs.existsSync(dir)) {
            fs.mkdirSync(dir);
        }
        fs.readdir(`${__dirname}/src/examples/${category}`, (err, examples) => {
            if (err) {
                return console.log('Unable to scan directory: ' + err);
            }
            categoriesString += `<h2>${category}</h2>`;
            examplesCounter += examples.length;
            examples.forEach((e) => {
                const example = e.replace('.tsx', '');
                categoriesString += `<li><a href='/#/iframe/${category}/${example}'>${example}</a></li>`;
                examplesCounter--;
                if (examplesCounter === 0) {
                    // categoriesString += '</ul>';
                    categoriesCounter--;
                    if (categoriesCounter === 0) {
                        createIframeDirectory();
                    }
                }
                const content = `
<!DOCTYPE html>
<html>
  <head>
    <meta http-equiv="refresh" content="0; url='/#/${category}/${example}'" />
    <meta name="twitter:card" content="photo" />
    <meta name="twitter:site" content="@playcanvas" />
    <meta name="twitter:title" content="${example.split('-').join(' ')}" />
    <meta name="twitter:description" content="A PlayCanvas engine example" />
    <meta name="twitter:image" content="https://playcanvas.github.io/thumbnails/${category}_${example}.png" />
    <meta name="twitter:url" content="https://playcanvas.github.io/${category}/${example}" />
  </head>
  <body>
    <p>Please follow <a href="/#/${category}/${example}">this link</a>.</p>
  </body>
</html>
`;
                var dir = `dist/${category}/${example}`;
                if (!fs.existsSync(dir)) {
                    fs.mkdirSync(dir);
                }
                fs.writeFile(`dist/${category}/${example}/index.html`, content, (err) => {
                    if (err) {
                        console.error(err);
                        return null;
                    }
                });
            });
        });
    });
});

function createIframeDirectory() {
    const iframeDirectoryHtml = `
    <!DOCTYPE html>
    <html>
    <head>
    </head>
    <body>
    ${categoriesString}
    </body>
    </html>
    `;
    var dir = `dist/iframes/`;
    if (!fs.existsSync(dir)) {
        fs.mkdirSync(dir);
    }
    fs.writeFile(`dist/iframes/index.html`, iframeDirectoryHtml, (err) => {
        if (err) {
            console.error(err);
            return null;
        }
    });
}

@@ -20,16 +20,41 @@
 'fs');%0A%0A
+let categoriesList = %5B%5D;%0A
 let cate
@@ -72,16 +72,16 @@
 g = '';%0A
-
 let cate
@@ -558,24 +558,210 @@
 mples) =%3E %7B%0A
+            examples = examples.map((example) =%3E example.replace('.tsx', ''));%0A            categoriesList.push(%7B%0A                name: category,%0A                examples%0A            %7D);%0A
             
@@ -995,70 +995,21 @@
 ch((
-e) =%3E %7B%0A                const 
 example
+)
  =
- e.replace('.tsx', '');
+%3E %7B
 %0A   
@@ -1195,60 +1195,8 @@
 ) %7B%0A
-                    // categoriesString += '%3C/ul%3E';%0A
     
@@ -1332,16 +1332,68 @@
 tory();%0A
+                        createCategoriesListFile();%0A
         
@@ -2871,24 +2871,24 @@
 dir);%0A    %7D%0A
-
     fs.write
@@ -3047,8 +3047,305 @@
   %7D);%0A%7D%0A
+%0Afunction createCategoriesListFile() %7B%0A    const text = %60/* eslint-disable no-unused-vars */%0Avar categories = $%7BJSON.stringify(categoriesList)%7D;%60;%0A    fs.writeFile(%60dist/examples.js%60, text, (err) =%3E %7B%0A        if (err) %7B%0A            console.error(err);%0A            return null;%0A        %7D%0A    %7D);%0A%7D%0A

extend the example directory script to build a list of examples in a javascript file (#3258)