This repository contains a small Svelte project that allows for connecting a mobile phone or micro:bit to a computer and displaying the sensor data.
- Real-time accelerometer data streaming from a mobile device or micro:bit
- WebRTC-based peer connection for mobile devices
- Webcam recording with synchronized sensor data playback
- Timeline view for reviewing recordings
- QR code scanning for easy peer connection to mobile devices
- User-friendly interface built with Svelte
To get started with the project, clone the repository and install the dependencies:
git clone https://github.com/gsteinLTU/SensorTimeline.git
cd SensorTimeline
npm installTo run the project in development mode, use the following command:
npm run devThis will start a local development server.
Navigate to the app in your browser. The GitHub Pages deployment is available at https://gsteinltu.github.io/SensorTimeline/. If you are hosting the app locally, it will typically be available at http://localhost:5173.
The desktop interface provides two input source options:
- Select "micro:bit" as your input source (selected by default)
- Click "Connect to micro:bit" to establish a Bluetooth LE connection
- Your micro:bit should be running code that advertises accelerometer data via Bluetooth
- Once connected, real-time accelerometer data will be displayed with live charts
- Select "Mobile Device" as your input source
- You will see a QR code that you can scan from the mobile page
- The mobile page is available at https://gsteinltu.github.io/SensorTimeline/mobile
- If you are running the app locally, use http://localhost:5173/mobile
- Scan the QR code or manually enter the peer ID to establish connection
- Once connected, the app will display real-time sensor data from your mobile device
- Use the webcam recorder to capture video synchronized with sensor data
- Review recordings with timeline-aligned playback
- Delete unwanted recordings from the recordings list
Getting the mobile page accessible from your phone can be challenging when developing locally. Consider using tools like localtunnel to expose your local server:
npx localtunnel --port 5173To use the micro:bit functionality, your micro:bit device needs to be programmed to advertise accelerometer data via Bluetooth LE. The application expects the micro:bit to:
- Enable Bluetooth LE advertising
- Broadcast accelerometer data (X, Y, Z values)
- Use the standard micro:bit Bluetooth accelerometer service
- Provide data in milli-g units (automatically converted to m/s² by the application)
You can use MakeCode or MicroPython to program your micro:bit with the appropriate Bluetooth accelerometer broadcasting code.
This project is licensed under the MIT License - see LICENSE for details.