browser-extension-manager 0.0.1

package/dist/gulp/tasks/icons.js

@@ -0,0 +1,149 @@
+// Libraries
+const Manager = new (require('../../build.js'));
+const logger = Manager.logger('icons');
+const { src, dest, watch, series } = require('gulp');
+const glob = require('glob').globSync;
+const responsive = require('gulp-responsive-modern');
+
+// Load package
+const package = Manager.getPackage('main');
+const project = Manager.getPackage('project');
+
+// Glob
+const input = [
+  // Files to include
+  // 'src/assets/images/**/*.{jpg,jpeg,png}',
+  // 'src/assets/images/icons/**/*.{jpg,jpeg,png}',
+  'src/assets/images/icons/icon.png',
+
+  // Files to exclude
+  // '!dist/**',
+];
+const output = 'dist/assets/images/icons';
+const delay = 250;
+
+// Main task
+function icons(complete) {
+  // Log
+  logger.log('Starting...');
+
+  // Use glob to get file count for matching files
+  const files = glob(input);
+
+  // If there's no files, complete
+  if (files.length === 0) {
+    // Log
+    logger.log('Found 0 images to process');
+
+    // Complete
+    return complete();
+  }
+
+  // Log
+  logger.log(`Found ${files.length} images to process`, files);
+
+  // Filter out files that already exist in the destination
+  // const filesToProcess = files.filter(file => {
+  //   const fileName = path.basename(file);
+  //   const destFile = path.join(output, fileName);
+  //   return !jetpack.exists(destFile);
+  // });
+
+  // If there's no files to process, complete
+  // if (filesToProcess.length === 0) {
+  //   // Log
+  //   logger.log('No new images to process');
+
+  //   // Complete
+  //   return complete();
+  // }
+
+  // Log
+  // logger.log(`Processing ${filesToProcess.length} images`, filesToProcess);
+
+  // Process images: resize and convert to webp
+  return src(files)
+    .pipe(
+      responsive({
+        '**/*.{jpg,jpeg,png}': [
+          // 1024 resized version in original format
+          {
+            width: 1024,
+            rename: { suffix: '-1024x' }
+          },
+          // 512 resized version in original format
+          {
+            width: 512,
+            rename: { suffix: '-512x' }
+          },
+          // 256 resized version in original format
+          {
+            width: 256,
+            rename: { suffix: '-256x' }
+          },
+          // 128 resized version in original format
+          {
+            width: 128,
+            rename: { suffix: '-128x' }
+          },
+          // 48 resized version in original format
+          {
+            width: 48,
+            rename: { suffix: '-48x' }
+          },
+          // 32 resized version in original format
+          {
+            width: 32,
+            rename: { suffix: '-32x' }
+          },
+          // 16 resized version in original format
+          {
+            width: 16,
+            rename: { suffix: '-16x' }
+          },
+          // Original size in original format
+          {
+            rename: { suffix: '' }
+          }
+        ]
+      }, {
+        quality: 100,
+        progressive: true,
+        withMetadata: false,
+        withoutEnlargement: false,
+        skipOnEnlargement: false,
+      })
+    )
+    .pipe(dest(output))
+    .on('end', () => {
+      // Log
+      logger.log('Finished!');
+
+      // Complete
+      return complete();
+    });
+}
+
+// Watcher task
+function iconsWatcher(complete) {
+  // Quit if in build mode
+  if (Manager.isBuildMode()) {
+    logger.log('[watcher] Skipping watcher in build mode');
+    return complete();
+  }
+
+  // Log
+  logger.log('[watcher] Watching for changes...');
+
+  // Watch for changes
+  watch(input, { delay: delay }, icons)
+  .on('change', function(path) {
+    logger.log(`[watcher] File ${path} was changed`);
+  });
+
+  // Complete
+  return complete();
+}
+
+// Default Task
+module.exports = series(icons, iconsWatcher);

package/dist/gulp/tasks/package.js

@@ -0,0 +1,167 @@
+// Libraries
+const Manager = new (require('../../build.js'));
+const logger = Manager.logger('package');
+const path = require('path');
+const jetpack = require('fs-jetpack');
+const { series, parallel, watch } = require('gulp');
+const { execute, getKeys } = require('node-powertools');
+const JSON5 = require('json5');
+
+// Load package
+const package = Manager.getPackage('main');
+const project = Manager.getPackage('project');
+
+// Glob
+const input = [
+  // Files to include
+  'dist/**/*',
+
+  // Files to exclude
+  // '!dist/**',
+];
+const output = 'dist/assets/images/icons';
+const delay = 250;
+
+// Supported browsers
+const BROWSERS = ['chrome', 'firefox', 'opera'];
+
+// Environment Check
+const targetBrowser = process.env.BROWSER;
+const isSpecificBrowser = targetBrowser && BROWSERS.includes(targetBrowser);
+
+// Special Compilation Task for manifest.json with default settings
+async function compileManifest(browser, complete) {
+  try {
+    const manifestPath = path.join('dist', 'manifest.json');
+    const outputPath = path.join('packaged', browser, 'manifest.json');
+    const configPath = path.join(__dirname, '../../', 'config', 'manifest.json');
+
+    // Read and parse using JSON5
+    const manifest = JSON5.parse(jetpack.read(manifestPath));
+    const defaultConfig = JSON5.parse(jetpack.read(configPath));
+
+    // Apply defaults
+    getKeys(defaultConfig).forEach(key => {
+      const defaultValue = key.split('.').reduce((o, k) => (o || {})[k], defaultConfig);
+      const userValue = key.split('.').reduce((o, k) => (o || {})[k], manifest);
+
+      if (Array.isArray(defaultValue) && Array.isArray(userValue)) {
+        // Merge arrays
+        const mergedArray = Array.from(new Set([...defaultValue, ...userValue]));
+        key.split('.').reduce((o, k, i, arr) => {
+          if (i === arr.length - 1) o[k] = mergedArray;
+          else o[k] = o[k] || {};
+          return o[k];
+        }, manifest);
+      } else if (userValue === undefined) {
+        // Apply default if user value doesn't exist
+        key.split('.').reduce((o, k, i, arr) => {
+          if (i === arr.length - 1) o[k] = defaultValue;
+          else o[k] = o[k] || {};
+          return o[k];
+        }, manifest);
+      }
+    });
+
+    // Save as regular JSON
+    jetpack.write(outputPath, JSON.stringify(manifest, null, 2));
+
+    logger.log(`Manifest compiled with defaults and saved for ${browser}`);
+  } catch (e) {
+    logger.error(`Error compiling manifest for ${browser}`, e);
+  }
+  return complete();
+}
+
+// Special Compilation Task for _locales
+async function compileLocales(browser, complete) {
+  try {
+    const localesDir = path.join('dist', '_locales');
+    const outputDir = path.join('packaged', browser, '_locales');
+
+    // Ensure the directory exists
+    jetpack.dir(outputDir);
+
+    // Process each locale file
+    jetpack.find(localesDir, { matching: '**/*.json' }).forEach(filePath => {
+      const relativePath = path.relative(localesDir, filePath);
+      const outputPath = path.join(outputDir, relativePath);
+
+      // Read and parse using JSON5
+      const localeData = JSON5.parse(jetpack.read(filePath));
+
+      // Save as regular JSON
+      jetpack.write(outputPath, JSON.stringify(localeData, null, 2));
+
+      logger.log(`Locale compiled and saved: ${outputPath}`);
+    });
+  } catch (e) {
+    logger.error(`Error compiling locales for ${browser}`, e);
+  }
+  return complete();
+}
+
+// Package Task for Each Browser
+async function packageBrowser(browser, complete) {
+  // Log
+  logger.log(`Starting packaging for ${browser}...`);
+
+  try {
+    const outputDir = `packaged/${browser}`;
+
+    // Ensure the directory exists
+    jetpack.dir(outputDir);
+
+    // Perform any browser-specific adjustments if needed
+    // await execute(`npx bxm setup --browser=${browser}`);
+
+    // Copy files to browser-specific directory
+    await execute(`cp -r dist/* ${outputDir}`);
+
+    // Compile manifest and locales
+    await compileManifest(browser, () => {});
+    await compileLocales(browser, () => {});
+
+    // Create packed extension (.zip)
+    await execute(`zip -r ${outputDir}.zip ${outputDir}`);
+
+    // Log completion
+    logger.log(`Finished packaging for ${browser}`);
+  } catch (e) {
+    logger.error(`Error packaging for ${browser}`, e);
+  }
+
+  return complete();
+}
+
+// Generate tasks for each browser
+const tasks = isSpecificBrowser
+  ? [packageBrowser.bind(null, targetBrowser)]
+  : BROWSERS.map((browser) => packageBrowser.bind(null, browser));
+
+// Watcher Task
+function packageWatcher(complete) {
+  // Quit if in build mode
+  if (Manager.isBuildMode()) {
+    logger.log('[watcher] Skipping watcher in build mode');
+    return complete();
+  }
+
+  // Log
+  logger.log('[watcher] Watching for changes...');
+
+  // Watch for changes in the dist folder
+  watch(input, { delay: delay }, series(parallel(...tasks)))
+    .on('change', function (path) {
+      logger.log(`[watcher] File ${path} was changed`);
+    });
+
+  // Complete
+  return complete();
+}
+
+// Export tasks
+module.exports = series(
+  parallel(...tasks),
+  packageWatcher
+);

package/dist/gulp/tasks/sass.js

@@ -0,0 +1,74 @@
+// Libraries
+const Manager = new (require('../../build.js'));
+const logger = Manager.logger('sass');
+const { src, dest, watch, series } = require('gulp');
+const path = require('path');
+const compiler = require('gulp-sass')(require('sass'));
+const cleanCSS = require('gulp-clean-css');
+const rename = require('gulp-rename');
+
+// Load package
+const package = Manager.getPackage('main');
+const project = Manager.getPackage('project');
+
+// Glob
+const input = [
+  // Files to include
+  'src/assets/css/**/*.{css,scss,sass}',
+
+  // Main files
+  // `${__dirname}/../../assets/css/main.scss`,
+  // path.join(__dirname, '..', '..', 'assets/css/main.scss'),
+  `${path.join(__dirname, '..', '..', 'assets/css')}/**/*`
+
+  // Files to exclude
+  // '!dist/**',
+];
+const output = 'dist/assets/css';
+const delay = 250;
+
+// SASS Compilation Task
+function sass(complete) {
+  // Log
+  logger.log('Starting...');
+
+  // Compile
+  return src(input)
+    .pipe(compiler({ outputStyle: 'compressed' }).on('error', compiler.logError))
+    .pipe(cleanCSS())
+    .pipe(rename((path) => {
+      path.basename += '.bundle';
+    }))
+    .pipe(dest(output))
+    .on('end', () => {
+      // Log
+      logger.log('Finished!');
+
+      // Complete
+      return complete();
+    });
+}
+
+// Watcher Task
+function sassWatcher(complete) {
+  // Quit if in build mode
+  if (Manager.isBuildMode()) {
+    logger.log('[watcher] Skipping watcher in build mode');
+    return complete();
+  }
+
+  // Log
+  logger.log('[watcher] Watching for changes...');
+
+  // Watch for changes
+  watch(input, { delay: delay }, sass)
+  .on('change', function(path) {
+    logger.log(`[watcher] File ${path} was changed`);
+  });
+
+  // Complete
+  return complete();
+}
+
+// Default Task
+module.exports = series(sass, sassWatcher);

package/dist/gulp/tasks/serve.js

@@ -0,0 +1,183 @@
+// Libraries
+const Manager = new (require('../../build.js'));
+const logger = Manager.logger('serve');
+const path = require('path');
+const browserSync = require('browser-sync').create();
+
+// Load package
+const package = Manager.getPackage('main');
+const project = Manager.getPackage('project');
+
+// Local URL
+let localUrl;
+let externalUrl;
+
+// BrowserSync settings
+const settings = {
+  port: 4000,
+  browser: 'default',
+  cors: true,
+  open: false,
+  ghostMode: false,
+  server: {
+    // TODO: FIX?
+    // baseDir: '_site',
+    baseDir: '_site',
+    middleware: async function (req, res, next) {
+      const url = new URL(`${localUrl}${req.url}`);
+      const pathname = url.pathname;
+
+      // Set the query object
+      req.query = {};
+      req.body = {};
+
+      // If the file has no ext, log it
+      if (!path.extname(pathname)) {
+        logger.log(`Serving ${pathname}`);
+      }
+
+      // Process the post request
+      if (pathname.match(/\/_process/)) {
+        const qsUrl = url.searchParams.get('url');
+        let lib;
+
+        // Set query
+        url.searchParams.forEach((value, key) => {
+          req.query[key] = value;
+        })
+
+        // Set body
+        if (req.method === 'POST') {
+          req.body = await receiveRequestBody(req);
+        }
+
+        // Try to load the library
+        try {
+          // Clear the cache
+          delete require.cache[require.resolve(`../${qsUrl}`)];
+
+          // Load the library
+          lib = require(`../${qsUrl}`);
+        } catch (e) {
+          // Log the error
+          logger.error(`Error processing ${qsUrl}`);
+
+          // Set the status code
+          res.statusCode = 500;
+
+          // Return an error
+          return res.write(`Cannot find ${qsUrl}`);
+        }
+
+        // Log
+        logger.log(`Processing ${qsUrl}`);
+
+        // Process the library
+        return await lib({
+          req: req,
+          res: res,
+        })
+        .then((r) => {
+          // Set the status code
+          res.statusCode = 200;
+
+          // Write the response (if it's JSON, set the content type)
+          try {
+            r = JSON.stringify(r);
+            res.setHeader('Content-Type', 'application/json');
+          } catch (e) {
+          }
+
+          // End the response
+          res.write(r);
+          res.end();
+        })
+        .catch((e) => {
+          // Set the status code
+          res.statusCode = 500;
+
+          // Write the error
+          res.write(`Error processing ${qsUrl}: ${e}`);
+          res.end();
+        });
+      }
+
+      // Check if the URL is missing a trailing slash and does not have an extension
+      if (!pathname.endsWith('/') && !path.extname(pathname)) {
+        // Get the new URL
+        const newURL = `${pathname}.html`;
+
+        // Log
+        // logger.log(`Rewriting ${pathname} to ${newURL}`);
+
+        // Rewrite it to serve the .html extension
+        req.url = newURL;
+      }
+
+      // Special case: Rewrite /blog/ to blog.html since Jekyll fucks it up locally
+      if (pathname === '/blog/') {
+        req.url = '/blog.html';
+      }
+
+      // Continue
+      return next();
+    },
+  },
+}
+
+// Task
+module.exports = function serve(complete) {
+  // Log
+  logger.log('Starting...');
+
+  // Initialize browserSync
+  browserSync.init(settings, async (e, instance) => {
+    if (e) {
+      return logger.error(e);
+    }
+
+    // Get URLs
+    localUrl = instance.options.get('urls').get('local');
+    externalUrl = instance.options.get('urls').get('external');
+
+    // Write the config file
+    // jetpack.write('.temp/_config_browsersync.yml', `url: ${externalUrl}`);
+
+    // Set global variable to access browserSync in other files
+    global.browserSync = browserSync;
+
+    // Log
+    logger.log('Finished!');
+
+    // Complete
+    return complete();
+  });
+};
+
+function receiveRequestBody(req) {
+  return new Promise((resolve, reject) => {
+    let body = [];
+
+    // Listen for data
+    req.on('data', (chunk) => {
+      body.push(chunk.toString());
+    });
+
+    // Listen for errors
+    req.on('error', (err) => {
+      return reject(err);
+    });
+
+    // Listen for the end of the request
+    req.on('end', () => {
+      body = body.join('');
+
+      // Attempt to parse the body as JSON
+      try {
+        return resolve(JSON.parse(body));
+      } catch (e) {
+        return resolve(body);
+      }
+    });
+  });
+}

package/dist/gulp/tasks/test.js

@@ -0,0 +1,16 @@
+// Libraries
+const Manager = new (require('../../build.js'));
+const logger = Manager.logger('test');
+
+// Load package
+const package = Manager.getPackage('main');
+const project = Manager.getPackage('project');
+
+// Task
+module.exports = function test(complete) {
+  // Log
+  logger.log('Starting test...');
+
+  // Complete
+  return complete();
+}