Skip to content

A lightweight local 3D meeting/demo app that uses Three.js, WebRTC-style socket updates, and pose/audio streaming to show simple avatars in a shared "space". This repository contains the server (Node/Express + Socket.IO) and client pages for login, creating/joining meetings, and a 3D space that uses Mediapipe/Kalidokit for face/pose mapping.

Notifications You must be signed in to change notification settings

tejasnayak25/3dmeet

Repository files navigation

3D Meet

A lightweight local 3D meeting/demo app that uses Three.js, WebRTC-style socket updates, and pose/audio streaming to show simple avatars in a shared "space". This repository contains the server (Node/Express + Socket.IO) and client pages for login, creating/joining meetings, and a 3D space that uses Mediapipe/Kalidokit for face/pose mapping.


Quick overview

  • Server: index.js (Express + Socket.IO)
  • Main client (3D space): space.html + space.js
  • Meeting form / auth pages: meetForm.html, login.html, logout.html
  • Simple local user store: storage/users.db (JSON file)

Requirements

  • Node.js (14+ recommended)
  • npm (or yarn)
  • Optional: nodemon for hot reload while developing

The project depends on the packages declared in package.json:

  • express
  • socket.io
  • kalidokit
  • node-localstorage

Quick start (Windows / PowerShell)

  1. Open a PowerShell terminal in the repository root (e:\imp\imp\3dmeet).
  2. Install dependencies:
npm install
  1. Start the server:

Use nodemon (the start script assumes nodemon is installed globally):

npm start

Or run directly with node if you don't have nodemon:

node index.js
  1. Open the app in your browser:

http://localhost:3000/

Notes: the server listens on port 3000 by default (see index.js).

How the app works (short)

  • The Express server serves static assets and provides a few routes for pages and JS modules. Socket.IO namespaces (/login, /meetForm, /space) handle realtime messaging for auth, meeting creation/joining, and pose/audio broadcasting.
  • space.html loads Three.js, Mediapipe models, Kalidokit and local modules (space.js, mocap.js, audio.js) to capture webcam/pose/audio data and broadcast it to the other participants.
  • Meetings are tracked in-memory inside index.js (the meetings object). Users are stored in storage/users.db as a JSON array.

Important notes & gotchas

  • Hardcoded absolute paths: index.js uses absolute Windows paths like E:/Imp/3dmeet/... when sending files and reading storage/users.db. For portability, update those to use __dirname or relative paths. Example change to make it portable:

    • Replace usages like res.sendFile('E:/Imp/3dmeet/space.html') with res.sendFile(path.join(__dirname, 'space.html')) (and const path = require('path')).
  • storage/users.db is a plain JSON file storing user data (including passwords). This is intended for demo/local use only. Do NOT use this in production. Consider using a proper database and hashing passwords.

  • The meeting state is stored in-memory: restarting the server clears all meetings.

  • The /space route in index.js decodes req.query.id and req.query.user using atob (client-side base64 decoding). When constructing deep links, ensure these query params are base64-encoded.

Development tips

  • Use nodemon for development to auto-restart the server on edits. Install globally if needed:
npm install -g nodemon
  • If you want to make the server more portable, change all absolute paths in index.js to use path.join(__dirname, ...) and ensure static middleware app.use(express.static(__dirname)); is kept.
  • If you want persistent meetings/users across restarts, replace the in-memory meetings object and the JSON file with a small database (SQLite, lowdb, or a hosted DB).

Project layout

  • index.js — Express server + Socket.IO namespaces and handlers
  • space.html — 3D space client page (loads models and mediapipe scripts)
  • space.js, mocap.js, audio.js — client modules (real-time capture + networking)
  • meetForm.html, login.html, logout.html — UI pages for creating/joining a meeting and auth flows
  • models/, animations/, backgrounds/ — assets used by the client
  • storage/users.db — simple JSON user store (demo only)

Security & privacy

  • This project is a demo/prototype. User passwords are stored in plain text in storage/users.db — change this before using with real users.
  • Socket.IO messages are unencrypted over HTTP. If you deploy to a network, run behind HTTPS and consider authentication tokens.

Troubleshooting

  • If npm start fails because nodemon is missing, either install nodemon globally or run node index.js.
  • If pages fail to load modules, confirm the server is running from the same folder that holds the files (or update paths in index.js).

Next steps / enhancements (suggestions)

  • Replace absolute paths with path.join(__dirname, ...) for portability.
  • Replace the plain JSON user store with an encrypted DB and hashed passwords.
  • Add basic automated tests for server endpoints and Socket.IO handlers.
  • Add a simple UI to list active meetings and invite links.

License

This project uses the ISC license (see package.json).

About

A lightweight local 3D meeting/demo app that uses Three.js, WebRTC-style socket updates, and pose/audio streaming to show simple avatars in a shared "space". This repository contains the server (Node/Express + Socket.IO) and client pages for login, creating/joining meetings, and a 3D space that uses Mediapipe/Kalidokit for face/pose mapping.

Topics

Resources

Stars

Watchers

Forks

Languages