@cs7player/chat 1.0.0

package/.vscode/settings.json

@@ -0,0 +1,6 @@
+{
+ "editor.tabSize": 1,
+ "editor.insertSpaces": true,
+ "editor.detectIndentation": false,
+ "css.lint.unknownAtRules": "ignore"
+}

package/Read.md

@@ -0,0 +1 @@
+if u find any issue send mail to s.chandrasekhar.h@gmail.com

package/app.js

@@ -0,0 +1,2 @@
+#!/usr/bin/env node
+import "./src/start.js";

package/package.json

@@ -0,0 +1,34 @@
+{
+ "name": "@cs7player/chat",
+ "version": "1.0.0",
+ "description": "to communicate in terminal",
+ "keywords": [
+  "chat"
+ ],
+ "bin": {
+  "lan-chat": "./app.js"
+ },
+ "license": "MIT",
+ "author": {
+  "name": "s.h.chandra sekhar",
+  "email": "s.chandrasekhar.h@gmail.com"
+ },
+ "type": "module",
+ "main": "app.js",
+ "scripts": {
+  "test": "echo \"Error: no test specified\" && exit 1"
+ },
+ "homepage": "https://github.com/CS7player/lan-chat#readme",
+ "repository": {
+  "type": "git",
+  "url": "git+https://github.com/CS7player/lan-chat.git"
+ },
+ "bugs": {
+  "url": "https://github.com/CS7player/lan-chat/issues"
+ },
+ "dependencies": {
+  "blessed": "^0.1.81",
+  "chalk": "^5.6.2",
+  "ws": "^8.20.1"
+ }
+}

package/src/network/discovery.js

@@ -0,0 +1,94 @@
+import dgram from "dgram";
+import * as os from "os";
+
+const PORT = 41234;
+const socket = dgram.createSocket("udp4");
+
+const ipToInt = (ip) => {
+ return ip.split(".").reduce((acc, p) => (acc << 8) + Number(p), 0) >>> 0;
+}
+
+const intToIp = (int) => {
+ return [
+  (int >>> 24) & 255,
+  (int >>> 16) & 255,
+  (int >>> 8) & 255,
+  int & 255,
+ ].join(".");
+}
+
+const getBroadcastIp = (netObj) => {
+ if (!netObj?.address || !netObj?.netmask) return null;
+ const ipInt = ipToInt(netObj.address);
+ const maskInt = ipToInt(netObj.netmask);
+ const network = ipInt & maskInt;
+ const broadcast = network | (~maskInt >>> 0);
+ return intToIp(broadcast);
+}
+
+export const getRealLANIP = () => {
+ const nets = os.networkInterfaces();
+ let fallback = null;
+ for (const name of Object.keys(nets)) {
+  for (const net of nets[name]) {
+   if (net.family !== "IPv4" || net.internal) continue;
+   const ip = net.address;
+   // skip virtual adapters
+   if (ip.startsWith("192.168.56.")) continue;
+   if (ip.startsWith("169.254.")) continue;
+   const isPreferred =
+    ip.startsWith("192.168.") ||
+    ip.startsWith("10.");
+   if (isPreferred) return net;
+   fallback = net;
+  }
+ }
+ return fallback || null;
+}
+
+export const startDiscovery = (username, onUserFound) => {
+ socket.bind(PORT, () => {
+  socket.setBroadcast(true);
+  const interval = setInterval(() => {
+   const net = getRealLANIP();
+   if (!net) {
+    console.log("No LAN interface found");
+    return;
+   }
+   const broadcastIP = getBroadcastIp(net);
+   if (!broadcastIP) {
+    console.log("Could not compute broadcast IP");
+    return;
+   }
+   const message = JSON.stringify({
+    type: "DISCOVER",
+    username,
+    ip: net.address,
+    port: 8080,
+   });
+   socket.send(
+    message,
+    0,
+    message.length,
+    PORT,
+    broadcastIP
+   );
+  }, 3000);
+  socket.interval = interval;
+ });
+ socket.on("message", (msg, rinfo) => {
+  try {
+   const data = JSON.parse(msg.toString());
+   if (data.type === "DISCOVER") {
+    onUserFound({
+     ip: data.ip || rinfo.address,
+     username: data.username,
+     port: data.port,
+    });
+   }
+  } catch (err) {
+   // ignore invalid packets
+   console.log(err);
+  }
+ });
+}

package/src/network/peers.js

@@ -0,0 +1,8 @@
+const peers = new Map();
+
+export function addPeer(ip, data) { peers.set(ip, data); }
+export function removePeer(ip) { peers.delete(ip); }
+export function hasPeer(ip) { return peers.has(ip); }
+export function getPeer(ip) { return peers.get(ip); }
+export function getPeers() { return peers; }
+export function getUsers() { return [...peers.values()]; }

package/src/network/websocket.js

@@ -0,0 +1,108 @@
+import WebSocket, { WebSocketServer } from "ws";
+import { addMessage, chatState, removeUser, addUser } from "../state/chatState.js";
+import { addPeer, removePeer, hasPeer, getPeers } from "./peers.js";
+import { createAlertBox } from "../tui/alert.js";
+import { clearFocus, screenExit } from "../utils/screen.js";
+import { startUI } from "../tui/welcome.js";
+
+export const startWSServer = (username) => {
+ try {
+  const wss = new WebSocketServer({ port: 8080 });
+  wss.on("listening", () => {
+   console.log("WS LISTENING on 8080");
+   startUI();
+  });
+  wss.on("error", (err) => {
+   console.error("WS failed:", err);
+  });
+  wss.on("connection", (ws, req) => {
+   const ip = req.socket.remoteAddress;
+   ws.on("message", (raw) => {
+    try {
+     const data = JSON.parse(raw.toString());
+     if (data.type === "INTRO") {
+      addPeer(ip, {
+       ws,
+       username: data.username,
+      });
+      addUser({ username: data.username, ip });
+      return;
+     }
+     if (data.type === "CHAT") {
+      for (const [, peer] of getPeers()) {
+       peer.ws.send(JSON.stringify(data));
+      }
+     }
+     if (data.type === "PRIVATE_CHAT") {
+
+     }
+    } catch (e) {
+     console.error("❌ MESSAGE ERROR:", e);
+     screenExit();
+    }
+   });
+
+   ws.on("close", () => {
+    const peer = getPeers().get(ip);
+    removeUser(peer?.username)
+    removePeer(ip);
+   });
+  });
+
+ } catch (err) {
+  console.error("❌ START ERROR:", err);
+  screenExit();
+ }
+}
+
+export const connectToPeer = (ip, username) => {
+ if (hasPeer(ip)) return;
+ const ws = new WebSocket(`ws://${ip}:8080`);
+ ws.on("open", () => {
+  addPeer(ip, { ws, username: "unknown" });
+  ws.send(JSON.stringify({
+   type: "INTRO",
+   username
+  }));
+ });
+
+ ws.on("message", (raw) => {
+  try {
+   const data = JSON.parse(raw.toString());
+   const userObj = { username: data["from"] }
+   addMessage(userObj, data)
+  } catch (err) {
+   console.log(err);
+  }
+ });
+ ws.on("close", () => { removePeer(ip); });
+}
+
+export const sendMessage = (username, message) => {
+ const payload = JSON.stringify({
+  type: "CHAT",
+  from: username,
+  message,
+  timestamp: Date.now(),
+ });
+ for (const [, peer] of getPeers()) {
+  peer.ws.send(payload);
+ }
+}
+
+// send to specific peer
+export const sendPrivateMessage = (toIp, username, message) => {
+ const peer = getPeers().get(toIp);
+ if (!peer) {
+  clearFocus();
+  createAlertBox("Selected User in Left.")
+  return;
+ }
+ const payload = JSON.stringify({
+  type: "PRIVATE_CHAT",
+  from: chatState.whoami,
+  message,
+  timestamp: Date.now(),
+ });
+ peer.ws.send(payload);
+}

package/src/start.js

@@ -0,0 +1,14 @@
+import * as os from "os";
+import { startWSServer, connectToPeer } from "./network/websocket.js";
+import { startDiscovery, getRealLANIP } from "./network/discovery.js";
+
+const username = os.userInfo().username;
+
+startWSServer(username);
+
+startDiscovery(username, (user) => {
+ if (user.username === username) return;
+ connectToPeer(user.ip, username);
+});
+
+

package/src/state/chatState.js

@@ -0,0 +1,51 @@
+import * as os from "node:os";
+import { loadUsers } from "../tui/side-bar.js";
+import { renderMessage, renderContent } from "../tui/content.js";
+import { sendPrivateMessage } from "../network/websocket.js";
+
+export const chatState = {
+ whoami: os.userInfo().username,
+ users: [],
+ messages: {},
+ selectedUser: null,
+};
+
+export function addUser(user) {
+ chatState.users.push(user);
+ loadUsers()
+}
+
+export function removeUser(username) {
+ chatState.users = chatState.users.filter(user => user.username !== username);
+ renderContent("no user Selected!!");
+ loadUsers()
+}
+
+export function setSelectedUser(user) {
+ chatState.selectedUser = user;
+ if (!chatState.messages[user.username]) {
+  chatState.messages[user.username] = [];
+ }
+}
+
+export function addMessage(user, msg) {
+ const key = user.username || "global";
+ if (!chatState.messages[key]) {
+  chatState.messages[key] = [];
+ }
+ chatState.messages[key].push(msg);
+ if (chatState.selectedUser.username == msg.from) {
+  renderMessage(msg);
+ }
+}
+
+export function sendMessage(user, msg) {
+ sendPrivateMessage(user.ip, user.username, msg)
+ const msgObj = {
+  from: "You",
+  to: user.username,
+  message: msg,
+  time: Date.now(),
+ };
+ addMessage(user, msgObj);
+}

package/src/tui/alert.js

@@ -0,0 +1,107 @@
+import blessed from "blessed";
+import { screen, screenRefresh, addFocusBtn, removeFocusBtn } from "../utils/screen.js";
+import { color, tabsfocus } from "../utils/contants.js";
+/**
+ * Creates a simple alert modal with OK button
+ * @param {string} message
+ * @param {Function} onClose
+ */
+export const createAlertBox = (
+ message = 'Something happened!',
+ onClose = null
+) => {
+ const overlay = blessed.box({
+  parent: screen,
+  top: 0,
+  left: 0,
+  width: '100%',
+  height: '100%',
+  style: {
+   bg: color.black,
+   transparent: false
+  }
+ });
+
+ // alert container
+ const alertBox = blessed.box({
+  parent: overlay,
+  top: 'center',
+  left: 'center',
+  width: '50%',
+  height: 9,
+  border: {
+   type: 'line'
+  },
+  tags: true,
+  label: ' Alert ',
+  style: {
+   fg: color.white,
+   bg: color.black,
+   border: {
+    fg: color.purple
+   }
+  }
+ });
+
+ // message text
+ blessed.text({
+  parent: alertBox,
+  top: 2,
+  left: 2,
+  width: '90%',
+  align: 'center',
+  content: message,
+  style: {
+   fg: color.white
+  }
+ });
+
+ // OK button
+ const okBtn = blessed.button({
+  parent: alertBox,
+  bottom: 1,
+  left: 'center',
+  width: 10,
+  height: 1,
+  mouse: true,
+  keys: true,
+  shrink: true,
+  name: 'ok-button',
+  content: ' OK ',
+  style: {
+   fg: color.black,
+   bg: color.red,
+   focus: {
+    fg: color.white,
+    bg: color.blue
+   },
+   hover: {
+    fg: color.white,
+    bg: color.blue
+   }
+  }
+ });
+
+ // add to focus system
+ okBtn.focus();
+ addFocusBtn({ id: 99, btn: okBtn });
+ tabsfocus.btnIndex = tabsfocus.btns.findIndex(b => b.id === 99);
+ tabsfocus.istoggle = false;
+
+ const closeAlert = () => {
+  tabsfocus.istoggle = true;
+  overlay.destroy();
+  if (onClose && typeof onClose === 'function') { onClose(); }
+  removeFocusBtn(99);
+  screenRefresh();
+ };
+
+ okBtn.on('press', closeAlert);
+ // ESC closes alert too
+ alertBox.key(['escape'], closeAlert);
+ screenRefresh();
+ return {
+  alertBox,
+  closeAlert
+ };
+};

package/src/tui/content.js

@@ -0,0 +1,61 @@
+import blessed from "blessed";
+import { screen } from "../utils/screen.js";
+import { color } from '../utils/contants.js';
+import { chatState, addMessage } from "../state/chatState.js";
+import { renderMsgBar } from "./msg-bar.js";
+
+const contentBox = blessed.box({
+ top: 1,
+ left: "20%",
+ width: "80%",
+ height: "100%-6",
+ label: " Chat ",
+ tags: true,
+ border: { type: "line" },
+ scrollable: true,
+ alwaysScroll: true,
+ scrollbar: {
+  ch: "│",
+  style: { fg: color.yellow },
+ },
+ style: {
+  fg: color.white,
+  bg: color.black,
+  border: { fg: color.yellow },
+ },
+ content: " NO one is Selected",
+});
+
+/* -RENDER CHAT CONTAINER-*/
+export const renderContent = (text = "") => {
+ contentBox.setLabel(text);
+ screen.append(contentBox);
+ renderMsgBar();
+ screen.render();
+};
+
+/* -CLEAR CHAT-*/
+export const clearChat = () => {
+ contentBox.setContent("");
+ screen.render();
+};
+
+/* -MESSAGE RENDERER (LEFT / RIGHT)-*/
+export const renderMessage = (msg) => {
+ const isMe = msg.from === "You";
+ const formatted = isMe
+  ? `{right}${msg.from}: ${msg.message}{/right}`
+  : `{left}${msg.from}: ${msg.message}{/left}`;
+ const current = contentBox.getContent();
+ contentBox.setContent(current + "\n" + formatted);
+ contentBox.setScrollPerc(100);
+ screen.render();
+};
+
+/* -LOAD CHAT HISTORY (OPTIONAL)-*/
+export const loadChatHistory = (user) => {
+ const msgs = chatState.messages?.[user.username] || [];
+ contentBox.setContent("");
+ msgs.forEach(renderMessage);
+ screen.render();
+};

package/src/tui/header.js

@@ -0,0 +1,60 @@
+import blessed from 'blessed';
+import { screen, addFocusBtn } from '../utils/screen.js';
+import { showDialogBox } from '../utils/dialog.js';
+import { color } from '../utils/contants.js';
+import { clearFocus } from "../utils/screen.js";
+
+// HEADER
+const header = blessed.box({
+ top: 0,
+ left: 0,
+ width: '100%',
+ height: 1,
+ style: {
+  bg: color.green,
+ }
+});
+
+const title = blessed.text({
+ parent: header,
+ top: 0,
+ left: 'center',
+ width: 'shrink',
+ height: 1,
+ align: 'center',
+ content: 'cHat TUI',
+ style: {
+  fg: color.yellow,
+  bg: color.green,
+  bold: true,
+ }
+});
+
+// Exit button 
+const exitBtn = blessed.button({
+ parent: header,
+ content: ' X ',
+ top: 0,
+ right: 2,
+ height: 1,
+ shrink: true,
+ mouse: true,
+ keys: true,
+ style: {
+  fg: color.white, bg: color.red,
+  focus: { fg: color.white, bg: color.purple },
+  hover: { fg: color.white, bg: color.purple },
+  active: { fg: color.white, bg: color.red }
+ }
+});
+
+exitBtn.on('press', () => {
+ clearFocus();
+ showDialogBox();
+ screen.render();
+});
+
+export const renderHeader = () => {
+ addFocusBtn({ id: 4, btn: exitBtn })
+ screen.append(header);
+}

package/src/tui/layout.js

@@ -0,0 +1,12 @@
+import { renderHeader } from './header.js';
+import { renderSideBar } from './side-bar.js';
+import { renderContent } from './content.js';
+import { screenRefresh } from '../utils/screen.js';
+// Append all
+export const displayDashboard = () => {
+ renderHeader();
+ renderSideBar();
+ renderContent(" Chat ");
+ screenRefresh();
+}
+

package/src/tui/msg-bar.js

@@ -0,0 +1,112 @@
+import blessed from "blessed";
+import { addFocusBtn, screen, focusButton, screenRefresh, clearFocus } from "../utils/screen.js";
+import { color, tabsfocus } from '../utils/contants.js';
+import { chatState, sendMessage } from "../state/chatState.js";
+import { renderMessage } from "./content.js";
+import { createAlertBox } from "./alert.js";
+
+/* -INPUT BAR CONTAINER-*/
+const inputBar = blessed.box({
+ bottom: 0,
+ left: "20%",
+ width: "80%",
+ height: 5,
+ label: "{yellow-fg} Use TAB to Navigate {/yellow-fg}",
+ tags: true,
+ border: {
+  type: "line"
+ },
+ style: {
+  fg: color.white,
+  bg: color.black,
+  border: {
+   fg: color.green
+  }
+ }
+});
+
+/* -INPUT BOX-*/
+export const inputBox = blessed.textbox({
+ parent: inputBar,
+ left: 0,
+ top: 0,
+ height: 3,
+ width: "85%",
+ keys: true,
+ mouse: true,
+ border: { type: "line" },
+ style: {
+  fg: color.white,
+  bg: color.black,
+  border: { fg: color.green },
+  focus: { border: { fg: color.purple } },
+  hover: { border: { fg: color.purple } }
+ },
+});
+
+/* -SEND BUTTON-*/
+const sendButton = blessed.button({
+ parent: inputBar,
+ right: 0,
+ top: 0,
+ height: 3,
+ width: 10,
+ content: " Send ",
+ mouse: true,
+ keys: true,
+ align: "center",
+ shrink: true,
+ border: { type: "line", },
+ style: {
+  fg: color.black,
+  bg: color.green,
+  border: { fg: color.white, },
+  focus: { border: { fg: color.purple }, bg: color.yellow, fg: color.green },
+  hover: { border: { fg: color.purple }, bg: color.yellow, fg: color.green }
+ },
+});
+
+/* -SEND MESSAGE HANDLER-*/
+const handleSend = () => {
+ try {
+  // inputBox.cancel();
+  const text = inputBox.getValue().trim();
+  if (!text) {
+   clearFocus();
+   createAlertBox("NO Text is Entered!");
+   return;
+  }
+  const user = chatState.selectedUser;
+  if (!user) {
+   clearFocus();
+   createAlertBox("NO User is Selected!");
+   return;
+  }
+  sendMessage(user, text);
+  inputBox.clearValue();
+ } catch (err) {
+  console.log(err)
+ }
+};
+
+/* -EVENTS-*/
+sendButton.on("press", handleSend);
+
+inputBox.on('click', () => {
+ inputBox.focus();
+ screen.render();
+});
+inputBox.on('submit', handleSend);
+inputBox.key('tab', () => {
+ clearFocus();
+ return false;
+});
+
+/* -RENDER-*/
+export const renderMsgBar = () => {
+ if (!screen.children.includes(inputBar)) {
+  addFocusBtn({ id: 8, btn: inputBox });
+  addFocusBtn({ id: 9, btn: sendButton });
+  screen.append(inputBar);
+ }
+};

package/src/tui/side-bar.js

@@ -0,0 +1,127 @@
+import blessed from 'blessed';
+import { addFocusBtn, screen, screenRefresh } from '../utils/screen.js';
+import { color } from '../utils/contants.js';
+import { renderContent, clearChat, loadChatHistory } from './content.js';
+import { chatState } from '../state/chatState.js';
+import { setSelectedUser } from '../state/chatState.js';
+
+// SIDEBAR
+const sidebar = blessed.box({
+ top: 1,
+ left: 0,
+ width: '20%',
+ height: '100%-1',
+ label: ' Users (↑/↓ nav) ',
+ border: { type: 'line' },
+ style: {
+  fg: color.white,
+  bg: color.black,
+  border: { fg: color.green },
+  focus: { border: { fg: color.purple } },
+  hover: { border: { fg: color.purple } }
+ }
+});
+
+const spinnerFrames = ['|', '/', '-', '\\'];
+let i = 0;
+const loader = blessed.text({
+ parent: sidebar,
+ top: 1,
+ left: 'center',
+ content: 'Loading users |',
+ style: { fg: color.yellow }
+});
+
+const loaderInterval = setInterval(() => {
+ i = (i + 1) % spinnerFrames.length;
+ loader.setContent(`Loading users ${spinnerFrames[i]}`);
+ sidebar.screen.render();
+}, 120);
+
+function stopLoader() {
+ clearInterval(loaderInterval);
+ loader.hide();
+}
+
+const userRows = [];
+let selectedIndex = 0;
+
+const renderUsers = (users, callBack) => {
+ loader.hide();
+ userRows.forEach(row => row.destroy());
+ userRows.length = 0;
+ users.forEach((user, index) => {
+  const row = blessed.box({
+   parent: sidebar,
+   top: index * 3 + 1,
+   width: '94%',
+   height: 3,
+   keys: true,
+   mouse: true,
+   clickable: true,
+   focusable: true,
+   content: user.username,
+   border: { type: 'line' },
+   style: {
+    fg: color.white,
+    bg: color.black,
+    border: { fg: color.green },
+    focus: { border: { fg: color.purple }, bg: color.green, fg: color.black },
+    hover: { border: { fg: color.purple }, bg: color.green, fg: color.black }
+   }
+  });
+  row.on('click', () => callBack(user, row));
+  row.key('enter', () => callBack(user, row));
+  userRows.push(row);
+ });
+ sidebar.screen.render();
+};
+
+const handleUserClick = (user, box) => {
+ box.focus();
+ setSelectedUser(user);
+ clearChat();
+ renderContent(`Chat with ${user.username}`);
+ loadChatHistory(user);
+ screenRefresh();
+};
+
+export const loadUsers = () => {
+ loader.show();
+ stopLoader()
+ renderUsers(chatState.users, handleUserClick);
+ screen.render();
+}
+
+export const renderSideBar = () => {
+ screen.append(sidebar);
+ addFocusBtn({ id: 7, btn: sidebar })
+ loadUsers();
+}
+
+const isSidebarFocused = () => {
+ let node = screen.focused;
+ while (node) {
+  if (node === sidebar) {
+   if (chatState.users.length == 0)
+    return false;
+   return true;
+  }
+  node = node.parent;
+ }
+ return false;
+};
+
+screen.key(['up'], () => {
+ if (!isSidebarFocused()) return;
+ selectedIndex = (selectedIndex - 1 + userRows.length) % userRows.length;
+ userRows[selectedIndex].focus();
+ screen.render();
+});
+
+screen.key(['down'], () => {
+ if (!isSidebarFocused()) return;
+ selectedIndex = (selectedIndex + 1) % userRows.length;
+ userRows[selectedIndex].focus();
+ screen.render();
+});

package/src/tui/welcome.js

@@ -0,0 +1,104 @@
+import blessed from 'blessed';
+import { screen, screenClear, screenExit, screenRefresh, addFocusBtn, removeFocusBtn } from "../utils/screen.js";
+import { displayDashboard } from "./layout.js"
+import { color } from '../utils/contants.js';
+
+const welcome_box = blessed.box({
+ top: 'center',
+ left: 'center',
+ width: 50,
+ height: 10,
+ border: {
+  type: 'line'
+ },
+ align: 'center',
+ content: `
+
+ Welcome to Chat TUI`,
+ style: {
+  fg: color.white,
+  bg: color.black,
+  border: {
+   fg: color.green
+  }
+ }
+});
+
+// YES button
+const yesBtn = blessed.button({
+ parent: welcome_box,
+ mouse: true,
+ keys: true,
+ shrink: true,
+ padding: {
+  left: 2,
+  right: 2
+ },
+ left: 10,
+ bottom: 2,
+ name: 'yes',
+ content: 'YES',
+ style: {
+  bg: color.green,
+  fg: color.black,
+  focus: {
+   bg: color.purple,
+   fg: color.black,
+   bold: true
+  },
+  hover: {
+   bg: color.purple
+  }
+ }
+});
+
+// NO button
+const noBtn = blessed.button({
+ parent: welcome_box,
+ mouse: true,
+ keys: true,
+ shrink: true,
+ padding: {
+  left: 2,
+  right: 2
+ },
+ right: 10,
+ bottom: 2,
+ name: 'no',
+ content: 'NO',
+ style: {
+  bg: color.red,
+  fg: color.black,
+  focus: {
+   bg: color.purple,
+   fg: color.black,
+   bold: true
+  },
+  hover: {
+   bg: color.purple
+  }
+ }
+});
+
+// YES event
+yesBtn.on('press', () => {
+ screenClear()
+ removeFocusBtn(1)
+ removeFocusBtn(2)
+ displayDashboard()
+});
+
+// NO event
+noBtn.on('press', () => {
+ screenExit();
+});
+
+export const startUI = () => {
+ screen.append(welcome_box);
+ yesBtn.focus();
+ addFocusBtn({ id: 1, btn: yesBtn })
+ addFocusBtn({ id: 2, btn: noBtn })
+ screenRefresh();
+}
+
+

package/src/utils/contants.js

@@ -0,0 +1,17 @@
+export const color = {
+ white: "#ffffff",
+ black: "#000000",
+ primary: "#67e55e",
+ red: "#ff0000",
+ green: "#00ff00",
+ purple: "#9966ff",
+ blue: "#0066ff",
+ sky: "#00ccff",
+ yellow: "#ffff00"
+};
+
+export const tabsfocus = {
+ btns: [],
+ btnIndex: 0,
+ istoggle: true
+}

package/src/utils/dialog.js

@@ -0,0 +1,105 @@
+import blessed from 'blessed';
+import { screen, screenRefresh, addFocusBtn, removeFocusBtn, screenExit } from './screen.js';
+import { color } from './contants.js';
+
+const dialogBox = blessed.box({
+ top: 'center',
+ left: 'center',
+ width: 40,
+ height: 7,
+ border: {
+  type: 'line'
+ },
+ style: {
+  fg: color.white,
+  bg: color.black,
+  border: { fg: color.yellow }
+ },
+ hidden: true
+});
+
+const dialogText = blessed.text({
+ parent: dialogBox,
+ top: 1,
+ left: 'center',
+ content: 'Are you sure you want to exit?',
+ style: {
+  fg: color.white,
+  bg: color.black
+ }
+});
+
+const okBtn = blessed.button({
+ parent: dialogBox,
+ content: ' ok ',
+ bottom: 1,
+ left: 8,
+ shrink: true,
+ mouse: true,
+ style: {
+  fg: color.white,
+  bg: color.red,
+  focus: { bg: color.purple },
+  hover: { bg: color.purple }
+ }
+});
+
+const noBtn = blessed.button({
+ parent: dialogBox,
+ content: ' No ',
+ bottom: 1,
+ right: 8,
+ shrink: true,
+ mouse: true,
+ style: {
+  fg: color.black,
+  bg: color.green,
+  focus: { bg: color.purple },
+  hover: { bg: color.purple }
+ }
+});
+
+okBtn.on('press', () => {
+ dialogBox.hide();
+ removeFocusBtn(okBtn);
+ removeFocusBtn(noBtn);
+ screen.remove(dialogBox);
+ screenExit()
+ disableModalMode();
+ screenRefresh();
+});
+
+noBtn.on('press', () => {
+ dialogBox.hide();
+ removeFocusBtn(5);
+ removeFocusBtn(6);
+ screen.remove(dialogBox);
+ disableModalMode();
+ screenRefresh();
+});
+
+export function showDialogBox() {
+ screen.append(dialogBox)
+ addFocusBtn({ id: 5, btn: okBtn })
+ addFocusBtn({ id: 6, btn: noBtn })
+ okBtn.focus();
+ dialogBox.show();
+ enableModalMode();
+ dialogBox.focus();
+ dialogBox.setFront();
+ screenRefresh();
+}
+
+function enableModalMode() {
+ screen.children.forEach(child => {
+  if (child !== dialogBox) {
+   child.hidden = true;
+  }
+ });
+}
+
+function disableModalMode() {
+ screen.children.forEach(child => {
+  child.hidden = false;
+ });
+}

package/src/utils/screen.js

@@ -0,0 +1,79 @@
+import blessed from 'blessed';
+import { tabsfocus } from '../utils/contants.js';
+
+export const screen = blessed.screen({
+ smartCSR: true,
+ mouse: true,
+ title: "Chat TUI"
+})
+
+screen.key(['escape', 'C-c'], () => {
+ screenExit();
+});
+
+export const screenRefresh = () => { screen.render(); }
+export const screenExit = () => {
+ try {
+  screen.destroy();
+ } catch (e) { }
+ process.stdout.write("\x1b[?25h"); // show cursor
+ process.stdout.write("\x1b[0m");   // reset styles
+ process.exit(0);
+};
+export const screenClear = () => {
+ [...screen.children].forEach(child => child.destroy());
+}
+
+export const addFocusBtn = (btn) => {
+ const exists = tabsfocus.btns.some(b => b.id == btn.id);
+ if (!exists)
+  tabsfocus.btns.push(btn);
+}
+
+export const removeFocusBtn = (index) => {
+ const eleIndex = tabsfocus.btns.findIndex(b => b.id == index);
+ if (eleIndex != -1) {
+  tabsfocus.btns.splice(eleIndex, 1);
+ }
+};
+
+// Helper to focus button
+export const focusButton = (index) => {
+ if (!tabsfocus.btns.length) return;
+ const safeIndex = index % tabsfocus.btns.length;
+ tabsfocus.btnIndex = safeIndex;
+ const item = tabsfocus.btns[safeIndex];
+ if (!item || !item.btn) return;
+ item.btn.focus();
+ if (item.btn.readInput) {
+  item.btn.readInput();
+ }
+ screenRefresh();
+};
+
+// TAB key
+screen.key(['tab'], () => {
+ if (!tabsfocus.istoggle) return;
+ if (!tabsfocus.btns.length) return;
+ tabsfocus.btnIndex = (tabsfocus.btnIndex + 1) % tabsfocus.btns.length;
+ focusButton(tabsfocus.btnIndex);
+});
+
+// ENTER key
+screen.key(['enter'], () => {
+ const item = tabsfocus.btns[tabsfocus.btnIndex];
+ if (!item || !item.btn) return;
+ item.btn.emit('press');
+});
+
+export const clearFocus = () => {
+ if (screen.focused?.cancel) {
+  screen.focused.cancel();
+ }
+ screen.focused = null;
+ screen.render();
+};
+
+
+
+