srv-it 0.4.0 → 0.5.0

package/README.md

@@ -34,7 +34,7 @@ srv-it
 srv-it 3000
 srv-it 8080 ./public
 srv-it ./public --open
-srv-it --style neon --style-css ./srv-listing.css
+srv-it --style paper --style-css ./srv-listing.css
 ```
 
 ## Config defaults
@@ -43,7 +43,7 @@ You can set defaults globally and per-project:
 
 - global: `~/.srvrc.json`
 - project: `./srv.config.json`
-- override file: `srv --config ./my-srv.json`
+- override file: `srv-it --config ./my-srv.json`
 - template: `./srv.config.example.json`
 
 Example `srv.config.json`:
@@ -74,23 +74,29 @@ Run:
 srv-it --help
 ```
 
-Highlights:
-
-- `-p, --port <number>`
-- `--host <host>`
-- `--open [path]`, `--no-open`
-- `--watch <path>` (repeat)
-- `--ignore <glob>` (repeat)
-- `--single`
-- `--cors`
-- `--no-css-inject`
-- `--no-dir-listing`
-- `--style <midnight|paper|neon>`
-- `--style-css <file>`
-- `-c` (create `srv.config.json` in served root if missing)
-- `--log-level <0-3>`
-- `--no-request-logging`
-- `--ssl-cert <file> --ssl-key <file> [--ssl-pass <file>]`
+### Supported Arguments
+
+- `-h, --help`: show help output
+- `-v, --version`: print the current version
+- `-p, --port <number>`: set the server port
+- `--host <host>`: set the bind host (default: `0.0.0.0`)
+- `--open [path]`: open a browser to `/` or the provided path
+- `--no-open`: disable automatic browser opening
+- `--watch <path>` (repeat): add extra files/folders to watch for live reload
+- `--ignore <glob>` (repeat): ignore matching watcher paths/globs
+- `--no-css-inject`: use full page reload for CSS changes instead of hot CSS refresh
+- `--cors`: enable CORS headers
+- `--single`: serve `index.html` for unknown routes (SPA fallback)
+- `--no-dir-listing`: disable generated directory listing pages
+- `--style <midnight|paper>`: choose the directory listing style preset
+- `--style-css <file>`: load custom CSS for directory listing pages
+- `-c`: create `srv.config.json` in the served root if missing
+- `--config <file>`: read additional config JSON file
+- `--no-request-logging`: disable request logs
+- `--log-level <0-3>`: set startup log verbosity
+- `--ssl-cert <file>`: path to SSL certificate
+- `--ssl-key <file>`: path to SSL private key
+- `--ssl-pass <file>`: path to SSL passphrase file
 
 ## Notes
 

package/license.md

@@ -0,0 +1,20 @@
+# The MIT License (MIT)
+
+Copyright (c) 2026 Elouan Grimm.
+
+Permission is hereby granted, free of charge, to any person obtaining a copy of
+this software and associated documentation files (the "Software"), to deal in
+the Software without restriction, including without limitation the rights to
+use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of
+the Software, and to permit persons to whom the Software is furnished to do so,
+subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS
+FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR
+COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER
+IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN
+CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "srv-it",
-  "version": "0.4.0",
+  "version": "0.5.0",
   "description": "Static server with polished CLI UI, directory listing, and live reload",
   "keywords": [
     "server",

package/src/cli.js

@@ -46,7 +46,7 @@ function getHelpText() {
     `  ${chalk.yellow('--cors')}                       Enable CORS`,
     `  ${chalk.yellow('--single')}                     SPA fallback to /index.html`,
     `  ${chalk.yellow('--no-dir-listing')}             Disable directory listing`,
-    `  ${chalk.yellow('--style <name>')}               Listing style preset: midnight | paper | neon`,
+    `  ${chalk.yellow('--style <midnight|paper>')}     Listing style preset`,
     `  ${chalk.yellow('--style-css <file>')}           Custom CSS file for listing page`,
     `  ${chalk.yellow('-c')}                           Create srv.config.json in served root if missing`,
     `  ${chalk.yellow('--config <file>')}              Read additional config JSON file`,
@@ -207,7 +207,7 @@ async function run() {
 
   if (options.logLevel >= 1) {
     const lines = [
-      `${chalk.green.bold('srv is running')}`,
+      `${chalk.hex("#3b82f6").bold('srv-it is running')}`,
       '',
       `${chalk.bold('- Local:')}    ${url}`,
       `${chalk.bold('- Root:')}     ${options.root}`,
@@ -230,7 +230,8 @@ async function run() {
       boxen(content, {
         padding: 1,
         borderStyle: 'single',
-        borderColor: 'cyan',
+        borderColor: '#3b82f6',
+        margin: 1,
       }),
     );
   }

package/src/server.js

@@ -11,8 +11,19 @@ const os = require('node:os');
 const chalk = require('chalk');
 const { WebSocketServer } = require('ws');
 
+const srvLogger = {
+  http: (...message) => console.info(chalk.bgBlue.bold(' HTTP '), ...message),
+  info: (...message) => console.info(chalk.bgMagenta.bold(' INFO '), ...message),
+  warn: (...message) => console.error(chalk.bgYellow.bold(' WARN '), ...message),
+  error: (...message) => console.error(chalk.bgRed.bold(' ERRR '), ...message),
+  log: console.log,
+};
+
 const BASE_WATCH_IGNORES = ['**/.git/**', '**/node_modules/**'];
 
+const DIRECTORY_FAVICON_SVG = '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="#0c0a09" d="M3 5.5A2.5 2.5 0 0 1 5.5 3H10l2 2h6.5A2.5 2.5 0 0 1 21 7.5v9A2.5 2.5 0 0 1 18.5 19h-13A2.5 2.5 0 0 1 3 16.5z"/><path fill="#3b82f6" d="M3 8h18v8.5a2.5 2.5 0 0 1-2.5 2.5h-13A2.5 2.5 0 0 1 3 16.5z"/></svg>';
+const DIRECTORY_FAVICON_DATA_URL = `data:image/svg+xml,${encodeURIComponent(DIRECTORY_FAVICON_SVG)}`;
+
 function toGlobPath(value) {
   return value.replace(/\\/g, '/');
 }
@@ -31,15 +42,29 @@ const LIVE_RELOAD_SNIPPET = `\n<script>\n(function(){\n  if(!('WebSocket' in win
 const STYLE_PRESETS = {
   midnight: {
     accent: '#3b82f6',
+    accentSoft: 'rgba(59, 130, 246, 0.16)',
+    bg: '#0c0a09',
+    bgRaised: '#1c1917',
+    bgSurface: '#292524',
+    border: '#292524',
     borderStrong: '#78716c',
+    text: '#e7e5e4',
+    textMuted: '#a8a29e',
+    textFaint: '#78716c',
+    textBright: '#f5f5f4',
   },
   paper: {
-    accent: '#f59e0b',
-    borderStrong: '#a8a29e',
-  },
-  neon: {
-    accent: '#22c55e',
+    accent: '#d97706',
+    accentSoft: 'rgba(217, 119, 6, 0.16)',
+    bg: '#f5f5f4',
+    bgRaised: '#fafaf9',
+    bgSurface: '#e7e5e4',
+    border: '#d6d3d1',
     borderStrong: '#a8a29e',
+    text: '#292524',
+    textMuted: '#57534e',
+    textFaint: '#78716c',
+    textBright: '#1c1917',
   },
 };
 
@@ -106,6 +131,7 @@ function renderDirListing({ pathnameValue, entries, style, customCss }) {
   <meta charset="utf-8" />
   <meta name="viewport" content="width=device-width,initial-scale=1" />
   <title>Index of ${pathnameValue}</title>
+  <link rel="icon" href="${DIRECTORY_FAVICON_DATA_URL}" />
   <style>
     :root {
       --stone-050: #fafaf9;
@@ -120,16 +146,17 @@ function renderDirListing({ pathnameValue, entries, style, customCss }) {
       --stone-900: #1c1917;
       --stone-950: #0c0a09;
 
-      --bg: var(--stone-950);
-      --bg-raised: var(--stone-900);
-      --bg-surface: var(--stone-800);
-      --border: var(--stone-800);
+      --bg: ${palette.bg};
+      --bg-raised: ${palette.bgRaised};
+      --bg-surface: ${palette.bgSurface};
+      --border: ${palette.border};
       --border-strong: ${palette.borderStrong};
-      --text: var(--stone-200);
-      --text-muted: var(--stone-400);
-      --text-faint: var(--stone-500);
-      --text-bright: var(--stone-100);
+      --text: ${palette.text};
+      --text-muted: ${palette.textMuted};
+      --text-faint: ${palette.textFaint};
+      --text-bright: ${palette.textBright};
       --accent: ${palette.accent};
+      --accent-soft: ${palette.accentSoft};
       --font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
       --font-mono: "JetBrains Mono", "SF Mono", "Fira Code", "Roboto Mono", "Cascadia Code", monospace;
       --line-height: 1.6;
@@ -163,7 +190,7 @@ function renderDirListing({ pathnameValue, entries, style, customCss }) {
 
     h1 {
       margin-bottom: 0.25rem;
-      color: var(--text-bright);
+      color: var(--accent);
       font-family: var(--font-mono);
       font-size: 1.1rem;
       line-height: var(--line-height-tight);
@@ -176,6 +203,8 @@ function renderDirListing({ pathnameValue, entries, style, customCss }) {
       color: var(--text-muted);
       font-family: var(--font-mono);
       font-size: 0.9rem;
+      border-left: 2px solid var(--accent);
+      padding-left: 0.6rem;
     }
 
     .up {
@@ -183,10 +212,10 @@ function renderDirListing({ pathnameValue, entries, style, customCss }) {
       margin-bottom: 0.75rem;
       color: var(--accent);
       text-decoration: none;
-      border: 1px solid var(--border-strong);
+      border: 1px solid var(--accent);
       padding: 0.3rem 0.55rem;
       font-family: var(--font-mono);
-      transition: background-color 0.18s ease, color 0.18s ease;
+      transition: background-color 0.18s ease, color 0.18s ease, border-color 0.18s ease;
     }
 
     .up:hover {
@@ -209,7 +238,7 @@ function renderDirListing({ pathnameValue, entries, style, customCss }) {
       color: var(--text);
       border-bottom: 1px solid var(--border);
       font-family: var(--font-mono);
-      transition: background-color 0.18s ease, color 0.18s ease;
+      transition: background-color 0.18s ease, color 0.18s ease, box-shadow 0.18s ease;
     }
 
     li:last-child a {
@@ -219,6 +248,7 @@ function renderDirListing({ pathnameValue, entries, style, customCss }) {
     li a:hover {
       background-color: var(--bg-surface);
       color: var(--text-bright);
+      box-shadow: inset 3px 0 0 var(--accent);
     }
 
     .name {
@@ -229,10 +259,13 @@ function renderDirListing({ pathnameValue, entries, style, customCss }) {
     }
 
     .type {
-      color: var(--text-faint);
+      color: var(--accent);
       text-transform: uppercase;
       font-size: 0.72rem;
       letter-spacing: 0.07em;
+      padding: 0.12rem 0.35rem;
+      border: 1px solid var(--accent-soft);
+      background-color: var(--accent-soft);
     }
 
     @media (max-width: 768px) {
@@ -278,6 +311,7 @@ async function createSrvServer(options) {
   const root = path.resolve(options.root);
   const compress = getCompressionMiddleware();
   const clients = new Set();
+  const sockets = new Set();
 
   let customCss = '';
   if (options.styleCss) {
@@ -315,6 +349,12 @@ async function createSrvServer(options) {
       try {
         stat = await fsp.stat(filePath);
       } catch (error) {
+        if (pathnameValue === '/sw.js' && error && error.code === 'ENOENT') {
+          // Browsers often probe /sw.js by default; treat missing file as a silent no-op.
+          res.statusCode = 204;
+          res.end();
+          return;
+        }
         if (options.single) {
           filePath = path.join(root, 'index.html');
           stat = await fsp.stat(filePath);
@@ -385,18 +425,22 @@ async function createSrvServer(options) {
       res.statusCode = 500;
       res.end('Internal server error');
       if (options.logLevel >= 1) {
-        console.error('[srv] request error:', error.message);
+        srvLogger.error('[srv-it] request error:', error.message);
       }
     } finally {
       if (!options.noRequestLogging) {
         const statusCode = res.statusCode;
+        const suppressRequestLog = pathnameValue === '/sw.js' && statusCode === 204;
+        if (suppressRequestLog) {
+          return;
+        }
         const elapsed = Date.now() - start;
         const sourceIp = (req.socket.remoteAddress || '-').replace('::ffff:', '');
         const now = new Date();
         const formattedTime = `${now.toLocaleDateString()} ${now.toLocaleTimeString()}`;
         const methodColor = method === 'GET' ? 'cyan' : 'magenta';
 
-        console.log(
+        srvLogger.http(
           chalk.dim(formattedTime),
           chalk.yellow(sourceIp),
           chalk[methodColor](`${method} ${pathnameValue}`),
@@ -420,7 +464,7 @@ async function createSrvServer(options) {
         res.statusCode = 500;
         res.end('Internal server error');
         if (options.logLevel >= 1) {
-          console.error('[srv] handler error:', error.message);
+          srvLogger.error('[srv-it] handler error:', error.message);
         }
       });
     });
@@ -430,12 +474,17 @@ async function createSrvServer(options) {
         res.statusCode = 500;
         res.end('Internal server error');
         if (options.logLevel >= 1) {
-          console.error('[srv] handler error:', error.message);
+          srvLogger.error('[srv-it] handler error:', error.message);
         }
       });
     });
   }
 
+  server.on('connection', (socket) => {
+    sockets.add(socket);
+    socket.on('close', () => sockets.delete(socket));
+  });
+
   const wss = new WebSocketServer({ server, path: '/__srv_ws' });
   wss.on('connection', (socket) => {
     clients.add(socket);
@@ -474,7 +523,7 @@ async function createSrvServer(options) {
       }
     }
     if (options.logLevel >= 2) {
-      console.log(`[srv] ${isCss ? 'css refresh' : 'reload'}: ${changePath}`);
+      srvLogger.info(`[srv-it] ${isCss ? 'css refresh' : 'reload'}: ${changePath}`);
     }
   };
 
@@ -487,27 +536,66 @@ async function createSrvServer(options) {
     if (error && error.code === 'ENOSPC') {
       liveReloadEnabled = false;
       await closeWatcher();
-      console.error('[srv] live reload disabled: file watcher limit reached (ENOSPC).');
-      console.error('[srv] use --ignore to exclude noisy paths, or raise inotify limits on Linux.');
+      srvLogger.error('[srv-it] live reload disabled: file watcher limit reached (ENOSPC).');
+      srvLogger.warn('[srv-it] use --ignore to exclude noisy paths, or raise inotify limits on Linux.');
       return;
     }
 
     if (options.logLevel >= 1) {
-      console.error(`[srv] watcher error: ${error.message}`);
+      srvLogger.error(`[srv-it] watcher error: ${error.message}`);
     }
   });
 
+  let closingPromise;
   const closeAll = async () => {
-    await closeWatcher();
-    wss.close();
-    await new Promise((resolve) => server.close(resolve));
+    if (closingPromise) {
+      return closingPromise;
+    }
+
+    closingPromise = (async () => {
+      await closeWatcher();
+
+      for (const client of clients) {
+        try {
+          client.terminate();
+        } catch (_error) {
+          // Ignore client termination errors during shutdown.
+        }
+      }
+
+      await new Promise((resolve) => wss.close(resolve));
+
+      for (const socket of sockets) {
+        socket.destroy();
+      }
+
+      await new Promise((resolve) => server.close(resolve));
+    })();
+
+    return closingPromise;
   };
 
-  process.on('SIGINT', async () => {
-    console.log('\n[srv] shutting down...');
-    await closeAll();
-    process.exit(0);
-  });
+  let shuttingDown = false;
+  const onSigint = async () => {
+    if (shuttingDown) {
+      process.exit(130);
+      return;
+    }
+
+    shuttingDown = true;
+    process.stdout.write('\u001B[2K\r');
+    console.log(chalk.bgWhite.bold('\n[srv-it]') + ' shutting down...');
+
+    try {
+      await closeAll();
+      process.exit(0);
+    } catch (error) {
+      srvLogger.error('[srv-it] shutdown error:', error.message);
+      process.exit(1);
+    }
+  };
+
+  process.once('SIGINT', onSigint);
 
   await new Promise((resolve, reject) => {
     server.once('error', reject);