bluecherrydvr / unity

[work-in-progress] Bluecherry DVR client to run across range of devices. 💙

Bluecherry Client

Bluecherry DVR client to run across range of devices.

Website • Purchase • Chat

Features

• 🖲️ Ability to add multiple Bluecherry DVR servers.
• 📺 Play any stream or recording from the web.
• 🎛️ Interactive camera grid viewer, with support for multiple layouts:
  $~~~~$ 💻 For larger screens, compact and multiple layout views are available.
  $~~~~~$📱 For smaller screens, see multiple cameras in 2x3, 2x2, 2x1 or 1x1 view
  $~~~~~$👆 Re-orgderable drag-and-drop camera viewer
  $~~~~~$🛞 Cycle through different layout views automatically
• 🔎 Pinch-to-zoom fullscreen camera viewer.
• 📹 Multicast streams support
• 🏃 Events List Viewer
• 🚡 Events Timeline Viewer
• 📸 Direct camera viewer.
• 🎮 Pan-Tilt-Zoom controls for supported cameras.
• 🌓 Light & dark app theme.
• 📰 System camera event notifications.
• 📺 Adaptive and responsive design for larger screens
• 📱 Cross-platform
  $~~~~$📱 Mobile: Android & iOS
  $~~~~$🖥️ Desktop: Windows, Linux & MacOS
• 📦 Automatic updates

Download

Android	iOS	Windows	GNU/Linux	MacOS
arm64 .apk	App Store	Windows Setup	AppImage	Executable .app
armabi .apk		🚧 SOON winget install bluecherry	Ubuntu/Debian .deb	🚧 SOON App Store
x86_64 .apk		🚧 SOON Microsoft Store	Raw Executable .tar.gz
🚧 SOON Play Store			Fedora/Red Hat Linux .rpm

Or download the latest release here.

Installation

Most platforms will not require any extra steps to install the app.

Linux

You need mpv & libmpv-dev installed:

sudo apt install mpv libmpv-dev

To install the .deb file, run:

sudo dpkg -i bluecherry-linux-x86_64.deb

Usage

Refer to USAGE.md for detailed usage instructions.

License

Copyright © 2022, Bluecherry DVR.

This project & work under this repository is licensed under GNU General Public License v3.0.

Bug-Reports

Send us details about any issues you discover in the issues or in the forums.

Contribute

Translate

You may provide translations for the application to see it running in your own language. Please follow these steps:

Let's say, we're adding French (fr) translation.

1. Fork the repository & navigate here.
2. Create a new file named app_fr.arb.
3. Add your translations to your new app_fr.arb file in correspondence to existing English translations.
4. Send us a new pull-request. 🎉

When adding new strings, run bin/l10n_organizer.dart. This script will ensure that the new strings are added to all l10n files and that they are in the same location. It will also remove any unused strings. The base file is app_en.arb, so all strings must be added there first.

Note that the app is constantly changing and new strings are added all the time. The translations need to be updated constantly.

Technical Details

The code uses Provider for state-management because it is widely known by Flutter community, doesn't bring any unnecessary complexity to the codebase & is scalable/stable enough.

Most ChangeNotifiers are available as singletons, though de-coupled from each other. This is important to handle things like loading app configuration before runApp, handling background notification button actions & few other asynchronous operations performed outside the widget tree. By having singletons, we are able to avoid a strict dependency on the BuildContext & do certain things in a more performant way.

Current source tree has following files:

lib
│
├───api                                                [API wrapper around Bluecherry DVR server.]
│   └──api.dart
│   └──ptz.dart  [API related to Pan-Tilt-Zoom controls]
│
├───l10n [Tranlations]
│
├───models                                             [model classes to serve & bind type-safe data together in various entities.]
│   ├───device.dart
│   ├───event.dart
│   ├───layout.dart
│   └───server.dart
│
├───providers                                          [core business logic of the application.]
│   ├───desktop_view_provider.dart                     [stores, provides & caches desktop camera layout]
│   ├───downloads_provider.dart                        [manages events downloading and progress]
│   ├───events_playback_provider.dart                  [caches data about the events playback view]
│   ├───home_provider.dart                             [stores, provides & caches data about the home page]
│   ├───mobile_view_provider.dart                      [stores, provides & caches mobile camera layout etc.]
│   ├───server_provider.dart                           [stores, provides & caches multiple DVR servers added by the user.]
│   └───settings_provider.dart                         [stores, provides & caches various in-app configurations & settings.]
│   └───update_provider.dart                           [manages app updates and app status.]
│
├───utils                                              [constant values, helper functions & theme-related stuff.]
│   ├───constants.dart
│   ├───extensions.dart
│   ├───methods.dart
│   ├───storage.dart
│   ├───theme.dart
│   ├───video_player.dart
│   └───window.dart
│
├───screens                                            [All the screens of the application.]
│
├───widgets                                            [UI/UX & widgets used to display content.]
│
├───firebase_messaging_background_handler.dart         [handles in-app notifications, snoozing, thumbnails etc. & other Firebase related hooks.]
├───firebase_options.dart                              [auto-generated firebase configuration.]
└───main.dart                                          [entry-point of the application.]

packages
│
├───unity_multi_window                                 [multi-window support for desktop platforms.]                  
│
├───unity_video_player
│   ├───unity_video_player                             [the core video player logic.]
│   ├───unity_video_player_flutter                     [video player used as fallback, used on embedded platforms.]
│   ├───unity_video_player_main                        [main video player logic, used on most platforms.]
│   ├───unity_video_player_platform_interface          [the platform interface for the video player.]
│   └───unity_video_player_web                         [web specific video player logic, used on web.]

Feel free to send any pull-requests to add any features you wish or fix any bugs you notice.

Build

The build process is pretty straight-forward. You need to have Flutter installed on your system.

git clone https://github.com/bluecherrydvr/unity
cd unity
flutter pub get
flutter build [linux|windows|macos|android|ios]

The automated build process is done using GitHub Actions. You may find the workflow here. The workflow builds the app for all supported platforms & uploads the artifacts to the release page.

Linux

On Linux, a Flutter executable with different environment variables is used to build the app for different distributions. This tells the app how the system is configured and how it should install updates. To run for Linux, you need to provide the following environment variables based on your system, where [DISTRO_ENV] can be appimage (AppImage), deb (Debian), rpm (RedHat), tar.gz (Tarball) or pi (Raspberry Pi).

flutter run -d linux --dart-define-from-file=linux/env/[DISTRO_ENV].json

Web

When running on debug, you must disable the CORS policy in your browser. Note that this is only for debugging purposes and should not be used in production. To do this, run the following command:

flutter run -d chrome --web-browser-flag "--disable-web-security"

unity's Issues

UI: Unable to exit 'Add Server'

Android: Back button doesn't work and you are stuck in the screen unless you force quit or proceed to the next step
Apple: Same as above, but obviously no back button.

Unable to connect to server

using IP address and port 7001

Tried admin account and a view-only account.

Same result whether at program startup, or if I skip that and attempt to add server once the program has started.

UI: Rename Event Browser to History

'History' would be better for the UI.

App crashes when a server is deleted

When a server that has an active camera is removed, the app crashes out of the sudden

No Live View

Windows 11 22H2
Bluecherry client 3.0.0 beta6
Bluecherry server 3.1.0-rc7

I freshly installed the client, connected to a server and opened a camera to the live view but am seeing a blank screen. I can view recordings.

The version 2 client can connect to the streams and of course the recordings just fine.

No error messages appear, so I'm not sure what diagnostic info I can provide to help.

iOS is not rotating on screen switch

The app initializes in the correct screen orientation, but it doesn't switch back to portrait when required

Implement Downloads Manager

Add the possibility to download event videos to the system local storage, and implement the Downloads Manager as well

Image quality

Discussed in #75

^{Originally posted by guillebot March 2, 2023}
I don't really know if this is beta5 related, but I just had both clients opened and I realized that the image quality degraded a lot.

I'm sending a couple of captures:

Legacy client:

Unity:

Events are limited to 50

Currently, events are limited to 50 events, which can mislead customers.

Expected behavior

There shouldn't be a limit, but it seems that the current implementation can not parse a high number of events without affecting the UI.

When looking deeper, part of the events seems to be handled inside the build method, blocking the UI when performing the operation with large lists. Before handling the events, the events are parsed in the main thread, which is also something that can affect the UI

Additional resources
https://github.com/bluecherrydvr/unity/blob/main/lib/api/api.dart#L145
https://github.com/bluecherrydvr/unity/blob/main/lib/widgets/events/events_screen.dart#L130-L165

Option to sort device list alphabetically

It would be helpful to have an option for the list to be alphabetically sorted by device name. The makes the task of finding a specific device easier when you have over 100 devices.

Originally posted by @pyeager56 in #52 (comment)

Possibility to reorder layouts

In LayoutManager, it should be possible to reorder the layouts. The layouts, when cycling is enabled, will be displayed in the specified order

Distribute on different Linux platforms and stores

Since you guys seem great about trying to maintain Linux support in the client, I would suggest you look into creating a Linux AppImage package.

It makes supporting multiple Linux distros MUCH easier.

https://appimage.org/

This actually might be a way to package the existing client to work on newer systems that come with Qt5 now but still make them able to run the client because the AppImage can contain its own Qt4 libs inside it. You could create the AppImage on older Ubuntu with Qt4, but people would be able to run it on their newer Ubuntu 20, or Arch Linux systems too.

It would take some of the pressure off having to immediately migrate to Qt5 for instance.

Camera Added to view is blank until unother camera is added

Add option to edit server information

Currently you can not edit the server information (credentials / ip address / ports, etc) from inside the mobile app. You have to delete the server and add it again.

macOS support

Currently, only Android, iOS and Windows are supported. It'd be nice to have macOS support

Option to snooze notifications from notification

Similar to the Ring app, add the ability to "snooze" notifications for 15 minutes, 30 minutes, one hour

[feature] provide ability to configure cover/contain/fill/fit-width/fit-height of camera views

This is somewhat important.
Being able to configure video aspect ratio / fitting options for various camera views in settings will be a good option.

• Cover
• Contain
• Fill
• Fit-Width
• Fit-Height

Not urgent ATM.

Integrated event player

Currently, the event player shows only a snippet of the player.

Proposal

Implement an integrated event player for a specific camera, showing a complete timeline for the given camera

References

https://www.youtube.com/watch?v=pxje3ciJEUk&t=41s&ab_channel=CCTVCameraWorld

Layout cycling options

Currently, it's possible to enable layout cycling on the layout manager by pressing the cycle button. Every 5 seconds, the layout will change.

Proposal

It should be possible to change the order of the layouts. as well as changing the duration between each change (default to 5 seconds). This could be done on the Settings page

Additional

Cycling should be possible in mobile/small devices

Seeking the TimelineView doesn't work properly

Seeking the TimelineView doesn't work properly, specially with big events. Gaps do not fullfill into the views time properly

Automated Windows release builds using CI builds

Similar to the Android CI

Depends on #29

Locked up, reinstall doesn't help.

I attempted to open the app to reproduce an issue.

All I got was a blank white window with the Bluecherry logo in the center. Had to kill it with task manager.

Tried reinstalling. No luck. Uninstalled and reinstalled. No luck. Uninstalled, deleted the folder in Program Files (x86), and reinstalled.

Got the screen shown below. Totally unresponsive. Can't minimize, maximize, close or move the window.

Allow layouts to be opened in new window

Add option to right click on a layout and open that into a new window.

Clicking on "open in a new window" on the main view does nothing:

    Clicking on "open in a new window" on the main view does nothing:

Originally posted by @guillebot in #74 (comment)

Scaling/UI -

Device Info: iPhone 13, iOS 16.2

Love the work the BlueCherry team is doing but finding the new app difficult to work with and not quite right. I preferred the old app even though it has less features.

1. I found scaling and UI issues. Screenshots have been attached. Playback event window seems to small. Cannot accurately see position on timeline. Perhaps reduce the amount of information on the screen / make less cluttered. Images and buttons can be too small to accurately click.
2. Also miss the ability to select a view and zoom in on the live image.
3. Have also been finding the app crashes a bit can’t quite workout what’s triggering it yet.

Happy to complete further testing.

I will test on the latest iPad Air and also let you know how it goes.

Navigation issue

¹ The side navigation style should only be visible in a tablet-like environment. In other words, the screen must be (641px to 1007px large and at least 800px tall). The current implementation is buggy and doesn't work in small screens

² On mobile, landscape orientation should only be applied on grid view and on timeline view. Tho, the other screens are found in the landscape mode:

³ The drawer navigation style should only be visible in small screens style. Instead, sometimes the drawer button is visible even on desktop

configure iOS compilation

• Add configuration for various third-party plugins & packages.
• Adding app icons & splash screen.
• Setup Firebase.
• Configure push notifications from Firebase (only works on real device, not XCode Simulator).
• Add the CI for iOS to pump .ipa files.

iOS (maybe Android): Time line / filtering does not populate

See attached image

UI: Add server shouldn't be in landscape mode

Tested on iOS / Android, if the phone is in landscape mode and you click 'Add Server' it defaults to adding the server however the buttons are missing and you can't scroll down.

Forcing into portrait mode would be better.

iOS button format error (w/ iOS simulator) "bottom overflowed by 132"

Tested with iOS 16 simulator and virtual devices iPhone 12 and iPhone 14 Pro, see attached image.

I can only 'click' on the first three icons on the left, anything buttons below the "bottom overflowed by 132..." are not clickable. In the simulator I can use the arrow keys to move around to the bottom buttons.

CI automatic versioning doesn't change for android (maybe iOS?)

Beta3 was released but the apk shows beta2

Originally posted by @guillebot in #61 (comment)

UI: Change layouts from 4,2,1 to 1,2,4

[bug] App feezed when open

#65

Control the camera remotely (PTZ)

Add the PTZ control functionality

Additional resources

• Documentation
• Example Showcase

Closing on Windows doesn't work for the first time

The close button needs to be pressed for the amount of cameras that are initialized.

The camera list is empty (beta5)

    The camera list is empty, unless I go to settings and back:

It is the same camera list used by the Events Playback

As soon as I go to settings it detects the cameras:

And then they appear everywhere:

Originally posted by @guillebot in #74 (comment)

Unable to add server in 3.0.0-alpha1

Hi

I installed the alpha from the .exe setup, it went ok except some antivirus glitch on Windows 11.

But when I try to add the server, with the same credentials (checked many times), it says
"10.1.1.6 could not be added. Please check the entered details."

I don't see anything related to this on the system log.

Thanks

Version number mismatch

I downloaded the "Windows client 3.1.0-alpha1" from the releases page but the installer shows 3.0.0-beta1

And the app shows 3.0.0-alpha1

Desktop client will not close all the way, has to be killed via task manager

1. If you exit from the program in the history viewer by clicking the X, a unity process is left running in the task manager. I needed to manually remove the nonresponsive unity process before starting the program again.

Originally posted by @MathewWMoore in #47 (comment)

Mobile app doesn't open if deny notification permission

When the mobile app is installed for the first time, the system requests the user to display notifications. They are used to warn the user about events. Although, if the user denies the permission, the app is stuck at the splash screen and doesn't complete the initialization

https://github.com/bluecherrydvr/unity/blob/main/lib/main.dart#L103-L116

Release versions are hard coded

Currently Windows release has a hard coded release for the installer (

unity/installer/installer-test.iss

Line 5 in 15a33a5

#define MyAppVersion "3.0.0-beta1"

) and the settings area uses hard coded values (

unity/lib/utils/constants.dart

Line 24 in 15a33a5

const kAppVersion = '0.0.1';

).

As reported in #40

[Feature Request] Possibility to zoom in the fullscreen viewer

It'd be nice to be able to zoom in the full screen live viewer with the panning gesture. On desktop, the mouse scroll wheel can be used

Additional info

#92

Show thumbnail in pop up notification

Pretty simple, request a thumbnail (code already exists) from the event and display in the notification.

iOS SDK version warning

SDK version issue. This app was built with the iOS 16.0 SDK. Starting April 25, 2023, all iOS and iPadOS apps submitted to the App Store must be built with the iOS 16.1 SDK or later, included in Xcode 14.1 or later. (90725)

Accept command line options for display and layout

Currently we only support a fullscreen command line option. Adding a command line option would be useful for customers with multiple monitors / layouts:

For example: bluecherryclient.exe [ -l "layout name:monitor_number" ]

Export layouts to an XML file, allowing importing to another client

PTZ zoom doesn't work on touch devices

On touch devices, the scale gesture is conflicted with the drag (horizontal and vertical) gestures. The movement gestures work fine, as well as the stop gesture

Currently blocked by:

• flutter/flutter#68960
• flutter/flutter#11384

Use same provider for both mobile and desktop

The problem

Currently, if a screen is larger than 800px, DesktopViewProvider is used. Otherwise, MobileViewProvider is used. This is good for a static device, but doesn't work properly for an app running on a tablet, where the window can be resized to any size.

Proposal

Use the same view provider for both large and small screens, as well as ensure the view is properly updated and adapted to the new screen size when the app window is resized.

This can be done by creating a new layout management type for smaller screens, where the layout can have the same level of customization as for larger screens: single, compact and multiple view. With this, cycling through different layouts should also be allowed.

dart_vlc_plugin.dll was not found

This message pops up when I try to run the client.

Do we have to download the flutter and dart SDK packages to run this?

Regards

Timezone uses GMT instead of local timezone

I believe the timestamp on the Events player does not account for the local timezone. I'm getting a date in the future :)

Originally posted by @MathewWMoore in #47 (comment)