rpgx-dioxus 0.1.5

Dioxus plugin for the RPGX engine
Documentation 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105

use dioxus::prelude::*;
use rpgx::{
    library::Library,
    prelude::{RPGXError, Rect},
};
use std::any::Any;

#[derive(PartialEq, Props, Clone)]
pub struct TileProps {
    tile: Rect,
    layer_z: u32,
    square_size: u32,
    library: Signal<Library<Box<dyn Any>>>,
    onclick: EventHandler<Result<Rect, RPGXError>>,
}

#[allow(non_snake_case)]
pub fn Tile(props: TileProps) -> Element {
    let background = if let Some(texture_id) = props.tile.effect.texture_id {
        if let Some(asset) = props
            .library
            .read()
            .get_by_id(texture_id)
            .and_then(|boxed| boxed.downcast_ref::<String>())
        {
            format!("background-image: url({}); background-size: cover;", asset)
        } else {
            "background-size: cover;".to_string()
        }
    } else {
        "background-size: cover;".to_string()
    };

    let x = props.tile.area.origin.x;
    let y = props.tile.area.origin.y;

    let base_style = format!(
        "{background} \
        position: absolute; \
        left: {}px; \
        top: {}px; \
        width: {}px; \
        height: {}px; \
        border: solid 1px rgba(255,255,255,0.1); \
        z-index: {}; \
        pointer-events: {}; \
        cursor: pointer;",
        x * props.square_size,
        y * props.square_size,
        // if props.tile.effect.group {
        //     props.tile.area.shape.width
        // } else {
        //     1
        // } * props.square_size,
        props.tile.area.shape.width * props.square_size,
        // if props.tile.effect.group {
        //     props.tile.area.shape.height
        // } else {
        //     1
        // } * props.square_size,
        props.tile.area.shape.height * props.square_size,
        props.layer_z,
        // if props.layer_kind == LayerType::Base {
        //     "auto"
        // } else {
        //     "none"
        // }
        "auto"
    );

    let onclick_tile = {
        let tile = props.tile.clone();
        // console::log_1(&"onclick_tile".into());
        move |_| {
            println!("onclick_tile");
            // console::log_1(&"onclick_tile_emit_props".into());
            let _ = props.onclick.call(Ok(tile.clone()));
        }
    };

    let library = props.library.read();

    rsx! {
        div {
            class: "layer-tile",
            style: "{base_style}",
            onclick: onclick_tile,
            {
                props
                    .tile
                    .effect
                    .render_id
                    .and_then(|id| {
                        println!(
                            "Rendering custom VNode from library {:?}",
                            library.get_by_id(id),
                        );
                        let f = library.get_by_id(id)?.downcast_ref::<Box<dyn Fn() -> VNode>>()?;
                        Some(f())
                    })
                    .unwrap_or(rsx! {}.unwrap())
            }
        }
    }
}