Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/ice-hazymoon/slidev-addon-slidepods

Last synced: about 2 months ago
JSON representation

Host: GitHub
URL: https://github.com/ice-hazymoon/slidev-addon-slidepods
Owner: Ice-Hazymoon
Created: 2024-10-20T07:27:55.000Z (3 months ago)
Default Branch: main
Last Pushed: 2024-10-20T07:59:18.000Z (3 months ago)
Last Synced: 2024-10-20T12:35:29.493Z (3 months ago)
Language: Vue
Size: 771 KB
Stars: 4
Watchers: 1
Forks: 0
Open Issues: 0
Metadata Files:
- Readme: README.md

Awesome Lists containing this project

README

# 🎧 SlidePods – Control Slidev with Your Earbuds!

Inspired by the amazing [headphone-morse-transmitter](https://github.com/EtherDream/headphone-morse-transmitter) project, SlidePods leverages the `navigator.mediaSession` API to listen for headphone button presses. These inputs are then mapped to control your Slidev presentation 🚀.

In short, you can use your AirPods or other audio control devices to navigate forward or backward through your slides.

## 🎥 Video Demo

https://github.com/user-attachments/assets/40b78501-08ac-4ea9-901d-db1578e59acc

## 🚀 Getting Started

1. Install the plugin 📦

```bash
npm install slidev-addon-slidepods
```

2. Add the plugin to your Slidev configuration 💥

```md
---
addons:
- slidev-addon-slidepods
---
```

🎉 You're all set! Now you can control your slides by tapping on your earbuds!

## 🔧 How It Works

- **Single tap** 🎯 go to the next slide ⏭️.
- **Double tap** 🎯 go to the previous slide ⏮️.

Tip: Due to restrictions in Chrome or other browsers, automatic audio playback doesn't always work. Therefore, you'll need to manually click the play button before starting your presentation.

Some headphones stop listening for click actions when removed from your ears. You'll need to cover the sensor area with your finger for them to continue working.

## 💻 Compatibility

https://developer.mozilla.org/en-US/docs/Web/API/Navigator/mediaSession

| Browser | Supported 🎉 |
|--------------------|--------------|
| Chrome (v73+) | ✅ |
| Firefox (v82+) | ✅ |
| Edge (v79+) | ✅ |
| Safari (v15+) | ✅ |

---

Enjoy your next presentation! 🎉👂🖱️