Commit Graph

183 Commits

Author SHA1 Message Date
Nicolas Mowen
c14f3c3902
Fix frigate+ submit and recordings layouts for portrait cameras (#10486)
* Fix plus submission dialog

* Different layout for portrait recordings

* Fix now preview found pulsing

* Fix bug with uneven milliseconds

* Improve consistency of video scaling
2024-03-15 18:28:57 -05:00
Nicolas Mowen
64763293a2
Add birdseye live view (#10485)
* Add birdseye viewer and make it linkable

* Add on click from main dashboard
2024-03-15 18:28:32 -05:00
Nicolas Mowen
380b15b286
WebUI Fixes (#10481)
* Update previews on the hour

* Allow tap to toggle controls so zooming still works

* Use hash location insteaad of state for live camera view

* Add typing
2024-03-15 13:46:17 -05:00
Nicolas Mowen
df0291db5c
Fix zoom scaling for live view (#10479) 2024-03-15 09:57:58 -05:00
Nicolas Mowen
f5a26c5962
Add ability to zoom in to live and recordings views (#10475)
* Make live view zoomable

* Add zooming to full recordings
2024-03-15 07:03:14 -06:00
Nicolas Mowen
c66f552280
Improve Recordings loading (#10462)
* Show skeleton until video players finishes loading

* Clean up android logic

* Ensure mobile view video is consistent

* Cleanup

* Only show when not scrubbing

* Don't use loading

* Start preview at correct time too

* Fix react race condition

* Be wait for seek to show video player
2024-03-15 07:52:38 -05:00
Nicolas Mowen
8d85a69203
Update UI and then run api call (#10460) 2024-03-14 15:49:03 -05:00
Josh Hawkins
39a29d148e
Recording scrubbing fixes (#10439)
* use a single source of truth for scrubbing

* simplify controller state

* Cleanup scrubbing logic

* Apply same logic to mobile

---------

Co-authored-by: Nicolas Mowen <nickmowen213@gmail.com>
2024-03-14 08:28:06 -06:00
Nicolas Mowen
f9ed082e35
Use react lazy to break js files into smaller chunks & remove videojs in favor of hls.js (#10431)
* Use dynamic imports to reduce initial load times

Remove videojs

* Convert to using hls.js instead of videojs

* Improve mobile controls experience

* Cleanup

* Ensure playback rate stays teh same when source changes

* Use webp for latest camera image

* Switch to hls.js on error

* Don't rerun error if hls already tried

* Fix error checking

* also check for media decode error to fallback to HLS

---------

Co-authored-by: Josh Hawkins <32435876+hawkeye217@users.noreply.github.com>
2024-03-13 15:24:24 -05:00
Nicolas Mowen
0e8350ea7f
Fix jumping to segment in recordings view (#10424)
* Fix skeletons showing incorrectly

* Handle clicking segment from different time range
2024-03-13 09:05:01 -05:00
Nicolas Mowen
52ce6190ae
Fix two way talk starting webrtc session (#10422)
* Fix two way talk starting webrtc session

* Remove logs
2024-03-13 09:04:11 -05:00
Nicolas Mowen
9d01a7dc74
Fix gif layout (#10421) 2024-03-13 08:58:46 -05:00
Nicolas Mowen
09cf54c731
Improve preview loading (#10406)
* Use skeleton for gif loading

* cache gifs as well

* Show skeleton when switching previews

* Fix touch controls for mobile

* Fix android mobile scrub logic

* Cleanup
2024-03-12 18:19:16 -05:00
Nicolas Mowen
92255f771b
Add micropohone button for two way talk (#10408) 2024-03-12 18:19:02 -05:00
Josh Hawkins
9e10b914c9
Add ability to add legacy birdseye to camera groups (#10404)
* initial try

* add birdseye

* remove vite

* cleanup

* memoize

* remove console

* ensure birdseye is actually enabled in config

* birdseye first in select list and fix jsmpeg player size
2024-03-12 13:53:01 -06:00
Josh Hawkins
dce2e9b366
filter review items and motion to be main camera in recordings view only (#10403) 2024-03-12 11:08:31 -06:00
Nicolas Mowen
8c0275fe2f
Add special casing for android preview scrubbing (#10398)
* Add special casing for android scrubbing

* Fix motion data
2024-03-12 09:24:18 -06:00
Nicolas Mowen
579a7c8900
Fix preview update (#10388) 2024-03-11 21:42:13 -05:00
Nicolas Mowen
1c5d6765a1
Preview improvements (#10384)
* Write preview frames as webp instead of jpg and ensure webp are cached in nginx

* Support preview player that shows current hour images

* Update to get preview player working

* Use timestamp based recordings check instead of calendar

* Start motion review from current time

* Adjust layout

* Use preview players for previews

* remove vite

* Cleanup

* Fix up the layout
2024-03-11 18:31:05 -05:00
Josh Hawkins
fa22f01f39
use flexbox for recordings view (#10385) 2024-03-11 17:07:56 -05:00
Nicolas Mowen
8d4b9bc7ed
Indicate on calendar which days have unreviewed activity (#10381) 2024-03-11 10:14:41 -05:00
Nicolas Mowen
838ef636f8
Layout tweaks (#10365)
* Cleanup review items

* Fix spacing

* Fix -1 text

* Cleanup scroll

* Show activity indicator when review items are null

* Show no preview text when not found

* Add padding to buttons

* Simplify comparisons
2024-03-11 08:05:44 -05:00
Nicolas Mowen
b910db4f05
Fix handling of recordings and switching cameras (#10351)
* Fix handling of recordings and switching cameras

* mobile switch

* Cleanup

* Cleanup autoplay

* Remove vite
2024-03-10 08:17:09 -05:00
Nicolas Mowen
62d13024f6
Adjustments and fixes (#10346)
* Increase duration of alerts and detections

* Add key

* Fix cancel button

* Fix motion review when switching days

* Add reset buttons and make calendar apply immediately

* Adjust apis for motion and audio activity

* Write review thumbs as webp and reduce size
2024-03-09 07:08:06 -07:00
Nicolas Mowen
086eb37ece
Cleanup to use new preview video player in dynamic player (#10335)
* Cleanup to use new preview video player

* Make it so motion persists the selected time

* Don't jump when player first starts

* Get autoplay working right
2024-03-08 17:24:12 -06:00
Nicolas Mowen
3d539c93eb
Fix motion review (#10329)
* Break preview only video player out

* Simplify

* Load after current preview changes

* Clear out waiting for seek state

* Start at correct time of hour

* Fix layout for tall video
2024-03-08 11:56:00 -06:00
Nicolas Mowen
90a40d2509
Fix motion and recording views (#10318)
* Fix switching between different hours

* Simplify book keeping of different time ranges

* Rewrite player to handle changing of previews outside of video player

* Simplify switching between cameras

* Fix previews causing cameras to not load

* Simplify listeners

* Always clear existing listener
2024-03-07 18:31:43 -06:00
Nicolas Mowen
fc6d6a4e9a
Fix layout shifting (#10313)
* Fix layout shifting

* Change value for current data

* Fix motion scrubbing lockout
2024-03-07 10:11:24 -06:00
Nicolas Mowen
8776cdfd5b
Tweaks fixes (#10311)
* Save numbers as int instead of string

* Fix hover logic

* Fix delay for new alerts

* Fixup dialog and marking item as uploaded

* Make preview progress larger and easier to grab

* Allow hovering to control preview on desktop
2024-03-07 08:34:11 -06:00
Nicolas Mowen
b2931bcaa9
Remove paging (#10310)
* Remove paging and use reviewed as an internal filter

* Fix new reviews not going away
2024-03-07 08:33:36 -06:00
Josh Hawkins
90db27e3c8
Scrolling fixes and motion timeline changes (#10295)
* scrolling updates

* only scroll by 1 segment on desktop
2024-03-06 14:35:10 -07:00
Nicolas Mowen
fb81e44283
UI Tweaks (#10289)
* Use different cursor for dragging preview

* Improve filters UI and add audio labels

* Use switch and adjust colors

* Disable chromecast button and remove dimming

* Change marked reviewed text
2024-03-06 14:49:51 -06:00
Nicolas Mowen
68ed18d3f4
Reviewed buttons (#10271)
* mark items as reviewed when they are opened

* Update api to use json and add button to mark all as reviewed

* fix api so last24 hours has its own review summary

* fix sidebar spacing

* formatting

* Bug fixes

* Make motion activity respect filters
2024-03-05 18:39:37 -06:00
Josh Hawkins
ed99be0856
Live camera aspect ratio fixes (#10266)
* dynamically manage aspect ratio

* full size

* always use camera aspect ratio for mobile

* no need for different handling for pano cams

* don't set aspect ratio on fullscreen
2024-03-05 13:19:56 -07:00
Nicolas Mowen
9e8a42ca0e
Motion timeline data (#10245)
* Refactor activity api to send motion and audio data

* Prepare for using motion data timeline

* Get working

* reduce to 0

* fix

* Formatting

* fix typing

* add motion data to timelines and allow motion cameas to be selectable

* Fix tests

* cleanup

* Fix not loading preview when changing hours
2024-03-05 13:55:44 -06:00
Nicolas Mowen
30b68e59f2
Multi cam recording view (#10244)
* Split recording view for mobile and desktop and get desktop working

* Get stuff working well

* Handle onclick for video

* Fix camera grid

* set onclick
2024-03-05 06:03:10 -06:00
Nicolas Mowen
bbdb8d36ca
Improve review data (#10246)
* Adjust remaining summary items when items are marked as reviewed

* Add api for filtering and show correct number when filtering

* Fix default group config

* Update review summary when data is reloaded

* Fix quick items not getting reviewed
2024-03-05 06:02:34 -06:00
Nicolas Mowen
b4b2162ada
Camera groups (#10223)
* Add camera group config

* Add saving of camera group selection

* Implement camera groups in config and live view

* Fix warnings

* Add tooltips to camera group items on desktop

* Add camera groups to the filters for events

* Fix tooltips and group selection

* Cleanup
2024-03-04 16:18:30 -07:00
Josh Hawkins
0f168dfc1a
fix overflowing review timeline on mobile (#10231) 2024-03-04 06:35:10 -07:00
Nicolas Mowen
c2a537ce22
Motion review (#10221)
* Break detection grid into separate function

* Implement backward preview jump and jump lockout

* ensure lockout is engaged when starting

* Add preview only mode to make loading more efficeint

* remove scrollbar and match gaps/margins with live view

* Rewrite dynamic player to use html video for preview and fix grid gaps

* consistent check for aspect ratio for tall cameras

---------

Co-authored-by: Josh Hawkins <32435876+hawkeye217@users.noreply.github.com>
2024-03-03 22:21:30 -06:00
Nicolas Mowen
d3f9fd1a60
Review summary (#10196)
* Create review summary api to get information about reviewed and unreviewed events on each day

* remove unused

* Fix tests

* Format tests

* Fix
2024-03-03 18:19:02 -06:00
Josh Hawkins
c74eb75554
Update camera activity indicator (#10208)
* new indicator

* create indicators directory and update imports

* create indicators directory and update imports

* remove vite
2024-03-03 09:32:47 -07:00
Josh Hawkins
312dc95156
More intelligent timeline scrolling (#10209)
* more intelligent timeline scrolling

* keep as div
2024-03-03 09:32:35 -07:00
Nicolas Mowen
8645545ef4
Add support for live fullscreen mode (#10191)
* Fix timeline colors

* Add support for full screen mode

* Add support for live view full screen

* Cleanup

* Add border to sidebar and statusbar
2024-03-02 21:59:50 -06:00
Nicolas Mowen
837f30cbf0
Update frontend colors to match style guide (#10188)
* Get main background colors going

* Finish sidebar

* Get light mode colors working

* Adjust icons

* Adjust icons

* remove unused

* Fix mobile colors
2024-03-02 09:00:50 -06:00
Nicolas Mowen
5028a9632e
Individual live view (#10178)
* Get live camera view working

* Get ptz working

* Add button for ptz presets

* Add camera feature buttons

* Add button for camera audio

* Cleanup

* Cleanup mobile live

* Only use landscape check on mobile
2024-03-01 18:43:02 -06:00
Nicolas Mowen
a67e970fca
Implement scroll lock for previews (#10180)
* Implement scroll lock

* Fix seekbar not working
2024-03-01 17:34:41 -07:00
Nicolas Mowen
ebf34ce378
Revamp multiselect (#10172)
* Just use multiselect for mobile

* Update revamped design and add export to values

* Get actions looking good on mobile and desktop
2024-03-01 11:56:45 -06:00
Josh Hawkins
a49e1bbc64
Timeline handlebar changes (#10170)
* auto scrolling handlebar with preview time

* tablets can show 2 columns on the event view grid

* font sizes

* hide minimap when previewing
2024-03-01 08:36:13 -07:00
Nicolas Mowen
63d8c3662a
Add multiselect and batch actions to review items (#10161)
* Implement context menu for batch operations and implement apis

* reduce preview calculations on rerenders

* Add button to mark above items as reviewed

* Use context menu for mark as reviewed

* Cleanup
2024-02-29 19:53:29 -07:00
Nicolas Mowen
e7f8bca2c3
Preview player upgrades (#10152)
* Implement manual slider control for previews

* Automatically end preview video on mobile

* Show current time on timeline

* remove z height
2024-03-01 00:58:50 +00:00
Nicolas Mowen
3bf2a496e1
Fix linter and fix lint issues (#10141) 2024-02-28 16:23:56 -06:00
Josh Hawkins
dce4e3fb0b
Make full recordings view usable on mobile (#10134)
* adapt timeline to mobile

* remove unused

* tweaks

* pointer cursor on segments

* make full recordings view look better on mobile

* explicitly set timeline width for md

* button positioning
2024-02-28 08:57:56 -07:00
Nicolas Mowen
a978adc5a9
Fix reload (#10109)
* Fix reloading data

* Don't show new review data when not looking at last 24 hours

* Fix refresh button and no items text

* Cleanup
2024-02-28 08:16:32 -06:00
Josh Hawkins
485057abc1
Adapt review timeline for mobile devices (#10120)
* adapt timeline to mobile

* remove unused

* tweaks

* pointer cursor on segments
2024-02-28 06:18:08 -07:00
Nicolas Mowen
9893741990
Update tailwind css and cleanup classNames (#10107)
* Bump tailwindcss from 3.3.5 to 3.4.1 in /web

Bumps [tailwindcss](https://github.com/tailwindlabs/tailwindcss) from 3.3.5 to 3.4.1.
- [Release notes](https://github.com/tailwindlabs/tailwindcss/releases)
- [Changelog](https://github.com/tailwindlabs/tailwindcss/blob/master/CHANGELOG.md)
- [Commits](https://github.com/tailwindlabs/tailwindcss/compare/v3.3.5...v3.4.1)

---
updated-dependencies:
- dependency-name: tailwindcss
  dependency-type: direct:development
  update-type: version-update:semver-minor
...

Signed-off-by: dependabot[bot] <support@github.com>

* Update tailwind css and cleanup

---------

Signed-off-by: dependabot[bot] <support@github.com>
Co-authored-by: dependabot[bot] <49699333+dependabot[bot]@users.noreply.github.com>
2024-02-28 03:40:57 +00:00
Nicolas Mowen
3fed6a0ab3
Implement swipe gesture instead of autoplay for mobile (#10110)
* Implement swipe gesture instead of autoplay

* Cleanup
2024-02-28 03:39:06 +00:00
Nicolas Mowen
fd24007618
Revamp mobile UI (#10103)
* Simplify nav components

* Allow ability to choose live layout on mobile

* Combine event views

* Undo vite

* Fix autoplay

* Remove import

* Show filters on mobile view

* Spacing

* Don't separate properties
2024-02-27 15:39:05 -06:00
Josh Hawkins
622e9741c0
Review timeline improvements (#10102)
* make event bars clickable

* outline and scroll when segment is clicked

* match outline colors to event type

* hover thumbnails

* make event bars clickable

* outline and scroll when segment is clicked

* match outline colors to event type

* hover thumbnails

* fix merge from rebase

* remove minimap opacity classes

* live player outline colors

* safelist shadow classes
2024-02-27 12:41:26 -07:00
Nicolas Mowen
8663fbba01
Fix autoplay (#10099) 2024-02-27 12:24:15 -06:00
Nicolas Mowen
21defbea9d
Rewrite websocket to use tracked state instead of context (#10091)
* Rewrite websocket to use tracked state instead of context

* Cleanup

* Use component for updating items

* Fix scroll update

* Don't save vite
2024-02-27 09:05:28 -07:00
Nicolas Mowen
f95ce913b1
Publish finished reviews to mqtt / ws and use that for source of update banner (#10072)
* Add reviews to frontend

* Update ready when new review is saved

* fix

* Formatting
2024-02-27 06:37:39 -07:00
Nicolas Mowen
849f343b25
Reduce rerenders on some components (#10068)
* Remove direct callback

* don't rerender for callback

* Move websocket to top level events

* Be smarter about updating timeago

* Cleanup
2024-02-26 16:08:55 -06:00
Nicolas Mowen
20578de9d0
Conditionally show no items (#10065)
* Conditionally show no items

* Clean up view
2024-02-26 14:47:20 -06:00
Nicolas Mowen
3c5ed474af
Add message when there are no items to review (#10064) 2024-02-26 12:00:49 -07:00
Nicolas Mowen
1dd904d89a
Don't show minimap when view is not scrollable (#10062) 2024-02-26 12:31:21 -06:00
Josh Hawkins
8d96111184
Use skeleton for review image loading (#10040)
* don't show chips and date when image is loading

* add skeleton and change observer threshold

* remove debug

* use skeleton for live view too

* old activity indicator looks better on live

* fix gradients and lazy load with skeleton

* fading effects
2024-02-26 09:07:54 -07:00
Nicolas Mowen
4061be602d
Automatically skip to next preview / clip when watching full recordings (#10055)
* Fix useEffect and try to load next clip for preview

* Get scrubbing to next preview working

* Handle skipping to next preview
2024-02-26 10:04:56 -06:00
Nicolas Mowen
9801534f11
Implement Review Filters (#10031)
* Get cameras filter working

* Implement label and review filters

* Fix

* Add time selection

* Cleanup

* Cleanup

* cleanup

* remove commented code

* Fix
2024-02-25 13:04:44 -06:00
Josh Hawkins
64eaf60b24
remove overflow and scrollbar classes from grid (#10000) 2024-02-23 09:39:19 -07:00
Josh Hawkins
de3a6a8738
fix pointer events on review grid (#9998) 2024-02-23 08:30:18 -07:00
Josh Hawkins
7d18c2c03d
UI tweaks (#9996)
* various tweaks

* update debounce time

* scroll to top with new events
2024-02-23 06:52:54 -07:00
Josh Hawkins
a6aa5328aa
UI fixes (#9986)
* scroll minimap to keep it in view

* remove console log

* change ref

* rebase to dev

* rebase to dev

* rebase to dev

* fix history flexbox and live extra scrollbar

* remove extra class
2024-02-22 20:15:50 -07:00
Nicolas Mowen
f84d2db406
Recordings viewer (#9985)
* Reduce redundant code and don't pull new items when marking as reviewed

* Chunk recording times and run playback

* fix overwriting existing data

* Implement scrubbing

* Show refresh button

* Remove old history

* Fix race condition

* Cleanup handling

* Remove console
2024-02-22 18:03:34 -06:00
Nicolas Mowen
746939ed4f
Fix safari preview speed and other cleanup (#9976)
* Cleanups and fix safari preview speed on iOS

* Clarifying comment

* Update paging when loading page with no items

* Use chip for detections and show all the time

* make time ago dense

* Be smarter about paging empty

* Fix elevation
2024-02-22 07:08:55 -07:00
Nicolas Mowen
509e46adc8
Review segment UI (#9945)
* Add ui for events

* Display data for review items

* Use preview thumbnails

* Implement paging

* Show icons for what was detected

* Show progress bar on preview thumbnail

* Hide the overlays on hover and update reviewed status

* Dim previews that have been reviewed

* Show audio icons

* Cleanup preview thumb player

* initial implementation of review timeline

* Use timeout for hover playback

* Break apart mobile and desktop views

* Show icons for sub labels

* autoplay first video on mobile

* Only show the last 24 hours by default

* Rework scrolling to fix nested scrolling

* Final scroll cleanups

---------

Co-authored-by: Josh Hawkins <32435876+hawkeye217@users.noreply.github.com>
2024-02-21 13:07:32 -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