Skip to content

Commit 491320a

Browse files
AlbertShownAlbertShown
committed
Update All C++ Examples To Use Classes
1 parent 25dddeb commit 491320a

File tree

5 files changed

+354
-371
lines changed

5 files changed

+354
-371
lines changed

‎examples/C++/call_cpp_from_js/main.cpp‎

Lines changed: 107 additions & 120 deletions
Original file line numberDiff line numberDiff line change
@@ -1,131 +1,118 @@
11
// Call C++ from JavaScript Example
22

3-
// Include the WebUI header
43
#include "webui.hpp"
5-
6-
// Include C++ STD
74
#include <iostream>
85

9-
void my_function_string(webui::window::event* e) {
10-
11-
// JavaScript:
12-
// my_function_string('Hello', 'World`);
13-
14-
std::string str_1 = e->get_string(); // Or e->get_string(0);
15-
std::string str_2 = e->get_string(1);
16-
17-
std::cout << "my_function_string 1: " << str_1 << std::endl; // Hello
18-
std::cout << "my_function_string 2: " << str_2 << std::endl; // World
19-
}
20-
21-
void my_function_integer(webui::window::event* e) {
22-
23-
// JavaScript:
24-
// my_function_integer(123, 456, 789);
25-
26-
long long number_1 = e->get_int(); // Or e->get_int(0);
27-
long long number_2 = e->get_int(1);
28-
long long number_3 = e->get_int(2);
29-
30-
std::cout << "my_function_integer 1: " << number_1 << std::endl; // 123
31-
std::cout << "my_function_integer 2: " << number_2 << std::endl; // 456
32-
std::cout << "my_function_integer 3: " << number_3 << std::endl; // 789
33-
}
34-
35-
void my_function_boolean(webui::window::event* e) {
36-
37-
// JavaScript:
38-
// my_function_boolean(true, false);
39-
40-
bool status_1 = e->get_bool(); // Or e->get_bool(0);
41-
bool status_2 = e->get_bool(1);
42-
43-
std::cout << "my_function_boolean 1: " << (status_1 ? "True" : "False") << std::endl;
44-
std::cout << "my_function_boolean 2: " << (status_2 ? "True" : "False") << std::endl;
45-
}
46-
47-
void my_function_with_response(webui::window::event* e) {
48-
49-
// JavaScript:
50-
// my_function_with_response(number, 2).then(...)
51-
52-
long long number = e->get_int(0);
53-
long long times = e->get_int(1);
54-
55-
long long res = number * times;
56-
57-
std::cout << "my_function_with_response: " << number << " * " << times << " = " << res << std::endl;
58-
59-
// Send back the response to JavaScript
60-
e->return_int(res);
61-
}
6+
class CallCppFromJsApp {
7+
public:
8+
CallCppFromJsApp() {
9+
// Bind HTML element IDs with class methods
10+
win.bind("my_function_string", this, &CallCppFromJsApp::my_function_string);
11+
win.bind("my_function_integer", this, &CallCppFromJsApp::my_function_integer);
12+
win.bind("my_function_boolean", this, &CallCppFromJsApp::my_function_boolean);
13+
win.bind("my_function_with_response", this, &CallCppFromJsApp::my_function_with_response);
14+
}
15+
16+
void run() {
17+
const std::string html = R"V0G0N(
18+
<html>
19+
<head>
20+
<meta charset="UTF-8">
21+
<script src="/webui.js"></script>
22+
<title>Call C++ from JavaScript Example</title>
23+
<style>
24+
body {
25+
background: linear-gradient(to left, #36265a, #654da9);
26+
color: AliceBlue;
27+
font-size: 16px sans-serif;
28+
text-align: center;
29+
margin-top: 30px;
30+
}
31+
button {
32+
margin: 5px 0 10px;
33+
}
34+
</style>
35+
</head>
36+
<body>
37+
<h1>WebUI - Call C++ from JavaScript</h1>
38+
<p>Call C++ functions with arguments (<em>See the logs in your terminal</em>)</p>
39+
<button onclick="my_function_string('Hello', 'World');">Call my_function_string()</button>
40+
<br>
41+
<button onclick="my_function_integer(123, 456, 789);">Call my_function_integer()</button>
42+
<br>
43+
<button onclick="my_function_boolean(true, false);">Call my_function_boolean()</button>
44+
<br>
45+
<p>Call a C++ function that returns a response</p>
46+
<button onclick="MyJS();">Call my_function_with_response()</button>
47+
<div>Double: <input type="text" id="MyInputID" value="2"></div>
48+
<script>
49+
function MyJS() {
50+
const MyInput = document.getElementById('MyInputID');
51+
const number = MyInput.value;
52+
my_function_with_response(number, 2).then((response) => {
53+
MyInput.value = response;
54+
});
55+
}
56+
</script>
57+
</body>
58+
</html>
59+
)V0G0N";
60+
61+
// Show the HTML page in the WebView/Browser window
62+
win.show(html);
63+
// win.show_browser(html, webui_browser::Chrome);
64+
// win.show_wv(html);
65+
66+
// Wait until the window gets closed
67+
webui::wait();
68+
}
69+
70+
private:
71+
webui::window win;
72+
73+
void my_function_string(webui::window::event* e) {
74+
// JavaScript: my_function_string('Hello', 'World');
75+
std::string str_1 = e->get_string(); // Or e->get_string(0);
76+
std::string str_2 = e->get_string(1);
77+
std::cout << "my_function_string 1: " << str_1 << std::endl; // Hello
78+
std::cout << "my_function_string 2: " << str_2 << std::endl; // World
79+
}
80+
81+
void my_function_integer(webui::window::event* e) {
82+
// JavaScript: my_function_integer(123, 456, 789);
83+
long long number_1 = e->get_int(); // Or e->get_int(0);
84+
long long number_2 = e->get_int(1);
85+
long long number_3 = e->get_int(2);
86+
std::cout << "my_function_integer 1: " << number_1 << std::endl; // 123
87+
std::cout << "my_function_integer 2: " << number_2 << std::endl; // 456
88+
std::cout << "my_function_integer 3: " << number_3 << std::endl; // 789
89+
}
90+
91+
void my_function_boolean(webui::window::event* e) {
92+
// JavaScript: my_function_boolean(true, false);
93+
bool status_1 = e->get_bool(); // Or e->get_bool(0);
94+
bool status_2 = e->get_bool(1);
95+
std::cout << "my_function_boolean 1: " << (status_1 ? "True" : "False") << std::endl;
96+
std::cout << "my_function_boolean 2: " << (status_2 ? "True" : "False") << std::endl;
97+
}
98+
99+
void my_function_with_response(webui::window::event* e) {
100+
// JavaScript: my_function_with_response(number, 2).then(...)
101+
long long number = e->get_int(0);
102+
long long times = e->get_int(1);
103+
long long res = number * times;
104+
std::cout << "my_function_with_response: " << number << " * " << times << " = " << res << std::endl;
105+
// Send the response back to JavaScript
106+
e->return_int(res);
107+
}
108+
};
62109

63110
int main() {
64-
65-
// HTML
66-
const std::string my_html = R"V0G0N(
67-
<html>
68-
<head>
69-
<meta charset="UTF-8">
70-
<script src="/webui.js"></script>
71-
72-
<title>Call C++ from JavaScript Example</title>
73-
<style>
74-
body {
75-
background: linear-gradient(to left, #36265a, #654da9);
76-
color: AliceBlue;
77-
font-size: 16px sans-serif;
78-
text-align: center;
79-
margin-top: 30px;
80-
}
81-
button {
82-
margin: 5px 0 10px;
83-
}
84-
</style>
85-
</head>
86-
<body>
87-
<h1>WebUI - Call C++ from JavaScript</h1>
88-
<p>Call C++ functions with arguments (<em>See the logs in your terminal</em>)</p>
89-
<button onclick="my_function_string('Hello', 'World');">Call my_function_string()</button>
90-
<br>
91-
<button onclick="my_function_integer(123, 456, 789);">Call my_function_integer()</button>
92-
<br>
93-
<button onclick="my_function_boolean(true, false);">Call my_function_boolean()</button>
94-
<br>
95-
<p>Call a C++ function that returns a response</p>
96-
<button onclick="MyJS();">Call my_function_with_response()</button>
97-
<div>Double: <input type="text" id="MyInputID" value="2"></div>
98-
<script>
99-
function MyJS() {
100-
const MyInput = document.getElementById('MyInputID');
101-
const number = MyInput.value;
102-
my_function_with_response(number, 2).then((response) => {
103-
MyInput.value = response;
104-
});
105-
}
106-
</script>
107-
</body>
108-
</html>
109-
)V0G0N";
110-
111-
// Create a window
112-
webui::window my_window;
113-
114-
// Bind HTML elements with C++ functions
115-
my_window.bind("my_function_string", my_function_string);
116-
my_window.bind("my_function_integer", my_function_integer);
117-
my_window.bind("my_function_boolean", my_function_boolean);
118-
my_window.bind("my_function_with_response", my_function_with_response);
119-
120-
// Show the window
121-
my_window.show(my_html); // webui_show_browser(my_window, my_html, Chrome);
122-
123-
// Wait until all windows get closed
124-
webui::wait();
125-
126-
return 0;
111+
CallCppFromJsApp app;
112+
app.run();
113+
return 0;
127114
}
128115

129116
#if defined(_MSC_VER)
130-
int APIENTRY WinMain(HINSTANCE hInst, HINSTANCE hInstPrev, PSTR cmdline, int cmdshow) { main(); }
117+
int APIENTRY WinMain(HINSTANCE hInst, HINSTANCE hInstPrev, PSTR cmdline, int cmdshow) { return main(); }
131118
#endif

0 commit comments

Comments
 (0)