@mahe_pkm/buzl-html-editor 0.1.0

package/dist/site-server.js

@@ -0,0 +1,318 @@
+#!/usr/bin/env node
+
+'use strict';
+
+const fs = require('fs');
+const http = require('http');
+const net = require('net');
+const path = require('path');
+const readline = require('readline');
+const { URL } = require('url');
+
+const SITE_ROOT = path.resolve(process.env.BUZL_SITE_ROOT || process.cwd());
+const DEFAULT_PORT = 3000;
+const HOST = '127.0.0.1';
+const MIN_NODE_MAJOR = 18;
+
+const BLOCKED_SEGMENTS = new Set([
+  'admin',
+  'api',
+  'node_modules',
+  '.git',
+  '.backups',
+  'rollback_backups',
+  'tests',
+]);
+
+const BLOCKED_FILES = new Set([
+  '.env',
+  '.env_example',
+  '.env.example',
+  'package.json',
+  'package-lock.json',
+  'server.js',
+  'start-website.js',
+  'start-website.cmd',
+  'start-website.sh',
+]);
+
+const BLOCKED_EXTENSIONS = new Set([
+  '.bat',
+  '.cmd',
+  '.log',
+  '.md',
+  '.sh',
+]);
+
+const CONTENT_TYPES = {
+  '.avif': 'image/avif',
+  '.css': 'text/css; charset=utf-8',
+  '.csv': 'text/csv; charset=utf-8',
+  '.gif': 'image/gif',
+  '.htm': 'text/html; charset=utf-8',
+  '.html': 'text/html; charset=utf-8',
+  '.ico': 'image/x-icon',
+  '.jpeg': 'image/jpeg',
+  '.jpg': 'image/jpeg',
+  '.js': 'text/javascript; charset=utf-8',
+  '.json': 'application/json; charset=utf-8',
+  '.map': 'application/json; charset=utf-8',
+  '.mjs': 'text/javascript; charset=utf-8',
+  '.mp3': 'audio/mpeg',
+  '.mp4': 'video/mp4',
+  '.ogg': 'audio/ogg',
+  '.otf': 'font/otf',
+  '.pdf': 'application/pdf',
+  '.png': 'image/png',
+  '.svg': 'image/svg+xml',
+  '.txt': 'text/plain; charset=utf-8',
+  '.webm': 'video/webm',
+  '.webp': 'image/webp',
+  '.woff': 'font/woff',
+  '.woff2': 'font/woff2',
+  '.xml': 'application/xml; charset=utf-8',
+};
+
+function parsePort(value, fallback = DEFAULT_PORT) {
+  const text = String(value ?? '').trim();
+  if (!text) return fallback;
+
+  if (!/^\d+$/.test(text)) {
+    throw new Error('The port must contain numbers only.');
+  }
+
+  const port = Number(text);
+  if (!Number.isInteger(port) || port < 1024 || port > 65535) {
+    throw new Error('Choose a port between 1024 and 65535.');
+  }
+
+  return port;
+}
+
+function askForPort() {
+  if (!process.stdin.isTTY || !process.stdout.isTTY) {
+    return Promise.resolve(DEFAULT_PORT);
+  }
+
+  const prompt = readline.createInterface({
+    input: process.stdin,
+    output: process.stdout,
+  });
+
+  return new Promise((resolve) => {
+    prompt.question(`Enter website port [${DEFAULT_PORT}]: `, (answer) => {
+      prompt.close();
+      resolve(parsePort(answer));
+    });
+  });
+}
+
+function ensureSupportedNode() {
+  const major = Number(process.versions.node.split('.')[0]);
+  if (!Number.isInteger(major) || major < MIN_NODE_MAJOR) {
+    throw new Error(
+      `Node.js ${MIN_NODE_MAJOR} or newer is required. Node.js 20 LTS is recommended.`,
+    );
+  }
+}
+
+function checkPort(port) {
+  return new Promise((resolve, reject) => {
+    const probe = net.createServer();
+    probe.unref();
+    probe.once('error', (error) => {
+      if (error.code === 'EADDRINUSE') {
+        reject(new Error(`Port ${port} is already in use. Choose another port.`));
+      } else {
+        reject(error);
+      }
+    });
+    probe.listen({ host: HOST, port }, () => probe.close(resolve));
+  });
+}
+
+function isInsidePath(parentDir, targetPath) {
+  const relative = path.relative(parentDir, targetPath);
+  return relative === ''
+    || (!!relative && !relative.startsWith('..') && !path.isAbsolute(relative));
+}
+
+function isBlockedPath(urlPath) {
+  const segments = urlPath
+    .replace(/\\/g, '/')
+    .split('/')
+    .filter(Boolean)
+    .map((segment) => segment.toLowerCase());
+
+  if (segments.some((segment) => segment.startsWith('.'))) return true;
+  if (segments.some((segment) => BLOCKED_SEGMENTS.has(segment))) return true;
+
+  const filename = segments.at(-1) || '';
+  if (BLOCKED_FILES.has(filename)) return true;
+  return BLOCKED_EXTENSIONS.has(path.extname(filename));
+}
+
+async function resolvePublicFile(siteRoot, pathname) {
+  let decoded;
+  try {
+    decoded = decodeURIComponent(pathname);
+  } catch {
+    return null;
+  }
+
+  if (decoded.includes('\0') || isBlockedPath(decoded)) return null;
+
+  const rootPath = path.resolve(siteRoot);
+  let candidate = path.resolve(rootPath, `.${decoded.replace(/\\/g, '/')}`);
+  if (!isInsidePath(rootPath, candidate)) return null;
+
+  let stats;
+  try {
+    stats = await fs.promises.stat(candidate);
+  } catch {
+    stats = null;
+  }
+
+  if (stats?.isDirectory()) {
+    candidate = path.join(candidate, 'index.html');
+    try {
+      stats = await fs.promises.stat(candidate);
+    } catch {
+      stats = null;
+    }
+  }
+
+  if (!stats && !path.extname(candidate)) {
+    const htmlCandidate = `${candidate}.html`;
+    try {
+      const htmlStats = await fs.promises.stat(htmlCandidate);
+      if (htmlStats.isFile()) {
+        candidate = htmlCandidate;
+        stats = htmlStats;
+      }
+    } catch {
+      stats = null;
+    }
+  }
+
+  if (!stats?.isFile()) return null;
+
+  let realRoot;
+  let realCandidate;
+  try {
+    [realRoot, realCandidate] = await Promise.all([
+      fs.promises.realpath(rootPath),
+      fs.promises.realpath(candidate),
+    ]);
+  } catch {
+    return null;
+  }
+
+  if (!isInsidePath(realRoot, realCandidate)) return null;
+  return { filePath: realCandidate, stats };
+}
+
+function sendText(res, statusCode, message) {
+  const body = Buffer.from(message, 'utf8');
+  res.writeHead(statusCode, {
+    'Content-Type': 'text/plain; charset=utf-8',
+    'Content-Length': body.length,
+    'X-Content-Type-Options': 'nosniff',
+  });
+  res.end(body);
+}
+
+function createSiteServer({ siteRoot = SITE_ROOT } = {}) {
+  const resolvedRoot = path.resolve(siteRoot);
+
+  return http.createServer(async (req, res) => {
+    if (!['GET', 'HEAD'].includes(req.method || '')) {
+      res.setHeader('Allow', 'GET, HEAD');
+      sendText(res, 405, 'Method Not Allowed');
+      return;
+    }
+
+    let pathname;
+    try {
+      pathname = new URL(req.url || '/', 'http://localhost').pathname;
+    } catch {
+      sendText(res, 400, 'Bad Request');
+      return;
+    }
+
+    const resolved = await resolvePublicFile(resolvedRoot, pathname);
+    if (!resolved) {
+      sendText(res, 404, 'Page Not Found');
+      return;
+    }
+
+    const extension = path.extname(resolved.filePath).toLowerCase();
+    const contentType = CONTENT_TYPES[extension] || 'application/octet-stream';
+    const headers = {
+      'Content-Type': contentType,
+      'Content-Length': resolved.stats.size,
+      'X-Content-Type-Options': 'nosniff',
+      'Cache-Control': contentType.startsWith('text/html')
+        ? 'no-cache'
+        : 'public, max-age=300',
+    };
+
+    res.writeHead(200, headers);
+    if (req.method === 'HEAD') {
+      res.end();
+      return;
+    }
+
+    const stream = fs.createReadStream(resolved.filePath);
+    stream.once('error', () => {
+      if (!res.headersSent) sendText(res, 500, 'Could not read this file');
+      else res.destroy();
+    });
+    stream.pipe(res);
+  });
+}
+
+async function main() {
+  try {
+    ensureSupportedNode();
+    const port = process.argv[2]
+      ? parsePort(process.argv[2])
+      : await askForPort();
+    await checkPort(port);
+
+    if (!fs.existsSync(path.join(SITE_ROOT, 'index.html'))) {
+      console.warn('\nWarning: index.html was not found beside start-website.js.');
+    }
+
+    const server = createSiteServer();
+    server.once('error', (error) => {
+      console.error(`\nWebsite server error: ${error.message}\n`);
+      process.exitCode = 1;
+    });
+    server.listen(port, HOST, () => {
+      console.log('\nStarting public website only...');
+      console.log(`Website: http://localhost:${port}/`);
+      console.log('The editor and API are disabled in this mode.');
+      console.log('Press Ctrl+C to stop.\n');
+    });
+  } catch (error) {
+    console.error(`\nUnable to start: ${error.message}\n`);
+    process.exitCode = 1;
+  }
+}
+
+if (require.main === module) {
+  main();
+}
+
+module.exports = {
+  BLOCKED_FILES,
+  BLOCKED_SEGMENTS,
+  DEFAULT_PORT,
+  HOST,
+  checkPort,
+  createSiteServer,
+  isBlockedPath,
+  parsePort,
+  resolvePublicFile,
+};

package/lib/cli.js

@@ -0,0 +1,267 @@
+'use strict';
+
+const fs = require('fs');
+const net = require('net');
+const path = require('path');
+const readline = require('readline');
+const { spawn } = require('child_process');
+
+const LOCAL_HOSTS = new Set(['127.0.0.1', 'localhost', '::1']);
+
+function parsePort(value, fallback) {
+  const text = String(value ?? '').trim();
+  if (!text) return fallback;
+  if (!/^\d+$/.test(text)) throw new Error('The port must contain numbers only.');
+  const port = Number(text);
+  if (!Number.isInteger(port) || port < 1024 || port > 65535) {
+    throw new Error('Choose a port between 1024 and 65535.');
+  }
+  return port;
+}
+
+function parseArgs(argv, defaults) {
+  const options = {
+    allowNetwork: false,
+    command: 'serve',
+    host: defaults.host,
+    hostProvided: false,
+    open: defaults.open,
+    openProvided: false,
+    port: undefined,
+    portProvided: false,
+    root: process.cwd(),
+  };
+
+  const args = [...argv];
+  if (['doctor', 'init'].includes(args[0])) options.command = args.shift();
+
+  for (let index = 0; index < args.length; index += 1) {
+    const arg = args[index];
+    if (arg === '--help' || arg === '-h') options.command = 'help';
+    else if (arg === '--version' || arg === '-v') options.command = 'version';
+    else if (arg === '--no-open') { options.open = false; options.openProvided = true; }
+    else if (arg === '--open') { options.open = true; options.openProvided = true; }
+    else if (arg === '--allow-network') options.allowNetwork = true;
+    else if (arg === '--root') options.root = requireValue(args, ++index, '--root');
+    else if (arg.startsWith('--root=')) options.root = arg.slice(7);
+    else if (arg === '--port' || arg === '-p') {
+      options.port = requireValue(args, ++index, arg);
+      options.portProvided = true;
+    } else if (arg.startsWith('--port=')) {
+      options.port = arg.slice(7);
+      options.portProvided = true;
+    } else if (arg === '--host') { options.host = requireValue(args, ++index, '--host'); options.hostProvided = true; }
+    else if (arg.startsWith('--host=')) { options.host = arg.slice(7); options.hostProvided = true; }
+    else if (/^\d+$/.test(arg) && !options.portProvided) {
+      options.port = arg;
+      options.portProvided = true;
+    } else {
+      throw new Error(`Unknown option: ${arg}`);
+    }
+  }
+
+  options.root = path.resolve(options.root);
+  return options;
+}
+
+function requireValue(args, index, option) {
+  const value = args[index];
+  if (!value || value.startsWith('--')) throw new Error(`${option} requires a value.`);
+  return value;
+}
+
+function loadConfig(siteRoot) {
+  const configPath = path.join(siteRoot, '.buzl', 'config.json');
+  if (!fs.existsSync(configPath)) return {};
+  try {
+    const config = JSON.parse(fs.readFileSync(configPath, 'utf8'));
+    if (!config || Array.isArray(config) || typeof config !== 'object') {
+      throw new Error('the file must contain a JSON object');
+    }
+    return config;
+  } catch (error) {
+    throw new Error(`Could not read ${configPath}: ${error.message}`);
+  }
+}
+
+function resolveRuntimeOptions(options, defaults) {
+  const config = loadConfig(options.root);
+  const configuredPort = config[defaults.configPortKey] ?? config.port;
+  const portValue = options.portProvided
+    ? options.port
+    : process.env.PORT || configuredPort || defaults.port;
+  const host = options.hostProvided
+    ? options.host
+    : process.env.HOST || config.host || defaults.host;
+  const shouldOpen = options.openProvided
+    ? options.open
+    : typeof config.open === 'boolean' ? config.open : defaults.open;
+
+  if (!LOCAL_HOSTS.has(host) && !options.allowNetwork) {
+    throw new Error(
+      `Refusing network host ${host}. Add --allow-network only when LAN access is intentional.`,
+    );
+  }
+
+  return {
+    ...options,
+    config,
+    host,
+    open: shouldOpen,
+    port: parsePort(portValue, defaults.port),
+    portConfigured: options.portProvided || Boolean(process.env.PORT) || configuredPort != null,
+  };
+}
+
+function askForPort(label, defaultPort) {
+  if (!process.stdin.isTTY || !process.stdout.isTTY) return Promise.resolve(defaultPort);
+  const prompt = readline.createInterface({ input: process.stdin, output: process.stdout });
+  return new Promise((resolve, reject) => {
+    prompt.question(`Enter ${label} port [${defaultPort}]: `, (answer) => {
+      prompt.close();
+      try {
+        resolve(parsePort(answer, defaultPort));
+      } catch (error) {
+        reject(error);
+      }
+    });
+  });
+}
+
+function checkPort(port, host) {
+  return new Promise((resolve, reject) => {
+    const probe = net.createServer();
+    probe.unref();
+    probe.once('error', (error) => {
+      if (error.code === 'EADDRINUSE') {
+        reject(new Error(`Port ${port} is already in use. Choose another port.`));
+      } else {
+        reject(error);
+      }
+    });
+    probe.listen({ host, port }, () => probe.close(resolve));
+  });
+}
+
+function ensureSiteRoot(siteRoot) {
+  if (!fs.existsSync(siteRoot)) throw new Error(`Website folder does not exist: ${siteRoot}`);
+  if (!fs.statSync(siteRoot).isDirectory()) throw new Error(`Website root is not a folder: ${siteRoot}`);
+}
+
+function listHtmlFiles(siteRoot) {
+  const skipped = new Set(['admin', 'node_modules', '.git', '.buzl', 'tests']);
+  const results = [];
+  function visit(directory, relative = '') {
+    for (const entry of fs.readdirSync(directory, { withFileTypes: true })) {
+      if (entry.name.startsWith('.') || skipped.has(entry.name)) continue;
+      const childRelative = relative ? path.join(relative, entry.name) : entry.name;
+      const child = path.join(directory, entry.name);
+      if (entry.isDirectory()) visit(child, childRelative);
+      else if (entry.isFile() && entry.name.toLowerCase().endsWith('.html')) {
+        results.push(childRelative.replace(/\\/g, '/'));
+      }
+    }
+  }
+  visit(siteRoot);
+  return results.sort();
+}
+
+function runDoctor(siteRoot, port, host) {
+  ensureSiteRoot(siteRoot);
+  const pages = listHtmlFiles(siteRoot);
+  const checks = {
+    node: process.version,
+    root: siteRoot,
+    entryPage: fs.existsSync(path.join(siteRoot, 'index.html')),
+    htmlPages: pages.length,
+    assetsDirectory: fs.existsSync(path.join(siteRoot, 'assets')),
+    writable: canWrite(siteRoot),
+    anthropicConfigured: Boolean(process.env.ANTHROPIC_API_KEY),
+    openRouterConfigured: Boolean(process.env.OPENROUTER_API_KEY),
+    address: `http://${host}:${port}/`,
+  };
+  console.log('\nBuzl editor diagnostics');
+  console.table(checks);
+  if (!checks.entryPage) console.warn('Warning: index.html is not present in the website root.');
+  if (checks.htmlPages === 0) console.warn('Warning: no editable HTML pages were found.');
+  return checks;
+}
+
+function canWrite(directory) {
+  try {
+    fs.accessSync(directory, fs.constants.W_OK);
+    return true;
+  } catch {
+    return false;
+  }
+}
+
+function initializeSite(siteRoot) {
+  ensureSiteRoot(siteRoot);
+  const configDir = path.join(siteRoot, '.buzl');
+  const configPath = path.join(configDir, 'config.json');
+  const envExamplePath = path.join(siteRoot, '.env.example');
+  const gitignorePath = path.join(siteRoot, '.gitignore');
+  fs.mkdirSync(configDir, { recursive: true });
+
+  const created = [];
+  if (!fs.existsSync(configPath)) {
+    fs.writeFileSync(configPath, `${JSON.stringify({ editorPort: 4000, websitePort: 3000, host: '127.0.0.1', open: true }, null, 2)}\n`);
+    created.push(path.relative(siteRoot, configPath));
+  }
+  if (!fs.existsSync(envExamplePath)) {
+    fs.writeFileSync(envExamplePath, [
+      'ANTHROPIC_API_KEY=',
+      'OPENROUTER_API_KEY=',
+      '',
+    ].join('\n'));
+    created.push(path.relative(siteRoot, envExamplePath));
+  }
+
+  const ignoreRules = ['.env', '.buzl/generated/'];
+  const existingIgnore = fs.existsSync(gitignorePath) ? fs.readFileSync(gitignorePath, 'utf8') : '';
+  const missingRules = ignoreRules.filter((rule) => !existingIgnore.split(/\r?\n/).includes(rule));
+  if (missingRules.length) {
+    const prefix = existingIgnore && !existingIgnore.endsWith('\n') ? '\n' : '';
+    fs.appendFileSync(gitignorePath, `${prefix}# Buzl editor\n${missingRules.join('\n')}\n`);
+    created.push(path.relative(siteRoot, gitignorePath));
+  }
+
+  console.log(created.length ? `Created: ${created.join(', ')}` : 'Buzl configuration already exists.');
+  return created;
+}
+
+function openBrowser(url) {
+  let command;
+  let args;
+  if (process.platform === 'win32') {
+    command = 'cmd.exe';
+    args = ['/d', '/s', '/c', 'start', '', url];
+  } else if (process.platform === 'darwin') {
+    command = 'open';
+    args = [url];
+  } else {
+    command = 'xdg-open';
+    args = [url];
+  }
+  try {
+    const child = spawn(command, args, { detached: true, stdio: 'ignore' });
+    child.unref();
+  } catch {
+    // The printed URL remains available if no desktop browser opener exists.
+  }
+}
+
+module.exports = {
+  askForPort,
+  checkPort,
+  ensureSiteRoot,
+  initializeSite,
+  listHtmlFiles,
+  loadConfig,
+  openBrowser,
+  parseArgs,
+  parsePort,
+  resolveRuntimeOptions,
+  runDoctor,
+};

package/package.json

@@ -0,0 +1,52 @@
+{
+  "name": "@mahe_pkm/buzl-html-editor",
+  "version": "0.1.0",
+  "description": "Local visual editor and static-site server for multi-page HTML websites",
+  "author": "mahe_pkm",
+  "type": "commonjs",
+  "bin": {
+    "buzl-editor": "bin/buzl-editor.js",
+    "buzl-site": "bin/buzl-site.js"
+  },
+  "files": [
+    "bin/",
+    "dist/",
+    "lib/",
+    "templates/",
+    "README.md",
+    "LICENSE"
+  ],
+  "scripts": {
+    "build": "node scripts/build-package.js",
+    "prepack": "npm run build",
+    "test": "npm run build && node --test",
+    "verify:pack": "node scripts/verify-packed-install.js",
+    "pack:check": "npm pack --dry-run"
+  },
+  "engines": {
+    "node": ">=18"
+  },
+  "dependencies": {
+    "@anthropic-ai/sdk": "^0.124.0",
+    "cheerio": "^1.0.0-rc.12",
+    "dotenv": "^16.4.7",
+    "express": "^4.18.2",
+    "multer": "^2.1.1",
+    "sharp": "^0.35.4"
+  },
+  "overrides": {
+    "qs": "^6.16.0"
+  },
+  "keywords": [
+    "html",
+    "visual-editor",
+    "static-site",
+    "grapesjs",
+    "website-editor",
+    "avif"
+  ],
+  "license": "UNLICENSED",
+  "publishConfig": {
+    "access": "public"
+  }
+}

package/templates/config.example.json

@@ -0,0 +1,6 @@
+{
+  "editorPort": 4000,
+  "websitePort": 3000,
+  "host": "127.0.0.1",
+  "open": true
+}

package/templates/website_context.example.json

@@ -0,0 +1,7 @@
+{
+  "name": "Website",
+  "businessCategory": "business",
+  "purpose": "website",
+  "tone_and_style": "clear and professional",
+  "context": ""
+}