Blue Iris UI3

Love the interface; Now I dont have to remote into the host running BI..
Only thing I'd like to see is a UI option to allow changing the playback speed that I could map to two keys, or arrows to click on like the current UI.
 
  • Like
Reactions: actran
is anyone else having issue with scrubbing playback of clips? both safari and chrome exhibit the same issue. blurry image during scrubbing. playback is fine, just holding down the timeline handle causes blurry images, making itimposible to scrub through and see the image. when you let go of the handle, it goes back to clear.

this is pretty much a show stopper for me. i use scrubbing every morning to preview the previous day's recordings quickly.

You know how if you pause the playback and just mouse over the seek bar you get a little thumbnail preview of that location? Well if you are dragging, I just stretch that exact same thumbnail to the full video area. That is why it looks so bad.

I guess I will have to improve the quality while actively dragging, even though it will make seeking less responsive.
 
Love the interface; Now I dont have to remote into the host running BI..
Only thing I'd like to see is a UI option to allow changing the playback speed that I could map to two keys, or arrows to click on like the current UI.

Both are good ideas. Expect to find hotkeys available in the next release. What do you think of '[' and ']' keys for the defaults?

I think I will not add two new buttons to the playback controls bar though.
 
  • Like
Reactions: anijet
Both are good ideas. Expect to find hotkeys available in the next release. What do you think of '[' and ']' keys for the defaults?

I think I will not add two new buttons to the playback controls bar though.
I think the [] would be fine!
tks
 
I guess I will have to improve the quality while actively dragging, even though it will make seeking less responsive.

I've made some measurements of different quality options.

These download times do not include internet latency.

Using a remote machine with about 19 Mbps of bandwidth available.

160px, 50% quality: 3 KB. Download time 0.5 ms. (This is the current seek preview quality)
320px, 50% quality: 9 KB. Download time 2.5 ms.
480px, 50% quality: 18 KB. Download time 6.5 ms.
640px, 50% quality: 32 KB. Download time 12ms. (Equivalent to UI3's "Jpeg SD" quality)

Here are results of the same tests using a local machine and Chrome's "Fast 3G" network throttling mode which is about 1.6 Mbps.

160px, 50% quality: 3 KB. Download time 16 ms. (This is the current seek preview quality)
320px, 50% quality: 9 KB. Download time 48 ms.
480px, 50% quality: 18 KB. Download time 96 ms.
640px, 50% quality: 32 KB. Download time 166ms. (Equivalent to UI3's "Jpeg SD" quality)

A lot of people are still stuck with their BI servers behind ADSL, so I also tested using a custom 700 Kbps network throttling mode.

160px, 50% quality: 3 KB. Download time 34 ms. (This is the current seek preview quality)
320px, 50% quality: 9 KB. Download time 100 ms.
480px, 50% quality: 18 KB. Download time 200 ms.
640px, 50% quality: 32 KB. Download time 351ms. (Equivalent to UI3's "Jpeg SD" quality)
640px, 25% quality: 20 KB. Download time 218ms.
But rather than pick one quality option and force it upon everyone, I think what I'll do is change the seek preview size and quality to be somewhat dynamic based on your chosen jpeg streaming quality or recent H.264 bit rate.
 
Hmmm OK. Is this something that can be added? I put my cameras in a strip down the side of my desktop. UI2 works so well because I can remove the interface and see only the cameras, whereas UI3 doesn't work so well as you can see.

This is in beta version b8.
 
Beta b8 is now available in the first post.

Changes include:
* Improved image quality while seeking in a clip. Quality is dynamic based on your current streaming quality.
* Added hotkeys for PTZ manual focusing and changing clip playback speed. These share the '[' and ']' keys by default.
* Added a "maximize video area" hotkey bound by default to CTRL + tilde (`) which will show/hide the left and top control bars.
* Browsers that don't support the fullscreen API will once again show the fullscreen button, and the button will toggle "maximize video area" instead.
 
Awesome work! btw, fine on the latest FF

Two Small feature requests...

1. for those of us without PTZ cameras, can you have a 'UI Settings' option to remove the PTZ menu from the left menu, completely?
2. can you have an section (on left menu - or row on top or bottom of screen) that lists all the camera names as separate buttons for "1-click camera change"? Would be really nice to have a way to do this.

thx!
 
1. for those of us without PTZ cameras, can you have a 'UI Settings' option to remove the PTZ menu from the left menu, completely?

If you aren't happy with just collapsing the PTZ section in the UI, you can remove PTZ permission from the user account in Blue Iris and then the UI will hide PTZ controls completely for each user you've done this for. I feel like it would just be clutter to add this to UI Settings.

2. can you have an section (on left menu - or row on top or bottom of screen) that lists all the camera names as separate buttons for "1-click camera change"? Would be really nice to have a way to do this.

You mean like the list in the old jpegpull.htm and default.htm pages? Why would you want to use that when you could just click directly on the camera to change to it?
 
Multi-camera simultaneous playback via a timeline is something that might happen some day, but right now Blue Iris's web server has no support for streaming multiple clips at the same time efficiently.
 
If you aren't happy with just collapsing the PTZ section in the UI, you can remove PTZ permission from the user account in Blue Iris and then the UI will hide PTZ controls completely for each user you've done this for. I feel like it would just be clutter to add this to UI Settings.
OK I didnt know.

You mean like the list in the old jpegpull.htm and default.htm pages? Why would you want to use that when you could just click directly on the camera to change to it?
Unless I misunderstand... when you are viewing 1-camera (full), there is no way to quickly change to a different camera? Example: I'm watching the Kitchen and in 1-click, want to switch to Entry full.
 
On one of my computers (Dell Latitude e520 with i5-2520m and 8gb of RAM) I get the eror "your cpu is not fast enough to handle this stream in real time". Using Ui3 B8 and blue iris 4.6.4.8. I have tried 4.6.4.9 as well but it produced the same results. I am using chrome Version 62.0.3202.89 (Official Build) (64-bit). I have tried switching profiles. My slowest profile is 1024kbps gop 300 ultrafast. On my phone all 3 profiles work fine. This is from my internal network so pretty sure bandwidth is not the issue. In fact I can switch to JPG best quality on this same computer and it works fine. I mean it plays at about 5-10 fps but switching between cameras and alerts and clips is smooth. With H.264 on this one computer everything is really slow, it takes like 10 seconds or more to switch between cameras or alerts and clips. Then it plays the 10 seconds really fast and then once it catches up it plays fine as long as I don't switch cameras or what not. Surely my CPU should be sufficient? Any ideas?
 
Last edited:
Unless I misunderstand... when you are viewing 1-camera (full), there is no way to quickly change to a different camera? Example: I'm watching the Kitchen and in 1-click, want to switch to Entry full.

That is correct, you do need to click again to return to the group view before you can select another single camera. I don't know about you but I have enough cams that a vertical list is really long and it takes me more time to find the one I want in a list than to just click back to the group view and then click the one I want to see. It isn't impossible to add a vertical list to that left bar but in all my time working on Blue Iris interfaces you might be the first person to ask for that.

On one of my computers (Dell Latitude e520 with i5-2520m and 8gb of RAM) I get the eror "your cpu is not fast enough to handle this stream in real time". Using Ui3 B8 and blue iris 4.6.4.8. I have tried 4.6.4.9 as well but it produced the same results. I am using chrome Version 62.0.3202.89 (Official Build) (64-bit). I have tried switching profiles. My slowest profile is 1024kbps gop 300 ultrafast. On my phone all 3 profiles work fine. This is from my internal network so pretty sure bandwidth is not the issue. In fact I can switch to JPG best quality on this same computer and it works fine. I mean it plays at about 5-10 fps but switching between cameras and alerts and clips is smooth. With H.264 on this one computer everything is really slow, it takes like 10 seconds or more to switch between cameras or alerts and clips. Then it plays the 10 seconds really fast and then once it catches up it plays fine as long as I don't switch cameras or what not. Surely my CPU should be sufficient? Any ideas?

By all means that system should have no problem with H.264.

Some questions for you.

1) What is the Blue Iris server's CPU usage and memory usage when you are experiencing this problem?
2) Try a different browser that is compatible with UI3's H.264 streaming. Recent versions of Chrome, Edge, Opera, and Safari should be compatible. Does another browser work correctly where Chrome does not?
3) Can you try with a wired network connection, just to rule out wifi issues?
4) Does it always take about the same amount of time to switch between cameras?
5) What about when you open UI3 and it loads the first stream? Does this also take a long time or does it happen quickly (about 2 seconds)?

If you right click on the video stream, there is a "Stats for nerds" item which has graphs to help figure out what is going wrong. For the most part the graphs only update when a frame is rendered, but if no frames are rendered for a while then the graphs will update every 10 seconds.

When everything is normal, the graphs should be fairly steady, like this:

KUUjNhl.png


Here is what it looks like when the network connection is consistently too slow. Note how the network delay graph steadily rises.

takRPKf.png


Similarly, if the CPU is too slow, you should expect to see the Player Delay graph rise steadily. The warning you mention won't appear unless Player Delay is higher than 3 seconds. However if the graphs freeze completely for longer than a fraction of a second when you switch cameras, then the problem is not as easy as just "CPU too slow" or "network too slow".
 
That is correct, you do need to click again to return to the group view before you can select another single camera. I don't know about you but I have enough cams that a vertical list is really long and it takes me more time to find the one I want in a list than to just click back to the group view and then click the one I want to see. It isn't impossible to add a vertical list to that left bar but in all my time working on Blue Iris interfaces you might be the first person to ask for that.



By all means that system should have no problem with H.264.

Some questions for you.

1) What is the Blue Iris server's CPU usage and memory usage when you are experiencing this problem?
2) Try a different browser that is compatible with UI3's H.264 streaming. Recent versions of Chrome, Edge, Opera, and Safari should be compatible. Does another browser work correctly where Chrome does not?
3) Can you try with a wired network connection, just to rule out wifi issues?
4) Does it always take about the same amount of time to switch between cameras?
5) What about when you open UI3 and it loads the first stream? Does this also take a long time or does it happen quickly (about 2 seconds)?

If you right click on the video stream, there is a "Stats for nerds" item which has graphs to help figure out what is going wrong. For the most part the graphs only update when a frame is rendered, but if no frames are rendered for a while then the graphs will update every 10 seconds.

When everything is normal, the graphs should be fairly steady, like this:

KUUjNhl.png


Here is what it looks like when the network connection is consistently too slow. Note how the network delay graph steadily rises.

takRPKf.png


Similarly, if the CPU is too slow, you should expect to see the Player Delay graph rise steadily. The warning you mention won't appear unless Player Delay is higher than 3 seconds. However if the graphs freeze completely for longer than a fraction of a second when you switch cameras, then the problem is not as easy as just "CPU too slow" or "network too slow".


By all means that system should have no problem with H.264.

Some questions for you.

1) What is the Blue Iris server's CPU usage and memory usage when you are experiencing this problem?

CPU and RAM seem fine during the issue. I run a Dell R710. Will be switching to something newer but for now it does the job just fine. Nothing else running on the server except BI.

Serverstats.png

2) Try a different browser that is compatible with UI3's H.264 streaming. Recent versions of Chrome, Edge, Opera, and Safari should be compatible. Does another browser work correctly where Chrome does not?

Just tested all 3 right now hardwired and Chrome, Edge, and Opera all have the same issue.

3) Can you try with a wired network connection, just to rule out wifi issues?

I did this round of testing hardwired and the issue is the same. I am plugged into a gigabit switch now. I was too lazy to do a large file transfer test but you can tell I have at least 100mbps download, which of course on this test is limited by my ISP.

speedtest.png

4) Does it always take about the same amount of time to switch between cameras?

Yes, I actually timed it and it took 25 seconds or so. Did it a few times and results were consistent.

5) What about when you open UI3 and it loads the first stream? Does this also take a long time or does it happen quickly (about 2 seconds)?

It takes about 25-30 seconds to load the inital screen. Same amount of time as it does for me to switch cameras or switch to clips or alerts.

Here is my stats for nerds. After waiting for the video to load I notice player delay is maxed out and it clears itself as the video catches up. Takes maybe 10 seconds or so to catch up. I didn't really time this part, but after the initial hiccup everything seems normal.

Here are my stats when loading the all cams view. After stats had gone by about 1.3 times.

stats1.png

Here are my stats when I selected one camera.

stats2.png

Here are my stats about 5 secocnds after the video catches up.

Stats 3.png

Please let me know if you have any other ideas. Maybe it could be my resolution? 1366X768 is my screen resolution of the laptop. I got it for free at work as we were throwing them out so I assume this is the native resolution of the laptop. Yep, just looked it up. Looks to be right, but maybe it is an issue downscaling tor whatever it is called? But my Samsung S7 edge displays ui3 just fine. hmm.

I also tested from my work laptop over the WAN and it loads fine using chrome even at the highest H264 profile, which I have set to 4096kbps I believe.
 
Last edited:
For the maximize feature, is there a way to pass this through the URL like there was with UI2?

The next beta build will let you send a URL parameter "maximize" with value "1" or "true".

e.g.
Code:
/ui3beta/ui3.htm?maximize=1

Other URL parameters already supported are:

Code:
/ui3beta/ui3.htm?tab=live
/ui3beta/ui3.htm?tab=alerts
/ui3beta/ui3.htm?tab=clips
/ui3beta/ui3.htm?group=groupname
/ui3beta/ui3.htm?cam=cameraShortName

And of course to use multiple parameters at once, separate with &

Code:
/ui3beta/ui3.htm?tab=alerts&cam=porch&maximize=1
 
  • Like
Reactions: actran
Please let me know if you have any other ideas. Maybe it could be my resolution? 1366X768 is my screen resolution of the laptop. I got it for free at work as we were throwing them out so I assume this is the native resolution of the laptop. Yep, just looked it up. Looks to be right, but maybe it is an issue downscaling tor whatever it is called? But my Samsung S7 edge displays ui3 just fine. hmm.

Nah, it wouldn't be a problem with the screen resolution. It looks like it is getting stuck for a long time trying to decode or render the first frame of each stream. Since it fails the same way in all 3 browsers that suggests it is not a bug in any particular browser version. The decoder is purely software based so it can't be getting hung up trying to access special decoding hardware. Rendering is hardware accelerated through WebGL, so I guess it is a possibility that your video driver is bad. I think this is the latest for your CPU: Download Intel® HD Graphics Driver for Windows* 7/8-64-bit And this one is a little older: Download Intel® HD Graphics Driver for Windows* 7/8-64-bit Maybe try both to see what happens. If I had remote access to the problem machine I could probably determine exactly which part of the streaming process is causing the problem, but chances are not good that I'd be able to fix it.
 
Nah, it wouldn't be a problem with the screen resolution. It looks like it is getting stuck for a long time trying to decode or render the first frame of each stream. Since it fails the same way in all 3 browsers that suggests it is not a bug in any particular browser version. The decoder is purely software based so it can't be getting hung up trying to access special decoding hardware. Rendering is hardware accelerated through WebGL, so I guess it is a possibility that your video driver is bad. I think this is the latest for your CPU: Download Intel® HD Graphics Driver for Windows* 7/8-64-bit And this one is a little older: Download Intel® HD Graphics Driver for Windows* 7/8-64-bit Maybe try both to see what happens. If I had remote access to the problem machine I could probably determine exactly which part of the streaming process is causing the problem, but chances are not good that I'd be able to fix it.

Ah OK, therein lies the problem. I installed windows 10 and the driver is not officially supported on windows 10. Looks like my only option is to downgrade to windows 8.1. Hmm maybe I should buy a new laptop lol.
 
  • Like
Reactions: bp2008
That is correct, you do need to click again to return to the group view before you can select another single camera. I don't know about you but I have enough cams that a vertical list is really long and it takes me more time to find the one I want in a list than to just click back to the group view and then click the one I want to see. It isn't impossible to add a vertical list to that left bar but in all my time working on Blue Iris interfaces you might be the first person to ask for that.

I have 10 cams, probably will end up with 12. I attached a screenshot showing a mockup of how we should be able to get up to 16 cams on the left menu, when PTZ is gone - more like 12 or 13 with PTZ

Also, unless the person has a TON of cams, you can also see there is a lot of black/open space on the top and bottom that could hold 20+ cams in horizontal button rows

thanks for considering, I suspect others would find this very useful too.
 

Attachments

  • Capture.JPG
    Capture.JPG
    234.4 KB · Views: 37