-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathdraft.txt
49 lines (31 loc) · 2.03 KB
/
draft.txt
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
1. How to recognize click
Current :: Pinching Gesture
-> Is it okay to use Pinching as click gesture considering performance?
2. How does the program recognize pinching Gesture?
Current :: cacluate distance between index finger tip and thumb tip in 2-Dimensionals and compare whether its lower than threshold
-> calculating distance per every frame seems bit tough
-> remain ?? gesture recognition
3. How to deal with DOM pinching
since pinching is occuring on canvas context, we can't directly make connection from canvas -> main DOM
so the only option I've got is using coord info's and emit event on specific position.
Therefore, process will be held like this. (action) = f({ x : x_pos , y : y_pos})
using Brutal force, whenever dom, renders, I have to calculate every DOMNode's boundary( click boudary),
and whenever event broadcasts, I've to check every nodes boundary and check whether event is interior of current element.
to deal with this,
1. Restrict node boundary.
-> As a Draft, we could indicate flag for every 'Gesture Clickable' element
e.g) <div gestureClickable >Gesture clickable</div>
2. Among clickable Nodes, how can I find closest node from trigger point(event point)?
-> initially, event propagation not supported
-> its kinda search problem, so we could use sort and binary search to find the closest target point.
-> ex) assume trigger point is { x : 250 , y : 600} , window size { x : 1280 , y: 960 } , inner boundary threshold
-> nodes = [
{x : 300 , y: 100 , dx : 50, dy: 50},{x : 600 , y: 100, dx : 50, dy: 50},{x : 900 , y: 100, dx : 50, dy: 50},
{x : 300 , y: 400, dx : 50, dy: 50},{x : 600 , y: 400, dx : 50, dy: 50},{x : 900 , y: 400, dx : 50, dy: 50},
{x : 300 , y: 800 ,dx : 50, dy: 50},{x : 600 , y: 800, dx : 50, dy: 50},{x : 900 , y: 800, dx : 50, dy: 50}
] // name nodes with index p0 ~ p8
first, sort array base with x value
sortedNode = [p0,p3,p6,p1,p4,p7,p2,p5,p8]
run binary search and filter candidates?
k-d tree ? voronoi diagram?
https://stackoverflow.com/questions/1901139/closest-point-to-a-given-point