Commit Graph

117 Commits

Author SHA1 Message Date
Josh Hawkins
2d22800a3d
Set aspect ratios on live display (#9780)
* set aspect ratios on live display

* try 8/9
2024-02-10 16:28:23 +00:00
Nicolas Mowen
64988c9be0
Streamline live view (#9772)
* Break out live page

* Improving layouts and add chip component

* Improve default camera player sizing

* Improve live updating

* Cleanup and fit figma

* Use fixed height

* Masonry layout

* Fix stuff

* Don't force heights

* Adjust scaling

* Cleanup

* remove sidebar (#9731)

* remove sidebar

* keep sidebar on mobile for now and add icons

* Fix revalidation

* Cleanup

* Cleanup width

* Add chips for activity on cameras

* Remove dashboard from header

* Use Inter font (#9735)

* Show still image when no activity is occurring

* remove unused search params

* add playing check for webrtc

* Don't use grid at all for single column

* Fix height on mobile

* a few style updates to better match figma (#9745)

* Remove active objects when they become stationary

* Move to sidebar only and make settings separate component

* Fix layout

* Animate visibility of chips

* Sidebar is full screen

* Fix tall aspect ratio cameras

* Fix complicated aspect logic

* remove

* Adjust thumbnail aspect and add text

* margin on single column layout

* Smaller event thumb text

* Simplify basic image view

* Only show the red dot when camera is recording

* Improve typing for camera toggles

* animate chips with react-transition-group (#9763)

* don't flash when going to still image

* revalidate

* tooltips and active tracking outline (#9766)

* tooltips

* fix tooltip provider and add active tracking outline

* remove unused icon

* remove figma comment

* Get live mode working for jsmpeg

* add small gradient below timeago on event thumbnails (#9767)

* Create live mode hook and make sure jsmpeg can be used

* Enforce env var

* Use print

* Remove unstable

* Add tooltips to thumbnails

* Put back vite

* Format

* Update web/src/components/player/JSMpegPlayer.tsx

---------

Co-authored-by: Josh Hawkins <32435876+hawkeye217@users.noreply.github.com>
Co-authored-by: Blake Blackshear <blake@frigate.video>
2024-02-10 05:30:53 -07:00
Nicolas Mowen
f4310862aa
WebUI Improvements and fixes (#9613)
* Show toast instead of text for success and errors

* Show correct times

* Start playing next hour when current hour ends

* Fix refreshing camera image

* Fix timeline
2024-02-05 17:54:08 -06:00
Nicolas Mowen
c5819478d3
Web & ffmpeg bug fixes (#9525)
* Fix scaling for long timeline lists

* Better handle taller video in player

* Fix birdseye options

* Fix ffmpeg auto detect
2024-02-01 06:44:10 -06:00
Nicolas Mowen
af3f6dadcb Improve graph using pandas (#9234)
* Ensure viewport is always full screen

* Protect against hour with no cards and ensure data is consistent

* Reduce grouped up image refreshes

* Include current hour and fix scrubbing bugginess

* Scroll initially selected timeline in to view

* Expand timelne class type

* Use poster image for preview on video player instead of using separate image view

* Fix available streaming modes

* Incrase timing for grouping timline items

* Fix audio activity listener

* Fix player not switching views correctly

* Use player time to convert to timeline time

* Update sub labels for previous timeline items

* Show mini timeline bar for non selected items

* Rewrite desktop timeline to use separate dynamic video player component

* Extend improvements to mobile as well

* Improve time formatting

* Fix scroll

* Fix no preview case

* Mobile fixes

* Audio toggle fixes

* More fixes for mobile

* Improve scaling of graph motion activity

* Add keyboard shortcut hook and support shortcuts for playback page

* Fix sizing of dialog

* Improve height scaling of dialog

* simplify and fix layout system for timeline

* Fix timeilne items not working

* Implement basic Frigate+ submitting from timeline
2024-01-31 12:56:11 +00:00
Nicolas Mowen
9c4b69191b Add graph showing motion and object activity to history timeline desktop view (#9184)
* Add timeline graph component

* Add more custom colors and improve graph

* Add api and data

* Fix data sorting

* Add graph to timeline

* Only show timeline for selected hour

* Make data full range
2024-01-31 12:56:11 +00:00
Nicolas Mowen
6dd9d54f70 UI Fixes (#9177)
* Fix mobile crash

* Reduce tap timeout

* Fix selection

* Try to fix safari empty frame

* Fix config editor
2024-01-31 12:56:11 +00:00
Nicolas Mowen
160e331035 Improve desktop timeline view (#9150)
* Break apart mobile and desktop timeline views

* Set aspect ratio for player correctly

* more modest default width

* Add timeline item card

* Get video player to fit

* get layout going

* More work on youtube view

* Get video scaling working

* Better dialog sizes

* Show all timelines for day

* Add full day of timelines

* Improve hooks

* Fix previews

* Separate mobile and desktop views and don't rerender

* cleanup

* Optimizations and improvements

* make preview dates more efficient

* Remove seekbar and use timeline as seekbar

* Improve background and scrubbing
2024-01-31 12:56:11 +00:00
Nicolas Mowen
a946a8f099 Refactor history viewer to show player / timeline for full hour and use preview while scrubbing timeline (#9051)
* Move history card view to separate view and create timeline view

* Get custom time scrubber working

* Add back nav

* Show timeline bounding boxes

* Implement seeking limiter

* Use browser history to allow back button to close timeline viewer

* Fix mobile timeline and add more icons for detections

* Play when item is initially visible
2024-01-31 12:56:11 +00:00
Nicolas Mowen
9a0dfa723a Add logs to new webui (#9118)
* Add logs to new webui

* Automatically refresh logs while viewing

* Clean up hooks
2024-01-31 12:56:11 +00:00
Nicolas Mowen
928dbd8335 Update dashboard cameras dynamically (#9100)
* Automatically update camera image when detecting objects and show activity indicators

* Update ws typing

* Cleanup type
2024-01-31 12:56:11 +00:00
Nicolas Mowen
a1e5c658d5 Add support for filtering history page and add support for creating timeline entries for audio / custom events (#9034)
* Add filter popover

* Add api filter hook and use UI with filtering

* Get history filtering working for cameras and labels

* Allow filtering on detail level

* Save timeline entries for api events

* reset

* fix width
2024-01-31 12:56:11 +00:00
Nicolas Mowen
feb3ee0703 Allow deletion of history items (#9030)
* Allow deletion of history items

* Remove type
2024-01-31 12:56:11 +00:00
Josh Hawkins
7bec162353 Scrubber UI component (#9036)
* add scrubber and ui playground when running dev

* fix mobile dropdown menu width

* timeline scrubber and revamp for all event handlers
2024-01-31 12:56:11 +00:00
Nicolas Mowen
2236ae5d3b Add jsmpeg support to new webUI and make birdseye default for live page (#8995)
* Add jsmpeg and make birdseye default for live view

* Fix jsmpeg

* Fix
2024-01-31 12:56:11 +00:00
Nicolas Mowen
f8d114cd33 Webui cleanups (#8991)
* Fix mobile event timeago

* Reduce preview playback rate for safari browser

* Fix dashboard buttons

* Update recent events correctly

* Fix opening page on icon toggle

* Fix video player remote playback check

* fix history image

* Add sticky headers to history page

* Fix iOS empty frame

* reduce duplicate items and improve time format

* Organize data more effictively and ensure data is not overwritten

* Use icon to indicate preview
2024-01-31 12:56:11 +00:00
Blake Blackshear
bdebb99b5a Use new UI (#8983)
* fixup build

* swap frontends
2024-01-31 12:56:11 +00:00