Extend your application Lifecycle by adding new web functionalities

Extend web functionalities

In this quick article, we will explain to you how to add new features and functionalities by applying Webcomponents to your existing Thinfinity VirtualUI web application.

Web components are a set of web frameworks that allow you to create new custom, reusable and encapsulated HTML tags to use in web pages or, in this case, inside your Thinfinity VirtualUI web application. This web component can be used with any JavaScript library or framework that works with HTML such as Angular, React and many others, this is only possible since modern browsers understand and interact with them seamlessly.

Screenshot example

With this being said, now is clear why one of the great things about Web components is that they can easily be used in existing applications without requiring you to re-architect the application. It also gives you many more options when it comes to high-quality UI components at your disposal.

Also, web components can be used and reused in order to interact with an existing framework or application, and this will be one of the use cases we’ll cover today.

Basically, a component of your existing framework is able to interact with the web component through its properties, attributes and public methods.

In the example we are about to see, the data flow is coming from the parent (component of the apps framework) to its child (Web component) and then the same thing happens vice versa, where the Data flow is now coming from the child (Webcomponent) to its parent (Application Framework)

As a result, a web component contained inside an application framework, is able to interact and communicate with it through standard events, meaning the web component will communicate with the application framework upwards using DOM.

To showcase this particular interaction, we created a small VB6 application where we are interacting between the Application Framework to the Webcomponent and vice versa:

Screenshot example

This type of interaction is called event-driven architecture, also called EDA and is the key to how current web applications work. In our github repository you can find this particular example: https://github.com/cybelesoft/virtualui/tree/master/WebComponents/demos/WebComponents-VB6/Vb6Wc1 

Another good example, can be implementing jQuery libraries using our jSRO (Javascript Remote Objects) integration.

You can find more information about this, on this article:

https://www.cybelesoft.com/blog/windows-and-web-integration-through-thinfinity-jsro-javascript-remote-objects-introduction/ ).

In this quick VB6 demo, we are using jQuery and jsRO to deliver the web component. Here we are simply exposing a textbox from the native web app and sending it back to the browser in HTML. Eventually, you could expose the content of a website or another web application like Google Maps or any other.

Screenshot example

You can find this demo in our github repository here :


Now, in the following example, we’ll discover one of the methods to display a web browser inside your VirtualUI application.

Here we created a simple form and placed a browser inside of it.

Screenshot example

As you can see, we are now able to browse any webpage inside your Thinfinity VirtualUI web based application without leaving Thinfinity’s tab and your application.

As you can imagine, this use-case it’s quite useful when you are trying to get access not only to external webs outside the Thinfinity VirtualUI network, but now, you can access internal web resources on a private network, and you can browse your resources in a secure way. You can find this demo in our GitHub repository here: https://github.com/cybelesoft/virtualui/tree/master/WebComponents/demos/vui-webbrowser

In an upcoming tutorial, we’ll show you how to integrate the well-known Dojo Toolkit with Thinfinity VirtualUI applications.

We hope you enjoyed this tutorial and if you have any questions feel free to contact us at [email protected]


If you have any questions, please email us at [email protected].



Comments (4)

Is it possible to instruct the browser to open a website in another tab and set focus to it?

We also noticed that you asked in our site regarding instructing the browser to open sites on other tabs and set focus.There’s a function you can call to set this on your side which is OpenLinkDlg() 

Here’s a help link you can refer to regarding this: https://files.cybelesoft.com/manuals/thinfinity/virtualui_v25/index.html?00393.html

how much memory each client consumes accessing my application on the server with thinfinity vui

Dear Nelson,

Regarding the memory allocation, it is entirely dependent on the app itself, VirtualUI is transparent to that.

We can assist you to webify your app in minutes, so you can run a deep evaluation during 30 days.

Request a custom demo HERE. No commitment!

Best regards,

Leave a comment

Privacy Preferences
This website uses cookies to improve your experience while you navigate through the website. Out of these, the cookies that are categorized as necessary are stored on your browser as they are essential for the working of basic functionalities of the website. We also use third-party cookies that help us analyze and understand how you use this website. These cookies will be stored in your browser only with your consent. You also have the option to opt-out of these cookies. But opting out of some of these cookies may affect your browsing experience.