├── .github
└── workflows
│ ├── deno.yml
│ └── publish-jsr.yml
├── .gitignore
├── LICENSE
├── README.md
├── bootstrap.bat
├── bootstrap.sh
├── deno.json
├── deps.ts
├── examples
├── custom_file_handler
│ ├── assets
│ │ ├── test_app.js
│ │ └── webui.jpeg
│ ├── custom_file_handler.ts
│ └── index.html
├── custom_web_server
│ ├── custom_web_server.ts
│ ├── index.html
│ ├── second.html
│ └── simple_web_server.py
├── hello_world
│ └── hello_world.ts
└── send_raw_binary
│ ├── send_raw_binary.ts
│ └── webui.jpeg
├── img
├── cppcon_2019.png
├── screenshot.png
├── webui.png
├── webui_deno_example.png
└── webui_diagram.png
├── mod.ts
└── src
├── bootstrap.bat
├── bootstrap.sh
├── lib.ts
├── types.ts
├── utils.ts
└── webui.ts
/.github/workflows/deno.yml:
--------------------------------------------------------------------------------
1 | name: Deno
2 |
3 | on:
4 | push:
5 | branches: ["main"]
6 | pull_request:
7 | branches: ["main"]
8 |
9 | permissions:
10 | contents: read
11 |
12 | jobs:
13 | test:
14 | runs-on: ${{ matrix.os }}
15 | strategy:
16 | matrix:
17 | os: [ubuntu-latest, macOS-latest, windows-latest]
18 |
19 | steps:
20 | - name: Setup repo
21 | uses: actions/checkout@v4
22 |
23 | - name: Setup Rust
24 | uses: dtolnay/rust-toolchain@master
25 | with:
26 | toolchain: 1.85.0 # Specify minimum Rust version that supports 2024 edition
27 |
28 | - name: Setup Deno
29 | uses: denoland/setup-deno@v2
30 |
31 | - name: Verify formatting
32 | if: runner.os == 'Linux'
33 | run: deno fmt --check
34 |
35 | - name: Run linter
36 | if: runner.os == 'Linux'
37 | run: deno lint
38 |
39 | - name: Run doc linter
40 | if: runner.os == 'Linux'
41 | run: deno doc --lint mod.ts
42 |
43 | - name: Run type checker
44 | if: runner.os == 'Linux'
45 | run: deno check .
46 |
--------------------------------------------------------------------------------
/.github/workflows/publish-jsr.yml:
--------------------------------------------------------------------------------
1 | name: Publish
2 |
3 | on:
4 | release:
5 | types: [published]
6 |
7 | jobs:
8 | publish:
9 | runs-on: ubuntu-latest
10 |
11 | permissions:
12 | contents: read
13 | id-token: write
14 |
15 | steps:
16 | - uses: actions/checkout@v4
17 |
18 | - name: Publish package
19 | run: npx jsr publish
20 |
--------------------------------------------------------------------------------
/.gitignore:
--------------------------------------------------------------------------------
1 | # Deno binaries
2 | src/webui-windows-msvc-x64/
3 | src/webui-windows-msvc-arm/
4 | src/webui-windows-msvc-arm64/
5 | src/webui-macos-clang-x64/
6 | src/webui-macos-clang-arm/
7 | src/webui-macos-clang-arm64/
8 | src/webui-linux-gcc-x64/
9 | src/webui-linux-gcc-arm/
10 | src/webui-linux-gcc-arm64/
11 | *.dll
12 | *.so
13 | *.dylib
14 |
15 | # Archives
16 | *.zip
17 | *.tar
18 | *.gz
19 |
20 | # Build
21 | *.exe
22 | *.ilk
23 | *.pdb
24 | *.exp
25 | *.res
26 | *.out
27 | *.def
28 | *.obj
29 | *.iobj
30 | *.o
31 |
32 | # Logs
33 | *.log
34 | *.logs
35 | *.tlog
36 |
37 | # IDE
38 | .vscode/
39 | .vs/
40 | .zed/
41 |
42 | # Visual Studio
43 | .idea/
44 | *.recipe
45 | *.idb
46 |
47 | # Visual Studio for Mac
48 | .idea/
49 |
50 | # Visual Studio cache files
51 | ipch/
52 | *.dbmdl
53 | *.dbproj.schemaview
54 |
55 | # Others
56 | .builds
57 | *~*
58 | *.cache
59 | *.swp
60 | *.bak
61 | *.tmp
62 | *.swp
63 | *.userosscache
64 | *.err
65 | *.vspscc
66 | *.vssscc
67 | *.pidb
68 | *.svclog
69 | *.scc
70 |
71 | # NuGet
72 | packages/
73 | !packages/repositories.config
74 | *.nupkg
75 |
76 | # Microsoft Azure Build Output
77 | csx/
78 | *.build.csdef
79 |
80 | # User-specific files
81 | *.suo
82 | *.user
83 | *.userprefs
84 | *.sln.docstates
85 |
86 | # Python
87 | __pycache__/
88 | dist/
89 | webui2.egg-info/
90 |
91 | # Rust
92 | target/
93 | *.lock
94 |
95 | # Broken NTFS
96 | nul
97 |
98 | # Zig
99 | zig-cache/
100 | zig-out/
101 |
102 | # macOS
103 | .DS_Store
104 | .DS_Store?
105 | ._*
106 | .Spotlight-V100
107 | .Trashes
108 | ehthumbs.db
109 | Thumbs.db
110 |
111 | # User-specific private settings
112 | *.DotSettings.user
113 |
--------------------------------------------------------------------------------
/LICENSE:
--------------------------------------------------------------------------------
1 | MIT License
2 |
3 | Copyright (c) 2025 Hassan Draga
4 |
5 | Permission is hereby granted, free of charge, to any person obtaining a copy
6 | of this software and associated documentation files (the "Software"), to deal
7 | in the Software without restriction, including without limitation the rights
8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
9 | copies of the Software, and to permit persons to whom the Software is
10 | furnished to do so, subject to the following conditions:
11 |
12 | The above copyright notice and this permission notice shall be included in all
13 | copies or substantial portions of the Software.
14 |
15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
21 | SOFTWARE.
22 |
--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
1 |
2 |
3 | 
4 |
5 | # Deno-WebUI v2.5.8 (Beta)
6 |
7 | [last-commit]: https://img.shields.io/github/last-commit/webui-dev/webui?style=for-the-badge&logo=github&logoColor=C0CAF5&labelColor=414868
8 | [release-version]: https://img.shields.io/github/v/tag/webui-dev/webui?style=for-the-badge&logo=webtrees&logoColor=C0CAF5&labelColor=414868&color=7664C6
9 | [license]: https://img.shields.io/github/license/webui-dev/webui?style=for-the-badge&logo=opensourcehardware&label=License&logoColor=C0CAF5&labelColor=414868&color=8c73cc
10 |
11 | [![][last-commit]](https://github.com/webui-dev/deno-webui/pulse)
12 | [![][release-version]](https://github.com/webui-dev/deno-webui/releases/latest)
13 | [![][license]](https://github.com/webui-dev/deno-webui/blob/main/LICENSE)
14 |
15 | > Use any web browser or WebView as GUI, with your preferred language in the
16 | > backend and modern web technologies in the frontend, all in a lightweight
17 | > portable library.
18 |
19 | 
20 |
21 |
22 |
23 | ## Download
24 |
25 | - [Latest Stable Release](https://github.com/webui-dev/deno-webui/releases)
26 |
27 | ## Features
28 |
29 | - Portable (_Needs only a web browser or a WebView at runtime_)
30 | - Lightweight (_Few Kb library_) & Small memory footprint
31 | - Fast binary communication protocol
32 | - Multi-platform & Multi-Browser
33 | - Using private profile for safety
34 | - Cross-platform WebView
35 |
36 | ## Screenshot
37 |
38 | This
39 | [hello world example](https://github.com/webui-dev/deno-webui/tree/main/examples/hello_world)
40 | is written in Deno using WebUI as the GUI library.
41 |
42 | 
43 |
44 | ## Installation
45 |
46 | Specific version:
47 |
48 | ```js
49 | import { WebUI } from "jsr:@webui/deno-webui@2.5.8";
50 | // Or
51 | import { WebUI } from "https://deno.land/x/webui@2.5.8/mod.ts";
52 | ```
53 |
54 | Latest version:
55 |
56 | ```js
57 | import { WebUI } from "jsr:@webui/deno-webui";
58 | // Or
59 | import { WebUI } from "https://deno.land/x/webui/mod.ts";
60 | ```
61 |
62 | ## Minimal Example
63 |
64 | ```js
65 | import { WebUI } from "jsr:@webui/deno-webui";
66 |
67 | const myWindow = new WebUI();
68 | await myWindow.show(
69 | ' Hello World! ',
70 | );
71 | await WebUI.wait();
72 | ```
73 |
74 | ```sh
75 | deno run --allow-read --allow-write --allow-net --allow-env --allow-ffi minimal.ts
76 | ```
77 |
78 | [More examples](https://github.com/webui-dev/deno-webui/tree/main/examples)
79 |
80 | ## Documentation
81 |
82 | - [Online Documentation](https://webui.me/docs/2.5/#/)
83 |
84 | ## CppCon 2019 Presentation
85 |
86 | [Borislav Stanimirov](https://ibob.bg/) explained at
87 | [C++ Conference 2019 (_YouTube_)](https://www.youtube.com/watch?v=bbbcZd4cuxg)
88 | how beneficial it is to use the web browser as GUI.
89 |
90 |
93 |
94 | 
95 |
96 | ## UI & The Web Technologies
97 |
98 | Web application UI design is not just about how a product looks but how it
99 | works. Using web technologies in your UI makes your product modern and
100 | professional, And a well-designed web application will help you make a solid
101 | first impression on potential customers. Great web application design also
102 | assists you in nurturing leads and increasing conversions. In addition, it makes
103 | navigating and using your web app easier for your users.
104 |
105 | ## Why Use Web Browser?
106 |
107 | Today's web browsers have everything a modern UI needs. Web browsers are very
108 | sophisticated and optimized. Therefore, using it as a GUI will be an excellent
109 | choice. While old legacy GUI lib is complex and outdated, a WebView-based app is
110 | still an option. However, a WebView needs a huge SDK to build and many
111 | dependencies to run, and it can only provide some features like a real web
112 | browser. That is why WebUI uses real web browsers to give you full features of
113 | comprehensive web technologies while keeping your software lightweight and
114 | portable.
115 |
116 | ## How does it work?
117 |
118 | 
119 |
120 | Think of WebUI like a WebView controller, but instead of embedding the WebView
121 | controller in your program, which makes the final program big in size, and
122 | non-portable as it needs the WebView runtimes. Instead, by using WebUI, you use
123 | a tiny static/dynamic library to run any installed web browser and use it as
124 | GUI, which makes your program small, fast, and portable. **All it needs is a web
125 | browser**.
126 |
127 | ## Runtime Dependencies Comparison
128 |
129 | | | Tauri / WebView | Qt | WebUI |
130 | | ------------------------------- | ----------------- | -------------------------- | ------------------- |
131 | | Runtime Dependencies on Windows | _WebView2_ | _QtCore, QtGui, QtWidgets_ | **_A Web Browser_** |
132 | | Runtime Dependencies on Linux | _GTK3, WebKitGTK_ | _QtCore, QtGui, QtWidgets_ | **_A Web Browser_** |
133 | | Runtime Dependencies on macOS | _Cocoa, WebKit_ | _QtCore, QtGui, QtWidgets_ | **_A Web Browser_** |
134 |
135 | ## Supported Web Browsers
136 |
137 | | Browser | Windows | macOS | Linux |
138 | | --------------- | --------------- | ------------- | --------------- |
139 | | Mozilla Firefox | ✔️ | ✔️ | ✔️ |
140 | | Google Chrome | ✔️ | ✔️ | ✔️ |
141 | | Microsoft Edge | ✔️ | ✔️ | ✔️ |
142 | | Chromium | ✔️ | ✔️ | ✔️ |
143 | | Yandex | ✔️ | ✔️ | ✔️ |
144 | | Brave | ✔️ | ✔️ | ✔️ |
145 | | Vivaldi | ✔️ | ✔️ | ✔️ |
146 | | Epic | ✔️ | ✔️ | _not available_ |
147 | | Apple Safari | _not available_ | _coming soon_ | _not available_ |
148 | | Opera | _coming soon_ | _coming soon_ | _coming soon_ |
149 |
150 | ## Supported Languages
151 |
152 | | Language | v2.4.0 API | v2.5.0 API | Link |
153 | | -------------- | -------------- | -------------- | ----------------------------------------------------------------- |
154 | | Python | ✔️ | _not complete_ | [Python-WebUI](https://github.com/webui-dev/python-webui) |
155 | | Go | ✔️ | _not complete_ | [Go-WebUI](https://github.com/webui-dev/go-webui) |
156 | | Zig | ✔️ | _not complete_ | [Zig-WebUI](https://github.com/webui-dev/zig-webui) |
157 | | Nim | ✔️ | _not complete_ | [Nim-WebUI](https://github.com/webui-dev/nim-webui) |
158 | | V | ✔️ | _not complete_ | [V-WebUI](https://github.com/webui-dev/v-webui) |
159 | | Rust | _not complete_ | _not complete_ | [Rust-WebUI](https://github.com/webui-dev/rust-webui) |
160 | | TS / JS (Deno) | ✔️ | _not complete_ | [Deno-WebUI](https://github.com/webui-dev/deno-webui) |
161 | | TS / JS (Bun) | _not complete_ | _not complete_ | [Bun-WebUI](https://github.com/webui-dev/bun-webui) |
162 | | Swift | _not complete_ | _not complete_ | [Swift-WebUI](https://github.com/webui-dev/swift-webui) |
163 | | Odin | _not complete_ | _not complete_ | [Odin-WebUI](https://github.com/webui-dev/odin-webui) |
164 | | Pascal | _not complete_ | _not complete_ | [Pascal-WebUI](https://github.com/webui-dev/pascal-webui) |
165 | | Purebasic | _not complete_ | _not complete_ | [Purebasic-WebUI](https://github.com/webui-dev/purebasic-webui) |
166 | | - | | | |
167 | | Common Lisp | _not complete_ | _not complete_ | [cl-webui](https://github.com/garlic0x1/cl-webui) |
168 | | Delphi | _not complete_ | _not complete_ | [WebUI4Delphi](https://github.com/salvadordf/WebUI4Delphi) |
169 | | C# | _not complete_ | _not complete_ | [WebUI4CSharp](https://github.com/salvadordf/WebUI4CSharp) |
170 | | WebUI.NET | _not complete_ | _not complete_ | [WebUI.NET](https://github.com/Juff-Ma/WebUI.NET) |
171 | | QuickJS | _not complete_ | _not complete_ | [QuickUI](https://github.com/xland/QuickUI) |
172 | | PHP | _not complete_ | _not complete_ | [PHPWebUiComposer](https://github.com/KingBes/php-webui-composer) |
173 |
174 | ## Supported WebView
175 |
176 | | WebView | Status |
177 | | ----------------- | ------ |
178 | | Windows WebView2 | ✔️ |
179 | | Linux GTK WebView | ✔️ |
180 | | macOS WKWebView | ✔️ |
181 |
182 | ### License
183 |
184 | > Licensed under MIT License.
185 |
186 | ### Stargazers
187 |
188 | [](https://github.com/webui-dev/deno-webui/stargazers)
189 |
--------------------------------------------------------------------------------
/bootstrap.bat:
--------------------------------------------------------------------------------
1 | @echo off
2 | cd src
3 | call bootstrap.bat %*
4 | cd ..
5 |
--------------------------------------------------------------------------------
/bootstrap.sh:
--------------------------------------------------------------------------------
1 | #!/bin/bash
2 | cd src
3 | sh bootstrap.sh "$@"
4 | cd ..
5 |
--------------------------------------------------------------------------------
/deno.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "@webui/deno-webui",
3 | "version": "2.5.8",
4 | "exports": "./mod.ts"
5 | }
6 |
--------------------------------------------------------------------------------
/deps.ts:
--------------------------------------------------------------------------------
1 | // Deno WebUI
2 | // Resolves the path to the required native WebUI library,
3 | // ensuring it is downloaded to a central cache if needed.
4 |
5 | import { ensureWebUiLib } from "./src/utils.ts";
6 |
7 | // Determine the base library filename based
8 | // on the current operating system and architecture.
9 | function getBaseLibName(): string {
10 | let baseName: string;
11 | switch (Deno.build.os) {
12 | case "windows":
13 | baseName = "webui-2.dll";
14 | // Validate architecture for Windows
15 | if (Deno.build.arch !== "x86_64" && Deno.build.arch !== "aarch64") {
16 | throw new Error(
17 | `Unsupported architecture ${Deno.build.arch} for Windows`,
18 | );
19 | }
20 | break;
21 | case "darwin": // macOS
22 | baseName = "libwebui-2.dylib";
23 | // Validate architecture for macOS
24 | if (Deno.build.arch !== "x86_64" && Deno.build.arch !== "aarch64") {
25 | throw new Error(
26 | `Unsupported architecture ${Deno.build.arch} for macOS`,
27 | );
28 | }
29 | break;
30 | default: // Linux and other Unix-like OSes
31 | baseName = "libwebui-2.so";
32 | // Validate architecture for Linux/others
33 | if (Deno.build.arch !== "x86_64" && Deno.build.arch !== "aarch64") {
34 | throw new Error(
35 | `Unsupported architecture ${Deno.build.arch} for ${Deno.build.os}`,
36 | );
37 | }
38 | break;
39 | }
40 | return baseName;
41 | }
42 |
43 | // Determine the required base filename
44 | const baseLibName = getBaseLibName();
45 |
46 | // Ensure the library exists in the cache (downloads if needed)
47 | // and export the resolved path.
48 | // This promise resolves to the final path of the library file.
49 | export const libPath = await ensureWebUiLib(baseLibName);
50 |
51 | // Optional: Export the base name too if needed elsewhere
52 | export { baseLibName };
53 |
--------------------------------------------------------------------------------
/examples/custom_file_handler/assets/test_app.js:
--------------------------------------------------------------------------------
1 | // deno-lint-ignore no-unused-vars
2 | function test_app() {
3 | alert("Hello from test_app.js");
4 | }
5 |
--------------------------------------------------------------------------------
/examples/custom_file_handler/assets/webui.jpeg:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/webui-dev/deno-webui/684554f83d6d791cedd72c50fb10e667b389d3ac/examples/custom_file_handler/assets/webui.jpeg
--------------------------------------------------------------------------------
/examples/custom_file_handler/custom_file_handler.ts:
--------------------------------------------------------------------------------
1 | // To run this script:
2 | // deno run --allow-read --allow-write --allow-net --allow-env --allow-ffi custom_file_handler.ts
3 |
4 | // To import from local (Debugging and Development)
5 | // import { WebUI } from "../../mod.ts";
6 |
7 | // To import from online package registry (Production)
8 | import { WebUI } from "jsr:@webui/deno-webui@2.5.8"; // import {WebUI} from "https://deno.land/x/webui@2.5.8/mod.ts";
9 |
10 | // Return HTTP header + file raw binary content
11 | const getFile = async (
12 | contentType: string,
13 | filename: string,
14 | ): Promise => {
15 | const content = await Deno.readFile(filename);
16 | const header = `HTTP/1.1 200 OK\r\nContent-Type: ${contentType}\r\n\r\n`;
17 | const headerBytes = new TextEncoder().encode(header);
18 | const response = new Uint8Array(headerBytes.length + content.length);
19 | response.set(headerBytes);
20 | response.set(content, headerBytes.length);
21 | return response;
22 | };
23 |
24 | // Set a custom files handler
25 | async function myFileHandler(myUrl: URL) {
26 | console.log(`File: ${myUrl.pathname}`);
27 | // Index example
28 | if (myUrl.pathname === "/index.html" || myUrl.pathname === "/") {
29 | return await getFile("text/html", "index.html");
30 | }
31 | // Custom text string example
32 | if (myUrl.pathname === "/test") {
33 | return "HTTP/1.1 200 OK\r\nContent-Length: 5\r\n\r\nHello";
34 | }
35 | // File examples
36 | if (myUrl.pathname === "/assets/test_app.js") {
37 | return await getFile("application/javascript", "assets/test_app.js");
38 | }
39 | if (myUrl.pathname === "/assets/webui.jpeg") {
40 | return await getFile("image/jpeg", "assets/webui.jpeg");
41 | }
42 | // Error 404 example
43 | return "HTTP/1.1 404 Not Found";
44 | }
45 |
46 | // Create new window
47 | const myWindow = new WebUI();
48 |
49 | // Bind Exit
50 | myWindow.bind("exit", () => {
51 | // Close all windows and exit
52 | WebUI.exit();
53 | });
54 |
55 | // Set files handler
56 | // Note: Should be called before `.show()`
57 | myWindow.setFileHandler(myFileHandler);
58 |
59 | // Show the window
60 | await myWindow.showBrowser("index.html", WebUI.Browser.AnyBrowser);
61 |
62 | // Wait until all windows get closed
63 | await WebUI.wait();
64 |
65 | console.log("Thank you.");
66 |
--------------------------------------------------------------------------------
/examples/custom_file_handler/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 | WebUI 2 - Deno File Handler Example
7 |
8 |
9 |
WebUI 2 - Deno File Handler Example
10 |
11 |
12 |
13 | -
16 |
17 |
18 |
--------------------------------------------------------------------------------
/examples/custom_web_server/custom_web_server.ts:
--------------------------------------------------------------------------------
1 | // To run this script:
2 | // deno run --allow-read --allow-write --allow-net --allow-env --allow-ffi --allow-run=deno custom_web_server.ts
3 |
4 | // To import from local (Debugging and Development)
5 | // import { WebUI } from "../../mod.ts";
6 |
7 | // To import from online package registry (Production)
8 | import { WebUI } from "jsr:@webui/deno-webui@2.5.8"; // import {WebUI} from "https://deno.land/x/webui@2.5.8/mod.ts";
9 |
10 | function allEvents(e: WebUI.Event) {
11 | /*
12 | e.window: WebUI;
13 | e.eventType: WebUI.EventType;
14 | e.element: string;
15 | */
16 | console.log(`\nallEvents: window = '${e.window}'`);
17 | console.log(`allEvents: eventType = '${e.eventType}'`);
18 | console.log(`allEvents: element = '${e.element}'`);
19 | switch (e.eventType) {
20 | case WebUI.EventType.Disconnected:
21 | // Window disconnection event
22 | console.log(`Window closed.`);
23 | break;
24 | case WebUI.EventType.Connected:
25 | // Window connection event
26 | console.log(`Window connected.`);
27 | break;
28 | case WebUI.EventType.MouseClick:
29 | // Mouse click event
30 | console.log(`Mouse click.`);
31 | break;
32 | case WebUI.EventType.Navigation: {
33 | // Window navigation event
34 | const url = e.arg.string(0);
35 | console.log(`Navigation to '${url}'`);
36 | // Because we used `webui_bind(MyWindow, "", events);`
37 | // WebUI will block all `href` link clicks and sent here instead.
38 | // We can then control the behaviour of links as needed.
39 | e.window.navigate(url);
40 | break;
41 | }
42 | case WebUI.EventType.Callback:
43 | // Function call event
44 | console.log(`Function call.`);
45 | break;
46 | }
47 | }
48 |
49 | function myBackendFunc(e: WebUI.Event) {
50 | const a = e.arg.number(0); // First argument
51 | const b = e.arg.number(1); // Second argument
52 | const c = e.arg.number(2); // Third argument
53 | console.log(`\nFirst argument: ${a}`);
54 | console.log(`Second argument: ${b}`);
55 | console.log(`Third argument: ${c}`);
56 | }
57 |
58 | // Create new window
59 | const myWindow = new WebUI();
60 |
61 | // Bind All Events
62 | myWindow.bind("", allEvents);
63 |
64 | // Bind Backend Function
65 | myWindow.bind("myBackendFunc", myBackendFunc);
66 |
67 | // Bind Exit Function
68 | myWindow.bind("exit", () => {
69 | // Close all windows and exit
70 | WebUI.exit();
71 | });
72 |
73 | // Set the web-server/WebSocket port that WebUI should
74 | // use. This means `webui.js` will be available at:
75 | // http://localhost:MY_PORT_NUMBER/webui.js
76 | myWindow.setPort(8081);
77 |
78 | // Start our custom web server using Python script `python simple_web_server.py`.
79 | // Or using `file-server` module.
80 | const webServer = new Deno.Command("deno", {
81 | args: ["-RNS", "jsr:@std/http/file-server", "-p", "8080"],
82 | }).spawn();
83 | await new Promise((r) => setTimeout(r, 500));
84 |
85 | // Show a new window and point to our custom web server
86 | // Assuming the custom web server is running on port
87 | // 8080...
88 | await myWindow.showBrowser("http://localhost:8080/", WebUI.Browser.AnyBrowser);
89 |
90 | // Wait until all windows get closed
91 | await WebUI.wait();
92 |
93 | // Stop the web server
94 | webServer.kill("SIGTERM");
95 | await webServer.status;
96 |
97 | console.log("Thank you.");
98 |
--------------------------------------------------------------------------------
/examples/custom_web_server/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 | WebUI - Custom Web-Server Example (C)
6 |
7 |
8 |
9 |
10 |
Custom Web-Server Example (C)
11 |
12 | This HTML page is handled by a custom Web-Server other than WebUI.
13 | This window is connected to the back-end because we used: