BLUI Open Source HTML5/JS/CSS HUD/UI

[QUOTE=Aricwithana;571039]
For non-functional issues, the only one I have is the transparency halo issue on border radius elements that I posted about above.

Do you have a sample file or a sample URL that I can test with?

I will look in to the other issues/frustrations you have mentioned and see if I can assist you there.

[QUOTE=;571042]
Do you have a sample file or a sample URL that I can test with?

I will look in to the other issues/frustrations you have mentioned and see if I can assist you there.

Just take any div, add a background color and a border radius. It happens no matter what html is loaded.

Yea for the other parts, no worries. I just think Iā€™m using things differently than most people. To get the webview responsive I had to create a little node flow with the event tick to check the sizing and if different, updates the sizing when the window is resized. Since the webview wasnā€™t responsive out of the box Iā€™m just using it outside the original intent by making the webview render fullscreen and thus the UMG widget is filling the whole area.

Other than that, everything works great. WIth that line of code updated so the plugin would compile for the newer unreal, the newer nodes from are very nice. I guess there is one thing that isnā€™t an issue, we just wrote our own node so that the js/blueprint communication is a little more standard to other similar projects like cefpython/cordova/etcā€¦ It isnā€™t a perfect solution but it got us close enough.

Well I thought they were working but anyone else having issues with keyboard events? Maybe I just didnā€™t test when I thought I did but it seems that with the more recent updates the mouse events work great but keyboard input nada. The display widget is in focus, can fully interact with any rendered html (ui or website) with the mouse just no keyboard events, even typing in a text box.

Any thoughts? Is it just me and Iā€™m missing something obvious I had worked through before?

Are there any updates on the update?

Just started a new project and am new to Unreal and BLUI. I am using Unreal Engine 10. Have some proof of concepts working when compiling for Windows, but having issues when cross compiling a project from Windows to Linux. I see that a url is loaded from the console output, but when the demo game I made loads the ExampleHUD does not fully render and there is a discoloration in the shape of a grid on the screen. I will try and get a screenshot, but just wondering if anyone else has seen anything like this or has gotten cross compilation from windows to linux working with BLUI installed in a project.

[QUOTE=Aricwithana;578228]
Well I thought they were working but anyone else having issues with keyboard events? Maybe I just didnā€™t test when I thought I did but it seems that with the more recent updates the mouse events work great but keyboard input nada. The display widget is in focus, can fully interact with any rendered html (ui or website) with the mouse just no keyboard events, even typing in a text box.

Any thoughts? Is it just me and Iā€™m missing something obvious I had worked through before?

I updated my project to UE 4.12 and my keyboard events also stopped working. I did not change anything related to BLUI.

edit: fixed, solution in post 511

Weā€™ve been having a project specific issue in UE 4.12.5. Blank Projects with BLUI are compiling fine, but if we attempt to compile our project with BLUI, VaRest, and SQLite3UE4 plugins, we get the error *ā€œThe game module ā€˜ProjectNameā€™ could not be loaded. There may be an operating system error or the module may not be properly set up.ā€ *

Itā€™s worth noting we are also building two separate modules- ā€˜ProjectNameā€™ as the primary module and ā€˜ProjectNameBackendā€™ as a dedicated server only module.

[QUOTE=;571036]
At the moment I see the maintenance of the plugin happening in three different legs:

1). Releasing new Binaries for new versions of the Unreal Engine that are released.

2). Releasing new Binaries for new versions of the CEF that are released.

3). Providing Bug Fixes and New Features to the plugin.

The first two will be automated in the long run with me providing overview ā€¦ the third one is more complex as right now I think the plugin is pretty feature rich and not much needs to be added ā€¦ however if there are features you would like to see added ā€¦ lets list them here and I will see what I can do.

Please remember that I am still getting to grips with the plugin and CEF, so you will all have to be patient with me. 8-}

Any progress at all? Things are to the point to where Iā€™m wondering if trying to use HTML as a HUD or more is fruitless unless I had the $3.5k to afford Coherent UI. After integrating the trial plugin from them, Blui has a long, long way to go. From the quality and responsiveness of the render to the automatic mouse and keyboard handling with alpha transparency. The only thing better at the moment is that Blui has the nodes. Seems that the best that Blui can be utilized for is a Steam like overlay.

[QUOTE=Aricwithana;594764]
Any progress at all? Things are to the point to where Iā€™m wondering if trying to use HTML as a HUD or more is fruitless unless I had the $3.5k to afford Coherent UI. After integrating the trial plugin from them, Blui has a long, long way to go. From the quality and responsiveness of the render to the automatic mouse and keyboard handling with alpha transparency. The only thing better at the moment is that Blui has the nodes. Seems that the best that Blui can be utilized for is a Steam like overlay.

Unfortunately there is no progress here. I canā€™t even get the plugin to build with the scripts that were provided to me and the instructions provided werenā€™t very clear at all. Every time I try to do a build it takes upwards of 2 hours and then fails at the end ā€¦ I try to tweak a few things ā€¦try the build again and it fails.

I will gladly defer to anyone who can try to build BLUI themselves but I am afraid to say the CoherentUI seems to be the only alternative now ā€¦ or we have to work together to modify the current UE4 HTML Widget to provide us with the key events we need.

I have been looking at ways of using the UE4 HTML Widget, which is also based on CEF, and have come up with a novel event system but it is not elegant.

[QUOTE=;594947]
Unfortunately there is no progress here. I canā€™t even get the plugin to build with the scripts that were provided to me and the instructions provided werenā€™t very clear at all. Every time I try to do a build it takes upwards of 2 hours and then fails at the end ā€¦ I try to tweak a few things ā€¦try the build again and it fails.

I will gladly defer to anyone who can try to build BLUI themselves but I am afraid to say the CoherentUI seems to be the only alternative now ā€¦ or we have to work together to modify the current UE4 HTML Widget to provide us with the key events we need.

I have been looking at ways of using the UE4 HTML Widget, which is also based on CEF, and have come up with a novel event system but it is not elegant.

No worries, that was what I was guessing would come about, lol. I wish I could help but my skills sit within the webview than outside it. If key events would work, things would be acceptable enough just not production quality but it is the only ways to get our specific UI to come about.

Ohh nice! I wonder if the events issue is possibly the difference between using a umg widget like Blui vs the slate element like the Unreal webview uses, same with Coherent. Maybe Blui could be swapped to use them instead?

Managed to fix my keyboard events in 4.12!
Apparently some focus-related setting is no longer enabled by default in 4.12 and you have to enable it manually.

Hereā€™s how I fixed it when using the ExampleHUD asset:

  1. Open the asset.
  2. Select Designer mode from the top right.
  3. In the Hierarchy pane, select ExampleHUD.
  4. In the Details pane, tick the box ā€œInteraction -> Is Focusableā€.

Now my BLUI browser actually gets some keyboard events after I focus it by clicking once.

[QUOTE=;594947]
Unfortunately there is no progress here. I canā€™t even get the plugin to build with the scripts that were provided to me and the instructions provided werenā€™t very clear at all. Every time I try to do a build it takes upwards of 2 hours and then fails at the end ā€¦ I try to tweak a few things ā€¦try the build again and it fails.

I will gladly defer to anyone who can try to build BLUI themselves but I am afraid to say the CoherentUI seems to be the only alternative now ā€¦ or we have to work together to modify the current UE4 HTML Widget to provide us with the key events we need.

I have been looking at ways of using the UE4 HTML Widget, which is also based on CEF, and have come up with a novel event system but it is not elegant.

Unfortunately thatā€™s basically how it goes when building Chromium from source, (I had that experience for over two weeks straight when first doing this) and itā€™s one of the reasons I donā€™t have the time to build new releases of CEF3 anymore. College has to take some priority, I appologize for not replying to anyone lately
If you post whatever errors your getting I may be able to point you in the right direction.

[QUOTE=Sami Vuorela;596397]
Managed to fix my keyboard events in 4.12!
Apparently some focus-related setting is no longer enabled by default in 4.12 and you have to enable it manually.

Hereā€™s how I fixed it when using the ExampleHUD asset:

  1. Open the asset.
  2. Select Designer mode from the top right.
  3. In the Hierarchy pane, select ExampleHUD.
  4. In the Details pane, tick the box ā€œInteraction -> Is Focusableā€.

Now my BLUI browser actually gets some keyboard events after I focus it by clicking once.

Perfect!! This worked and keys are now firing. Thanks for noticing!

[QUOTE=;596415]
Unfortunately thatā€™s basically how it goes when building Chromium from source, (I had that experience for over two weeks straight when first doing this) and itā€™s one of the reasons I donā€™t have the time to build new releases of CEF3 anymore. College has to take some priority, I appologize for not replying to anyone lately
If you post whatever errors your getting I may be able to point you in the right direction.

Maybe, atm, instead of continual updates, a specific version needs to utilized and only updated when necessary? Some of the CEF really needs to be edited and tweaked for performance and more so just being able to pull straight from CEF might not be something that Blui should aspire to for performance.

is it possible to use webrtc or any web based voice/video chatting using this plugin?

Hi This Plugin Work In Last Version 4.13 Im trying and receive various errorsā€¦

Has anyone experimented with using the transparent area of CEF as a click-through event?

[QUOTE=Dodgin;613566]
Has anyone experimented with using the transparent area of CEF as a click-through event?

I have been looking at this myself. The only solution I came up with was forcing the input to UI only on start, then in Javascript you capture a mouse down event and call a blu_event() when clicking on <body> which calls a C++ function that switches the input to game only and then trigger your gameā€™s mouse down event. You switch back to UI only input once youā€™re done with input.

Iā€™m fairly sure thereā€™s a better way around this, for instance: Switch input to game and UI, grab the zbuffer off the BLUI material, test against that and pass the click event to the game if the pixel clicked is transparent.

EDIT: It seems the overly priced Coherent UI has transparent click through implemented by default and they seem to be using the transparency method I wrote about above. Itā€™s about half way down the page. Search for ā€œinput on transparentā€.

As described by the documentation they have a canvas over both BLUI and game, this captures mouse events, tests the pixel under the cursor for transparency in BLUI (I assume it checks raw pixels from the material, like this). If itā€™s transparent then it passes the input to the game, if the pixelā€™s opacity above a certain threshold then it passes the input to the BLUI instance.

I will definitely be looking into this in the next few days if I decide to stick with BLUI and will post my results here.

[QUOTE=Zinglish;614771]
I have been looking at this myself. The only solution I came up with was forcing the input to UI only on start, then in Javascript you capture a mouse down event and call a blu_event() when clicking on <body> which calls a C++ function that switches the input to game only and then trigger your gameā€™s mouse down event. You switch back to UI only input once youā€™re done with input.

Iā€™m fairly sure thereā€™s a better way around this, for instance: Switch input to game and UI, grab the zbuffer off the BLUI material, test against that and pass the click event to the game if the pixel clicked is transparent.

EDIT: It seems the overly priced Coherent UI has transparent click through implemented by default and they seem to be using the transparency method I wrote about above. Itā€™s about half way down the page. Search for ā€œinput on transparentā€.

As described by the documentation they have a canvas over both BLUI and game, this captures mouse events, tests the pixel under the cursor for transparency in BLUI (I assume it checks raw pixels from the material, like this). If itā€™s transparent then it passes the input to the game, if the pixelā€™s opacity above a certain threshold then it passes the input to the BLUI instance.

I will definitely be looking into this in the next few days if I decide to stick with BLUI and will post my results here.

Iā€™ve been meddling with having CEF just test for DOM element body in the click event. Essentially if you clicked the body, you didnā€™t click an element, and it should pass through.

@Zinglish, Iā€™ve got it running pretty smoothly using a communication that updates on mousemove, since that has to be forwarded to CEF anyways. Sure beats temporarily freezing the render buffer and causing crashes.

Anywho - Iā€™ve got my gameā€™s UI set up on a single CEF overlay, and then a few dynamic spool-ups for 3D uis. If anyone is curious how to do I can explain further.

[QUOTE=Dodgin;616904]
@Zinglish, Iā€™ve got it running pretty smoothly using a communication that updates on mousemove, since that has to be forwarded to CEF anyways. Sure beats temporarily freezing the render buffer and causing crashes.

Anywho - Iā€™ve got my gameā€™s UI set up on a single CEF overlay, and then a few dynamic spool-ups for 3D uis. If anyone is curious how to do I can explain further.

I ended up moving over to UMG / Slate since CEF ended up being complete overkill. Can I ask why you are choosing a CEF UI over UMG?

I found that the things I could do in UMG were pretty close to or better than any HTML, CSS and JS I could have made, not to mention UMG was quicker development time, less fiddly and less resource hungry than BLUI. I am having a hard time thinking about reasons I actually need CEF in my UI now.