swaits/dioxus
1
0 Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

wip: more work on html

Browse Source
This commit is contained in:
Jonathan Kelley committed 2022-11-15 16:51:22 -08:00
1 parent 0dad91bc08
commit 8caabb97d8
6 files changed
+574 -492
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

examples/all_css.rs
+399 -399
View File
@@ -7,405 +7,405 @@ fn main() {
fn app(cx: Scope) -> Element { fn app(cx: Scope) -> Element {
cx.render(rsx! { cx.render(rsx! {
div { div {
align_content: "a", align_content: "a",
align_items: "a", align_items: "a",
align_self: "a", align_self: "a",
alignment_adjust: "a", alignment_adjust: "a",
alignment_baseline: "a", alignment_baseline: "a",
all: "a", all: "a",
alt: "a", alt: "a",
animation: "a", animation: "a",
animation_delay: "a", animation_delay: "a",
animation_direction: "a", animation_direction: "a",
animation_duration: "a", animation_duration: "a",
animation_fill_mode: "a", animation_fill_mode: "a",
animation_iteration_count: "a", animation_iteration_count: "a",
animation_name: "a", animation_name: "a",
animation_play_state: "a", animation_play_state: "a",
animation_timing_function: "a", animation_timing_function: "a",
azimuth: "a", azimuth: "a",
backface_visibility: "a", backface_visibility: "a",
background: "a", background: "a",
background_attachment: "a", background_attachment: "a",
background_clip: "a", background_clip: "a",
background_color: "a", background_color: "a",
background_image: "a", background_image: "a",
background_origin: "a", background_origin: "a",
background_position: "a", background_position: "a",
background_repeat: "a", background_repeat: "a",
background_size: "a", background_size: "a",
background_blend_mode: "a", background_blend_mode: "a",
baseline_shift: "a", baseline_shift: "a",
bleed: "a", bleed: "a",
bookmark_label: "a", bookmark_label: "a",
bookmark_level: "a", bookmark_level: "a",
bookmark_state: "a", bookmark_state: "a",
border: "a", border: "a",
border_color: "a", border_color: "a",
border_style: "a", border_style: "a",
border_width: "a", border_width: "a",
border_bottom: "a", border_bottom: "a",
border_bottom_color: "a", border_bottom_color: "a",
border_bottom_style: "a", border_bottom_style: "a",
border_bottom_width: "a", border_bottom_width: "a",
border_left: "a", border_left: "a",
border_left_color: "a", border_left_color: "a",
border_left_style: "a", border_left_style: "a",
border_left_width: "a", border_left_width: "a",
border_right: "a", border_right: "a",
border_right_color: "a", border_right_color: "a",
border_right_style: "a", border_right_style: "a",
border_right_width: "a", border_right_width: "a",
border_top: "a", border_top: "a",
border_top_color: "a", border_top_color: "a",
border_top_style: "a", border_top_style: "a",
border_top_width: "a", border_top_width: "a",
border_collapse: "a", border_collapse: "a",
border_image: "a", border_image: "a",
border_image_outset: "a", border_image_outset: "a",
border_image_repeat: "a", border_image_repeat: "a",
border_image_slice: "a", border_image_slice: "a",
border_image_source: "a", border_image_source: "a",
border_image_width: "a", border_image_width: "a",
border_radius: "a", border_radius: "a",
border_bottom_left_radius: "a", border_bottom_left_radius: "a",
border_bottom_right_radius: "a", border_bottom_right_radius: "a",
border_top_left_radius: "a", border_top_left_radius: "a",
border_top_right_radius: "a", border_top_right_radius: "a",
border_spacing: "a", border_spacing: "a",
bottom: "a", bottom: "a",
box_decoration_break: "a", box_decoration_break: "a",
box_shadow: "a", box_shadow: "a",
box_sizing: "a", box_sizing: "a",
box_snap: "a", box_snap: "a",
break_after: "a", break_after: "a",
break_before: "a", break_before: "a",
break_inside: "a", break_inside: "a",
buffered_rendering: "a", buffered_rendering: "a",
caption_side: "a", caption_side: "a",
clear: "a", clear: "a",
clear_side: "a", clear_side: "a",
clip: "a", clip: "a",
clip_path: "a", clip_path: "a",
clip_rule: "a", clip_rule: "a",
color: "a", color: "a",
color_adjust: "a", color_adjust: "a",
color_correction: "a", color_correction: "a",
color_interpolation: "a", color_interpolation: "a",
color_interpolation_filters: "a", color_interpolation_filters: "a",
color_profile: "a", color_profile: "a",
color_rendering: "a", color_rendering: "a",
column_fill: "a", column_fill: "a",
column_gap: "a", column_gap: "a",
column_rule: "a", column_rule: "a",
column_rule_color: "a", column_rule_color: "a",
column_rule_style: "a", column_rule_style: "a",
column_rule_width: "a", column_rule_width: "a",
column_span: "a", column_span: "a",
columns: "a", columns: "a",
column_count: "a", column_count: "a",
column_width: "a", column_width: "a",
contain: "a", contain: "a",
content: "a", content: "a",
counter_increment: "a", counter_increment: "a",
counter_reset: "a", counter_reset: "a",
counter_set: "a", counter_set: "a",
cue: "a", cue: "a",
cue_after: "a", cue_after: "a",
cue_before: "a", cue_before: "a",
cursor: "a", cursor: "a",
direction: "a", direction: "a",
display: "a", display: "a",
display_inside: "a", display_inside: "a",
display_outside: "a", display_outside: "a",
display_extras: "a", display_extras: "a",
display_box: "a", display_box: "a",
dominant_baseline: "a", dominant_baseline: "a",
elevation: "a", elevation: "a",
empty_cells: "a", empty_cells: "a",
enable_background: "a", enable_background: "a",
fill: "a", fill: "a",
fill_opacity: "a", fill_opacity: "a",
fill_rule: "a", fill_rule: "a",
filter: "a", filter: "a",
float: "a", float: "a",
float_defer_column: "a", float_defer_column: "a",
float_defer_page: "a", float_defer_page: "a",
float_offset: "a", float_offset: "a",
float_wrap: "a", float_wrap: "a",
flow_into: "a", flow_into: "a",
flow_from: "a", flow_from: "a",
flex: "a", flex: "a",
flex_basis: "a", flex_basis: "a",
flex_grow: "a", flex_grow: "a",
flex_shrink: "a", flex_shrink: "a",
flex_flow: "a", flex_flow: "a",
flex_direction: "a", flex_direction: "a",
flex_wrap: "a", flex_wrap: "a",
flood_color: "a", flood_color: "a",
flood_opacity: "a", flood_opacity: "a",
font: "a", font: "a",
font_family: "a", font_family: "a",
font_size: "a", font_size: "a",
font_stretch: "a", font_stretch: "a",
font_style: "a", font_style: "a",
font_weight: "a", font_weight: "a",
font_feature_settings: "a", font_feature_settings: "a",
font_kerning: "a", font_kerning: "a",
font_language_override: "a", font_language_override: "a",
font_size_adjust: "a", font_size_adjust: "a",
font_synthesis: "a", font_synthesis: "a",
font_variant: "a", font_variant: "a",
font_variant_alternates: "a", font_variant_alternates: "a",
font_variant_caps: "a", font_variant_caps: "a",
font_variant_east_asian: "a", font_variant_east_asian: "a",
font_variant_ligatures: "a", font_variant_ligatures: "a",
font_variant_numeric: "a", font_variant_numeric: "a",
font_variant_position: "a", font_variant_position: "a",
footnote_policy: "a", footnote_policy: "a",
glyph_orientation_horizontal: "a", glyph_orientation_horizontal: "a",
glyph_orientation_vertical: "a", glyph_orientation_vertical: "a",
grid: "a", grid: "a",
grid_auto_flow: "a", grid_auto_flow: "a",
grid_auto_columns: "a", grid_auto_columns: "a",
grid_auto_rows: "a", grid_auto_rows: "a",
grid_template: "a", grid_template: "a",
grid_template_areas: "a", grid_template_areas: "a",
grid_template_columns: "a", grid_template_columns: "a",
grid_template_rows: "a", grid_template_rows: "a",
grid_area: "a", grid_area: "a",
grid_column: "a", grid_column: "a",
grid_column_start: "a", grid_column_start: "a",
grid_column_end: "a", grid_column_end: "a",
grid_row: "a", grid_row: "a",
grid_row_start: "a", grid_row_start: "a",
grid_row_end: "a", grid_row_end: "a",
hanging_punctuation: "a", hanging_punctuation: "a",
height: "a", height: "a",
hyphenate_character: "a", hyphenate_character: "a",
hyphenate_limit_chars: "a", hyphenate_limit_chars: "a",
hyphenate_limit_last: "a", hyphenate_limit_last: "a",
hyphenate_limit_lines: "a", hyphenate_limit_lines: "a",
hyphenate_limit_zone: "a", hyphenate_limit_zone: "a",
hyphens: "a", hyphens: "a",
icon: "a", icon: "a",
image_orientation: "a", image_orientation: "a",
image_resolution: "a", image_resolution: "a",
image_rendering: "a", image_rendering: "a",
ime: "a", ime: "a",
ime_align: "a", ime_align: "a",
ime_mode: "a", ime_mode: "a",
ime_offset: "a", ime_offset: "a",
ime_width: "a", ime_width: "a",
initial_letters: "a", initial_letters: "a",
inline_box_align: "a", inline_box_align: "a",
isolation: "a", isolation: "a",
justify_content: "a", justify_content: "a",
justify_items: "a", justify_items: "a",
justify_self: "a", justify_self: "a",
kerning: "a", kerning: "a",
left: "a", left: "a",
letter_spacing: "a", letter_spacing: "a",
lighting_color: "a", lighting_color: "a",
line_box_contain: "a", line_box_contain: "a",
line_break: "a", line_break: "a",
line_grid: "a", line_grid: "a",
line_height: "a", line_height: "a",
line_slack: "a", line_slack: "a",
line_snap: "a", line_snap: "a",
list_style: "a", list_style: "a",
list_style_image: "a", list_style_image: "a",
list_style_position: "a", list_style_position: "a",
list_style_type: "a", list_style_type: "a",
margin: "a", margin: "a",
margin_bottom: "a", margin_bottom: "a",
margin_left: "a", margin_left: "a",
margin_right: "a", margin_right: "a",
margin_top: "a", margin_top: "a",
marker: "a", marker: "a",
marker_end: "a", marker_end: "a",
marker_mid: "a", marker_mid: "a",
marker_pattern: "a", marker_pattern: "a",
marker_segment: "a", marker_segment: "a",
marker_start: "a", marker_start: "a",
marker_knockout_left: "a", marker_knockout_left: "a",
marker_knockout_right: "a", marker_knockout_right: "a",
marker_side: "a", marker_side: "a",
marks: "a", marks: "a",
marquee_direction: "a", marquee_direction: "a",
marquee_play_count: "a", marquee_play_count: "a",
marquee_speed: "a", marquee_speed: "a",
marquee_style: "a", marquee_style: "a",
mask: "a", mask: "a",
mask_image: "a", mask_image: "a",
mask_repeat: "a", mask_repeat: "a",
mask_position: "a", mask_position: "a",
mask_clip: "a", mask_clip: "a",
mask_origin: "a", mask_origin: "a",
mask_size: "a", mask_size: "a",
mask_box: "a", mask_box: "a",
mask_box_outset: "a", mask_box_outset: "a",
mask_box_repeat: "a", mask_box_repeat: "a",
mask_box_slice: "a", mask_box_slice: "a",
mask_box_source: "a", mask_box_source: "a",
mask_box_width: "a", mask_box_width: "a",
mask_type: "a", mask_type: "a",
max_height: "a", max_height: "a",
max_lines: "a", max_lines: "a",
max_width: "a", max_width: "a",
min_height: "a", min_height: "a",
min_width: "a", min_width: "a",
mix_blend_mode: "a", mix_blend_mode: "a",
nav_down: "a", nav_down: "a",
nav_index: "a", nav_index: "a",
nav_left: "a", nav_left: "a",
nav_right: "a", nav_right: "a",
nav_up: "a", nav_up: "a",
object_fit: "a", object_fit: "a",
object_position: "a", object_position: "a",
offset_after: "a", offset_after: "a",
offset_before: "a", offset_before: "a",
offset_end: "a", offset_end: "a",
offset_start: "a", offset_start: "a",
opacity: "a", opacity: "a",
order: "a", order: "a",
orphans: "a", orphans: "a",
outline: "a", outline: "a",
outline_color: "a", outline_color: "a",
outline_style: "a", outline_style: "a",
outline_width: "a", outline_width: "a",
outline_offset: "a", outline_offset: "a",
overflow: "a", overflow: "a",
overflow_x: "a", overflow_x: "a",
overflow_y: "a", overflow_y: "a",
overflow_style: "a", overflow_style: "a",
overflow_wrap: "a", overflow_wrap: "a",
padding: "a", padding: "a",
padding_bottom: "a", padding_bottom: "a",
padding_left: "a", padding_left: "a",
padding_right: "a", padding_right: "a",
padding_top: "a", padding_top: "a",
page: "a", page: "a",
page_break_after: "a", page_break_after: "a",
page_break_before: "a", page_break_before: "a",
page_break_inside: "a", page_break_inside: "a",
paint_order: "a", paint_order: "a",
pause: "a", pause: "a",
pause_after: "a", pause_after: "a",
pause_before: "a", pause_before: "a",
perspective: "a", perspective: "a",
perspective_origin: "a", perspective_origin: "a",
pitch: "a", pitch: "a",
pitch_range: "a", pitch_range: "a",
play_during: "a", play_during: "a",
pointer_events: "a", pointer_events: "a",
position: "a", position: "a",
quotes: "a", quotes: "a",
region_fragment: "a", region_fragment: "a",
resize: "a", resize: "a",
rest: "a", rest: "a",
rest_after: "a", rest_after: "a",
rest_before: "a", rest_before: "a",
richness: "a", richness: "a",
right: "a", right: "a",
ruby_align: "a", ruby_align: "a",
ruby_merge: "a", ruby_merge: "a",
ruby_position: "a", ruby_position: "a",
scroll_behavior: "a", scroll_behavior: "a",
scroll_snap_coordinate: "a", scroll_snap_coordinate: "a",
scroll_snap_destination: "a", scroll_snap_destination: "a",
scroll_snap_points_x: "a", scroll_snap_points_x: "a",
scroll_snap_points_y: "a", scroll_snap_points_y: "a",
scroll_snap_type: "a", scroll_snap_type: "a",
shape_image_threshold: "a", shape_image_threshold: "a",
shape_inside: "a", shape_inside: "a",
shape_margin: "a", shape_margin: "a",
shape_outside: "a", shape_outside: "a",
shape_padding: "a", shape_padding: "a",
shape_rendering: "a", shape_rendering: "a",
size: "a", size: "a",
speak: "a", speak: "a",
speak_as: "a", speak_as: "a",
speak_header: "a", speak_header: "a",
speak_numeral: "a", speak_numeral: "a",
speak_punctuation: "a", speak_punctuation: "a",
speech_rate: "a", speech_rate: "a",
stop_color: "a", stop_color: "a",
stop_opacity: "a", stop_opacity: "a",
stress: "a", stress: "a",
string_set: "a", string_set: "a",
stroke: "a", stroke: "a",
stroke_dasharray: "a", stroke_dasharray: "a",
stroke_dashoffset: "a", stroke_dashoffset: "a",
stroke_linecap: "a", stroke_linecap: "a",
stroke_linejoin: "a", stroke_linejoin: "a",
stroke_miterlimit: "a", stroke_miterlimit: "a",
stroke_opacity: "a", stroke_opacity: "a",
stroke_width: "a", stroke_width: "a",
tab_size: "a", tab_size: "a",
table_layout: "a", table_layout: "a",
text_align: "a", text_align: "a",
text_align_all: "a", text_align_all: "a",
text_align_last: "a", text_align_last: "a",
text_anchor: "a", text_anchor: "a",
text_combine_upright: "a", text_combine_upright: "a",
text_decoration: "a", text_decoration: "a",
text_decoration_color: "a", text_decoration_color: "a",
text_decoration_line: "a", text_decoration_line: "a",
text_decoration_style: "a", text_decoration_style: "a",
text_decoration_skip: "a", text_decoration_skip: "a",
text_emphasis: "a", text_emphasis: "a",
text_emphasis_color: "a", text_emphasis_color: "a",
text_emphasis_style: "a", text_emphasis_style: "a",
text_emphasis_position: "a", text_emphasis_position: "a",
text_emphasis_skip: "a", text_emphasis_skip: "a",
text_height: "a", text_height: "a",
text_indent: "a", text_indent: "a",
text_justify: "a", text_justify: "a",
text_orientation: "a", text_orientation: "a",
text_overflow: "a", text_overflow: "a",
text_rendering: "a", text_rendering: "a",
text_shadow: "a", text_shadow: "a",
text_size_adjust: "a", text_size_adjust: "a",
text_space_collapse: "a", text_space_collapse: "a",
text_spacing: "a", text_spacing: "a",
text_transform: "a", text_transform: "a",
text_underline_position: "a", text_underline_position: "a",
text_wrap: "a", text_wrap: "a",
top: "a", top: "a",
touch_action: "a", touch_action: "a",
transform: "a", transform: "a",
transform_box: "a", transform_box: "a",
transform_origin: "a", transform_origin: "a",
transform_style: "a", transform_style: "a",
transition: "a", transition: "a",
transition_delay: "a", transition_delay: "a",
transition_duration: "a", transition_duration: "a",
transition_property: "a", transition_property: "a",
unicode_bidi: "a", unicode_bidi: "a",
vector_effect: "a", vector_effect: "a",
vertical_align: "a", vertical_align: "a",
visibility: "a", visibility: "a",
voice_balance: "a", voice_balance: "a",
voice_duration: "a", voice_duration: "a",
voice_family: "a", voice_family: "a",
voice_pitch: "a", voice_pitch: "a",
voice_range: "a", voice_range: "a",
voice_rate: "a", voice_rate: "a",
voice_stress: "a", voice_stress: "a",
voice_volumn: "a", voice_volumn: "a",
volume: "a", volume: "a",
white_space: "a", white_space: "a",
widows: "a", widows: "a",
width: "a", width: "a",
will_change: "a", will_change: "a",
word_break: "a", word_break: "a",
word_spacing: "a", word_spacing: "a",
word_wrap: "a", word_wrap: "a",
wrap_flow: "a", wrap_flow: "a",
wrap_through: "a", wrap_through: "a",
writing_mode: "a", writing_mode: "a",
z_index: "a", z_index: "a",
} }
}) })
} }
examples/svg.rs
+5 -5
View File
@@ -1,6 +1,6 @@
// Thanks to @japsu and their project https://github.com/japsu/jatsi for the example! // Thanks to @japsu and their project https://github.com/japsu/jatsi for the example!
use dioxus::{events::MouseData, html::MouseEvent, prelude::*}; use dioxus::prelude::*;
fn main() { fn main() {
dioxus_desktop::launch(app); dioxus_desktop::launch(app);
@@ -9,7 +9,7 @@ fn main() {
fn app(cx: Scope) -> Element { fn app(cx: Scope) -> Element {
let val = use_state(&cx, || 5); let val = use_state(&cx, || 5);
render! { cx.render(rsx! {
div { div {
user_select: "none", user_select: "none",
webkit_user_select: "none", webkit_user_select: "none",
@@ -31,7 +31,7 @@ fn app(cx: Scope) -> Element {
} }
} }
} }
} })
} }
#[derive(Props)] #[derive(Props)]
@@ -78,7 +78,7 @@ pub fn Die<'a>(cx: Scope<'a, DieProps<'a>>) -> Element {
}) })
}); });
render! { cx.render(rsx! {
svg { svg {
onclick: move |e| cx.props.onclick.call(e), onclick: move |e| cx.props.onclick.call(e),
prevent_default: "onclick", prevent_default: "onclick",
@@ -96,5 +96,5 @@ pub fn Die<'a>(cx: Scope<'a, DieProps<'a>>) -> Element {
dots dots
} }
} })
} }
packages/dioxus/src/lib.rs
+2 -2
View File
@@ -7,7 +7,7 @@ pub use dioxus_hooks as hooks;
pub mod events { pub mod events {
#[cfg(feature = "html")] #[cfg(feature = "html")]
pub use dioxus_html::{AnimationEvent, FormData, FormEvent, KeyCode, KeyboardEvent, MouseData}; pub use dioxus_html::prelude::*;
} }
#[cfg(feature = "html")] #[cfg(feature = "html")]
@@ -32,5 +32,5 @@ pub mod prelude {
pub use dioxus_html as dioxus_elements; pub use dioxus_html as dioxus_elements;
#[cfg(feature = "html")] #[cfg(feature = "html")]
pub use dioxus_elements::{FormEvent, GlobalAttributes, SvgAttributes}; pub use dioxus_elements::{prelude::*, GlobalAttributes, SvgAttributes};
} }
packages/html/src/events/mouse.rs
+86 -86
View File
@@ -2,7 +2,7 @@ use crate::geometry::{ClientPoint, Coordinates, ElementPoint, PagePoint, ScreenP
use crate::input_data::{ use crate::input_data::{
decode_mouse_button_set, encode_mouse_button_set, MouseButton, MouseButtonSet, decode_mouse_button_set, encode_mouse_button_set, MouseButton, MouseButtonSet,
}; };
use dioxus_core::{Attribute, ScopeState, UiEvent}; use dioxus_core::UiEvent;
use keyboard_types::Modifiers; use keyboard_types::Modifiers;
use std::fmt::{Debug, Formatter}; use std::fmt::{Debug, Formatter};
@@ -88,6 +88,91 @@ pub struct MouseData {
pub shift_key: bool, pub shift_key: bool,
} }
impl_event! {
MouseData;
/// Execute a callback when a button is clicked.
///
/// ## Description
///
/// An element receives a click event when a pointing device button (such as a mouse's primary mouse button)
/// is both pressed and released while the pointer is located inside the element.
///
/// - Bubbles: Yes
/// - Cancelable: Yes
/// - Interface(InteData): [`MouseEvent`]
///
/// If the button is pressed on one element and the pointer is moved outside the element before the button
/// is released, the event is fired on the most specific ancestor element that contained both elements.
/// `click` fires after both the `mousedown` and `mouseup` events have fired, in that order.
///
/// ## Example
/// ```rust, ignore
/// rsx!( button { "click me", onclick: move |_| log::info!("Clicked!`") } )
/// ```
///
/// ## Reference
/// - <https://www.w3schools.com/tags/ev_onclick.asp>
/// - <https://developer.mozilla.org/en-US/docs/Web/API/Element/click_event>
onclick
/// oncontextmenu
oncontextmenu
/// ondoubleclick
ondoubleclick
/// ondoubleclick
ondblclick
/// ondrag
ondrag
/// ondragend
ondragend
/// ondragenter
ondragenter
/// ondragexit
ondragexit
/// ondragleave
ondragleave
/// ondragover
ondragover
/// ondragstart
ondragstart
/// ondrop
ondrop
/// onmousedown
onmousedown
/// onmouseenter
onmouseenter
/// onmouseleave
onmouseleave
/// onmousemove
onmousemove
/// onmouseout
onmouseout
/// onmouseover
///
/// Triggered when the users's mouse hovers over an element.
onmouseover
/// onmouseup
onmouseup
}
impl MouseData { impl MouseData {
/// Construct MouseData with the specified properties /// Construct MouseData with the specified properties
/// ///
@@ -217,88 +302,3 @@ impl Debug for MouseData {
.finish() .finish()
} }
} }
impl_event! {
MouseData;
/// Execute a callback when a button is clicked.
///
/// ## Description
///
/// An element receives a click event when a pointing device button (such as a mouse's primary mouse button)
/// is both pressed and released while the pointer is located inside the element.
///
/// - Bubbles: Yes
/// - Cancelable: Yes
/// - Interface(InteData): [`MouseEvent`]
///
/// If the button is pressed on one element and the pointer is moved outside the element before the button
/// is released, the event is fired on the most specific ancestor element that contained both elements.
/// `click` fires after both the `mousedown` and `mouseup` events have fired, in that order.
///
/// ## Example
/// ```rust, ignore
/// rsx!( button { "click me", onclick: move |_| log::info!("Clicked!`") } )
/// ```
///
/// ## Reference
/// - <https://www.w3schools.com/tags/ev_onclick.asp>
/// - <https://developer.mozilla.org/en-US/docs/Web/API/Element/click_event>
onclick
/// oncontextmenu
oncontextmenu
/// ondoubleclick
ondoubleclick
/// ondoubleclick
ondblclick
/// ondrag
ondrag
/// ondragend
ondragend
/// ondragenter
ondragenter
/// ondragexit
ondragexit
/// ondragleave
ondragleave
/// ondragover
ondragover
/// ondragstart
ondragstart
/// ondrop
ondrop
/// onmousedown
onmousedown
/// onmouseenter
onmouseenter
/// onmouseleave
onmouseleave
/// onmousemove
onmousemove
/// onmouseout
onmouseout
/// onmouseover
///
/// Triggered when the users's mouse hovers over an element.
onmouseover
/// onmouseup
onmouseup
}
packages/html/src/events/wheel.rs
+78
View File
@@ -0,0 +1,78 @@
use dioxus_core::UiEvent;
use euclid::UnknownUnit;
use std::fmt::{Debug, Formatter};
use crate::geometry::{LinesVector, PagesVector, PixelsVector, WheelDelta};
pub type WheelEvent = UiEvent<WheelData>;
#[cfg_attr(feature = "serialize", derive(serde::Serialize, serde::Deserialize))]
#[derive(Clone)]
pub struct WheelData {
#[deprecated(since = "0.3.0", note = "use delta() instead")]
pub delta_mode: u32,
#[deprecated(since = "0.3.0", note = "use delta() instead")]
pub delta_x: f64,
#[deprecated(since = "0.3.0", note = "use delta() instead")]
pub delta_y: f64,
#[deprecated(since = "0.3.0", note = "use delta() instead")]
pub delta_z: f64,
}
impl_event![
WheelData;
/// Called when the mouse wheel is rotated over an element.
onwheel
];
impl WheelData {
/// Construct a new WheelData with the specified wheel movement delta
pub fn new(delta: WheelDelta) -> Self {
let (delta_mode, vector) = match delta {
WheelDelta::Pixels(v) => (0, v.cast_unit::<UnknownUnit>()),
WheelDelta::Lines(v) => (1, v.cast_unit::<UnknownUnit>()),
WheelDelta::Pages(v) => (2, v.cast_unit::<UnknownUnit>()),
};
#[allow(deprecated)]
WheelData {
delta_mode,
delta_x: vector.x,
delta_y: vector.y,
delta_z: vector.z,
}
}
/// Construct from the attributes of the web wheel event
pub fn from_web_attributes(delta_mode: u32, delta_x: f64, delta_y: f64, delta_z: f64) -> Self {
#[allow(deprecated)]
Self {
delta_mode,
delta_x,
delta_y,
delta_z,
}
}
/// The amount of wheel movement
#[allow(deprecated)]
pub fn delta(&self) -> WheelDelta {
let x = self.delta_x;
let y = self.delta_y;
let z = self.delta_z;
match self.delta_mode {
0 => WheelDelta::Pixels(PixelsVector::new(x, y, z)),
1 => WheelDelta::Lines(LinesVector::new(x, y, z)),
2 => WheelDelta::Pages(PagesVector::new(x, y, z)),
_ => panic!("Invalid delta mode, {:?}", self.delta_mode),
}
}
}
impl Debug for WheelData {
fn fmt(&self, f: &mut Formatter<'_>) -> std::fmt::Result {
f.debug_struct("WheelData")
.field("delta", &self.delta())
.finish()
}
}
packages/html/src/lib.rs
+4
View File
@@ -24,3 +24,7 @@ pub mod input_data;
pub use elements::*; pub use elements::*;
pub use events::*; pub use events::*;
pub use global_attributes::*; pub use global_attributes::*;
pub mod prelude {
pub use crate::events::*;
}