2019-04-16 14:40:16 +08:00
# CYP: Control Your Player
CYP is a web-based frontend for [MPD ](https://www.musicpd.org/ ), the Music Player Daemon. You can use it to control the playback without having to install native application(s). It works in modern web browsers, both desktop and mobile.
2019-04-16 19:00:59 +08:00
## Screenshots
2019-04-23 18:31:01 +08:00
![](misc/screen1.png) ![](misc/screen2.png)
2019-04-16 15:03:42 +08:00
2019-04-16 19:00:59 +08:00
2019-04-16 14:40:16 +08:00
## Features
- Control the playback, queue, volume
- Save and load playlists
- Browse the library by artists/albums/directories
- Display album art via native MPD calls (no need to access the library; requires MPD >= 0.21)
2019-04-16 19:01:27 +08:00
- [Youtube-dl ](https://ytdl-org.github.io/youtube-dl/index.html ) integration
- Dark/Light themes
2019-04-16 14:40:16 +08:00
2019-04-16 15:03:42 +08:00
2019-04-16 14:40:16 +08:00
## Installation
2019-05-13 22:29:05 +08:00
Make sure you have a working MPD setup first and Node version >= 10
2019-04-16 14:40:16 +08:00
```sh
git clone https://github.com/ondras/cyp.git & & cd cyp
npm i
node .
```
2019-10-01 21:36:39 +08:00
Point your browser to http://localhost:8080 to open the interface. Specify a custom MPD address via a `server` querystring argument (`?server=localhost:6655`).
2019-04-16 14:40:16 +08:00
2019-04-16 15:03:42 +08:00
2019-04-16 14:40:16 +08:00
## Technology
- Connected to MPD via WebSockets (using the [ws2mpd ](https://github.com/ondras/ws2mpd/ ) bridge)
2019-04-16 15:03:42 +08:00
- Token-based access to the WebSocket endpoint (better than an `Origin` check)
2019-04-16 14:40:16 +08:00
- Modern ES6+ (modules, async/await)
- Responsive layout via Flexbox
2019-04-16 15:03:42 +08:00
- CSS Custom Properties
2019-04-16 14:40:16 +08:00
- SVG icons (Material Design)
2019-04-16 15:03:42 +08:00
- Can spawn Youtube-dl to download audio files
- Album art retrieved directly from MPD (and cached via localStorage)
2019-04-16 14:40:16 +08:00
## TODO
- [ ] Bundling
- [ ] Range styling
2019-04-16 15:03:42 +08:00
- [ ] Browser testing