webchat-irc 1.0.0

package/README.md

@@ -0,0 +1,90 @@
+# webchat-IRC
+
+Bring back the classic web to your website.
+
+## Quick Start
+
+```bash
+npm install webchat-irc
+```
+
+Copy the example config into your project directory:
+
+```bash
+cp node_modules/webchat-irc/webchat.config.example.json webchat.config.json
+```
+
+Edit `webchat.config.json` with your IRC server details, then start the server:
+
+```bash
+npx webchat-irc
+```
+
+Open `http://localhost:3000` to see the results!
+
+## Configuration
+
+Create a `webchat.config.json` in your project root:
+
+```json
+{
+  "port": 3000,
+  "irc": {
+    "host": "irc.libera.chat",
+    "port": 6697,
+    "tls": true,
+    "channel": "#your-channel"
+  },
+  "guestbook": {
+    "enabled": true,
+    "maxEntries": 200
+  }
+}
+```
+
+| Option | Default | Description |
+|---|---|---|
+| `port` | `3000` | HTTP server port |
+| `irc.host` | `irc.libera.chat` | IRC server hostname |
+| `irc.port` | `6697` | IRC server port |
+| `irc.tls` | `true` | Use TLS/SSL |
+| `irc.channel` | `#webchatirc-general` | IRC channel to join |
+| `guestbook.enabled` | `true` | Enable/disable the guestbook feature |
+| `guestbook.maxEntries` | `200` | Maximum stored guestbook entries |
+
+## Embedding on Your Website
+
+Once the server is running, embed the widget on any page using an iframe:
+
+```html
+<iframe
+  src="https://your-server.com/embed.html"
+  width="400"
+  height="500"
+  frameborder="0"
+  style="border-radius: 6px; border: 1px solid #333;">
+</iframe>
+```
+
+The `/embed.html` widget includes tabbed panels for **Chat** and **Guestbook** — fully self-contained with no external dependencies.
+
+
+## Development
+
+Clone and run locally:
+
+```bash
+git clone https://github.com/byeoon/webchat-irc.git
+cd webchat-irc
+npm install
+cp webchat.config.example.json webchat.config.json
+npm start
+```
+
+## Pages
+
+| Route | Description |
+|---|---|
+| `/` | Landing page |
+| `/demo.html` | Full demo with navbar |
+| `/embed.html` | Embeddable widget (chat + guestbook tabs) |

package/bin/webchat.js

@@ -0,0 +1,18 @@
+#!/usr/bin/env node
+
+const path = require('path');
+const fs = require('fs');
+const { createServer } = require('../index.js');
+
+const configName = 'webchat.config.json';
+const configPath = path.join(process.cwd(), configName);
+
+let config = {};
+try {
+    config = JSON.parse(fs.readFileSync(configPath, 'utf-8'));
+    console.log(`[webchatIRC] Loaded config from ${configPath}`);
+} catch (err) {
+    console.log(`[webchatIRC] No ${configName} found in current directory, using defaults.`);
+}
+
+createServer(config);

package/index.js

@@ -0,0 +1,270 @@
+const express = require('express');
+const path = require('path');
+const http = require('http');
+const fs = require('fs');
+const { Server } = require('socket.io');
+const IRC = require('irc-framework');
+
+const DEFAULT_CONFIG = {
+    port: 3000,
+    irc: {
+        mode: 'centralized',
+        host: 'irc.libera.chat',
+        port: 6697,
+        tls: true,
+        channel: '#webchatirc-general'
+    },
+    guestbook: {
+        enabled: true,
+        maxEntries: 200
+    }
+};
+
+/**
+ * Create and start a webchatIRC server.
+ * @param {object} [userConfig] - Configuration object (merged over defaults)
+ * @returns {{ app, server, io }} Express app, HTTP server, and Socket.IO instance
+ */
+function createServer(userConfig) {
+    const config = {
+        ...DEFAULT_CONFIG,
+        ...userConfig,
+        irc: { ...DEFAULT_CONFIG.irc, ...(userConfig && userConfig.irc) },
+        guestbook: { ...DEFAULT_CONFIG.guestbook, ...(userConfig && userConfig.guestbook) }
+    };
+
+    const app = express();
+    const server = http.createServer(app);
+    const io = new Server(server);
+
+    const port = config.port || 3000;
+    const ircConfig = config.irc;
+    const domainMap = {};
+
+    // persistence
+    const guestbookPath = path.join(process.cwd(), 'guestbook.json');
+    let guestbookEntries = [];
+    if (config.guestbook.enabled) {
+        try {
+            guestbookEntries = JSON.parse(fs.readFileSync(guestbookPath, 'utf-8'));
+            console.log(`[webchatIRC] Loaded ${guestbookEntries.length} guestbook entries`);
+        } catch (err) {
+            guestbookEntries = [];
+        }
+    }
+
+    function saveGuestbook() {
+        try {
+            fs.writeFileSync(guestbookPath, JSON.stringify(guestbookEntries, null, 2), 'utf-8');
+        } catch (err) {
+            console.error('[webchatIRC] Failed to save guestbook:', err.message);
+        }
+    }
+
+    function populateWHOIS(irc, channel, socket) {
+        irc.raw('NAMES', channel);
+        irc.once('userlist', (event) => {
+            if (!event.users) return;
+            socket.emit('server_info', {
+                server: ircConfig.host,
+                userCount: event.users.length
+            });
+            event.users.forEach((user) => {
+                const nick = user.nick;
+                if (nick === irc.user.nick) return;
+                irc.whois(nick, (info) => {
+                    domainMap[nick] = info.real_name || 'Unknown';
+                    socket.emit('whois', { nick, domain: domainMap[nick] });
+                });
+            });
+        });
+    }
+
+    function sanitizeUsername(username) {
+        if (!username || typeof username !== 'string') return 'Guest';
+        const clean = username.replace(/[^a-zA-Z0-9_-]/g, '').slice(0, 16);
+        return clean || 'Guest';
+    }
+
+    function sanitizeDomain(domain) {
+        if (!domain || typeof domain !== 'string') return 'Unknown';
+        const clean = domain.replace(/[^a-zA-Z0-9.\-:]/g, '').slice(0, 64);
+        return clean || 'Unknown';
+    }
+
+    io.on('connection', (socket) => {
+        console.log('[webchatIRC] Client connected');
+
+        socket.on('register', ({ domain, username }) => {
+            if (socket.irc) {
+                socket.emit('error_msg', 'Already connected.');
+                return;
+            }
+
+            const cleanUser = sanitizeUsername(username);
+            const cleanDomain = sanitizeDomain(domain);
+            const nick = `${cleanUser}_${Math.floor(Math.random() * 10000)}`;
+            const irc = new IRC.Client();
+            irc.userDomain = cleanDomain;
+
+            irc.connect({
+                host: ircConfig.host,
+                port: ircConfig.port,
+                nick: nick,
+                username: cleanUser,
+                gecos: cleanDomain,
+                tls: ircConfig.tls
+            });
+
+            irc.on('registered', () => {
+                const channel = ircConfig.channel;
+                irc.join(channel);
+                socket.emit('system', `Connected to IRC as ${nick}`);
+
+                irc.whois(nick, (info) => {
+                    domainMap[nick] = info.real_name || cleanDomain;
+                });
+                populateWHOIS(irc, channel, socket);
+            });
+
+            irc.on('message', (event) => {
+                if (event.nick === irc.user.nick) return;
+                if (!event.nick || !domainMap[event.nick]) return;
+
+                const senderDomain = domainMap[event.nick];
+                socket.emit('message', {
+                    channel: event.target,
+                    nick: event.nick,
+                    text: event.message,
+                    domain: senderDomain,
+                    timestamp: Date.now()
+                });
+            });
+
+            irc.on('notice', (event) => {
+                if (event.message) {
+                    socket.emit('system', event.message);
+                }
+            });
+
+            irc.on('join', (event) => {
+                socket.emit('system', `${event.nick} joined ${event.channel}`);
+                socket.emit('user_joined');
+                if (event.nick === irc.user.nick) return;
+                irc.whois(event.nick, (info) => {
+                    domainMap[event.nick] = info.real_name || 'Unknown';
+                });
+            });
+
+            irc.on('part', (event) => {
+                socket.emit('system', `${event.nick} left ${event.channel}`);
+                socket.emit('user_left');
+                delete domainMap[event.nick];
+            });
+
+            irc.on('quit', (event) => {
+                socket.emit('system', `${event.nick} quit IRC`);
+                socket.emit('user_left');
+                delete domainMap[event.nick];
+            });
+
+            irc.on('error', (event) => {
+                console.error('[webchatIRC] IRC error:', event);
+                socket.emit('error_msg', `IRC error: ${event.reason || event.message || 'Unknown error'}`);
+            });
+
+            irc.on('close', () => {
+                socket.emit('system', 'Disconnected from IRC.');
+            });
+
+            socket.irc = irc;
+        });
+
+        socket.on('chat', (text) => {
+            if (!socket.irc) return;
+            if (typeof text !== 'string' || !text.trim()) return;
+
+            const cleanText = text.trim().slice(0, 500);
+            const channel = ircConfig.channel;
+
+            socket.irc.say(channel, cleanText);
+            socket.emit('message', {
+                channel: channel,
+                nick: socket.irc.user.nick,
+                text: cleanText,
+                domain: socket.irc.userDomain,
+                timestamp: Date.now(),
+                self: true
+            });
+        });
+
+        // Guestbook events
+        if (config.guestbook.enabled) {
+            socket.on('guestbook:load', () => {
+                socket.emit('guestbook:entries', guestbookEntries);
+            });
+
+            socket.on('guestbook:sign', ({ name, message }) => {
+                if (!name || typeof name !== 'string') return;
+                if (!message || typeof message !== 'string') return;
+
+                const ip = socket.handshake.headers['x-forwarded-for'] || socket.handshake.address;
+                const alreadySigned = guestbookEntries.some(e => e.ip === ip);
+                if (alreadySigned) {
+                    socket.emit('guestbook:error', 'You have already signed the guestbook!');
+                    return;
+                }
+
+                const entry = {
+                    name: name.replace(/[^a-zA-Z0-9_ -]/g, '').slice(0, 32),
+                    message: message.trim().slice(0, 200),
+                    domain: socket.handshake.headers.origin || 'Unknown',
+                    date: new Date().toISOString(),
+                    ip: ip
+                };
+
+                guestbookEntries.push(entry);
+                if (guestbookEntries.length > config.guestbook.maxEntries) {
+                    guestbookEntries = guestbookEntries.slice(-config.guestbook.maxEntries);
+                }
+                saveGuestbook();
+
+                // Broadcast without IP (important!!)
+                const publicEntry = { name: entry.name, message: entry.message, domain: entry.domain, date: entry.date };
+                io.emit('guestbook:new', publicEntry);
+                socket.emit('guestbook:signed');
+            });
+        }
+
+        socket.on('disconnect', () => {
+            if (socket.irc) {
+                const nick = socket.irc.user ? socket.irc.user.nick : null;
+                socket.irc.quit('webchatIRC Client Disconnected');
+                if (nick) delete domainMap[nick];
+            }
+            console.log('[webchatIRC] Client disconnected');
+        });
+    });
+
+    app.use(express.static(path.join(__dirname, 'public')));
+
+    server.listen(port, () => {
+        console.log(`[webchatIRC] Server running at http://localhost:${port}`);
+        console.log(`[webchatIRC] IRC: ${ircConfig.host}:${ircConfig.port} ${ircConfig.channel}`);
+    });
+
+    return { app, server, io };
+}
+
+module.exports = { createServer };
+
+if (require.main === module) {
+    const configPath = path.join(__dirname, 'webchat.config.json');
+    let fileConfig = {};
+    try {
+        fileConfig = JSON.parse(fs.readFileSync(configPath, 'utf-8'));
+    } catch (err) {
+        console.log('[webchatIRC] No webchat.config.json found, using defaults.');
+    }
+    createServer(fileConfig);
+}

package/package.json

@@ -0,0 +1,44 @@
+{
+  "name": "webchat-irc",
+  "version": "1.0.0",
+  "description": "Interlinked IRC for your website.",
+  "keywords": [
+    "irc",
+    "chat",
+    "webchat",
+    "embed",
+    "widget"
+  ],
+  "homepage": "https://github.com/byeoon/webchat-irc#readme",
+  "bugs": {
+    "url": "https://github.com/byeoon/webchat-irc/issues"
+  },
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/byeoon/webchat-irc.git"
+  },
+  "license": "ISC",
+  "author": "byeoon",
+  "type": "commonjs",
+  "main": "index.js",
+  "bin": {
+    "webchat-irc": "./bin/webchat.js"
+  },
+  "files": [
+    "bin/",
+    "public/",
+    "index.js",
+    "webchat.config.example.json",
+    "README.md"
+  ],
+  "scripts": {
+    "start": "node bin/webchat.js",
+    "test": "echo \"Error: no test specified\" && exit 1"
+  },
+  "dependencies": {
+    "express": "^5.2.1",
+    "irc-framework": "^4.14.0",
+    "socket.io": "^4.8.3",
+    "socket.io-client": "^4.8.3"
+  }
+}

package/public/demo.html

@@ -0,0 +1,178 @@
+<!DOCTYPE html>
+<html lang="en">
+
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>webchat - IRC for your website</title>
+    <link rel="stylesheet" href="https://getbootstrap.com/1.4.0/assets/css/bootstrap.min.css">
+    <link rel="stylesheet" href="style.css">
+</head>
+
+<body>
+    <div class="topbar">
+        <div class="fill">
+            <div class="container">
+                <a class="brand" href="#">webchat IRC</a>
+                <ul class="nav">
+                    <li><a href="/index.html">Home</a></li>
+                    <li><a href="#about">Setup</a></li>
+                    <li class="active"><a href="/demo.html">Demo</a></li>
+                </ul>
+            </div>
+        </div>
+    </div>
+
+    <div class="chat-wrapper">
+        <div class="username-overlay" id="usernameOverlay">
+            <div class="username-form">
+                <h2>Enter webchatIRC Demo</h2>
+                <p class="form-subtitle">Pick a name and start chatting</p>
+                <input type="text" id="usernameInput" class="username-input" placeholder="Enter your name..."
+                    maxlength="16" autocomplete="off">
+                <button class="btn primary" id="connectBtn">Connect</button>
+            </div>
+        </div>
+
+        <div class="webchatcontainer" id="chatContainer">
+            <div class="chat-header">
+                <div class="chat-header-left">
+                    <h1>webchat-IRC</h1>
+                    <span class="channel-label" id="channelLabel">#webchatirc-general</span>
+                </div>
+                <div class="chat-header-right">
+                    <span class="server-label" id="serverLabel"></span>
+                    <span class="users-label" id="usersLabel"></span>
+                </div>
+            </div>
+            <div class="divider"></div>
+            <div id="log">
+                <ul id="chat-list"></ul>
+            </div>
+        </div>
+
+        <div class="chatbox-wrapper" id="chatboxWrapper" style="display: none;">
+            <input type="text" class="chatbox" id="chatInput" placeholder="Type a message..." maxlength="500"
+                autocomplete="off" disabled>
+            <button class="send-btn" id="sendBtn" disabled>Send</button>
+        </div>
+    </div>
+
+    <footer>
+        <p>Open source on <b><a href="https://github.com/byeoon/webchatIRC">GitHub</a></b>!</p>
+    </footer>
+
+    <script src="/socket.io/socket.io.js"></script>
+    <script>
+        const chatList = document.getElementById('chat-list');
+        const logContainer = document.getElementById('log');
+        const usernameOverlay = document.getElementById('usernameOverlay');
+        const usernameInput = document.getElementById('usernameInput');
+        const connectBtn = document.getElementById('connectBtn');
+        const chatInput = document.getElementById('chatInput');
+        const sendBtn = document.getElementById('sendBtn');
+        const chatboxWrapper = document.getElementById('chatboxWrapper');
+        const channelLabel = document.getElementById('channelLabel');
+        const serverLabel = document.getElementById('serverLabel');
+        const usersLabel = document.getElementById('usersLabel');
+
+        const socket = io();
+        let connected = false;
+        let currentUserCount = 0;
+
+        function formatTime(ts) {
+            const d = ts ? new Date(ts) : new Date();
+            return d.toLocaleTimeString([], { hour: '2-digit', minute: '2-digit' });
+        }
+
+        function escapeHTML(str) {
+            const div = document.createElement('div');
+            div.textContent = str;
+            return div.innerHTML;
+        }
+
+        function addSystemMessage(text) {
+            const li = document.createElement('li');
+            li.classList.add('system-msg');
+            li.innerHTML = `<span class="timestamp">${formatTime()}</span> <span class="system-text">* ${escapeHTML(text)}</span>`;
+            chatList.appendChild(li);
+            logContainer.scrollTop = logContainer.scrollHeight;
+        }
+
+        function addChatMessage(msg) {
+            const li = document.createElement('li');
+            li.classList.add('chat-msg');
+            if (msg.self) li.classList.add('self-msg');
+
+            li.innerHTML = `<span class="timestamp">${formatTime(msg.timestamp)}</span> <span class="domain">[${escapeHTML(msg.domain)}]</span> <span class="nick">${escapeHTML(msg.nick)}</span>: <span class="text">${escapeHTML(msg.text)}</span>`;
+            chatList.appendChild(li);
+            logContainer.scrollTop = logContainer.scrollHeight;
+        }
+        socket.on('system', (text) => addSystemMessage(text));
+        socket.on('message', (msg) => addChatMessage(msg));
+        socket.on('error_msg', (text) => {
+            addSystemMessage(`ERROR: ${text}`);
+        });
+
+        socket.on('server_info', (data) => {
+            serverLabel.textContent = `Server: ${data.server}`;
+            currentUserCount = data.userCount;
+            usersLabel.textContent = `${currentUserCount} user${currentUserCount !== 1 ? 's' : ''}`;
+        });
+
+        socket.on('user_joined', () => {
+            if (currentUserCount > 0) {
+                currentUserCount++;
+                usersLabel.textContent = `${currentUserCount} user${currentUserCount !== 1 ? 's' : ''}`;
+            }
+        });
+
+        socket.on('user_left', () => {
+            if (currentUserCount > 0) {
+                currentUserCount--;
+                usersLabel.textContent = `${currentUserCount} user${currentUserCount !== 1 ? 's' : ''}`;
+            }
+        });
+
+        function doConnect() {
+            const username = usernameInput.value.trim() || 'Guest';
+            socket.emit('register', {
+                domain: window.location.hostname,
+                username: username
+            });
+
+            usernameOverlay.classList.add('hidden');
+            chatboxWrapper.style.display = 'flex';
+            chatInput.disabled = false;
+            sendBtn.disabled = false;
+            chatInput.focus();
+            connected = true;
+        }
+
+        connectBtn.addEventListener('click', doConnect);
+        usernameInput.addEventListener('keydown', (e) => {
+            if (e.key === 'Enter') doConnect();
+        });
+
+        usernameInput.focus();
+
+        function sendMessage() {
+            const text = chatInput.value.trim();
+            if (!text || !connected) return;
+            socket.emit('chat', text);
+            chatInput.value = '';
+            chatInput.focus();
+        }
+
+        chatInput.addEventListener('keydown', (e) => {
+            if (e.key === 'Enter') {
+                e.preventDefault();
+                sendMessage();
+            }
+        });
+
+        sendBtn.addEventListener('click', sendMessage);
+    </script>
+</body>
+
+</html>