Skip to content

stefanzvkvc/chord_lab

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

11 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

ChordLab

Welcome to ChordLab — a testing and demo tool for the Chord library. It showcases real-time state synchronization with delta tracking across three interactive features: chat, collaborative canvas, and cooperative minesweeper.

Getting started

Prerequisites

  • Elixir ~> 1.14
  • Phoenix ~> 1.7

Installation

  1. Clone the repository:

    git clone https://github.com/stefanzvkvc/chord_lab
    cd chord_lab
  2. Install dependencies:

    mix deps.get
    npm install --prefix assets
  3. Start the server:

    mix phx.server
  4. Open your browser and navigate to:

    http://localhost:4000
    

Features

Chat (/chat)

  • Public and private messaging with real-time delta syncing via Chord
  • Typing indicators tracked as Chord context keys
  • Unread message badges and online presence tracking
  • Delta inspector to visualize outgoing, incoming, and sync deltas
  • Connection loss simulation with automatic reconnection and delta catch-up

Collaborative Canvas (/canvas)

  • 16x16 pixel grid — paint together in real-time
  • 10-color palette with paint brush and eraser tools
  • Every pixel change is a Chord context update generating a delta
  • Multi-client real-time sync via PubSub delta broadcasting
  • Connection loss simulation — reconnect and sync missed pixel changes

Cooperative Minesweeper (/minesweeper)

  • 3 difficulty levels: Easy (8x8, 10 mines), Medium (12x12, 25 mines), Hard (16x16, 50 mines)
  • Left click to reveal, right click to flag
  • Cascade reveal on empty cells — batched as a single Chord delta
  • Win/loss detection with game status tracked as a Chord context key
  • All players share the same board in real-time
  • Connection loss simulation — reconnect and catch up on reveals made by teammates

Shared across all features

  • Delta Inspector — a side panel showing every delta flowing through Chord, color-coded by direction (outgoing, incoming, sync)
  • Connection loss simulation — test reconnection and Chord's delta-based state recovery
  • Online presence via Phoenix Presence

Powered by

Contributing

Contributions are welcome! Feel free to open issues or submit pull requests.

About

Interactive test tool for Chord, showcasing real-time state synchronization, delta tracking, and context management with examples like chat applications, games, and video calls.

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

 
 
 

Contributors