moonfire-nvr icon indicating copy to clipboard operation
moonfire-nvr copied to clipboard

New user interface

Open clydebarrow opened this issue 2 years ago • 5 comments

I have a first-pass version of a new web UI. Current functionality is close to the built-in UI, but it's a completely new project. You can find it here: https://github.com/clydebarrow/moonglasss.git

Most of the menu on the left does nothing yet. The Recordings page brings up a camera list, clicking on a stream will fetch and list available recordings. The camera icon on the right opens live view for the stream, the download buttons for each recording will save an MP4 file. The date/time selection works pretty much like the original.

moonglass

clydebarrow avatar Sep 03 '21 12:09 clydebarrow

Thanks for sharing! I've never used Kotlin before and will be interested to look through it when I get more time.

It works on my backup NVR where I have disabled auth. The fit in the browser window is awkward though:

image

scottlamb avatar Sep 03 '21 16:09 scottlamb

Which browser is that? The player layout will change, and needs optimisation.

clydebarrow avatar Sep 03 '21 19:09 clydebarrow

Chrome 93 on macOS on a 4k external display

scottlamb avatar Sep 03 '21 23:09 scottlamb

The layout has been revised, and now works well in all shapes and sizes.

clydebarrow avatar Sep 05 '21 08:09 clydebarrow

User authentication now working. I have tested the production build by running nginx on the nvr host.

Still some UI styling to finesse but will work on the live view now.

clydebarrow avatar Sep 07 '21 12:09 clydebarrow