profitlich-template-toolkit 0.4.4 → 0.5.0

package/package.json

@@ -1,7 +1,7 @@
 {
     "name": "profitlich-template-toolkit",
-    "version": "0.4.4",
-    "description": "Shared SCSS layout system, JS utilities and components for profitlich template repos",
+    "version": "0.5.0",
+    "description": "Shared SCSS layout system, JS utilities, components and build scripts for profitlich template repos",
     "type": "module",
     "exports": {
         "./dev": "./dev/Dev.js",
@@ -14,15 +14,24 @@
         "./utils/Vh100": "./utils/Vh100.js",
         "./utils/BodyScrolled": "./utils/BodyScrolled.js",
         "./components/menu-toggle/MenuToggle": "./components/menu-toggle/MenuToggle.js",
-        "./components/mux-player/MuxPlayer": "./components/mux-player/MuxPlayer.js"
+        "./components/mux-player/MuxPlayer": "./components/mux-player/MuxPlayer.js",
+        "./scripts/copy-files": "./scripts/copy-files.js",
+        "./scripts/deploy": "./scripts/deploy.js"
     },
     "files": [
         "dev/",
         "scss/",
         "utils/",
-        "components/"
+        "components/",
+        "scripts/"
     ],
     "dependencies": {
+        "basic-ftp": "^5.0.0",
+        "chokidar": "^4.0.0",
+        "cli-progress": "^3.12.0",
+        "dotenv": "^17.0.0",
+        "fs-extra": "^11.3.0",
+        "glob": "^11.0.0",
         "lil-gui": "^0.21.0"
     },
     "peerDependencies": {
@@ -38,4 +47,4 @@
         "url": "https://github.com/profitlich-ch/profitlich-template-toolkit"
     },
     "license": "MIT"
-}
+}

package/scripts/copy-files.js

@@ -0,0 +1,74 @@
+import fs from 'fs-extra';
+import { glob } from 'glob';
+import path from 'path';
+import chokidar from 'chokidar';
+
+async function runTask(task) {
+    const files = await glob(task.src, { nodir: true, dot: true });
+    if (files.length === 0) return;
+
+    for (const file of files) {
+        const relativePath = path.relative(task.base, file);
+        const destPath = path.join(task.dest, relativePath);
+        await fs.copy(file, destPath);
+    }
+}
+
+export async function copyAll(copyTasks) {
+    console.log('🚀 Starting initial copy of all files...');
+    // empty folders to prevent orphaned files
+    for (const task of copyTasks) {
+        await fs.emptyDir(task.dest);
+    }
+    // run tasks parallely
+    await Promise.all(copyTasks.map(task => runTask(task)));
+    console.log('✅ Initial copy complete.');
+}
+
+export function watchFiles(copyTasks, watchDir = 'src') {
+    console.log(`👀 Watching for file changes in ${watchDir}/`);
+
+    // set lock variable to prevent parallel copy tasks
+    let isCopying = false;
+
+    const watcher = chokidar.watch(watchDir, { ignored: /(^|[\/\\])\../, persistent: true });
+
+    watcher.on('all', async (event, filePath) => {
+        if (['add', 'change', 'unlink'].includes(event)) {
+
+            // only proceed if copy job is not running
+            if (isCopying) {
+                return;
+            }
+
+            console.log(`[${event}] ${filePath}. Re-copying all files...`);
+
+            // secure copy job with try...finally
+            try {
+                isCopying = true; // activate lock
+                await copyAll(copyTasks);
+            } catch (err) {
+                console.error("Error during copy:", err);
+            } finally {
+                isCopying = false; // deactivate lock, allow new copy job
+            }
+        }
+    });
+}
+
+/**
+ * Run the copy-files script.
+ * @param {Array} copyTasks - array of { name, src, dest, base } objects
+ * @param {object} [options] - optional settings
+ * @param {string} [options.watchDir] - directory to watch (default: 'src')
+ */
+export function run(copyTasks, options = {}) {
+    const command = process.argv[2];
+    const watchDir = options.watchDir || 'src';
+
+    if (command === 'dev') {
+        copyAll(copyTasks).then(() => watchFiles(copyTasks, watchDir));
+    } else if (command === 'build') {
+        copyAll(copyTasks);
+    }
+}

package/scripts/deploy.js

@@ -0,0 +1,112 @@
+import ftp from 'basic-ftp';
+import dotenv from 'dotenv';
+import { glob } from 'glob';
+import path from 'path';
+import readline from 'readline';
+import cliProgress from 'cli-progress';
+
+// Helper for making sure the upload progress bars go to 100%
+const delay = ms => new Promise(resolve => setTimeout(resolve, ms));
+
+export async function runDeploy(mode, uploadTasks) {
+    const client = new ftp.Client();
+    client.ftp.verbose = false;
+    let activeProgressBar = null;
+
+    try {
+        const modeUpper = mode.toUpperCase();
+        console.log(`🚀 Starting deployment for: ${modeUpper}`);
+
+        await client.access({
+            host: process.env[`FTP_HOST_${modeUpper}`],
+            user: process.env[`FTP_USER_${modeUpper}`],
+            password: process.env[`FTP_PASSWORD_${modeUpper}`],
+            secure: true
+        });
+
+        for (const task of uploadTasks) {
+            console.log(`\nProcessing Task: ${task.name}`);
+
+            const files = await glob(task.localPattern, {
+                nodir: true,
+                dot: true,
+                ignore: task.ignore
+            });
+
+            if (files.length === 0) {
+                console.log('No files found for this task.');
+                continue;
+            }
+
+            const newBar = new cliProgress.SingleBar({
+                format: '  Upload |{bar}| {percentage}%   {value}/{total} files   {duration_formatted}',
+                barCompleteChar: '█',
+                barIncompleteChar: '░',
+                hideCursor: true
+            });
+
+            activeProgressBar = newBar;
+            activeProgressBar.start(files.length, 0);
+
+            for (const file of files) {
+                const relativeFile = path.relative(task.localBase, file);
+                const remotePath = path.join(task.remoteDir, relativeFile).replace(/\\/g, '/');
+
+                await client.ensureDir(path.dirname(remotePath));
+                await client.uploadFrom(file, remotePath);
+
+                activeProgressBar.increment();
+            }
+
+            activeProgressBar.stop();
+            activeProgressBar = null;
+            await delay(50);
+        }
+
+        console.log('\n✅ Deployment completed successfully!');
+
+    } catch (err) {
+        if (activeProgressBar) {
+            activeProgressBar.stop();
+        }
+        console.error('Deployment failed:', err);
+    } finally {
+        client.close();
+    }
+}
+
+/**
+ * Run the deploy script.
+ * @param {Array} uploadTasks - array of { name, localPattern, localBase, remoteDir, ignore? }
+ */
+export function run(uploadTasks) {
+    const mode = process.argv[2];
+    if (!mode || (mode !== 'staging' && mode !== 'production')) {
+        console.error('Error: a mode needs to be given, either "staging" or "production"');
+        process.exit(1);
+    }
+
+    dotenv.config();
+
+    // In production mode prompt for confirmation
+    if (mode === 'production') {
+        const rl = readline.createInterface({
+            input: process.stdin,
+            output: process.stdout
+        });
+
+        rl.question('🔴 Do you really want to deploy to PRODUCTION? Type "yes" for confirmation: ', (answer) => {
+            rl.close();
+            if (answer.toLowerCase() === 'yes') {
+                console.log('Confirmed. Starting upload...');
+                runDeploy(mode, uploadTasks);
+            } else {
+                console.log('❌ Deployment aborted.');
+                process.exit(0);
+            }
+        });
+    // In all other modes run deploy without prompt
+    } else {
+        runDeploy(mode, uploadTasks);
+    }
+}

package/scss/forward.scss

@@ -1,3 +1,4 @@
+@forward "config";
 @forward "core/mediaqueries";
 @forward "core/layout";
 @forward "core/hamburger";