editbox.rs 41 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980981982983984985986987988989990991992993994995996997998999100010011002100310041005100610071008100910101011101210131014101510161017101810191020102110221023102410251026102710281029103010311032103310341035103610371038103910401041104210431044104510461047104810491050105110521053105410551056105710581059106010611062106310641065106610671068106910701071107210731074107510761077107810791080108110821083108410851086108710881089109010911092109310941095109610971098109911001101110211031104110511061107110811091110111111121113111411151116111711181119112011211122112311241125112611271128112911301131113211331134113511361137113811391140114111421143114411451146114711481149115011511152115311541155115611571158115911601161116211631164116511661167116811691170117111721173117411751176117711781179118011811182118311841185118611871188118911901191119211931194119511961197119811991200120112021203120412051206120712081209121012111212121312141215121612171218121912201221122212231224122512261227122812291230123112321233123412351236
  1. use miniquad::{window, BufferId, KeyCode, KeyMods, MouseButton, TextureId, TouchPhase};
  2. use rand::{rngs::OsRng, Rng};
  3. use std::{
  4. collections::HashMap,
  5. sync::{
  6. atomic::{AtomicBool, Ordering},
  7. Arc, Mutex as SyncMutex, Weak,
  8. },
  9. time::Instant,
  10. };
  11. use crate::{
  12. error::Result,
  13. gfx2::{
  14. DrawCall, DrawInstruction, DrawMesh, GraphicsEventPublisherPtr, Point, Rectangle,
  15. RenderApi, RenderApiPtr, Vertex,
  16. },
  17. mesh::{Color, MeshBuilder, MeshInfo, COLOR_BLUE, COLOR_WHITE},
  18. prop::{
  19. PropertyBool, PropertyColor, PropertyFloat32, PropertyPtr, PropertyStr, PropertyUint32,
  20. },
  21. pubsub::Subscription,
  22. scene::{Pimpl, SceneGraph, SceneGraphPtr2, SceneNodeId},
  23. text2::{self, Glyph, GlyphPositionIter, RenderedAtlas, SpritePtr, TextShaper, TextShaperPtr},
  24. util::zip3,
  25. };
  26. use super::{eval_rect, get_parent_rect, read_rect, DrawUpdate, OnModify, Stoppable};
  27. const CURSOR_WIDTH: f32 = 4.;
  28. #[derive(Debug, Clone, Eq, Hash, PartialEq)]
  29. enum PressedKey {
  30. Char(char),
  31. Key(KeyCode),
  32. }
  33. /// On key press (repeat=false), we immediately process the event.
  34. /// Then there's a delay (repeat=true) and then for every step time
  35. /// while key press events are being sent, we allow an event.
  36. /// This ensures smooth typing in the editbox.
  37. struct PressedKeysSmoothRepeat {
  38. /// When holding keys, we track from start and last sent time.
  39. /// This is useful for initial delay and smooth scrolling.
  40. pressed_keys: HashMap<PressedKey, RepeatingKeyTimer>,
  41. /// Initial delay before allowing keys
  42. start_delay: u32,
  43. /// Minimum time between repeated keys
  44. step_time: u32,
  45. }
  46. impl PressedKeysSmoothRepeat {
  47. fn new(start_delay: u32, step_time: u32) -> Self {
  48. Self { pressed_keys: HashMap::new(), start_delay, step_time }
  49. }
  50. fn key_down(&mut self, key: PressedKey, repeat: bool) -> u32 {
  51. //debug!(target: "PressedKeysSmoothRepeat", "key_down({:?}, {})", key, repeat);
  52. if !repeat {
  53. self.pressed_keys.remove(&key);
  54. return 1;
  55. }
  56. // Insert key if not exists
  57. if !self.pressed_keys.contains_key(&key) {
  58. //debug!(target: "PressedKeysSmoothRepeat", "insert key {:?}", key);
  59. self.pressed_keys.insert(key.clone(), RepeatingKeyTimer::new());
  60. }
  61. let repeater = self.pressed_keys.get_mut(&key).expect("repeat map");
  62. repeater.update(self.start_delay, self.step_time)
  63. }
  64. /*
  65. fn key_up(&mut self, key: &PressedKey) {
  66. //debug!(target: "PressedKeysSmoothRepeat", "key_up({:?})", key);
  67. println!("{:?}", self.pressed_keys.keys());
  68. assert!(self.pressed_keys.contains_key(key));
  69. self.pressed_keys.remove(key).expect("key was pressed");
  70. }
  71. */
  72. }
  73. struct RepeatingKeyTimer {
  74. start: Instant,
  75. actions: u32,
  76. }
  77. impl RepeatingKeyTimer {
  78. fn new() -> Self {
  79. Self { start: Instant::now(), actions: 0 }
  80. }
  81. fn update(&mut self, start_delay: u32, step_time: u32) -> u32 {
  82. let elapsed = self.start.elapsed().as_millis();
  83. //debug!(target: "RepeatingKeyTimer", "update() elapsed={}, actions={}",
  84. // elapsed, self.actions);
  85. if elapsed < start_delay as u128 {
  86. return 0
  87. }
  88. let total_actions = ((elapsed - start_delay as u128) / step_time as u128) as u32;
  89. let remaining_actions = total_actions - self.actions;
  90. self.actions = total_actions;
  91. remaining_actions
  92. }
  93. }
  94. #[derive(Clone)]
  95. struct TextRenderInfo {
  96. mesh: MeshInfo,
  97. texture_id: TextureId,
  98. }
  99. pub type EditBoxPtr = Arc<EditBox>;
  100. pub struct EditBox {
  101. node_id: SceneNodeId,
  102. tasks: Vec<smol::Task<()>>,
  103. sg: SceneGraphPtr2,
  104. render_api: RenderApiPtr,
  105. // So we can lock the event stream when we gain focus
  106. event_pub: GraphicsEventPublisherPtr,
  107. text_shaper: TextShaperPtr,
  108. key_repeat: SyncMutex<PressedKeysSmoothRepeat>,
  109. render_info: SyncMutex<Option<TextRenderInfo>>,
  110. glyphs: SyncMutex<Vec<Glyph>>,
  111. dc_key: u64,
  112. is_active: PropertyBool,
  113. is_focused: PropertyBool,
  114. rect: PropertyPtr,
  115. baseline: PropertyFloat32,
  116. scroll: PropertyFloat32,
  117. cursor_pos: PropertyUint32,
  118. font_size: PropertyFloat32,
  119. text: PropertyStr,
  120. text_color: PropertyColor,
  121. cursor_color: PropertyColor,
  122. hi_bg_color: PropertyColor,
  123. selected: PropertyPtr,
  124. z_index: PropertyUint32,
  125. debug: PropertyBool,
  126. mouse_btn_held: AtomicBool,
  127. }
  128. impl EditBox {
  129. pub async fn new(
  130. ex: Arc<smol::Executor<'static>>,
  131. sg: SceneGraphPtr2,
  132. node_id: SceneNodeId,
  133. render_api: RenderApiPtr,
  134. event_pub: GraphicsEventPublisherPtr,
  135. text_shaper: TextShaperPtr,
  136. ) -> Pimpl {
  137. let scene_graph = sg.lock().await;
  138. let node = scene_graph.get_node(node_id).unwrap();
  139. let node_name = node.name.clone();
  140. let is_active = PropertyBool::wrap(node, "is_active", 0).unwrap();
  141. let is_focused = PropertyBool::wrap(node, "is_focused", 0).unwrap();
  142. let rect = node.get_property("rect").expect("EditBox::rect");
  143. let baseline = PropertyFloat32::wrap(node, "baseline", 0).unwrap();
  144. let scroll = PropertyFloat32::wrap(node, "scroll", 0).unwrap();
  145. let cursor_pos = PropertyUint32::wrap(node, "cursor_pos", 0).unwrap();
  146. let font_size = PropertyFloat32::wrap(node, "font_size", 0).unwrap();
  147. let text = PropertyStr::wrap(node, "text", 0).unwrap();
  148. let text_color = PropertyColor::wrap(node, "text_color").unwrap();
  149. let cursor_color = PropertyColor::wrap(node, "cursor_color").unwrap();
  150. let hi_bg_color = PropertyColor::wrap(node, "hi_bg_color").unwrap();
  151. let selected = node.get_property("selected").unwrap();
  152. let z_index = PropertyUint32::wrap(node, "z_index", 0).unwrap();
  153. let debug = PropertyBool::wrap(node, "debug", 0).unwrap();
  154. drop(scene_graph);
  155. // testing
  156. window::show_keyboard(true);
  157. let glyphs = text_shaper.shape(text.get(), font_size.get()).await;
  158. let self_ = Arc::new_cyclic(|me: &Weak<Self>| {
  159. // Start a task monitoring for key down events
  160. let ev_sub = event_pub.subscribe_char();
  161. let me2 = me.clone();
  162. let char_task = ex.spawn(async move {
  163. loop {
  164. Self::process_char(&me2, &ev_sub).await;
  165. }
  166. });
  167. let ev_sub = event_pub.subscribe_key_down();
  168. let me2 = me.clone();
  169. let key_down_task = ex.spawn(async move {
  170. loop {
  171. Self::process_key_down(&me2, &ev_sub).await;
  172. }
  173. });
  174. /*
  175. let ev_sub = event_pub.subscribe_key_up();
  176. let me2 = me.clone();
  177. let key_up_task = ex.spawn(async move {
  178. loop {
  179. let Ok((key, mods)) = ev_sub.receive().await else {
  180. debug!(target: "ui::editbox", "Event relayer closed");
  181. break
  182. };
  183. let Some(self_) = me2.upgrade() else {
  184. // Should not happen
  185. panic!("self destroyed before key_up_task was stopped!");
  186. };
  187. let key = PressedKey::Key(key);
  188. let mut repeater = self_.key_repeat.lock().unwrap();
  189. repeater.key_up(&key);
  190. }
  191. });
  192. */
  193. let ev_sub = event_pub.subscribe_mouse_btn_down();
  194. let me2 = me.clone();
  195. let mouse_btn_down_task = ex.spawn(async move {
  196. loop {
  197. Self::process_mouse_btn_down(&me2, &ev_sub).await;
  198. }
  199. });
  200. let ev_sub = event_pub.subscribe_mouse_btn_up();
  201. let me2 = me.clone();
  202. let mouse_btn_up_task = ex.spawn(async move {
  203. loop {
  204. Self::process_mouse_btn_up(&me2, &ev_sub).await;
  205. }
  206. });
  207. let ev_sub = event_pub.subscribe_mouse_move();
  208. let me2 = me.clone();
  209. let mouse_move_task = ex.spawn(async move {
  210. loop {
  211. Self::process_mouse_move(&me2, &ev_sub).await;
  212. }
  213. });
  214. let ev_sub = event_pub.subscribe_touch();
  215. let me2 = me.clone();
  216. let touch_task = ex.spawn(async move {
  217. loop {
  218. Self::process_touch(&me2, &ev_sub).await;
  219. }
  220. });
  221. let mut on_modify = OnModify::new(ex, node_name, node_id, me.clone());
  222. on_modify.when_change(is_focused.prop(), Self::change_focus);
  223. async fn redraw(self_: Arc<EditBox>) {
  224. self_.redraw().await;
  225. }
  226. on_modify.when_change(rect.clone(), redraw);
  227. on_modify.when_change(baseline.prop(), redraw);
  228. on_modify.when_change(scroll.prop(), redraw);
  229. on_modify.when_change(cursor_pos.prop(), redraw);
  230. on_modify.when_change(font_size.prop(), redraw);
  231. on_modify.when_change(text.prop(), redraw);
  232. on_modify.when_change(text_color.prop(), redraw);
  233. on_modify.when_change(cursor_color.prop(), redraw);
  234. on_modify.when_change(hi_bg_color.prop(), redraw);
  235. on_modify.when_change(selected.clone(), redraw);
  236. on_modify.when_change(z_index.prop(), redraw);
  237. on_modify.when_change(debug.prop(), redraw);
  238. // on modify tasks too
  239. let mut tasks = vec![
  240. char_task,
  241. key_down_task,
  242. mouse_btn_down_task,
  243. mouse_btn_up_task,
  244. mouse_move_task,
  245. touch_task,
  246. ];
  247. tasks.append(&mut on_modify.tasks);
  248. Self {
  249. node_id,
  250. tasks,
  251. sg,
  252. render_api,
  253. event_pub,
  254. text_shaper,
  255. key_repeat: SyncMutex::new(PressedKeysSmoothRepeat::new(400, 50)),
  256. render_info: SyncMutex::new(None),
  257. glyphs: SyncMutex::new(glyphs),
  258. dc_key: OsRng.gen(),
  259. is_active,
  260. is_focused,
  261. rect,
  262. baseline,
  263. scroll,
  264. cursor_pos,
  265. font_size,
  266. text,
  267. text_color,
  268. cursor_color,
  269. hi_bg_color,
  270. selected,
  271. z_index,
  272. debug,
  273. mouse_btn_held: AtomicBool::new(false),
  274. }
  275. });
  276. Pimpl::EditBox(self_)
  277. }
  278. /// Called whenever the text or any text property changes.
  279. /// Not related to cursor, text highlighting or bounding (clip) rects.
  280. async fn regen_mesh(&self, mut clip: Rectangle) -> TextRenderInfo {
  281. clip.x = 0.;
  282. clip.y = 0.;
  283. let is_focused = self.is_focused.get();
  284. let text = self.text.get();
  285. let font_size = self.font_size.get();
  286. let text_color = self.text_color.get();
  287. let baseline = self.baseline.get();
  288. let scroll = self.scroll.get();
  289. let cursor_pos = self.cursor_pos.get() as usize;
  290. let cursor_color = self.cursor_color.get();
  291. let debug = self.debug.get();
  292. debug!(target: "ui::editbox", "Rendering text '{}' clip={:?}", text, clip);
  293. let glyphs = self.glyphs.lock().unwrap().clone();
  294. let atlas = text2::make_texture_atlas(&self.render_api, font_size, &glyphs).await.unwrap();
  295. let mut mesh = MeshBuilder::with_clip(clip.clone());
  296. self.draw_selected(&mut mesh, &glyphs, clip.h).unwrap();
  297. let mut glyph_pos_iter = GlyphPositionIter::new(font_size, &glyphs, baseline);
  298. // Used for drawing the cursor when it's at the end of the line.
  299. let mut rhs = 0.;
  300. for (glyph_idx, uv_rect, mut glyph_rect, glyph) in
  301. zip3(atlas.uv_rects.into_iter(), glyph_pos_iter, glyphs.iter())
  302. {
  303. glyph_rect.x += scroll;
  304. //mesh.draw_outline(&glyph_rect, COLOR_BLUE, 2.);
  305. let mut color = text_color.clone();
  306. if glyph.sprite.has_color {
  307. color = COLOR_WHITE;
  308. }
  309. mesh.draw_box(&glyph_rect, color, &uv_rect);
  310. if is_focused && cursor_pos != 0 && cursor_pos == glyph_idx {
  311. let cursor_rect =
  312. Rectangle { x: glyph_rect.x - CURSOR_WIDTH, y: 0., w: CURSOR_WIDTH, h: clip.h };
  313. mesh.draw_box(&cursor_rect, cursor_color, &Rectangle::zero());
  314. }
  315. rhs = glyph_rect.rhs();
  316. }
  317. if is_focused && cursor_pos == 0 {
  318. let cursor_rect = Rectangle { x: 0., y: 0., w: CURSOR_WIDTH, h: clip.h };
  319. mesh.draw_box(&cursor_rect, cursor_color, &Rectangle::zero());
  320. } else if is_focused && cursor_pos == glyphs.len() {
  321. let cursor_rect =
  322. Rectangle { x: rhs - CURSOR_WIDTH, y: 0., w: CURSOR_WIDTH, h: clip.h };
  323. mesh.draw_box(&cursor_rect, cursor_color, &Rectangle::zero());
  324. }
  325. if debug {
  326. mesh.draw_outline(&clip, COLOR_BLUE, 1.);
  327. }
  328. let mesh = mesh.alloc(&self.render_api).await.unwrap();
  329. TextRenderInfo { mesh, texture_id: atlas.texture_id }
  330. }
  331. fn draw_selected(
  332. &self,
  333. mesh: &mut MeshBuilder,
  334. glyphs: &Vec<Glyph>,
  335. clip_h: f32,
  336. ) -> Result<()> {
  337. if self.selected.is_null(0)? || self.selected.is_null(1)? {
  338. // Nothing selected so do nothing
  339. return Ok(())
  340. }
  341. let start = self.selected.get_u32(0)? as usize;
  342. let end = self.selected.get_u32(1)? as usize;
  343. // Selection started but nothing selected yet so do nothing
  344. if start == end {
  345. return Ok(())
  346. }
  347. let sel_start = std::cmp::min(start, end);
  348. let sel_end = std::cmp::max(start, end);
  349. let font_size = self.font_size.get();
  350. let baseline = self.baseline.get();
  351. let scroll = self.scroll.get();
  352. let hi_bg_color = self.hi_bg_color.get();
  353. let mut glyph_pos_iter = GlyphPositionIter::new(font_size, &glyphs, baseline);
  354. let mut start_x = 0.;
  355. let mut end_x = 0.;
  356. // When cursor lands at the end of the line
  357. let mut rhs = 0.;
  358. for (glyph_idx, mut glyph_rect) in glyph_pos_iter.enumerate() {
  359. glyph_rect.x += scroll;
  360. if glyph_idx == sel_start {
  361. start_x = glyph_rect.x;
  362. }
  363. if glyph_idx == sel_end {
  364. end_x = glyph_rect.x;
  365. }
  366. rhs = glyph_rect.rhs();
  367. }
  368. if sel_start == 0 {
  369. start_x = scroll;
  370. }
  371. if sel_end == glyphs.len() {
  372. end_x = rhs;
  373. }
  374. // We don't need to do manual clipping since MeshBuilder should do that
  375. let select_rect = Rectangle { x: start_x, y: 0., w: end_x - start_x, h: clip_h };
  376. mesh.draw_box(&select_rect, hi_bg_color, &Rectangle::zero());
  377. Ok(())
  378. }
  379. async fn do_key_action(&self, key: char, mods: &KeyMods) {
  380. match key {
  381. //KeyCode::Left => {}
  382. _ => self.insert_char(key).await,
  383. }
  384. }
  385. async fn process_char(me: &Weak<Self>, ev_sub: &Subscription<(char, KeyMods, bool)>) {
  386. let Ok((key, mods, repeat)) = ev_sub.receive().await else {
  387. debug!(target: "ui::editbox", "Event relayer closed");
  388. return
  389. };
  390. // First filter for only single digit keys
  391. if DISALLOWED_CHARS.contains(&key) {
  392. return
  393. }
  394. let Some(self_) = me.upgrade() else {
  395. // Should not happen
  396. panic!("self destroyed before char_task was stopped!");
  397. };
  398. if !self_.is_focused.get() {
  399. return
  400. }
  401. if mods.ctrl || mods.alt {
  402. if repeat {
  403. return
  404. }
  405. self_.handle_shortcut(key, &mods).await;
  406. return
  407. }
  408. let actions = {
  409. let mut repeater = self_.key_repeat.lock().unwrap();
  410. repeater.key_down(PressedKey::Char(key), repeat)
  411. };
  412. debug!(target: "ui::editbox", "Key {:?} has {} actions", key, actions);
  413. for _ in 0..actions {
  414. self_.insert_char(key).await;
  415. }
  416. }
  417. async fn process_key_down(me: &Weak<Self>, ev_sub: &Subscription<(KeyCode, KeyMods, bool)>) {
  418. let Ok((key, mods, repeat)) = ev_sub.receive().await else {
  419. debug!(target: "ui::editbox", "Event relayer closed");
  420. return
  421. };
  422. // First filter for only single digit keys
  423. // Avoid processing events handled by insert_char()
  424. if !ALLOWED_KEYCODES.contains(&key) {
  425. return
  426. }
  427. let Some(self_) = me.upgrade() else {
  428. // Should not happen
  429. panic!("self destroyed before char_task was stopped!");
  430. };
  431. if !self_.is_focused.get() {
  432. return
  433. }
  434. let actions = {
  435. let mut repeater = self_.key_repeat.lock().unwrap();
  436. repeater.key_down(PressedKey::Key(key), repeat)
  437. };
  438. // Suppress noisy message
  439. if actions > 0 {
  440. debug!(target: "ui::editbox", "Key {:?} has {} actions", key, actions);
  441. }
  442. for _ in 0..actions {
  443. self_.handle_key(&key, &mods).await;
  444. }
  445. }
  446. async fn process_mouse_btn_down(
  447. me: &Weak<Self>,
  448. ev_sub: &Subscription<(MouseButton, f32, f32)>,
  449. ) {
  450. let Ok((btn, mouse_x, mouse_y)) = ev_sub.receive().await else {
  451. debug!(target: "ui::editbox", "Event relayer closed");
  452. return
  453. };
  454. let Some(self_) = me.upgrade() else {
  455. // Should not happen
  456. panic!("self destroyed before mouse_btn_down_task was stopped!");
  457. };
  458. if !self_.is_active.get() {
  459. return
  460. }
  461. self_.handle_mouse_btn_down(btn, mouse_x, mouse_y).await;
  462. }
  463. async fn process_mouse_btn_up(me: &Weak<Self>, ev_sub: &Subscription<(MouseButton, f32, f32)>) {
  464. let Ok((btn, mouse_x, mouse_y)) = ev_sub.receive().await else {
  465. debug!(target: "ui::editbox", "Event relayer closed");
  466. return
  467. };
  468. let Some(self_) = me.upgrade() else {
  469. // Should not happen
  470. panic!("self destroyed before mouse_btn_up_task was stopped!");
  471. };
  472. if !self_.is_active.get() {
  473. return
  474. }
  475. self_.handle_mouse_btn_up(btn, mouse_x, mouse_y);
  476. }
  477. async fn process_mouse_move(me: &Weak<Self>, ev_sub: &Subscription<(f32, f32)>) {
  478. let Ok((mouse_x, mouse_y)) = ev_sub.receive().await else {
  479. debug!(target: "ui::editbox", "Event relayer closed");
  480. return
  481. };
  482. let Some(self_) = me.upgrade() else {
  483. // Should not happen
  484. panic!("self destroyed before mouse_move_task was stopped!");
  485. };
  486. if !self_.is_active.get() {
  487. return
  488. }
  489. self_.handle_mouse_move(mouse_x, mouse_y).await;
  490. }
  491. async fn process_touch(me: &Weak<Self>, ev_sub: &Subscription<(TouchPhase, u64, f32, f32)>) {
  492. let Ok((phase, id, touch_x, touch_y)) = ev_sub.receive().await else {
  493. debug!(target: "ui::editbox", "Event relayer closed");
  494. return
  495. };
  496. let Some(self_) = me.upgrade() else {
  497. // Should not happen
  498. panic!("self destroyed before touch_task was stopped!");
  499. };
  500. if !self_.is_active.get() {
  501. return
  502. }
  503. self_.handle_touch(phase, id, touch_x, touch_y).await;
  504. }
  505. async fn change_focus(self: Arc<Self>) {
  506. if !self.is_active.get() {
  507. return
  508. }
  509. debug!(target: "ui::editbox", "Focus changed");
  510. let is_focused = self.is_focused.get();
  511. // Cursor visibility will change so just redraw everything lol
  512. self.redraw().await;
  513. }
  514. async fn handle_mouse_btn_down(&self, btn: MouseButton, mouse_x: f32, mouse_y: f32) {
  515. if btn != MouseButton::Left {
  516. return
  517. }
  518. let mouse_pos = Point::from([mouse_x, mouse_y]);
  519. let mut focus_changed = false;
  520. let Some(rect) = self.get_cached_world_rect().await else { return };
  521. // clicking inside box will:
  522. // 1. make it active
  523. // 2. begin selection
  524. if rect.contains(&mouse_pos) {
  525. window::show_keyboard(true);
  526. if self.is_focused.get() {
  527. debug!(target: "ui::editbox", "EditBox clicked");
  528. } else {
  529. debug!(target: "ui::editbox", "EditBox focused");
  530. self.is_focused.set(true);
  531. focus_changed = true;
  532. }
  533. let cpos = self.find_closest_glyph_idx(mouse_x, &rect);
  534. // set cursor pos
  535. self.cursor_pos.set(cpos);
  536. self.apply_cursor_scrolling();
  537. // begin selection
  538. self.selected.set_u32(0, cpos).unwrap();
  539. self.selected.set_u32(1, cpos).unwrap();
  540. self.mouse_btn_held.store(true, Ordering::Relaxed);
  541. // click outside the box will make it unfocused
  542. } else if self.is_focused.get() {
  543. debug!(target: "ui::editbox", "EditBox unfocused");
  544. self.is_focused.set(false);
  545. self.selected.set_null(0).unwrap();
  546. self.selected.set_null(1).unwrap();
  547. focus_changed = true;
  548. }
  549. // Further on_focus logic change is handled by property modified callback
  550. // which calls Self::change_focus()
  551. // We still need to redraw if cursor is changed though, but we want to avoid redrawing
  552. // twice, so we do this check:
  553. if !focus_changed {
  554. self.redraw().await;
  555. }
  556. }
  557. fn handle_mouse_btn_up(&self, btn: MouseButton, x: f32, y: f32) {
  558. if btn != MouseButton::Left {
  559. return
  560. }
  561. // releasing mouse button will end selection
  562. self.mouse_btn_held.store(false, Ordering::Relaxed);
  563. }
  564. async fn handle_mouse_move(&self, mouse_x: f32, mouse_y: f32) {
  565. if !self.mouse_btn_held.load(Ordering::Relaxed) {
  566. return;
  567. }
  568. // if active and selection_active, then use x to modify the selection.
  569. // also implement scrolling when cursor is to the left or right
  570. // just scroll to the end
  571. // also set cursor_pos too
  572. let Some(rect) = self.get_cached_world_rect().await else { return };
  573. let cpos = self.find_closest_glyph_idx(mouse_x, &rect);
  574. self.cursor_pos.set(cpos);
  575. self.selected.set_u32(1, cpos).unwrap();
  576. self.apply_cursor_scrolling();
  577. self.redraw().await;
  578. }
  579. async fn handle_touch(&self, phase: TouchPhase, id: u64, touch_x: f32, touch_y: f32) {
  580. // Ignore multi-touch
  581. if id != 0 {
  582. return
  583. }
  584. // Simulate mouse events
  585. match phase {
  586. TouchPhase::Started => {
  587. self.handle_mouse_btn_down(MouseButton::Left, touch_x, touch_y).await
  588. }
  589. TouchPhase::Moved => self.handle_mouse_move(touch_x, touch_y).await,
  590. TouchPhase::Ended => self.handle_mouse_btn_up(MouseButton::Left, touch_x, touch_y),
  591. TouchPhase::Cancelled => {}
  592. }
  593. }
  594. /// Used when clicking the text. Given the x coord of the mouse, it finds the index
  595. /// of the closest glyph to that x coord.
  596. fn find_closest_glyph_idx(&self, x: f32, rect: &Rectangle) -> u32 {
  597. let font_size = self.font_size.get();
  598. let baseline = self.baseline.get();
  599. let glyphs = self.glyphs.lock().unwrap().clone();
  600. let mouse_x = x - rect.x;
  601. if mouse_x > rect.w {
  602. // Highlight to the end
  603. let cpos = glyphs.len() as u32;
  604. return cpos;
  605. // Scroll to the right handled in render
  606. } else if mouse_x < 0. {
  607. return 0;
  608. }
  609. let scroll = self.scroll.get();
  610. let mut cpos = 0;
  611. let lhs = 0.;
  612. let mut last_d = (lhs - mouse_x).abs();
  613. let mut glyph_pos_iter = GlyphPositionIter::new(font_size, &glyphs, baseline);
  614. let mut rhs = 0.;
  615. for (i, glyph_rect) in glyph_pos_iter.skip(1).enumerate() {
  616. // Because we skip the first item
  617. let glyph_idx = (i + 1) as u32;
  618. let x1 = glyph_rect.x + scroll;
  619. // I don't know what this is doing but it works so I won't touch it for now.
  620. let curr_d = (x1 - mouse_x).abs();
  621. if curr_d < last_d {
  622. last_d = curr_d;
  623. cpos = glyph_idx;
  624. }
  625. rhs = glyph_rect.rhs();
  626. }
  627. // also check the right hand side
  628. let curr_d = (rhs - mouse_x).abs();
  629. if curr_d < last_d {
  630. //last_d = curr_d;
  631. cpos = glyphs.len() as u32;
  632. }
  633. cpos
  634. }
  635. async fn insert_char(&self, key: char) {
  636. if !self.selected.is_null(0).unwrap() {
  637. self.delete_highlighted();
  638. // This is inefficient but we don't give a shit here
  639. self.redraw().await;
  640. };
  641. let mut text = String::new();
  642. let cursor_pos = self.cursor_pos.get();
  643. let glyphs = self.glyphs.lock().unwrap().clone();
  644. // We rebuild the string but insert our substr at cursor_pos.
  645. // The substr is inserted before cursor_pos, and appending to the end
  646. // of the string is when cursor_pos = len(str).
  647. // We can't use String::insert() because sometimes multiple chars are combined
  648. // into a single glyph. We treat the cursor pos as acting on the substrs
  649. // themselves.
  650. for (i, glyph) in glyphs.iter().enumerate() {
  651. if cursor_pos == i as u32 {
  652. text.push(key);
  653. }
  654. text.push_str(&glyph.substr);
  655. }
  656. // Append to the end
  657. if cursor_pos == glyphs.len() as u32 {
  658. text.push(key);
  659. }
  660. self.text.set(text);
  661. // Not always true lol
  662. // If glyphs are recombined, this could get messed up
  663. // meh lets pretend it doesn't exist for now.
  664. self.cursor_pos.set(cursor_pos + 1);
  665. self.apply_cursor_scrolling();
  666. self.redraw().await;
  667. }
  668. async fn handle_shortcut(&self, key: char, mods: &KeyMods) {
  669. debug!(target: "ui::editbox", "handle_shortcut({:?}, {:?})", key, mods);
  670. match key {
  671. 'c' => {
  672. if mods.ctrl {
  673. self.copy_highlighted().unwrap();
  674. }
  675. }
  676. 'v' => {
  677. if mods.ctrl {
  678. if let Some(text) = window::clipboard_get() {
  679. self.paste_text(text).await;
  680. }
  681. }
  682. }
  683. _ => {}
  684. }
  685. }
  686. async fn handle_key(&self, key: &KeyCode, mods: &KeyMods) {
  687. debug!(target: "ui::editbox", "handle_key({:?}, {:?})", key, mods);
  688. match key {
  689. KeyCode::Left => {
  690. let mut cursor_pos = self.cursor_pos.get();
  691. // Start selection if shift is held
  692. if !mods.shift {
  693. self.selected.set_null(0).unwrap();
  694. self.selected.set_null(1).unwrap();
  695. } else if self.selected.is_null(0).unwrap() {
  696. assert!(self.selected.is_null(1).unwrap());
  697. self.selected.set_u32(0, cursor_pos).unwrap();
  698. }
  699. if cursor_pos > 0 {
  700. cursor_pos -= 1;
  701. debug!(target: "ui::editbox", "Left cursor_pos={}", cursor_pos);
  702. self.cursor_pos.set(cursor_pos);
  703. }
  704. // Update selection
  705. if mods.shift {
  706. self.selected.set_u32(1, cursor_pos).unwrap();
  707. }
  708. self.apply_cursor_scrolling();
  709. self.redraw().await;
  710. }
  711. KeyCode::Right => {
  712. let mut cursor_pos = self.cursor_pos.get();
  713. // Start selection if shift is held
  714. if !mods.shift {
  715. self.selected.set_null(0).unwrap();
  716. self.selected.set_null(1).unwrap();
  717. } else if self.selected.is_null(0).unwrap() {
  718. assert!(self.selected.is_null(1).unwrap());
  719. self.selected.set_u32(0, cursor_pos).unwrap();
  720. }
  721. let glyphs_len = self.glyphs.lock().unwrap().len() as u32;
  722. if cursor_pos < glyphs_len {
  723. cursor_pos += 1;
  724. debug!(target: "ui::editbox", "Right cursor_pos={}", cursor_pos);
  725. self.cursor_pos.set(cursor_pos);
  726. }
  727. // Update selection
  728. if mods.shift {
  729. self.selected.set_u32(1, cursor_pos).unwrap();
  730. }
  731. self.apply_cursor_scrolling();
  732. self.redraw().await;
  733. }
  734. //KeyCode::Up,
  735. //KeyCode::Down,
  736. //KeyCode::Enter,
  737. KeyCode::Kp0 => self.insert_char('0').await,
  738. KeyCode::Kp1 => self.insert_char('1').await,
  739. KeyCode::Kp2 => self.insert_char('2').await,
  740. KeyCode::Kp3 => self.insert_char('3').await,
  741. KeyCode::Kp4 => self.insert_char('4').await,
  742. KeyCode::Kp5 => self.insert_char('5').await,
  743. KeyCode::Kp6 => self.insert_char('6').await,
  744. KeyCode::Kp7 => self.insert_char('7').await,
  745. KeyCode::Kp8 => self.insert_char('8').await,
  746. KeyCode::Kp9 => self.insert_char('9').await,
  747. KeyCode::KpDecimal => self.insert_char('.').await,
  748. KeyCode::Enter | KeyCode::KpEnter => self.send_event().await,
  749. KeyCode::Delete => {
  750. if !self.selected.is_null(0).unwrap() {
  751. self.delete_highlighted();
  752. } else {
  753. let glyphs = self.glyphs.lock().unwrap().clone();
  754. let cursor_pos = self.cursor_pos.get();
  755. if cursor_pos == glyphs.len() as u32 {
  756. return;
  757. }
  758. // Regen text
  759. let mut text = String::new();
  760. for (i, glyph) in glyphs.iter().enumerate() {
  761. let mut substr = glyph.substr.clone();
  762. if cursor_pos as usize == i {
  763. // Lmk if anyone knows a better way to do substr.pop_front()
  764. let mut chars = substr.chars();
  765. chars.next();
  766. substr = chars.as_str().to_string();
  767. }
  768. text.push_str(&substr);
  769. }
  770. self.text.set(text);
  771. };
  772. self.apply_cursor_scrolling();
  773. self.redraw().await;
  774. }
  775. KeyCode::Backspace => {
  776. if !self.selected.is_null(0).unwrap() {
  777. self.delete_highlighted();
  778. } else {
  779. let glyphs = self.glyphs.lock().unwrap().clone();
  780. let cursor_pos = self.cursor_pos.get();
  781. if cursor_pos == 0 {
  782. return;
  783. }
  784. let mut text = String::new();
  785. for (i, glyph) in glyphs.iter().enumerate() {
  786. let mut substr = glyph.substr.clone();
  787. if cursor_pos as usize - 1 == i {
  788. substr.pop().unwrap();
  789. }
  790. text.push_str(&substr);
  791. }
  792. self.text.set(text);
  793. self.cursor_pos.set(cursor_pos - 1);
  794. };
  795. self.apply_cursor_scrolling();
  796. self.redraw().await;
  797. }
  798. _ => {}
  799. }
  800. }
  801. fn delete_highlighted(&self) {
  802. assert!(!self.selected.is_null(0).unwrap());
  803. assert!(!self.selected.is_null(1).unwrap());
  804. let start = self.selected.get_u32(0).unwrap() as usize;
  805. let end = self.selected.get_u32(1).unwrap() as usize;
  806. let sel_start = std::cmp::min(start, end);
  807. let sel_end = std::cmp::max(start, end);
  808. let mut text = String::new();
  809. let glyphs = self.glyphs.lock().unwrap().clone();
  810. // Regen text
  811. for (i, glyph) in glyphs.iter().enumerate() {
  812. if sel_start <= i && i < sel_end {
  813. continue
  814. }
  815. text.push_str(&glyph.substr);
  816. }
  817. debug!(
  818. target: "ui::editbox",
  819. "delete_highlighted() text=\"{}\", cursor_pos={}",
  820. text, sel_start
  821. );
  822. self.text.set(text);
  823. self.selected.set_null(0).unwrap();
  824. self.selected.set_null(1).unwrap();
  825. self.cursor_pos.set(sel_start as u32);
  826. }
  827. fn copy_highlighted(&self) -> Result<()> {
  828. let start = self.selected.get_u32(0)? as usize;
  829. let end = self.selected.get_u32(1)? as usize;
  830. let sel_start = std::cmp::min(start, end);
  831. let sel_end = std::cmp::max(start, end);
  832. let mut text = String::new();
  833. let glyphs = self.glyphs.lock().unwrap().clone();
  834. for (glyph_idx, glyph) in glyphs.iter().enumerate() {
  835. if sel_start <= glyph_idx && glyph_idx < sel_end {
  836. text.push_str(&glyph.substr);
  837. }
  838. }
  839. info!(target: "ui::editbox", "Copied '{}'", text);
  840. window::clipboard_set(&text);
  841. Ok(())
  842. }
  843. async fn paste_text(&self, key: String) {
  844. let mut text = String::new();
  845. let cursor_pos = self.cursor_pos.get();
  846. if cursor_pos == 0 {
  847. text = key.clone();
  848. }
  849. let glyphs = self.glyphs.lock().unwrap().clone();
  850. for (glyph_idx, glyph) in glyphs.iter().enumerate() {
  851. text.push_str(&glyph.substr);
  852. if cursor_pos == glyph_idx as u32 + 1 {
  853. text.push_str(&key);
  854. }
  855. }
  856. self.text.set(text);
  857. // Not always true lol
  858. self.cursor_pos.set(cursor_pos + 1);
  859. self.apply_cursor_scrolling();
  860. self.redraw().await;
  861. }
  862. /// Beware of this method. Here be dragons.
  863. /// Possibly racy so we limit it just to cursor scrolling.
  864. fn cached_rect(&self) -> Rectangle {
  865. let Ok(rect) = read_rect(self.rect.clone()) else {
  866. panic!("Node bad rect property");
  867. };
  868. rect
  869. }
  870. async fn get_parent_rect(&self) -> Option<Rectangle> {
  871. let sg = self.sg.lock().await;
  872. let node = sg.get_node(self.node_id).unwrap();
  873. let Some(parent_rect) = get_parent_rect(&sg, node) else {
  874. return None;
  875. };
  876. drop(sg);
  877. Some(parent_rect)
  878. }
  879. async fn get_cached_world_rect(&self) -> Option<Rectangle> {
  880. // NBD if it's slightly wrong
  881. let mut rect = self.cached_rect();
  882. // If layers can be nested and we use offsets for (x, y)
  883. // then this will be incorrect for nested layers.
  884. // For now we don't allow nesting of layers.
  885. let parent_rect = self.get_parent_rect().await?;
  886. // Offset rect which is now in world coords
  887. rect.x += parent_rect.x;
  888. rect.y += parent_rect.y;
  889. Some(rect)
  890. }
  891. /// Whenever the cursor property is modified this MUST be called
  892. /// to recalculate the scroll x property.
  893. fn apply_cursor_scrolling(&self) {
  894. // This may need updating but yolo rite
  895. let rect = self.cached_rect();
  896. let cursor_pos = self.cursor_pos.get() as usize;
  897. let mut scroll = self.scroll.get();
  898. let cursor_x = {
  899. let font_size = self.font_size.get();
  900. let baseline = self.baseline.get();
  901. let glyphs = self.glyphs.lock().unwrap().clone();
  902. let mut glyph_pos_iter = GlyphPositionIter::new(font_size, &glyphs, baseline);
  903. if cursor_pos == 0 {
  904. 0.
  905. } else if cursor_pos == glyphs.len() {
  906. let glyph_pos = glyph_pos_iter.last().unwrap();
  907. glyph_pos.rhs()
  908. } else {
  909. assert!(cursor_pos < glyphs.len());
  910. let glyph_pos = glyph_pos_iter.nth(cursor_pos).expect("glyph pos mismatch glyphs");
  911. glyph_pos.x
  912. }
  913. };
  914. let cursor_lhs = cursor_x + scroll;
  915. let cursor_rhs = cursor_lhs + CURSOR_WIDTH;
  916. if cursor_rhs > rect.w {
  917. scroll = rect.w - cursor_x;
  918. } else if cursor_lhs < 0. {
  919. scroll = -cursor_x + CURSOR_WIDTH;
  920. }
  921. self.scroll.set(scroll);
  922. }
  923. async fn redraw(&self) {
  924. let old = self.render_info.lock().unwrap().clone();
  925. let glyphs = self.text_shaper.shape(self.text.get(), self.font_size.get()).await;
  926. *self.glyphs.lock().unwrap() = glyphs;
  927. // draw will recalc this when it's None
  928. *self.render_info.lock().unwrap() = None;
  929. let sg = self.sg.lock().await;
  930. let node = sg.get_node(self.node_id).unwrap();
  931. let Some(parent_rect) = get_parent_rect(&sg, node) else {
  932. return;
  933. };
  934. let Some(draw_update) = self.draw(&sg, &parent_rect).await else {
  935. error!(target: "ui::editbox", "Text {:?} failed to draw", node);
  936. return;
  937. };
  938. self.render_api.replace_draw_calls(draw_update.draw_calls).await;
  939. debug!(target: "ui::editbox", "replace draw calls done");
  940. // We're finished with these so clean up.
  941. if let Some(old) = old {
  942. self.render_api.delete_buffer(old.mesh.vertex_buffer);
  943. self.render_api.delete_buffer(old.mesh.index_buffer);
  944. self.render_api.delete_texture(old.texture_id);
  945. }
  946. }
  947. pub async fn draw(&self, sg: &SceneGraph, parent_rect: &Rectangle) -> Option<DrawUpdate> {
  948. debug!(target: "ui::editbox", "EditBox::draw()");
  949. // Only used for debug messages
  950. let node = sg.get_node(self.node_id).unwrap();
  951. if let Err(err) = eval_rect(self.rect.clone(), parent_rect) {
  952. panic!("Node {:?} bad rect property: {}", node, err);
  953. }
  954. let Ok(mut rect) = read_rect(self.rect.clone()) else {
  955. panic!("Node {:?} bad rect property", node);
  956. };
  957. rect.x += parent_rect.x;
  958. rect.y += parent_rect.y;
  959. let render_info = self.render_info.lock().unwrap().clone();
  960. let render_info = match render_info {
  961. Some(render_info) => render_info,
  962. None => {
  963. let render_info = self.regen_mesh(rect.clone()).await;
  964. *self.render_info.lock().unwrap() = Some(render_info.clone());
  965. render_info
  966. }
  967. };
  968. let mesh = DrawMesh {
  969. vertex_buffer: render_info.mesh.vertex_buffer,
  970. index_buffer: render_info.mesh.index_buffer,
  971. texture: Some(render_info.texture_id),
  972. num_elements: render_info.mesh.num_elements,
  973. };
  974. let off_x = rect.x / parent_rect.w;
  975. let off_y = rect.y / parent_rect.h;
  976. let scale_x = 1. / parent_rect.w;
  977. let scale_y = 1. / parent_rect.h;
  978. let model = glam::Mat4::from_translation(glam::Vec3::new(off_x, off_y, 0.)) *
  979. glam::Mat4::from_scale(glam::Vec3::new(scale_x, scale_y, 1.));
  980. Some(DrawUpdate {
  981. key: self.dc_key,
  982. draw_calls: vec![(
  983. self.dc_key,
  984. DrawCall {
  985. instrs: vec![DrawInstruction::ApplyMatrix(model), DrawInstruction::Draw(mesh)],
  986. dcs: vec![],
  987. z_index: self.z_index.get(),
  988. },
  989. )],
  990. })
  991. }
  992. async fn send_event(&self) {
  993. let text = self.text.get();
  994. debug!(target: "ui::editbox", "sending text {}", text);
  995. // This should probably be unset instead
  996. self.text.set(String::new());
  997. self.cursor_pos.set(0);
  998. self.redraw().await;
  999. }
  1000. }
  1001. impl Stoppable for EditBox {
  1002. async fn stop(&self) {
  1003. // TODO: Delete own draw call
  1004. // Free buffers
  1005. // Should this be in drop?
  1006. //self.render_api.delete_buffer(self.vertex_buffer);
  1007. //self.render_api.delete_buffer(self.index_buffer);
  1008. }
  1009. }
  1010. /// Filter these char events from being handled since we handle them
  1011. /// using the key_up/key_down events.
  1012. /// Avoids duplicate processing of keyboard input events.
  1013. static DISALLOWED_CHARS: &'static [char] = &['\r', '\u{8}', '\u{7f}', '\t', '\n'];
  1014. /// These keycodes are handled via normal key_up/key_down events.
  1015. /// Anything in this list must be disallowed char events.
  1016. static ALLOWED_KEYCODES: &'static [KeyCode] = &[
  1017. KeyCode::Left,
  1018. KeyCode::Right,
  1019. KeyCode::Up,
  1020. KeyCode::Down,
  1021. KeyCode::Enter,
  1022. KeyCode::Kp0,
  1023. KeyCode::Kp1,
  1024. KeyCode::Kp2,
  1025. KeyCode::Kp3,
  1026. KeyCode::Kp4,
  1027. KeyCode::Kp5,
  1028. KeyCode::Kp6,
  1029. KeyCode::Kp7,
  1030. KeyCode::Kp8,
  1031. KeyCode::Kp9,
  1032. KeyCode::KpDecimal,
  1033. KeyCode::KpEnter,
  1034. KeyCode::Delete,
  1035. KeyCode::Backspace,
  1036. ];