diff options
Diffstat (limited to 'src/components/taggs')
-rw-r--r-- | src/components/taggs/TaggDraggable.tsx | 48 |
1 files changed, 22 insertions, 26 deletions
diff --git a/src/components/taggs/TaggDraggable.tsx b/src/components/taggs/TaggDraggable.tsx index e31be729..e964d3d1 100644 --- a/src/components/taggs/TaggDraggable.tsx +++ b/src/components/taggs/TaggDraggable.tsx @@ -1,5 +1,5 @@ import {useNavigation} from '@react-navigation/native'; -import React, {useEffect, useRef} from 'react'; +import React, {useRef} from 'react'; import { Image, StyleSheet, @@ -7,6 +7,7 @@ import { TouchableOpacity, TouchableWithoutFeedback, View, + ViewProps, } from 'react-native'; import {useDispatch, useSelector} from 'react-redux'; import Avatar from '../../components/common/Avatar'; @@ -15,11 +16,13 @@ import {ProfilePreviewType, ScreenType, UserType} from '../../types'; import {normalize} from '../../utils'; import {navigateToProfile} from '../../utils/users'; -interface TaggDraggableProps { +interface TaggDraggableProps extends ViewProps { taggedUser: ProfilePreviewType; editingView: boolean; deleteFromList: () => void; setStart: Function; + offset: {fx: number; fy: number}; + imageDimensions: {width: number; height: number}; } const TaggDraggable: React.FC<TaggDraggableProps> = ( @@ -28,42 +31,35 @@ const TaggDraggable: React.FC<TaggDraggableProps> = ( const navigation = useNavigation(); const dispatch = useDispatch(); const state = useSelector((rs: RootState) => rs); - const {taggedUser, editingView, deleteFromList, setStart} = props; + const { + taggedUser, + editingView, + deleteFromList, + setStart, + offset, + imageDimensions, + } = props; let uriX = require('../../assets/images/draggableX.png'); let uriTip = require('../../assets/images/Tagg-Triangle.png'); const draggableRef = useRef(null); - useEffect(() => { + const getPositions = () => draggableRef.current.measure( ( - fx: number, // location of ref relative to parent element - fy: number, - width: number, - height: number, + _fx: number, // location of ref relative to parent element + _fy: number, + _width: number, + _height: number, px: number, // location of ref relative to entire screen py: number, ) => { - console.log(px); - // TODO: george + return [ + Math.floor(((px - offset.fx) / imageDimensions.width) * 100), + Math.floor(((py - offset.fy) / imageDimensions.height) * 100), + ]; }, ); - }); - - const getCoords = () => { - draggableRef.current.measure( - ( - fx: number, // location of ref relative to parent element - fy: number, - width: number, - height: number, - px: number, // location of ref relative to entire screen - py: number, - ) => { - return [px, py]; - }, - ); - }; const user: UserType = { userId: taggedUser.id, |