Skip to content

Commit 05f7396

Browse files
jinzhongjiajinzhongjia
committed
feat(examples): add advanced window, browser profiles, error handling, and secure communication demos
- introduce advanced_window example with window controls and info - add browser_profiles example for managing browser profiles and info - provide error_handling example demonstrating error reporting and recovery - add secure_communication example for encoding, binary transfer, and memory management - update win32GetHwnd for improved pointer handling on Windows
1 parent 2c2111c commit 05f7396

File tree

10 files changed

+1399
-2
lines changed

10 files changed

+1399
-2
lines changed

‎examples/advanced_window/index.html‎

Lines changed: 269 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,269 @@
1+
<!DOCTYPE html>
2+
<html>
3+
<head>
4+
<title>Advanced Window Controls</title>
5+
<style>
6+
:root {
7+
--primary-color: #5e35b1;
8+
--secondary-color: #7e57c2;
9+
--background: #f5f5f5;
10+
--text-color: #333;
11+
}
12+
13+
@media (prefers-contrast: high) {
14+
:root {
15+
--primary-color: #000;
16+
--secondary-color: #333;
17+
--background: #fff;
18+
--text-color: #000;
19+
}
20+
}
21+
22+
body {
23+
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, sans-serif;
24+
max-width: 1000px;
25+
margin: 0 auto;
26+
padding: 20px;
27+
background: var(--background);
28+
color: var(--text-color);
29+
}
30+
31+
h1 {
32+
color: var(--primary-color);
33+
text-align: center;
34+
font-size: 2.5em;
35+
margin-bottom: 30px;
36+
}
37+
38+
.control-panel {
39+
display: grid;
40+
grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
41+
gap: 20px;
42+
margin-bottom: 30px;
43+
}
44+
45+
.control-section {
46+
background: white;
47+
border-radius: 10px;
48+
padding: 20px;
49+
box-shadow: 0 2px 10px rgba(0,0,0,0.1);
50+
border: 2px solid transparent;
51+
transition: all 0.3s;
52+
}
53+
54+
.control-section:hover {
55+
border-color: var(--secondary-color);
56+
transform: translateY(-2px);
57+
box-shadow: 0 4px 20px rgba(0,0,0,0.15);
58+
}
59+
60+
h2 {
61+
color: var(--secondary-color);
62+
margin-top: 0;
63+
font-size: 1.3em;
64+
}
65+
66+
button {
67+
background: var(--primary-color);
68+
color: white;
69+
border: none;
70+
padding: 10px 20px;
71+
border-radius: 5px;
72+
cursor: pointer;
73+
font-size: 14px;
74+
margin: 5px;
75+
transition: all 0.3s;
76+
}
77+
78+
button:hover {
79+
background: var(--secondary-color);
80+
transform: scale(1.05);
81+
}
82+
83+
button:active {
84+
transform: scale(0.95);
85+
}
86+
87+
input[type="number"], input[type="text"] {
88+
padding: 8px;
89+
border: 2px solid #ddd;
90+
border-radius: 5px;
91+
margin: 5px;
92+
width: 80px;
93+
transition: border-color 0.3s;
94+
}
95+
96+
input[type="text"] {
97+
width: 200px;
98+
}
99+
100+
input:focus {
101+
outline: none;
102+
border-color: var(--secondary-color);
103+
}
104+
105+
.output {
106+
background: #f0f0f0;
107+
padding: 15px;
108+
border-radius: 5px;
109+
margin-top: 10px;
110+
font-family: 'Courier New', monospace;
111+
white-space: pre-wrap;
112+
min-height: 50px;
113+
border-left: 4px solid var(--primary-color);
114+
}
115+
116+
.danger-zone {
117+
background: #ffebee;
118+
border: 2px solid #ef5350;
119+
}
120+
121+
.danger-zone button {
122+
background: #ef5350;
123+
}
124+
125+
.danger-zone button:hover {
126+
background: #c62828;
127+
}
128+
</style>
129+
</head>
130+
<body>
131+
<h1>🪟 Advanced Window Controls</h1>
132+
133+
<div class="control-panel">
134+
<div class="control-section">
135+
<h2>Window Position</h2>
136+
<button onclick="centerWindow()">Center Window</button>
137+
<br><br>
138+
<input type="number" id="moveX" placeholder="X" value="200">
139+
<input type="number" id="moveY" placeholder="Y" value="200">
140+
<button onclick="moveWindow()">Move Window</button>
141+
</div>
142+
143+
<div class="control-section">
144+
<h2>Window Size</h2>
145+
<input type="number" id="width" placeholder="Width" value="800">
146+
<input type="number" id="height" placeholder="Height" value="600">
147+
<button onclick="resizeWindow()">Resize Window</button>
148+
<p style="font-size: 12px; color: #666;">Min size: 640x480</p>
149+
</div>
150+
151+
<div class="control-section">
152+
<h2>Window Visibility</h2>
153+
<button onclick="toggleHide(true)">Hide Window</button>
154+
<button onclick="toggleHide(false)">Show Window</button>
155+
<p style="font-size: 12px; color: #666;">Note: Hide may not work after window is shown</p>
156+
</div>
157+
158+
<div class="control-section">
159+
<h2>MIME Type Detection</h2>
160+
<input type="text" id="filename" placeholder="Enter filename" value="test.html">
161+
<button onclick="getMimeType()">Get MIME Type</button>
162+
<div id="mimeOutput" class="output">Enter a filename to get its MIME type</div>
163+
</div>
164+
165+
<div class="control-section">
166+
<h2>Port Information</h2>
167+
<button onclick="getPortInfo()">Get Port Info</button>
168+
<div id="portOutput" class="output">Click to get port information</div>
169+
</div>
170+
171+
<div class="control-section">
172+
<h2>Process Information</h2>
173+
<button onclick="getProcessInfo()">Get Process Info</button>
174+
<div id="processOutput" class="output">Click to get process information</div>
175+
</div>
176+
177+
<div class="control-section danger-zone">
178+
<h2>⚠️ Danger Zone</h2>
179+
<button onclick="destroyWindow()">Destroy Window</button>
180+
<p style="font-size: 12px; color: #c62828;">This will close and destroy the window!</p>
181+
</div>
182+
</div>
183+
184+
<script>
185+
async function centerWindow() {
186+
const result = await center_window();
187+
showNotification(result);
188+
}
189+
190+
async function toggleHide(hide) {
191+
const result = await toggle_hide(hide);
192+
showNotification(result);
193+
}
194+
195+
async function resizeWindow() {
196+
const width = parseInt(document.getElementById('width').value);
197+
const height = parseInt(document.getElementById('height').value);
198+
const result = await resize_window(width, height);
199+
showNotification(result);
200+
}
201+
202+
async function moveWindow() {
203+
const x = parseInt(document.getElementById('moveX').value);
204+
const y = parseInt(document.getElementById('moveY').value);
205+
const result = await move_window(x, y);
206+
showNotification(result);
207+
}
208+
209+
async function getMimeType() {
210+
const filename = document.getElementById('filename').value;
211+
const mime = await get_mime(filename);
212+
document.getElementById('mimeOutput').textContent = `MIME type for ${filename}: ${mime}`;
213+
}
214+
215+
async function getPortInfo() {
216+
const info = await get_port();
217+
document.getElementById('portOutput').textContent = info;
218+
}
219+
220+
async function getProcessInfo() {
221+
const info = await get_process();
222+
document.getElementById('processOutput').textContent = info;
223+
}
224+
225+
async function destroyWindow() {
226+
if (confirm('Are you sure you want to destroy this window?')) {
227+
await destroy_window();
228+
}
229+
}
230+
231+
function showNotification(message) {
232+
const notification = document.createElement('div');
233+
notification.style.cssText = `
234+
position: fixed;
235+
top: 20px;
236+
right: 20px;
237+
background: var(--primary-color);
238+
color: white;
239+
padding: 15px 20px;
240+
border-radius: 5px;
241+
box-shadow: 0 4px 10px rgba(0,0,0,0.3);
242+
animation: slideIn 0.3s ease;
243+
z-index: 1000;
244+
`;
245+
notification.textContent = message;
246+
document.body.appendChild(notification);
247+
248+
setTimeout(() => {
249+
notification.style.animation = 'slideOut 0.3s ease';
250+
setTimeout(() => notification.remove(), 300);
251+
}, 2000);
252+
}
253+
254+
// Add animations
255+
const style = document.createElement('style');
256+
style.textContent = `
257+
@keyframes slideIn {
258+
from { transform: translateX(100%); opacity: 0; }
259+
to { transform: translateX(0); opacity: 1; }
260+
}
261+
@keyframes slideOut {
262+
from { transform: translateX(0); opacity: 1; }
263+
to { transform: translateX(100%); opacity: 0; }
264+
}
265+
`;
266+
document.head.appendChild(style);
267+
</script>
268+
</body>
269+
</html>

0 commit comments

Comments
 (0)