@@ -60,45 +60,45 @@ export function usePosition(panelEl: Ref<HTMLElement | undefined>) {
60
60
61
61
onMounted ( ( ) => {
62
62
bringUp ( )
63
+ } )
63
64
64
- useEventListener ( window , 'pointerup' , ( ) => {
65
- isDragging . value = false
66
- } )
67
- useEventListener ( window , 'pointerleave' , ( ) => {
68
- isDragging . value = false
69
- } )
70
- useEventListener ( window , 'pointermove' , ( e ) => {
71
- if ( ! isDragging . value )
72
- return
73
-
74
- const centerX = windowWidth . value / 2
75
- const centerY = windowHeight . value / 2
76
-
77
- const x = e . clientX - draggingOffset . x
78
- const y = e . clientY - draggingOffset . y
79
-
80
- mousePosition . x = x
81
- mousePosition . y = y
82
-
83
- // Get position
84
- const deg = Math . atan2 ( y - centerY , x - centerX )
85
- const HORIZONTAL_MARGIN = 70
86
- const TL = Math . atan2 ( 0 - centerY + HORIZONTAL_MARGIN , 0 - centerX )
87
- const TR = Math . atan2 ( 0 - centerY + HORIZONTAL_MARGIN , windowWidth . value - centerX )
88
- const BL = Math . atan2 ( windowHeight . value - HORIZONTAL_MARGIN - centerY , 0 - centerX )
89
- const BR = Math . atan2 ( windowHeight . value - HORIZONTAL_MARGIN - centerY , windowWidth . value - centerX )
90
-
91
- updateState ( {
92
- position : ( deg >= TL && deg <= TR )
93
- ? 'top'
94
- : ( deg >= TR && deg <= BR )
95
- ? 'right'
96
- : ( deg >= BR && deg <= BL )
97
- ? 'bottom'
98
- : 'left' ,
99
- left : snapToPoints ( x / windowWidth . value * 100 ) ,
100
- top : snapToPoints ( y / windowHeight . value * 100 ) ,
101
- } )
65
+ useEventListener ( 'pointerup' , ( ) => {
66
+ isDragging . value = false
67
+ } )
68
+ useEventListener ( 'pointerleave' , ( ) => {
69
+ isDragging . value = false
70
+ } )
71
+ useEventListener ( 'pointermove' , ( e ) => {
72
+ if ( ! isDragging . value )
73
+ return
74
+
75
+ const centerX = windowWidth . value / 2
76
+ const centerY = windowHeight . value / 2
77
+
78
+ const x = e . clientX - draggingOffset . x
79
+ const y = e . clientY - draggingOffset . y
80
+
81
+ mousePosition . x = x
82
+ mousePosition . y = y
83
+
84
+ // Get position
85
+ const deg = Math . atan2 ( y - centerY , x - centerX )
86
+ const HORIZONTAL_MARGIN = 70
87
+ const TL = Math . atan2 ( 0 - centerY + HORIZONTAL_MARGIN , 0 - centerX )
88
+ const TR = Math . atan2 ( 0 - centerY + HORIZONTAL_MARGIN , windowWidth . value - centerX )
89
+ const BL = Math . atan2 ( windowHeight . value - HORIZONTAL_MARGIN - centerY , 0 - centerX )
90
+ const BR = Math . atan2 ( windowHeight . value - HORIZONTAL_MARGIN - centerY , windowWidth . value - centerX )
91
+
92
+ updateState ( {
93
+ position : ( deg >= TL && deg <= TR )
94
+ ? 'top'
95
+ : ( deg >= TR && deg <= BR )
96
+ ? 'right'
97
+ : ( deg >= BR && deg <= BL )
98
+ ? 'bottom'
99
+ : 'left' ,
100
+ left : snapToPoints ( x / windowWidth . value * 100 ) ,
101
+ top : snapToPoints ( y / windowHeight . value * 100 ) ,
102
102
} )
103
103
} )
104
104
0 commit comments