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

[blkdrgn808]

Exhaustive instructions for collapsing the left side menu are on the previous page of this thread

I still can't figure it out. I can't seem to drag it over to the left. :redface-new:

 

[djangel]

I still can't figure it out. I can't seem to drag it over to the left. :redface-new:

No need to read all 39 pages, just read the first one.

Installation Instructions

The zip contains a lot of files. Simply extract all of these into the "www" folder in your Blue Iris install. For basic usage, load the "ui2.htm" page:


http://localhost/ui2.htm - You will probably need to modify the URL to point at your Blue Iris machine.


Press F11 to load full-screen mode, if desired.

 

[thevorlon]

I still can't figure it out. I can't seem to drag it over to the left. :redface-new: View attachment 7018

That appears to be the Blue Iris remote view page and not bp2008's remote view.

 

[blkdrgn808]

I got it to work. I had all the files correct but I had to clear out the browser for it to pickup the ui2. I am now able to close the clips section. Thanks!

 

[bp2008]

Screenshots are amazing, huh?

 

[wcrowder]

You're not trying anymore...are you.

I apologize, you got me fired up a couple nights ago. Had a family issue I had to take care of and haven't been on here till today. You give good advise; most of the time... When I believe it's wrong, I'm going to call you on it. That is just how I am, and If I'm wrong you are more then welcome to call me on it. That's how we all learn off each other.

 

[Q™]

Fair enough.

 

[[NUT]]

Not easily. The best way to do what you want would probably be to use Blue Iris itself and not a web page. You can detach camera windows from the main program and create whatever arrangements you like on multiple monitors.

Alternatively, you can assign groups to your cameras in Blue Iris and then load the different groups in UI2.

To aid in loading the groups in UI2, you may want to be able to specify the group name in a parameter sent in the URL, so that you could make multiple bookmarks for the UI2 page, each configured to open a different camera group. First, you would need to create a file named ui2-local-overrides.js in the www/ui2/ folder.

Then paste inside it this code:

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

if (typeof params['group'] != 'undefined' && params['group'] != '')
{
    OverrideDefaultSetting("ui2_defaultCameraGroupId", params['group'], true, true, 0);
}

After doing this, you can load ui2 with a URL such as http://x.x.x.x/ui2.htm?group=groupname

:triumphant:

That's PERFECT. A solution that elegant should actually be part of the distribution

Thanks a bunch!

 

[tom95521]

Keyboard control question. I understand the keypad cursor arrow keys for pan control. The +/- keys seem to do digital zoom. Is there keyboard control for optical zoom? I tried shift key + other keys and it did not seem to work.

Thanks,
Tom

 

[bp2008]

Keyboard control question. I understand the keypad cursor arrow keys for pan control. The +/- keys seem to do digital zoom. Is there keyboard control for optical zoom? I tried shift key + other keys and it did not seem to work.

Thanks,
Tom

CTRL is the modifier for optical zoom.

You can look at and change all of the hotkeys in UI2's settings.

 

[tom95521]

Awesome! I changed the optical zoom controls to shift up arrow and shift down arrow. I didn't realize you could do so much with html code.

Thanks,
Tom

 

[tom95521]

This one might be a real problem. If I display the All Cameras group I can see all 10 of my cameras. The first 2 rows have 3 cameras and the last 4 cameras. When I click on the small video it opens up the camera video for the next camera to the right of where I clicked. I can also click in the black area between videos and it opens up the camera to the right of my selection. I assume it's related to the unequal number of cameras in each row and it's somehow causing the clickable area calculation to be incorrect. 9 out of 10 cameras are 16:9 ratio and the other is 4:3 ratio.
Not sure if it's fixable but I thought I should mention it. My other option is to buy 2 more cameras so each row is equal.

ver. 0.9.5
Windows 10
Chrome 47.0.2526.106 m

Thanks,
Tom

 

[wcrowder]

This one might be a real problem. If I display the All Cameras group I can see all 10 of my cameras. The first 2 rows have 3 cameras and the last 4 cameras. When I click on the small video it opens up the camera video for the next camera to the right of where I clicked. I can also click in the black area between videos and it opens up the camera to the right of my selection. I assume it's related to the unequal number of cameras in each row and it's somehow causing the clickable area calculation to be incorrect.
Not sure if it's fixable but I thought I should mention it. My other option is to buy 2 more cameras so each row is equal.

ver. 0.9.5
Windows 10
Chrome 47.0.2526.106 m

Thanks,
Tom

Did you just add a camera? Clear your browser catch and try again...

 

[tom95521]

Bingo! I added two cameras recently. I will remember to clear the browser cache before posting again.

Thanks,
Tom

 

[wcrowder]

Bingo! I added two cameras recently. I will remember to clear the browser cache before posting again.

Thanks,
Tom

Post away, we learn from each other....

 

[bp2008]

Did you just add a camera? Clear your browser catch and try again...

No need to clear any cache. Just reloading the page is all it takes

 

[skarragallagher]

Question, is there a way to use URL to load a specific camera full screen.

For instance:
Http://serverort/ui2.htm?cam=camerashortname&full screen=1

Those mods you had me add to the override file for group and full screen work beautifully!

 

[bp2008]

Question, is there a way to use URL to load a specific camera full screen.

For instance:
Http://serverort/ui2.htm?cam=camerashortname&full screen=1

Those mods you had me add to the override file for group and full screen work beautifully!

Sure. Add this to the bottom of your ui2_local_overrides.js file.

$(function()
{
	var params = {}; window.location.search.replace(/[?&]+([^=&]+)=([^&]*)/gi, function (str, key, value) { params[key] = value; });
	if (typeof params['cam'] != 'undefined' && params['cam'] != ' ')
	{
		// Override the StartRefresh method to add new functionality after UI2 fully loads.
		var oldStartRefresh = StartRefresh;
		StartRefresh = function()
		{
			var camData = GetCameraWithId(params['cam']);
			if (camData != null)
				ImgClick_Camera(camData);

			oldStartRefresh();
		};
	}
	if (typeof params['fullscreen'] != 'undefined' && params['fullscreen'] == '1')
	{
		$("#layoutleft").css("width", "0px");
		resized();
	}
});

Now you can use a url like this:

http://server:port/ui2.htm?cam=camerashortname&fullscreen=1

Note this implementation is a little hacky and it has a slightly increased chance of breaking in some future UI2 update.

 

[skarragallagher]

I can't say thank you enough

 

[Q™]

I can't say thank you enough

skarragallagher...you could make a donation to bp2008!...

https://www.paypal.me/bp2008