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.
Install
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)
Note
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
te.init()
- 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
})
})
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.
It will put the executable here <source directory>\Bindings\Node\demo\out\tangible-engine-node-demo-win32-x64\tangible-engine-node-demo.exe
Debugging
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.
