bp2008 / ui3

A powerful, modern HTML5 web interface for Blue Iris.
GNU Lesser General Public License v3.0
120 stars 18 forks source link

Hotkeys - feature request #116

Closed jaygrovr closed 1 year ago

jaygrovr commented 2 years ago

I wanted to know if there is a way to custom assign hotkeys to open a specific view. I need to remotely control the web interface and instead of having to "go to next view" I would like a hotkey to load a specific view. I can number the views if needed. Even better would be a way to send a command to web engine to open a specific view remotely. Currently I have to send keypresses using a utlitly. I have many PCs that have no keyboard or mouse and are used for displays only, so having a method to control these displays from a remote location would be ideal. I cannot setup or connect any hardware devices to the PC that is connected to the display, so it has to be from another machine.

Thanks, and great work. Jason

bp2008 commented 2 years ago

If you are willing to reload the page with different URL parameters, you can do a lot that way. https://bp2008.github.io/ui3/ui3/help/help.html#urlparameters

Otherwise you would need to add new hotkeys of your own design. Doing that is rather complicated and requires some javascript skill. Here's an example local overrides script that adds two hotkeys: https://github.com/bp2008/ui3/wiki/Local-Overrides-Sample:-Add-Buttons-to-Playback-Controls

bp2008 commented 2 years ago

If you need to go with the javascript extension route, this code will change the current camera/group.

videoPlayer.LoadLiveCamera(cameraListLoader.GetCameraWithId("camera_short_name_or_group_name"))
jaygrovr commented 2 years ago

How can I send that command to the web browser? Jason On Wednesday, June 15, 2022, 11:51:14 AM PDT, bp2008 @.***> wrote:

If you need to go with the javascript extension route, this code will change the current camera/group. videoPlayer.LoadLiveCamera(cameraListLoader.GetCameraWithId("camera_short_name_or_group_name")) — Reply to this email directly, view it on GitHub, or unsubscribe. You are receiving this because you authored the thread.Message ID: @.***>

bp2008 commented 2 years ago

Read about local overrides via the ui3 wiki and specifically the second link in my earlier reply has an example of how to add new hotkeys to UI3.

It is all quite complicated of course, hence why I say you need javascript skill.

As more specific example, this script would add a hotkey that is bound to the letter "M" by default:

defaultSettings.push({
            key: "ui3_hotkey_custom_1"
            , value: "0|0|0|77|M"
            , hotkey: true
            , label: "Load camera group 1"
            , actionDown: function () { 
                videoPlayer.LoadLiveCamera(cameraListLoader.GetCameraWithId("camera_short_name_or_group_name"))
             }
            , category: "Hotkeys"
        });

Note the "77" within the value string is the javascript key code for "m".

Once you load a UI3 instance with a default setting, that UI3 instance will adopt the default value provided such that if you change the default value later it won't affect any UI3 instance that has already loaded the setting before; to work around this you can clear the browser cache. Specifically you need to clear the local storage for the hostname you load UI3 from. Local storage is typically lumped together with "cookies" so if you clear the cookies it should clear the local storage too.

bp2008 commented 2 years ago

I've also considered adding MQTT client support to UI3 since I recently learned that MQTT brokers commonly make the service available via web sockets. That would allow a person to use MQTT to send commands to specific UI3 instances. But I have done very little with MQTT so I am not sure what capabilities would be appropriate or how best to implement them. If you have any suggestions for that, let me know!

jaygrovr commented 2 years ago

I would love to see MQTT involved, I could use node-red as the broker and make an entire user screen that can control all the client web interfaces. How hard would that be to add? Jason On Wednesday, June 15, 2022, 12:10:36 PM PDT, bp2008 @.***> wrote:

I've also considered adding MQTT client support to UI3 since I recently learned that MQTT brokers commonly make the service available via web sockets. That would allow a person to use MQTT to send commands to specific UI3 instances. But I have done very little with MQTT so I am not sure what capabilities would be appropriate or how best to implement them. If you have any suggestions for that, let me know!

— Reply to this email directly, view it on GitHub, or unsubscribe. You are receiving this because you authored the thread.Message ID: @.***>

jaygrovr commented 2 years ago

This is amazing, is it ok if I over-ride the 1-20 "load preset" hotkeys with new ones as well?  I would like to just send a number. Thanks! Jason On Wednesday, June 15, 2022, 12:06:59 PM PDT, bp2008 @.***> wrote:

Read about local overrides via the ui3 wiki and specifically the second link in my earlier reply has an example of how to add new hotkeys to UI3.

It is all quite complicated of course, hence why I say you need javascript skill.

As more specific example, this script would add a hotkey that is bound to the letter "M" by default: defaultSettings.push({ key: "ui3_hotkey_custom_1" , value: "0|0|0|77|M" , hotkey: true , label: "Load camera group 1" , actionDown: function () { videoPlayer.LoadLiveCamera(cameraListLoader.GetCameraWithId("camera_short_name_or_group_name")) } , category: "Hotkeys" }); Note the "77" within the value string is the javascript key code for "m".

Once you load a UI3 instance with a default setting, that UI3 instance will adopt the default value provided such that if you change the default value later it won't affect any UI3 instance that has already loaded the setting before; to work around this you can clear the browser cache. Specifically you need to clear the local storage for the hostname you load UI3 from. Local storage is typically lumped together with "cookies" so if you clear the cookies it should clear the local storage too.

— Reply to this email directly, view it on GitHub, or unsubscribe. You are receiving this because you authored the thread.Message ID: @.***>

bp2008 commented 2 years ago

I would love to see MQTT involved, I could use node-red as the broker and make an entire user screen that can control all the client web interfaces. How hard would that be to add?

I don't think it would be hard, but it would take some time. We just need to figure out what capabilities are needed and define exactly how it will work. I spent a couple hours thinking about it. See this issue: https://github.com/bp2008/ui3/issues/117

bp2008 commented 2 years ago

This is amazing, is it ok if I over-ride the 1-20 "load preset" hotkeys with new ones as well? I would like to just send a number. Thanks!

Yes but you might take a different approach than the above. Just override the BI_Hotkey_PtzPreset method in a ui3-local-overrides.js file.

function BI_Hotkey_PtzPreset(num)
{
    if (num === 1)
    {
    }
}

That is a really good idea. Gives you access to all of PTZ presets 1-40 hotkeys without any complicated code at all.

bp2008 commented 2 years ago

Although if you use PTZ presets normally, you might not want your local overrides script to activate on all systems you use UI3 on. You can do something conditionally based on the existence of a URL parameter. UI3 has a bit of utility to easily retrieve URL parameter values. In your local overrides script you could do

if (UrlParameters.Get("paramname") === "1")
{
// do things
}

and in the URL on specific devices, add parameter &paramname=1

jaygrovr commented 2 years ago

Can i just set those presets to not work? like unassign them? Also how can I hide the panel that is always visible (showing the profile, schedule, current group, streaming quality) and stats? Jason On Wednesday, June 15, 2022, 03:42:32 PM PDT, bp2008 @.***> wrote:

Although if you use PTZ presets normally, you might not want your local overrides script to activate on all systems you use UI3 on. You can do something conditionally based on the existence of a URL parameter. UI3 has a bit of utility to easily retrieve URL parameter values. In your local overrides script you could do if (UrlParameters.Get("paramname") === "1") { // do things } and in the URL on specific devices, add parameter &paramname=1

— Reply to this email directly, view it on GitHub, or unsubscribe. You are receiving this because you authored the thread.Message ID: @.***>

bp2008 commented 2 years ago

You can unassign presets within Blue Iris camera properties > PTZ/Control > Edit presets. If you clear the Name/value field I believe that will neuter BI's ability to load/set the preset.

You can hide that side bar by maximizing the video player. There's a hotkey for this, CTRL + ~, and you can also enable a button that will be down next to the full screen button.

image