better README
This commit is contained in:
parent
a9667d38fd
commit
7350ce0bea
4 changed files with 142 additions and 19 deletions
84
examples/CompleteEventHandling/README.md
Normal file
84
examples/CompleteEventHandling/README.md
Normal file
|
|
@ -0,0 +1,84 @@
|
|||
# Complete Event Handling Example
|
||||
|
||||
This example demonstrates comprehensive event handling capabilities in Crafter.CppDOM.
|
||||
|
||||
## Features
|
||||
|
||||
- Shows how to handle various types of DOM events using C++
|
||||
- Demonstrates mouse, keyboard, form, and window events
|
||||
- Illustrates proper event listener attachment and callback handling
|
||||
- Shows real-time interaction with UI elements
|
||||
|
||||
## Event Types Demonstrated
|
||||
|
||||
### Mouse Events
|
||||
- Click events
|
||||
- Mouse over/out events
|
||||
- Mouse move events
|
||||
|
||||
### Focus Events
|
||||
- Focus and blur events
|
||||
|
||||
### Keyboard Events
|
||||
- Key down, up, and press events
|
||||
|
||||
### Form Events
|
||||
- Change, submit, and input events
|
||||
|
||||
### Window Events
|
||||
- Load, error, resize, and scroll events
|
||||
|
||||
### Context Menu Events
|
||||
- Context menu events
|
||||
|
||||
### Drag and Drop Events
|
||||
- Drag start, end, and drop events
|
||||
|
||||
## Usage
|
||||
|
||||
```cpp
|
||||
import Crafter.CppDOM;
|
||||
using namespace Crafter::CppDOM;
|
||||
|
||||
int main(){
|
||||
// Create UI elements
|
||||
HtmlElement body("body");
|
||||
body.SetInnerHTML("<h1>Complete Event Handling Demo</h1>"
|
||||
"<button id='myButton'>Click Me!</button>"
|
||||
"<input type='text' id='textInput' placeholder='Type something...'>"
|
||||
"<p id='output'>Events will appear here</p>");
|
||||
|
||||
// Handle click event
|
||||
HtmlElement button("myButton");
|
||||
button.AddClickListener([]() {
|
||||
HtmlElement output("output");
|
||||
output.SetInnerHTML("Button was clicked!");
|
||||
});
|
||||
|
||||
// Handle keyboard events
|
||||
HtmlElement input("textInput");
|
||||
input.AddInputListener([]() {
|
||||
HtmlElement output("output");
|
||||
output.SetInnerHTML("Input changed!");
|
||||
});
|
||||
|
||||
// Handle form events
|
||||
input.AddChangeListener([]() {
|
||||
HtmlElement output("output");
|
||||
output.SetInnerHTML("Form value changed!");
|
||||
});
|
||||
|
||||
return 0;
|
||||
}
|
||||
```
|
||||
|
||||
## Building and Running
|
||||
|
||||
```bash
|
||||
crafter-build build executable
|
||||
run.sh
|
||||
```
|
||||
|
||||
Then navigate to `http://localhost:8080/` in your browser.
|
||||
|
||||
If caddy is not installed, you can use your favorite static file server instead.
|
||||
Loading…
Add table
Add a link
Reference in a new issue