Node.js Bindings

The Tangible Engine Node.js binding offers an interface for interacting with the Tangible Engine v3 service using Node.js application frameworks, such as Electron. The Node.js bindings use a TCP socket to communicate with the locally running Tangible Engine service. This TCP socket is not available in the browser directly, so something like Electron is needed in order to make the TCP connection.

Setting up the Engine

Once initialized, the TangibleEngine class creates a TCP socket connection with the Tangible Engine service and registered touch event listeners on a DOM target.


Import the TangibleEngine class using Node module exports, or import if your development environment supports ES6-style imports (such as when transpiling with Babel).

  // using exports module
  const TangibleEngine = require('./TangibleEngine').default

  // using ES6-style imports
  import TangibleEngine from './TangibleEngine'
Instantiate TangibleEngine. By default, the TangibleEngine constructor will attach touch event listeners to the window and open a TCP socket on port 4949. Optionally, you can pass a DOMString selector for the touch event listeners, and a port number.

   // with defaults
  const te = new TangibleEngine()

  // with options
  const te = new TangibleEngine('#app', 4002)
The port number must match the port number used by the Tangible Engine service.

Interfacing with the Engine

  • Initialize TangibleEngine

  // intialize update loop and register touch event listeners
  • Subscribe to the patterns event

  te.on('patterns', (response) => {
    response.PATTERNS.foreach((pattern) => {
      // do some stuff
  • Subscribe to the update event

  te.on('update', (response) => {
    response.TANGIBLES.foreach((tangible) => {
      // do some stuff


  • De-initialize the Tangible Engine client and remove registered touch event listeners


Electron Demo

From the powershell or bash shell in Windows navigate to the Node binding directory. It will be <source directory>\Bindings\Node\demo.
  • Build the tangibleEngine.js file from a shell.

  cd <source directory>\Bindings\Node
  npm install
  npm run build
  • Install the Electron dependencies and build the demo.

  cd <source directory>\Bindings\Node\demo
  npm install
  npm run start

Building an executable

If you want to build an executable to use on another Windows computer, there is an npm script for that.

  cd demo
  npm run package
It will put the executable here <source directory>\Bindings\Node\demo\out\tangible-engine-node-demo-win32-x64\tangible-engine-node-demo.exe


Electron has a nice feature where one can open the chrome-developer tools by clicking ctrl-shift-I. It is quite useful when developing.

Windows 11 Note

On Windows 11, there are some touch settings that interfere. Turn off “three- and four-finger gestures” in the “Bluetooth&Devices”->”Touch settings”.

Updating Bindings

To update the Node.js bindings, all you really need to do is recompile the dist/TangibleEngine.js file by running npm install and npm run build in the top level folder. Make sure your project can find the newly compiled js file, and run your application. 

The Node.js bindings now print out the TE version that the service is expecting at runtime in order to help make sure you are using the correct and most up to date bindings.
Last Updated: 6/3/2024