browser-extension-manager 0.0.1 → 1.0.0

package/dist/gulp/tasks/package.js

@@ -10,6 +10,8 @@ const JSON5 = require('json5');
 // Load package
 const package = Manager.getPackage('main');
 const project = Manager.getPackage('project');
+const rootPathPackage = Manager.getRootPath('main');
+const rootPathProject = Manager.getRootPath('project');
 
 // Glob
 const input = [
@@ -19,22 +21,15 @@ const input = [
   // Files to exclude
   // '!dist/**',
 ];
-const output = 'dist/assets/images/icons';
+const output = 'dist';
 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) {
+async function compileManifest(outputDir) {
   try {
     const manifestPath = path.join('dist', 'manifest.json');
-    const outputPath = path.join('packaged', browser, 'manifest.json');
-    const configPath = path.join(__dirname, '../../', 'config', 'manifest.json');
+    const outputPath = path.join(outputDir, 'manifest.json');
+    const configPath = path.join(rootPathPackage, 'dist', 'config', 'manifest.json');
 
     // Read and parse using JSON5
     const manifest = JSON5.parse(jetpack.read(manifestPath));
@@ -66,26 +61,25 @@ async function compileManifest(browser, complete) {
     // Save as regular JSON
     jetpack.write(outputPath, JSON.stringify(manifest, null, 2));
 
-    logger.log(`Manifest compiled with defaults and saved for ${browser}`);
+    logger.log(`Manifest compiled with defaults`);
   } catch (e) {
-    logger.error(`Error compiling manifest for ${browser}`, e);
+    logger.error(`Error compiling manifest`, e);
   }
-  return complete();
 }
 
 // Special Compilation Task for _locales
-async function compileLocales(browser, complete) {
+async function compileLocales(outputDir) {
   try {
     const localesDir = path.join('dist', '_locales');
-    const outputDir = path.join('packaged', browser, '_locales');
+    const outputLocalesDir = path.join(outputDir, '_locales');
 
     // Ensure the directory exists
-    jetpack.dir(outputDir);
+    jetpack.dir(outputLocalesDir);
 
     // Process each locale file
     jetpack.find(localesDir, { matching: '**/*.json' }).forEach(filePath => {
       const relativePath = path.relative(localesDir, filePath);
-      const outputPath = path.join(outputDir, relativePath);
+      const outputPath = path.join(outputLocalesDir, relativePath);
 
       // Read and parse using JSON5
       const localeData = JSON5.parse(jetpack.read(filePath));
@@ -96,51 +90,109 @@ async function compileLocales(browser, complete) {
       logger.log(`Locale compiled and saved: ${outputPath}`);
     });
   } catch (e) {
-    logger.error(`Error compiling locales for ${browser}`, e);
+    logger.error(`Error compiling locales`, e);
   }
-  return complete();
 }
 
-// Package Task for Each Browser
-async function packageBrowser(browser, complete) {
+// Package Task for raw
+async function packageRaw() {
   // Log
-  logger.log(`Starting packaging for ${browser}...`);
+  logger.log(`Starting raw packaging...`);
 
   try {
-    const outputDir = `packaged/${browser}`;
+    const outputDir = 'packaged/raw';
 
     // 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
+    // Copy files to raw package 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}`);
+    await compileManifest(outputDir);
+    await compileLocales(outputDir);
 
     // Log completion
-    logger.log(`Finished packaging for ${browser}`);
+    logger.log(`Finished raw packaging`);
   } catch (e) {
-    logger.error(`Error packaging for ${browser}`, e);
+    logger.error(`Error during raw packaging`, e);
   }
+}
 
-  return complete();
+// Create zipped version of raw package
+async function packageZip() {
+  // Log
+  logger.log(`Zipping raw package...`);
+
+  try {
+    const inputDir = 'packaged/raw';
+    const zipPath = 'packaged/extension.zip';
+
+    // Create packed extension (.zip)
+    if (Manager.isBuildMode()) {
+      await execute(`zip -r ${zipPath} ${inputDir}`);
+      logger.log(`Zipped package created at ${zipPath}`);
+    } else {
+      logger.log(`Skipping zip (not in build mode)`);
+    }
+  } catch (e) {
+    logger.error(`Error zipping package`, e);
+  }
 }
 
-// Generate tasks for each browser
-const tasks = isSpecificBrowser
-  ? [packageBrowser.bind(null, targetBrowser)]
-  : BROWSERS.map((browser) => packageBrowser.bind(null, browser));
+function liveReload() {
+  // Log
+  logger.log('Reloading live server clients...');
+
+  // Quit if in build mode
+  if (Manager.isBuildMode()) {
+    return logger.log('Skipping live reload in non-build mode');
+  }
+
+  // Quit if no websocket server
+  if (!global.websocket) {
+    return logger.log('No live reload server found');
+  }
+
+  // Reload each client
+  global.websocket.clients.forEach((client) => {
+    // Get client IP
+    const clientIp = client._socket?.remoteAddress || 'Unknown IP';
+
+    // Log
+    logger.log(`Sending to client at IP: ${clientIp}`);
+
+    // Send
+    client.send(JSON.stringify({ command: 'reload' }))
+  })
+
+  // Complete
+  return;
+}
+
+// Package Task
+async function packageFn(complete) {
+  // Log
+  logger.log('Starting...');
+
+  // Run packageRaw
+  await packageRaw();
+
+  // Run packageZip
+  await packageZip();
+
+  // Run liveReload
+  liveReload();
+
+  // Log
+  logger.log('Finished!');
+
+  // Complete
+  return complete();
+}
 
 // Watcher Task
-function packageWatcher(complete) {
+function packageFnWatcher(complete) {
   // Quit if in build mode
   if (Manager.isBuildMode()) {
     logger.log('[watcher] Skipping watcher in build mode');
@@ -151,7 +203,7 @@ function packageWatcher(complete) {
   logger.log('[watcher] Watching for changes...');
 
   // Watch for changes in the dist folder
-  watch(input, { delay: delay }, series(parallel(...tasks)))
+  watch(input, { delay: delay }, packageFn)
     .on('change', function (path) {
       logger.log(`[watcher] File ${path} was changed`);
     });
@@ -161,7 +213,4 @@ function packageWatcher(complete) {
 }
 
 // Export tasks
-module.exports = series(
-  parallel(...tasks),
-  packageWatcher
-);
+module.exports = series(packageFn, packageFnWatcher);

package/dist/gulp/tasks/sass.js

@@ -10,6 +10,8 @@ const rename = require('gulp-rename');
 // Load package
 const package = Manager.getPackage('main');
 const project = Manager.getPackage('project');
+const rootPathPackage = Manager.getRootPath('main');
+const rootPathProject = Manager.getRootPath('project');
 
 // Glob
 const input = [
@@ -17,9 +19,7 @@ const input = [
   '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')}/**/*`
+  `${rootPathPackage}/dist/assets/css/**/*`,
 
   // Files to exclude
   // '!dist/**',
@@ -35,6 +35,32 @@ function sass(complete) {
   // Compile
   return src(input)
     .pipe(compiler({ outputStyle: 'compressed' }).on('error', compiler.logError))
+    // .pipe(
+    //   compiler({
+    //     outputStyle: 'compressed',
+    //     // importer: alias.create({
+    //     //   // '@themes': path.resolve(rootPathProject, `node_modules/${package.name}/dist/assets`),
+    //     //   '@themes': '/node_modules/browser-extension-manager/dist/assets/themes',
+    //     // }),
+    //     // importers: [customAliasImporter],
+    //     // includePaths: [
+    //     //   // path.resolve(rootPathProject, `node_modules/${package.name}/dist/assets`),
+    //     //   '/Users/ian/Developer/Repositories/Slinko/slinko-browser-extension/node_modules/browser-extension-manager/dist/assets',
+    //     // ]
+    //     // includePaths: [
+    //     //   path.join(__dirname, '..', '..', 'src'),
+    //     //   path.resolve(__dirname, '../../src/assets'),
+    //     //   path.resolve(__dirname, '../../src'),
+    //     // ],
+    //     // includePaths: [
+    //     //   path.resolve(__dirname, '../../'),
+    //     //   path.resolve(process.cwd(), '../../'),
+    //     // ],
+    //     // loadPaths: [
+    //     //   path.resolve(rootPathProject, `node_modules/${package.name}/dist/assets`),
+    //     // ],
+    //   }).on('error', compiler.logError)
+    // )
     .pipe(cleanCSS())
     .pipe(rename((path) => {
       path.basename += '.bundle';

package/dist/gulp/tasks/serve.js

@@ -2,182 +2,33 @@
 const Manager = new (require('../../build.js'));
 const logger = Manager.logger('serve');
 const path = require('path');
-const browserSync = require('browser-sync').create();
+const WebSocket = require('ws');
 
 // 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();
-    },
-  },
-}
+const rootPathPackage = Manager.getRootPath('main');
+const rootPathProject = Manager.getRootPath('project');
 
 // 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;
+  // Get the local URL
+  const server = new WebSocket.Server({ port: Manager.getLiveReloadPort() })
 
-    // Log
-    logger.log('Finished!');
+  // Log
+  logger.log(`LiveReload server started on port ${Manager.getLiveReloadPort()}`);
 
-    // Complete
-    return complete();
+  // Log connection
+  server.on('connection', (socket, request) => {
+    logger.log(`LiveReload client connected from local IP: ${request.socket.localAddress}`);
   });
-};
-
-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);
-    });
+  // Set server
+  global.websocket = server;
 
-    // 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);
-      }
-    });
-  });
-}
+  // Complete
+  return complete();
+};

package/dist/gulp/tasks/test.js

@@ -5,6 +5,8 @@ const logger = Manager.logger('test');
 // Load package
 const package = Manager.getPackage('main');
 const project = Manager.getPackage('project');
+const rootPathPackage = Manager.getRootPath('main');
+const rootPathProject = Manager.getRootPath('project');
 
 // Task
 module.exports = function test(complete) {

package/dist/gulp/tasks/themes.js

@@ -0,0 +1,75 @@
+// Libraries
+const Manager = new (require('../../build.js'));
+const logger = Manager.logger('themes');
+const { src, dest, watch, series } = require('gulp');
+const through2 = require('through2');
+const jetpack = require('fs-jetpack');
+const path = require('path');
+const { execute } = require('node-powertools');
+
+// Load package
+const package = Manager.getPackage('main');
+const project = Manager.getPackage('project');
+const manifest = Manager.getManifest();
+const rootPathPackage = Manager.getRootPath('main');
+const rootPathProject = Manager.getRootPath('project');
+
+// Glob
+const input = [
+  // Files to include
+  `${rootPathPackage}/dist/assets/themes/**/*`,
+
+  // Files to exclude
+  // '!dist/**',
+];
+const output = 'src/assets/themes';
+const delay = 250;
+
+// Index
+let index = -1;
+
+// Main task
+async function themes(complete) {
+  // Increment index
+  index++;
+
+  // Log
+  logger.log('Starting...');
+
+  // Complete
+  return src(input)
+    .pipe(dest(output))
+    .on('end', () => {
+      // Log
+      logger.log('Finished!');
+
+      // Complete
+      return complete();
+    });
+}
+
+// Watcher task
+function themesWatcher(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 }, themes)
+  .on('change', function(path) {
+    logger.log(`[watcher] File ${path} was changed`);
+  });
+
+  // Complete
+  return complete();
+}
+
+// Default Task
+module.exports = series(themes, themesWatcher);
+
+

package/dist/gulp/tasks/webpack.js

@@ -13,6 +13,8 @@ const package = Manager.getPackage('main');
 const project = Manager.getPackage('project');
 const manifest = Manager.getManifest();
 const config = Manager.getConfig();
+const rootPathPackage = Manager.getRootPath('main');
+const rootPathProject = Manager.getRootPath('project');
 
 // Load variables
 const firebaseVersion = version.clean(require('web-manager/package.json').dependencies.firebase);
@@ -28,7 +30,7 @@ const input = [
   'src/assets/js/background.js',
 
   // Include UJ's dist files
-  path.join(__dirname, '../../../dist/assets/js/**/*.js'),
+  `${rootPathPackage}/dist/assets/js/**/*`,
 
   // Files to exclude
   // '!dist/**',
@@ -50,6 +52,7 @@ const settings = {
 
       // Specific
       firebaseVersion: firebaseVersion,
+      liveReloadPort: Manager.getLiveReloadPort(),
     }),
   ],
   entry: {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "browser-extension-manager",
-  "version": "0.0.1",
+  "version": "1.0.0",
   "description": "Browser Extension Manager dependency manager",
   "main": "dist/index.js",
   "exports": {
@@ -76,6 +76,7 @@
     "webpack": "^5.98.0",
     "wonderful-fetch": "^1.3.3",
     "wonderful-version": "^1.3.2",
+    "ws": "^8.18.1",
     "yargs": "^17.7.2"
   },
   "peerDependencies": {

package/dist/assets/js copy/base.js

@@ -1,7 +0,0 @@
-// // Initiate the web manager
-// Manager = new (require('web-manager'));
-
-// Manager.init(Configuration, function() {
-//   // Initialize core.js
-//   require('./core.js');
-// });

package/dist/assets/js copy/core.js

@@ -1,81 +0,0 @@
-// Manager.log('Init main.js');
-
-// var dom = Manager.dom();
-// var url = window.location.href;
-
-// // Load page specific scripts
-// if (url.includes('/pricing')) {
-//   dom.loadScript({src: 'https://cdn.itwcreativeworks.com/assets/general/js/pricing-page-handler/index.js'})
-// } else if (url.includes('/download')) {
-//   dom.loadScript({src: 'https://cdn.itwcreativeworks.com/assets/general/js/download-page-handler/index.js'})
-// } else if (url.includes('/browser-extension') || url.includes('/extension')) {
-//   dom.loadScript({src: 'https://cdn.itwcreativeworks.com/assets/general/js/browser-extension-page-handler/index.js'})
-// } else if (window.location.pathname.endsWith('.html')) {
-//   // Redirect and remove .html
-//   window.location.pathname = window.location.pathname.replace('.html', '');
-// }
-
-// // Load Slapform
-// var slapform;
-// dom.select('form.slapform')
-// .each(function (el, i) {
-
-//   dom.select(el).on('submit', function (event) {
-//     event.preventDefault();
-//     import('./slapform-processor.js')
-//     .then(function (mod) {
-//       slapform = slapform || new mod.default;
-//       slapform.process(event);
-//     })
-//   });
-
-//   dom.select(el.querySelector('button[type="submit"]'))
-//     .removeAttribute('disabled')
-//     .removeClass('disabled');
-// })
-
-// // Setup Tracking
-// var storage = Manager.storage();
-// var auth = storage.get('user.auth') || {};
-// var setup = false;
-
-// if (auth && auth.uid && auth.email) {
-//   setupTracking(auth);
-// }
-
-// // Save user auth data
-// Manager.auth().ready(function (user) {
-//   setupTracking(user);
-
-//   storage.set('user.auth.uid', user.uid);
-//   storage.set('user.auth.email', user.email);
-// })
-
-// function setupTracking(config) {
-//   if (setup) { return; }
-
-//   var tracking = window.Configuration.global.tracking;
-//   var phone = config.phone ? parseInt(config.phone.replace(/\+/ig, '')) : null;
-
-//   // Google Analytics
-//   gtag('set', 'user_id', config.uid);
-
-//   // Facebook Pixel
-//   fbq('init', tracking.facebookPixel, {
-//     external_id: config.uid,
-//     em: config.email,
-//     ph: phone,
-//     // fn: 'first_name',
-//     // ln: 'last_name',
-//   });
-
-//   // TikTok Pixel
-//   ttq.identify({
-//     external_id: config.uid || '',
-//     email: config.email || '',
-//     phone_number: phone ? '+' + phone : '',
-//   })
-
-//   setup = true;
-// }
-