I made a better remote-live-view page [OLD]

bp2008

Staff member
Joined
Mar 10, 2014
Messages
12,687
Reaction score
14,056
Location
USA
Great! Thank you very much. I was able to get it to work. However, I have another question. Can I pass the username and password in the link itself, so that I dont have to enter the username and password after opening the link? The link I am using now is http://ipaddress:port/mjpg/{camerashort name}/video.mjpg. How can I pass the username and password in this link?
To do that, you will have to uncheck Secure only in the web server settings, and then put the credentials in like this:

Code:
http://user:pass@ipaddress:port/mjpg/{camerashort name}/video.mjpg
I think that doesn't work in some browsers, and there might be a different way to put the credentials in the URL but I don't remember what it is and I can't find any mention of it by searching.
 

Donald

BIT Beta Team
Joined
Aug 28, 2015
Messages
47
Reaction score
8
I installed bp2008 files using the Blue Iris Tools to download and install the webserver files. I don't know what to do next except I knw that I need to put something into each BI uses home page. I forgot what to put there. Also what url do I send to each user to log into this new web server?

I asked this before but my brain stopped a while ago.

nevermind........I figured out the answer to my questions. Thanks!
 
Last edited by a moderator:

Spooling

Getting the hang of it
Joined
Sep 26, 2015
Messages
158
Reaction score
48
Thanks for making this remote-live-view page!

I have one suggestion which would help my situation out tremendously! My internet is quite slow, and I run 4MP cameras. It would be nice if when zoomed in, it only requested the visible portion of the image on the client's machine, rather than the entire zoomed in high resolution image. I could then shrink my browser window on a spot of interest and zoom in for the detail and still get decent performance.
 

GIR

n3wb
Joined
Oct 25, 2015
Messages
1
Reaction score
0
I want to start off by saying thank you for this awesome live view page. I've been using it for a little while now with no issues.

I do have a feature request. I'd like to have alert sounds for certain cameras when motion is triggered. I like to have a virtual door bell for my front door, but I hate having to leave the remote desktop open to get the alert sound from BI. I'm not one to complain about free software that works amazing. So I took a shot at it myself, and would like to share what I have done.

First I added some javascript to the ui2.htm page
Code:
<script type="text/javascript">
    var prev = "";
    var doorbell = new Audio();


    doorbell.src = "doorbell.wav";
    function playDoorbell(){
        doorbell.play()
    }


    setInterval(function() {
        $.get("/alerts.htm", function(data){
            if(data != "") {
                if(data != prev) {
                    playDoorbell();
                    prev = data;
                    showErrorToast("Front Door Triggered!");
                }
            }
        });
    }, 1000);


</script>
For people who don't know javascript, what this script does is check for changes in a file(alerts.htm) and plays a sound if it detects a change.

Next I made a Windows batch file.
Code:
if "%1" == "" (
    break > C:\BlueIris\www\alerts.htm
) ELSE (
    echo %1 >> C:\BlueIris\www\alerts.htm
)
This file does is look if there are any parameters, and if found there is its writes them too the file alerts.htm. If its blank, it clears the file.

Lastly, in the BI alert setting for the camera I want the alert for, I chose "Run a program or execute script" with these parameters.


Excuse my horrible programming, but it was the best thing that came to me. I am really not too familiar with the BI web API.
 

Attachments

Last edited by a moderator:

bp2008

Staff member
Joined
Mar 10, 2014
Messages
12,687
Reaction score
14,056
Location
USA
Thanks for making this remote-live-view page!

I have one suggestion which would help my situation out tremendously! My internet is quite slow, and I run 4MP cameras. It would be nice if when zoomed in, it only requested the visible portion of the image on the client's machine, rather than the entire zoomed in high resolution image. I could then shrink my browser window on a spot of interest and zoom in for the detail and still get decent performance.
I have considered this many times, but Blue Iris does not provide the ability to request just a cropped section of the image. So this is not currently possible. I'm sorry.
 

bp2008

Staff member
Joined
Mar 10, 2014
Messages
12,687
Reaction score
14,056
Location
USA
I want to start off by saying thank you for this awesome live view page. I've been using it for a little while now with no issues.

I do have a feature request. I'd like to have alert sounds for certain cameras when motion is triggered. I like to have a virtual door bell for my front door, but I hate having to leave the remote desktop open to get the alert sound from BI. I'm not one to complain about free software that works amazing. So I took a shot at it myself, and would like to share what I have done.
That is pretty cool.

Just so you know, there is a better alternative to putting the script in ui2.htm which would get overwritten every time you update UI2. UI2 always attempts to load a script file named ui2-local-overrides.js from the www/ui2/ directory. This file is intentionally not included in the ui2 release zip files so that people can create their own script modifications in it and have it not get overwritten during an update. I have been known to accidentally include a copy of the file in the release zip before, but for the most part it is safe from being overwritten. :rolleyes:

Also, you might want to share the doorbell sound!
 

erkme73

BIT Beta Team
Joined
Nov 9, 2014
Messages
1,540
Reaction score
1,412
Thanks for making this remote-live-view page!

I have one suggestion which would help my situation out tremendously! My internet is quite slow, and I run 4MP cameras. It would be nice if when zoomed in, it only requested the visible portion of the image on the client's machine, rather than the entire zoomed in high resolution image. I could then shrink my browser window on a spot of interest and zoom in for the detail and still get decent performance.
Just a heads up regarding low bandwidth limits... I have a vacation home that is currently being built in middle-TN that is in the middle of nowhere. DSL is available, with max speeds of 5mbps down, 1mbps up - for $100/mo (plus a mandatory copper phone line). My intention is to install a BI server with at least 8 cameras.

Unfortunately one of the only downsides to using this UI2 interface is that it uses the jpg pull/push method to produce the video stream. That is inherently MUCH less efficient (and less configurable) than the activex stream the the stock BI webpage (default.htm) uses.

To put it into perspective, with the default.htm page, I can define that a user's stream be limited to 500kbps. So when a user logs in, no matter which camera (or group) he's viewing, the max bandwidth will not exceed 500kbps. While there is a 'low bandwidth' mode for UI2, it's defined at the user level, not at the server - and a comparable 500kbps on motion jpg is nearly unusable when compared to the same compression on the activex stream.

I can clearly identify people/items at 500kbps using activex. With UI2, everything is too blocky/pixelated to be useful. That's not UI2's fault - it's just a limitation of the jpg stream.

When one of my users is logged into the unrestricted (normal) UI2 view, my BI server is moving between 10 and 20 megabits per second. Quality is superior to the activex view, no doubt, but that would never work on a low bandwidth connection. The same user logged into a 1mbps-limited activex viewer shows marginally poorer quality, but uses just 5 to 10% of the bandwidth.

Edited to add - most of my users are now using unrestricted UI2.htm to view my public cameras. Several of them log in, and stay logged in permanently (parents, family, etc). October, my router shows that I UPLOADED 1,8GB of data - nearly three times my download rate. Most of that data is from serving up to UI2 users.
 

bp2008

Staff member
Joined
Mar 10, 2014
Messages
12,687
Reaction score
14,056
Location
USA
It makes me sad that even in 2015 the communications companies are still installing new copper wire instead of fiber optics. If fixed wireless internet is an option in your area, then ditch the telephone company as fast as you can. http://broadbandnow.com/ can be a good resource for internet shopping, by the way.

Anyway I've spent a lot of hours trying to integrate a more bandwidth-efficient streaming method into my pages, but all the methods either don't work or they come with too many limitations or disadvantages and I just want nothing to do with them. I've asked Ken in the past if he would make Blue Iris able to stream one of the html5-compatible video formats (like h.264 in an mp4 container, or theora in an ogg container), but I never get much of a response about that. Either getting those to work is over his head or he just has different priorities.
 

erkme73

BIT Beta Team
Joined
Nov 9, 2014
Messages
1,540
Reaction score
1,412
I know, and I'm not faulting your pages at all. I'm hoping that the newer standard he's working on will open more doors for your bandwidth options.

As for the ISP options, unfortunately the location is so remote, and so hilly (right on the Cumberland ridge edge in the Appalachians) that the hills block virtually all RF. No OTA, only one cellular provider. I'm actually surprised DSL is even available given how far we are from any central office. The town I'm in has a population of less than 100, so I'm sure there Google fiber won't be there any time soon. Best I can hope for is some sort of government-subsidized build out of broadband - but that likely won't happen in my lifetime.

Interestingly enough, the VZ wireless service is stellar 4G (45/25mbps) - but they double-NAT their user IPs, so no way to configure port-forwarding, and therefore no remote accessibility. Thus, the only option is the ultra slow copper.
 

bp2008

Staff member
Joined
Mar 10, 2014
Messages
12,687
Reaction score
14,056
Location
USA
Interestingly enough, the VZ wireless service is stellar 4G (45/25mbps) - but they double-NAT their user IPs, so no way to configure port-forwarding, and therefore no remote accessibility. Thus, the only option is the ultra slow copper.
It is still possible to achieve remote accessibility if you have a fast internet connection elsewhere, such as at your home or workplace or if you rent a low end dedicated server, virtual private server (VPS), or cloud server. You can set up an OpenVPN server at the location with the high speed internet link and get a router with an OpenVPN client (any mid-range to high-end router compatible with Shibby's tomato build should work) to connect out to the server. The VPN can be very reliable as long as the cellular service is reliable. I use one to link to a remote location on AT&T cellular service (which is behind NAT, though I don't know how many layers of NAT). Once the VPN is working, you can set up proxy services of some kind to forward traffic from the publicly-accessible VPN server to the appropriate private hosts on the VPN.
 

erkme73

BIT Beta Team
Joined
Nov 9, 2014
Messages
1,540
Reaction score
1,412
I don't want to hijack your thread - but that's exactly what I intend on doing. I have DDWRT on two routers. One will be at the cabin, connecting to the Verizon jetpack via wifi. It will establish an OpenVPN connection to my DDWRT router at home. Once the networks are bridged, I should be able to access the server using a LAN IP (and forward to that via the server-side router). My only concern is that jetpack and the reliability of the 4G LTE connection. If anything happens (dead battery or cell site going off line), I won't have any local means of resetting everything if it doesn't recover on its own. Fortunately, it's only 700 miles from home :)
 

bp2008

Staff member
Joined
Mar 10, 2014
Messages
12,687
Reaction score
14,056
Location
USA
I don't want to hijack your thread - but that's exactly what I intend on doing. I have DDWRT on two routers. One will be at the cabin, connecting to the Verizon jetpack via wifi. It will establish an OpenVPN connection to my DDWRT router at home. Once the networks are bridged, I should be able to access the server using a LAN IP (and forward to that via the server-side router). My only concern is that jetpack and the reliability of the 4G LTE connection. If anything happens (dead battery or cell site going off line), I won't have any local means of resetting everything if it doesn't recover on its own. Fortunately, it's only 700 miles from home :)
That is a long way! I recommend you buy a wired router with Verizon 4G capability built in. One that doesn't run on batteries or require connections to be over WiFi. And perhaps one that lets you install an external/outdoor high gain antenna. I've been using a Pepwave MAX BR1 with AT&T 3G support. For some reason that I've never been able to determine, it fails to obtain an IP address over the cellular connection for days and even weeks on end, so it is only online perhaps 60 to 80% of the time. Probably AT&T's fault ... maybe they are doing some illegal limiting of the unlimited 3G data plan. It could just as easily be the modem's fault.
 

skarragallagher

Young grasshopper
Joined
Jan 13, 2015
Messages
36
Reaction score
1
I love what you have done here. Is there any way to add sound to the allcams page? It is perfect being that it shows all Cameras and allows you to maximize one can however I would like to have sound play automatically when you select a camera on full screen. Is this possible?
 

trogfish

n3wb
Joined
Nov 6, 2015
Messages
4
Reaction score
0
First off bp I LOVE the look of jpegpull and allcams.htm if it wasn't for me finding this for Blue Iris I would not have now Chromecast in different rooms with BIris full screen.

I have a feature request i'm sure must be easy.. perhaps a cycle.htm
Since the release of "+All Camera Cycle" is it possible to turn the Camera Cycle frame into a full frame as allcams.htm does, so that way in full screen remotely users with Motion trigger to bring forward in cycle can have this full screen like it is in jpegpull.htm .

I am sorry if this has been asked again before, but I haven't been able to find the exact answer in this thread. (...that I actually understand....)

I want a similar function to this user: I want a 'allcameracycle.htm' page/url that has no features, no options, but simply functions as a single click, full screen, all cameras cycle.

I am wondering if there is a way to include option parameters in the url, or hints how to slightly modify the pre-loaded options in the .htm to create a version of '/allcams.htm?internetmode=1000%20-' but does the all camera cycle I am looking for. (Without a 10 minute timeout?)

Using jpegpull2.htm with clip bar closed, and all camera cycle option is fine, but I want the page to programmaticly, open that way by default when loaded from any LAN user?

Thanks in advance!
 

Q™

IPCT Contributor
Joined
Feb 16, 2015
Messages
4,989
Reaction score
3,990
Location
Megatroplis, USA
Bp2008, I was wondering about this: when I'm working in the Blue Iris client -- and I view a camera full screen -- the quality of the video I see appears to be of better quality than the full screen camera video I experience when I view a camera full screen in your ui2.htm. Would you please tell me why this is? In addition, is there any setting in Blue Iris which will allow me to improve the full screen video I view in ui2.htm?
 

bp2008

Staff member
Joined
Mar 10, 2014
Messages
12,687
Reaction score
14,056
Location
USA
I love what you have done here. Is there any way to add sound to the allcams page? It is perfect being that it shows all Cameras and allows you to maximize one can however I would like to have sound play automatically when you select a camera on full screen. Is this possible?
Not particularly easily. You could use UI2 for this though, if you just drag the left menu closed then the top bar will disappear and it will behave much like allcams except it will keep the ability to play audio of course.

I am sorry if this has been asked again before, but I haven't been able to find the exact answer in this thread. (...that I actually understand....)

I want a similar function to this user: I want a 'allcameracycle.htm' page/url that has no features, no options, but simply functions as a single click, full screen, all cameras cycle.

I am wondering if there is a way to include option parameters in the url, or hints how to slightly modify the pre-loaded options in the .htm to create a version of '/allcams.htm?internetmode=1000%20-' but does the all camera cycle I am looking for. (Without a 10 minute timeout?)

Using jpegpull2.htm with clip bar closed, and all camera cycle option is fine, but I want the page to programmaticly, open that way by default when loaded from any LAN user?

Thanks in advance!
I'm a little short for time right now, so I'll try and get back to you later. Yes, it should be possible.

Bp2008, I was wondering about this: when I'm working in the Blue Iris client -- and I view a camera full screen -- the quality of the video I see appears to be of better quality than the full screen camera video I experience when I view a camera full screen in your ui2.htm. Would you please tell me why this is? In addition, is there any setting in Blue Iris which will allow me to improve the full screen video I view in ui2.htm?
It could be two things.

1) UI2 requests images at the resolution they will be displayed at. Blue Iris shrinks the image before sending it, and this shrinking algorithm makes it a tad blurry. If you increase the DPI scaling factor a few notches, the resolution of the images will go up and when the browser shrinks the images to fit, they will look slightly sharper because the browser uses a better scaling algorithm than Blue Iris.

2) Jpeg compression quality in Blue Iris is set individually for each camera. Increase that and the quality will go up. But so will the file size, and with higher file size comes lower frame rate usually.
 

Q™

IPCT Contributor
Joined
Feb 16, 2015
Messages
4,989
Reaction score
3,990
Location
Megatroplis, USA
...It could be two things.

1) UI2 requests images at the resolution they will be displayed at. Blue Iris shrinks the image before sending it, and this shrinking algorithm makes it a tad blurry. If you increase the DPI scaling factor a few notches, the resolution of the images will go up and when the browser shrinks the images to fit, they will look slightly sharper because the browser uses a better scaling algorithm than Blue Iris.

2) Jpeg compression quality in Blue Iris is set individually for each camera. Increase that and the quality will go up. But so will the file size, and with higher file size comes lower frame rate usually.
As always, thank you very much!
 

bp2008

Staff member
Joined
Mar 10, 2014
Messages
12,687
Reaction score
14,056
Location
USA
I am sorry if this has been asked again before, but I haven't been able to find the exact answer in this thread. (...that I actually understand....)

I want a similar function to this user: I want a 'allcameracycle.htm' page/url that has no features, no options, but simply functions as a single click, full screen, all cameras cycle.

I am wondering if there is a way to include option parameters in the url, or hints how to slightly modify the pre-loaded options in the .htm to create a version of '/allcams.htm?internetmode=1000%20-' but does the all camera cycle I am looking for. (Without a 10 minute timeout?)

Using jpegpull2.htm with clip bar closed, and all camera cycle option is fine, but I want the page to programmaticly, open that way by default when loaded from any LAN user?

Thanks in advance!
Alright, here is a method to do what you've asked for.

Create a file named "ui2-local-overrides.js" in your www/ui2/ folder.

Paste in the following content:

Code:
var params = {}; window.location.search.replace(/[?&]+([^=&]+)=([^&]*)/gi, function (str, key, value) { params[key] = value; });

if (params['group'] != '')
{
	OverrideDefaultSetting("ui2_defaultCameraGroupId", params['group'], true, true, 0);
}
if (params['full'] != '')
{
	OverrideDefaultSetting("ui2_hideTopBar", "1", true, true, 0);
	OverrideDefaultSetting("ui2_leftBarSize", 0, true, true, 0);
}
Then direct people to use /ui2.htm?full=1&group=@index

That is all you need to do.

This works by using URL parameters to force certain settings in UI2. When you specify "group=@index", you are overriding the "ui2_defaultCameraGroupId" setting and causing the camera group named "@index" to load. This particular group is the All cameras cycle group. You can use any group camera cycle by passing the value "@groupname" as long as you have the cycle enabled in Blue Iris. Then the full=1 parameter overrides 2 other settings to make sure that UI2 loads with all the UI elements hidden. You can easily override any ui2 setting in this manner. See the top of ui2.js for a full list of the available settings, or ui2-local-overrides-template.js for more complete usage instructions.

If you want to resume normal UI2 behavior, you'll find the clip list is simply collapsed on the side, and you can drag it open again ... or double click the drag bar to return it to its normal size.
 

trogfish

n3wb
Joined
Nov 6, 2015
Messages
4
Reaction score
0
Alright, here is a method to do what you've asked for.

Create a file named "ui2-local-overrides.js" in your www/ui2/ folder.

Paste in the following content:

Code:
var params = {}; window.location.search.replace(/[?&]+([^=&]+)=([^&]*)/gi, function (str, key, value) { params[key] = value; });

if (params['group'] != '')
{
    OverrideDefaultSetting("ui2_defaultCameraGroupId", params['group'], true, true, 0);
}
if (params['full'] != '')
{
    OverrideDefaultSetting("ui2_hideTopBar", "1", true, true, 0);
    OverrideDefaultSetting("ui2_leftBarSize", 0, true, true, 0);
}
Then direct people to use /ui2.htm?full=1&group=@index

That is all you need to do.

This works by using URL parameters to force certain settings in UI2. When you specify "group=@index", you are overriding the "ui2_defaultCameraGroupId" setting and causing the camera group named "@index" to load. This particular group is the All cameras cycle group. You can use any group camera cycle by passing the value "@groupname" as long as you have the cycle enabled in Blue Iris. Then the full=1 parameter overrides 2 other settings to make sure that UI2 loads with all the UI elements hidden. You can easily override any ui2 setting in this manner. See the top of ui2.js for a full list of the available settings, or ui2-local-overrides-template.js for more complete usage instructions.

If you want to resume normal UI2 behavior, you'll find the clip list is simply collapsed on the side, and you can drag it open again ... or double click the drag bar to return it to its normal size.
------------
Worked Perfectly!
Thanks for all that you have done.
 

skarragallagher

Young grasshopper
Joined
Jan 13, 2015
Messages
36
Reaction score
1
This is great. I can access the full screen now via URL options. Definitely a step in the right direction.

I am trying to integrate this into a screen with my home automation software, Homeseer hstouch. Currently it has an issue loading one or more of the modules. The allcams page loads fine however. I am wondering if there is a way to disable some of the components that load at startup. I am thinking they may be the issue.

Not sure if they all are needed with just a plain view of all the cameras but it would help me try to at least narrow down where the issue is.

 
Top