Fela Maslen 69c2536819 feat: basic mobile UI 5 年之前
..
public 6ae2b251e3 Refactor/project structure (#3) 5 年之前
src 69c2536819 feat: basic mobile UI 5 年之前
.dockerignore 3810564d53 feat: continuous integration and kubernetes config 5 年之前
.env.example a958d33941 feat: skip to next / previous song 5 年之前
.env.test 6ae2b251e3 Refactor/project structure (#3) 5 年之前
.eslintrc.js 1b15dfcbfe feat: play queue 5 年之前
.gitignore 6ae2b251e3 Refactor/project structure (#3) 5 年之前
.prettierrc.js 6ae2b251e3 Refactor/project structure (#3) 5 年之前
Dockerfile 3810564d53 feat: continuous integration and kubernetes config 5 年之前
Makefile 28a2fb8cd1 feat: grouped songs and queue position indicator 5 年之前
README.md 6ae2b251e3 Refactor/project structure (#3) 5 年之前
builder.Dockerfile 34e4e59b50 fix: add Makefile to image 5 年之前
nginx.conf 3810564d53 feat: continuous integration and kubernetes config 5 年之前
package.json 69c2536819 feat: basic mobile UI 5 年之前
tsconfig.json 6ae2b251e3 Refactor/project structure (#3) 5 年之前
yarn.lock 69c2536819 feat: basic mobile UI 5 年之前

README.md

gmus-web

This is a frontend web app for use with the gmus backend.

Scripts

yarn start

Runs the app in the development mode.

yarn test

Runs tests

yarn build

Builds app

Architecture

Global app

This is the main part of the app. It is responsible for handling:

  • Global state such as which song is playing, and the current time
  • Connections to the API, through a websocket
  • Sharing state with other clients, and responding to updates from the API
  • Playing music, through an HTML element
  • UI

    This is the part of the app which implements user interaction. It is responsible for handling:

    • User input, to decide which actions to take
    • Display, to let the user know the state of things

    UIs follow a common model and are built into separate bundles, then lazily loaded.

    The following UIs are implemented:

    cmus

    This is based heavily on the cmus ncurses-based music player, and is essentially a web-based client with vim-like bindings for navigation.