WIP: right-click menuright-click

1 files changed, 51 insertions, 13 deletions

diff --git a/src/lib.rs b/src/lib.rs
index 570d2f6..a3e153b 100644
--- a/src/lib.rs
+++ b/src/lib.rs
@@ -1,14 +1,5 @@
 use std::{
-    borrow::Borrow,
-    cell::RefCell,
-    collections::{HashMap, HashSet},
-    marker::PhantomData,
-    ops::{Deref, DerefMut},
-    rc::Rc,
-    str::FromStr,
-    sync::{atomic::AtomicUsize, Arc, RwLock},
-    thread::sleep,
-    time::{self, Duration},
+    borrow::Borrow, cell::RefCell, cmp::{max, min}, collections::{HashMap, HashSet}, marker::PhantomData, ops::{Deref, DerefMut}, rc::Rc, str::FromStr, sync::{atomic::AtomicUsize, Arc, RwLock}, thread::sleep, time::{self, Duration}
 };
 
 use base64::{Engine, prelude::BASE64_STANDARD};
@@ -20,10 +11,10 @@ use futures::stream::StreamExt;
 use indexmap::IndexMap;
 use jid::JID;
 use leptos::{
-    ev::{Event, KeyboardEvent, SubmitEvent},
+    ev::{Event, KeyboardEvent, MouseEvent, SubmitEvent},
     html::{self, Div, Input, Pre, Textarea},
-    prelude::*,
-    tachys::{dom::document, reactive_graph::bind::GetValue},
+    prelude::{document, *},
+    tachys::{dom::{document, window}, reactive_graph::bind::GetValue},
     task::{spawn, spawn_local},
 };
 use reactive_stores::{ArcStore, Store, StoreField};
@@ -2581,3 +2572,50 @@ fn ChatsListItem(chat: MacawChat, message: MacawMessage) -> impl IntoView {
         </div>
     }
 }
+
+#[component]
+fn ContextMenu(menu: Children, children: Children) -> impl IntoView {
+    let (open, set_open) = signal(false);
+
+    let on_click = |e: MouseEvent| {
+        e.prevent_default();
+        let window = window();
+        let menu = document().get_element_by_id("context-menu").expect("");
+        let menu_content = document().get_element_by_id("context-menu-content");
+        let x = e.client_x();
+        let y = e.client_y();
+        let x = max(0, min(x, window.outer_width() - menu.outer_width()));
+        let y = max(0, min(y, window.outer_height() - menu.outer_height()));
+        // set as visible
+    };
+
+    view! {
+        {children()}
+        {move || if *open.read() {
+            view! {
+                <div class="context-menu" on:click=on_click>
+                    <div class="context-menu-background"></div>
+                    <div class="menu">{menu()}</div>
+                </div>
+            }.into_any()
+        } else {
+            view! {}.into_any()
+        }}
+    }
+}
+
+#[component]
+fn ContextMenuWrap(children: Children) -> impl IntoView {
+    let (context_menu context_menu) = signal(None::<Vec<AnyView>>);
+
+    view! {
+        <div class="context-menu-wrap">
+            {children()}
+            <div class="context-menu">
+                {move || context_menu.get()}
+            </div>
+            <div class="context-menu-background"></div>
+        </div>
+    }
+}
+