Giter Site home page Giter Site logo

deseteral / lebkuchen-fm Goto Github PK

View Code? Open in Web Editor NEW
18.0 6.0 6.0 12.03 MB

馃幐 馃挰 YouTube TV like service with super powers controlled via Slack

License: MIT License

HTML 0.29% CSS 5.13% TypeScript 92.02% Shell 0.69% JavaScript 0.62% Dockerfile 1.26%
music youtube radio dashboard tv slack hacktoberfest nodejs javascript typescript

lebkuchen-fm's Introduction

LebkuchenFM

Actions Status

Monorepo for Lebkuchen FM project - opinionated YouTube TV-like service with super powers controlled via Discord.

Development

鈿狅笍 Please don't use npm to install dependencies

Start by installing dependencies:

yarn install

To build application run:

yarn run build

You can run tests using:

yarn test

To clean up after previous builds before installing dependencies use:

yarn run clean:deps

To run the application you have to connect to MongoDB database.

If you have Docker installed you can use ./scripts/docker_db_local.sh script to run MongoDB in Docker locally. For more information you can refer to Local MongoDB in Docker documentation section.

Then create .env file in the root of this project and put desired configuration variables in it (refer to Service > Configuration section of this document for available options).

When that's done you can just start the application:

yarn start

If you want to create local frontend dev server with hot reloading you should use "dev" script from packages/client:

yarn workspace lebkuchen-fm-client dev

This project is separated into backend service (lebkuchen-fm-service located in packages/service) and web client application (lebkuchen-fm-client located in packages/client). For development information specific to modules refer to their Development sections in this document. For more information about managing modules check out yarn workspace docs.

Type checking

Modules using TypeScript will compile even when there are type checking errors in the code. This allows for fast development iteration. Type checking is done during test script. For development it's recommended that you use type checker in watch mode:

yarn run test:type-check:watch

Modules

This projects consists of these modules:

Backend service (/packages/service)

Core LebkuchenFM Node.js service with MongoDB storage that communicates with clients over WebSockets and REST endpoints.

Configuration

Configure your instance via environment variables.

Service
  • MONGODB_URI - MongoDB connection string
  • PORT - port on which the service will be running (automatically injected by cloud providers)
  • LOCALE - language of the service
  • COMMAND_PROMPT - command prompt (optional, defaults to /fm)
Youtube player
  • YOUTUBE_API_KEY - YouTube Data API token
Discord
  • DISCORD_CHANNEL_ID - ID of the Discord channel where the bot is allowed to run
  • DISCORD_CLIENT_ID - Discord application ID
  • DISCORD_GUILD_ID - ID of the Discord guild (server) where the bot will operate
  • DISCORD_TOKEN - token of the Discord bot
Dropbox - used for persisting files
  • DROPBOX_CLIENT_ID - Dropbox App Key
  • DROPBOX_SECRET - Dropbox App Secret
  • DROPBOX_REFRESH_TOKEN - Dropbox refresh token used for persisting files

Authorization

LebkuchenFM uses session cookie and/or basic auth with token methods to authorize it's users. Each request to /api/* endpoint has to be authorized.

Session cookie is set during successful POST request to /api/auth endpoint and is generally handled by the web client.

There is no way to register as a new user. Instead LebkuchenFM functions as an invite only system.
When there are no registered users, first login is always correct and creates that account. Every next user has to be created using admin dashboard (/admin). That way a new account will be created and user is going be able to set the password when they login for the first time.

External integrations

For external integrations users should use API tokens.

Each user can obtain this token after logging in the web client and requesting GET /api/auth as mentioned in REST endpoints section of this documentation.

Using this token external tools can integrate with LebkuchenFM by making requests with Authorization: Basic <api-token> header set. Socket clients using socket.io can authorize by providing API token during connection like this:

const socket = io({
  auth: {
    token: "api-token"
  }
});

Event stream

This service communicates with clients mostly using event stream implemented on WebSockets. For possible events check out event data models.

REST endpoints

GET /api/auth
Information about currently logged in user.

Response

{
  "username": "anton",
  "apiToken": "this_users_api_token"
}

POST /api/auth/logout
Logs out currently logged in user.


GET /api/history
History listing containing list of queued songs.

Response

{
  "entries": [
    {
      "date": "2022-05-31T12:46:17.968Z",
      "youtubeId": "c6pPAso-y8s"
    }
  ]
}

GET /api/songs
Returns list of all songs in the database sorted by play count (descending).

Response

{
  "songs": [
    {
      "_id": "storage_id",
      "name": "Rick Astley - Never Gonna Give You Up (Official Music Video)",
      "url": "https://www.youtube.com/watch?v=dQw4w9WgXcQ",
      "timesPlayed": 1337
    }
  ]
}

POST /api/commands/text
Plain text interface for slash commands.

Body

{
  "text": "/fm help"
}

Response

{
  "textResponse": "Command response in plain text format"
}

GET /api/users
List of all registered users.

Response

{
  "users": [
    {
      "name": "anton",
      "creationDate": "2022-05-31T19:59:05.879Z",
      "lastLoggedIn": "2022-05-31T20:01:17.072Z"
    }
  ]
}

GET /api/x-sounds
Returns list of all XSounds in the database.

Response

{
  "sounds": [
    {
      "_id": "storage_id",
      "name": "example sound",
      "url": "https://example.com/example_sound.wav",
      "tags": ["tag1", "tag2"],
      "timesPlayed": 6
    }
  ]
}

GET /api/x-sounds?tag=example-tag
Returns a filtered list of XSounds containing given tag in the database.

Response

{
  "sounds": [
    {
      "_id": "storage_id",
      "name": "example sound",
      "url": "https://example.com/example_sound.wav",
      "tags": ["example-tag"],
      "timesPlayed": 6
    }
  ]
}

POST /api/x-sounds
Adds new sound file to XSounds database.

Request
Requires content type to be multipart/form-data with fields:

  • soundName: name of the sound to be added (like "cool sound")
  • tags (optional): comma separated list of tags (like "tag1, tag2, tag3")
  • soundFile: sound File ideally in mp3 or wav format

Response

{
  "_id": "storage_id",
  "name": "my new sound",
  "url": "https://example.com/example_sound.wav",
  "timesPlayed": 0
}

GET /api/x-sounds/tags
Returns list of all unique XSounds tags in database.

Response

{
  "tags": [
    "example tag",
    "another tag"
  ]
}

Client (/packages/client)

Web client for the application. Communicates with the service via WebSocket event stream.

Development

Running yarn run dev runs the application in development mode with hot reload on file change. This version of application won't connect to the service.
Running yarn run build builds the application in production mode.

Devops scripts (/scripts)

Scripts related to maintenance of the service.

FM Dev Helper

Helper script scripts/fm.sh is available for local development purposes. By default it sends a command to a local development server.

Example commands:

> fm.sh "/fm resume"
> fm.sh "/fm q dQw4w9WgXcQ"
> fm.sh "/fm x alert"

Alternatively you can run it as an yarn command from the root of the project:

> yarn run fm "/fm resume"
> yarn run fm "/fm q dQw4w9WgXcQ"
> yarn run fm "/fm x alert"

Local MongoDB in Docker

Helper script scripts/docker_db_local.sh runs MongoDB and binds ports for local development.
To stop container run scripts/docker_db_local.sh stop.

Docker Compose

You can also run this app via Docker Compose. It has MongoDB already configured. Just pass other necessary config variables.

docker compose up --build

License

This project is licensed under the MIT license.

lebkuchen-fm's People

Contributors

deseteral avatar dzikowskiw avatar gorzalczany avatar jasphall avatar jwest avatar kstodolak avatar mictyd avatar mswiechowicz avatar okazet avatar vanderosky avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar

lebkuchen-fm's Issues

Volume control commands

Introduce /fm volume <value> command that will give users ability to set the YouTube player volume using chat command.

Check volume level

Allow users to execute volume command without arguments (/fm vol or /fm volume). This send chat message with information about current volume level.

This could be done in two ways:

  • caching every volume change in backend service (this will be incorrect when dashboard gets refreshed and the value in cache is different than 100)
  • asking dashboard about current volume every time this command is received

Quick search input on dashboard

AC:

  • when user presses ctrl+f (or cmd+f on Mac) a search form pops up
  • when user enters query into the search form and presses enter the player queues first search result from YouTube for given query

Top sounds in chat

Add new command (/fm top maybe?) that will print out top x (three? five?) most popular sounds and/or songs.

add `[鉁揮 ignore volume events` player setting

What:

  • in the player, add a setting that allows you to ignore volume events

Why:

  • when web socket reconnects (eg. after connection lost) player state is obtained from other client
    • you may want to preserve your local volume

LebkuchenFM 2.0

LebkuchenFM 2.0

MVP TODO:

Features:

  • Generic text command
  • Slack support
  • YouTube Data API support
  • WebSocket connection

Commands:

  • /fm help
  • /fm addx <name|url>
  • /fm listx
  • /fm add <name|url>
  • /fm list
  • /fm pause and /fm resume
  • /fm queue <id || title>
  • /fm random <count>
  • /fm say <phrase>
  • /fm search <phrase>
  • /fm skip
  • /fm volume <amount>
  • /fm x <name>

Tagging system for XSounds

  • Allow users to add and remove tags from XSounds using commands
  • Add command to list sounds with specific tag assigned to them

Speech synthesis on backend

Speech synthesis inside browser is quirky and buggy. Generating sound server-side and sending it to the client to be played just like x-sounds would solve all browser related problems and simplify client quite a bit.

Help command

Implement /fm help command.

AC:

  • Help command should respond with list of all available commands and their descriptions.

Relative volume control

Allows users to send commands with relative volume.
Ex.
/fm vol +10 will increate volume by 10%
/fm vol -23 will decrease volume by 23%

This change doesn't break absolute volume control so /fm vol 65 will set volume to exactly 65%.

Slack integration

AC:

  • lebkuchen-fm works with Slack.

Add Slack integration. Possibly similar to current HipChat integration. Implementer should consult Slack documentation.

Soundboard: search sorting should prioritize sound names over tags

  • When you search for query "foo" and there is a sound called "foo" it should be first in search results.
  • When you search for query "foo" and there is a sound called "foo" and some other sounds with "foo" in their tag name, it should prioritize sound name first so that sound "foo" first in search results.

Random command

/fm random [amount]

AC:

  • There is a random command that queues random songs from database.
  • By default it queues one song unless user specifies amount of songs to add using optional [amount] parameter.

Refresh x-sounds list on fm-player view

FM player should have option to refresh x-sounds list.
I can see 2 different approaches at the moment:

  1. Add websocket signal when uploading new sound and handle it on frontend
  2. Create special keyboard shortcut to refetch updated sounds list

Missing fonts

There are missing fonts. Also there are some fonts that are being imported but are not used.

Display queue in Slack

Add new command that will display currently playing video and queue in Slack channel.

Top songs in the FM player

AC:

  • In TV dashboard there is a list/table view with songs sorted by play count
  • The list updates after add song to queue event

Playlist support

Add support for queuing whole YouTube playlists (probably as an extenstion for /fm queue <playlist_id> command)

This might be backend only task if we can "unroll" playlists into separate YouTube video IDs

Pause command

Add /fm pause command that will pause currently playing YouTube movie.

[Feature] shuffle command

What:

  • fm shuffle command that shuffles current queue

Why:

  • so that we can add various interesting artists through e.g. fm random 3 abcd command and then shuffle playlist so it is not to boring

[Proposal] refaktor komend

Stan obecny

Jest kilka powod贸w dla kt贸rych przyda艂by si臋 refaktor tego jak wygl膮daj膮 komendy:

  • jest ich coraz wi臋cej
  • s膮 coraz bardziej skomplikowane
  • help staje si臋 nieczytelny
    • jego d艂ugo艣膰聽zaczyna przekracza膰 limity API Slackowego

Dla przyk艂adu w PRze #119 dodajemy komend臋 tag.
Ma ona zaproponowan膮 ju偶 do艣膰聽fajn膮聽semantyk臋 tag-*, dzi臋ki kt贸rej wszystkie komendy obs艂uguj膮ce t臋 funkcjonalno艣膰聽s膮 niejako zgrupowane. Jej przeciwie艅stwem jest obs艂uga x-sound, do kt贸rej wykorzystujemy komendy x, listx oraz addx. S膮 one rozrzucone po dorzuceniu semantyki tag-* nie b臋dzie mi臋dzy nimi 偶adnej analogii.
Opr贸cz tego addx za chwil臋 wyleci na rzecz formularza webowego do uploadu plik贸w.

Propozycja:

  • odno艣nie x
    • rename x na sound z aliasem x
    • rename listx na sound-list z aliasem x-list
  • odno艣nie s
    • rename s na song-search z aliasem s
    • rename q na song-queue z aliasem q
  • odno艣nie help
    • zgrupowanie help贸w / grupowanie komend na backendzie (spory refaktor?)
    • /fm help wy艣wietla艂by tylko uproszczone info:
`/fm help` - wy艣wietla t膮 wiadomo艣膰

Opr贸cz tego dost臋pne s膮 nast臋puj膮ce komendy:
- sound [x]
- song [s]
- skip
- tag [t] - zarz膮dzanie systemem tagowania d藕wi臋k贸w

Szczeg贸艂owe wykorzystanie komend:
  `/fm help [command]`
  `/fm [command]-help`
  • komendy mia艂yby swoje szczeg贸艂owe helpy
  • odpalenie komendy z sam膮 nazw膮 grupuj膮c膮 mog艂oby wy艣wietla艂oby helpa
  • na przk艂adzie komendy [tag]
    • /fm tag - wy艣wietla szczeg贸艂owego helpa komendy tag
    • /fm tag-help - wy艣wietla szczeg贸艂owego helpa komendy tag
    • /fm tag-list - wy艣wietla list臋 tag贸w
    • /fm tag-add xyz|abc
    • itd

Inspiracja:

Wzorowa艂bym si臋 np tym jak wy艣wietlane jest brew help lub inne polecenia znane z terminala.
Mo偶e kto艣 ma lepszy przyk艂ad.

Database migration

mLab is becoming a part of MongoDB and suppresses its activity. We have to migrate to other MongoDB provider like MongoDB Atlas.

Interface improvements

Improve interface to make it more sparkly, effect heavy, reactive to user actions like in rhytmic games (e.g osu!).

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    馃枛 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 馃搳馃搱馃帀

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google 鉂わ笍 Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.