From 923f929d4ac8deacca65c0d6ee18d990a5a64702 Mon Sep 17 00:00:00 2001 From: Eric Handtke Date: Mon, 19 May 2025 15:01:00 +0200 Subject: [PATCH 1/3] added open(...) article. --- docs/docs/advanced/open.md | 23 +++++++++++++++++++++++ 1 file changed, 23 insertions(+) create mode 100644 docs/docs/advanced/open.md diff --git a/docs/docs/advanced/open.md b/docs/docs/advanced/open.md new file mode 100644 index 000000000..a4dfb1f27 --- /dev/null +++ b/docs/docs/advanced/open.md @@ -0,0 +1,23 @@ +--- +title: Opening URLs +--- + +The Page utility class comes with a few options to open URL's. + +The `Page.getCurrent().open(...)` method is used to programmatically open a new browser window or tab with a specified URL. + +## `open(...)` + +Opens the provided URL in a new window or tab. It's possible to supply both the window name and a string with parameters like height, +position, or window type. + +```java +Page.getCurrent().open("https://example.com"); + +Page.getCurrent().open("https://example.com", "self"); + +Page.getCurrent().open("https://webforj.com/", "webforJ", + "popup,left=100,top=100,width=600,height=600"); +``` + +These features match those available in standard [window.open()](https://developer.mozilla.org/en-US/docs/Web/API/Window/open) behavior in browsers. From dfe73e86d553312bff48e7f4df8a5b7037d9cc01 Mon Sep 17 00:00:00 2001 From: Eric Handtke Date: Mon, 19 May 2025 15:27:18 +0200 Subject: [PATCH 2/3] added htlm listener section to events. --- docs/docs/advanced/open.md | 1 + docs/docs/building-ui/events.md | 26 +++++++++++++++++++++++--- 2 files changed, 24 insertions(+), 3 deletions(-) diff --git a/docs/docs/advanced/open.md b/docs/docs/advanced/open.md index a4dfb1f27..7a34d7044 100644 --- a/docs/docs/advanced/open.md +++ b/docs/docs/advanced/open.md @@ -1,5 +1,6 @@ --- title: Opening URLs +sidebar_class_name: new-content --- The Page utility class comes with a few options to open URL's. diff --git a/docs/docs/building-ui/events.md b/docs/docs/building-ui/events.md index fe68bb9df..67f1f3496 100644 --- a/docs/docs/building-ui/events.md +++ b/docs/docs/building-ui/events.md @@ -3,6 +3,7 @@ sidebar_position: 10 title: Events slug: events draft: false +sidebar_class_name: updated-content --- @@ -63,9 +64,9 @@ listenerRegistration.remove(); ## Using event payload -It's important to note that events often come with a payload, which contains additional information related to the event. You can efficiently utilize this payload within the event handler to access relevant data without making unnecessary round trips between the client and server. By doing so, you can improve the performance of your application. +It's important to note that events often come with a payload, which contains additional information related to the event. You can efficiently utilize this payload within the event handler to access relevant data without making unnecessary round trips between the client and server. By doing so, you can improve the performance of your app. -The following code snippet queries the component to get information that, for our demonstration's purposes, is already included in the event payload, representing inefficient code: +The following code snippet queries the component to get information that, for the demonstration's purposes, is already included in the event payload, representing inefficient code: ```java myComponent.addEventListener(e -> { @@ -102,4 +103,23 @@ javaE='https://raw.githubusercontent.com/webforj/webforj-documentation/refs/head height='100px' /> - \ No newline at end of file + + +### Page-level event registration + +In addition to attaching event listeners to specific UI components, the Page utility class itself supports global HTML event registration. This enables use cases where an event should be captured across the entire page, without requiring a specific element reference. + +For example, the following registers a page-wide click event listener that logs the cursor position on click: + +```java +PageEventOptions options = new PageEventOptions(); +options.addData("clientX", "event.clientX"); +options.addData("clientY", "event.clientY"); + +Page.getCurrent().addEventListener("click", event -> { + int x = (int) event.getData().get("clientX"); + int y = (int) event.getData().get("clientY"); + + console().log("Clicked at x: " + x + ", y: " + y); +}, options); +``` From 57a76ee2b571e3d172856a954729ddd453867b11 Mon Sep 17 00:00:00 2001 From: Eric Handtke Date: Mon, 19 May 2025 16:23:28 +0200 Subject: [PATCH 3/3] added onunload section in basiscs for cleanup. --- docs/docs/introduction/basics.md | 26 +++++++++++++++++++++++--- 1 file changed, 23 insertions(+), 3 deletions(-) diff --git a/docs/docs/introduction/basics.md b/docs/docs/introduction/basics.md index 7922a056a..24edb7fb3 100644 --- a/docs/docs/introduction/basics.md +++ b/docs/docs/introduction/basics.md @@ -30,9 +30,9 @@ With `Application.java` set up, the app is now configured with a title and route ### Discovering an `App` A single App limit is enforced in webforJ, which shifts all error handling responsibilities to the Java side and gives developers full control over error management. - + During the webforJ bootstrap process, all classes that extend com.webforj.App are scanned. If multiple apps are found, the system looks for the com.webforj.annotation.AppEntry annotation. If any of the discovered classes are annotated with @AppEntry, the first one encountered is considered the entry point. - + - If a class is annotated with `@AppEntry`, that class is selected as the entry point. - If multiple classes are annotated with `@AppEntry`, an exception is thrown, listing all the discovered classes. - If no class is annotated and only one subclass of `App` is found, that class is selected as the entry point. @@ -146,4 +146,24 @@ Finally, the hello text field and btn button are added to the [`FlexLayout`](../ The `styles.css` file provides custom styling for your webforJ app. This CSS file is referenced in the Application class using the [`@StyleSheet`](../managing-resources/importing-assets#importing-css-files) annotation, which allows the app to apply styles to components within the app. -This file is located in the `resources/static` directory of the project, and can be referenced using the web server URL `ws://app.css`. \ No newline at end of file +This file is located in the `resources/static` directory of the project, and can be referenced using the web server URL `ws://app.css`. + +## Cleanup + +The Page class provides an `onUnload()` method that allows you to register a listener for when the browser is unloading the page. This can be useful for cleanup tasks such as logging, releasing resources, or tracking session activity. + +This event is triggered when the user: + +* Closes the browser tab or window +* Refreshes the page +* Navigates to a different URL + +### Example + +```java +Page.getCurrent().onUnload(event -> { + System.out.println("Page is unloading, webforj is shutting down"); +}); +``` + +This listener is registered using `addUnloadListener()` and returns a `ListenerRegistration` that can be used to remove the listener later if needed.