diff options
Diffstat (limited to 'components/Tweaks/BehaviorPanel.tsx')
| -rw-r--r-- | components/Tweaks/BehaviorPanel.tsx | 170 |
1 files changed, 0 insertions, 170 deletions
diff --git a/components/Tweaks/BehaviorPanel.tsx b/components/Tweaks/BehaviorPanel.tsx deleted file mode 100644 index 5d61730..0000000 --- a/components/Tweaks/BehaviorPanel.tsx +++ /dev/null @@ -1,170 +0,0 @@ -import { ChevronDownIcon } from '@chakra-ui/icons' -import { - Button, - Flex, - Menu, - MenuButton, - MenuItem, - MenuList, - Portal, - StackDivider, - VStack, - Text, - Box, - Switch, -} from '@chakra-ui/react' -import React from 'react' -import { initialBehavior, initialMouse } from '../config' -import { InfoTooltip } from './InfoTooltip' -import { SliderWithInfo } from './SliderWithInfo' - -export interface BehaviorPanelProps { - behavior: typeof initialBehavior - setBehavior: any - mouse: typeof initialMouse - setMouse: any -} -export const BehaviorPanel = (props: BehaviorPanelProps) => { - const { behavior, setBehavior, mouse, setMouse } = props - return ( - <VStack - spacing={2} - justifyContent="flex-start" - divider={<StackDivider borderColor="gray.500" />} - align="stretch" - paddingLeft={7} - color="gray.800" - > - <Flex alignItems="center" justifyContent="space-between"> - <Text>Preview node</Text> - <Menu isLazy placement="right"> - <MenuButton as={Button} rightIcon={<ChevronDownIcon />} colorScheme="" color="black"> - <Text> - {mouse.preview ? mouse.preview[0]!.toUpperCase() + mouse.preview!.slice(1) : 'Never'} - </Text> - </MenuButton> - <Portal> - {' '} - <MenuList bgColor="gray.200" zIndex="popover"> - <MenuItem onClick={() => setMouse({ ...mouse, preview: '' })}>Never</MenuItem> - <MenuItem onClick={() => setMouse({ ...mouse, preview: 'click' })}>Click</MenuItem> - <MenuItem onClick={() => setMouse({ ...mouse, preview: 'double' })}> - Double Click - </MenuItem> - </MenuList> - </Portal> - </Menu> - </Flex> - <Flex alignItems="center" justifyContent="space-between"> - <Flex> - <Text>Expand Node</Text> - <InfoTooltip infoText="View only the node and its direct neighbors" /> - </Flex> - <Menu isLazy placement="right"> - <MenuButton as={Button} rightIcon={<ChevronDownIcon />} colorScheme="" color="black"> - <Text> - {mouse.local ? mouse.local[0]!.toUpperCase() + mouse.local!.slice(1) : 'Never'} - </Text> - </MenuButton> - <Portal> - {' '} - <MenuList zIndex="popover" bgColor="gray.200"> - <MenuItem onClick={() => setMouse({ ...mouse, local: '' })}>Never</MenuItem> - <MenuItem onClick={() => setMouse({ ...mouse, local: 'click' })}>Click</MenuItem> - <MenuItem onClick={() => setMouse({ ...mouse, local: 'double' })}> - Double Click - </MenuItem> - <MenuItem onClick={() => setMouse({ ...mouse, local: 'right' })}> - Right Click - </MenuItem> - </MenuList> - </Portal> - </Menu> - </Flex> - <Flex alignItems="center" justifyContent="space-between"> - <Text>Open in Emacs</Text> - <Menu isLazy placement="right"> - <MenuButton as={Button} rightIcon={<ChevronDownIcon />} colorScheme="" color="black"> - <Text> - {mouse.follow ? mouse.follow[0]!.toUpperCase() + mouse.follow!.slice(1) : 'Never'} - </Text> - </MenuButton> - <Portal> - {' '} - <MenuList bgColor="gray.200" zIndex="popover"> - <MenuItem onClick={() => setMouse({ ...mouse, follow: '' })}>Never</MenuItem> - <MenuItem onClick={() => setMouse({ ...mouse, follow: 'click' })}>Click</MenuItem> - <MenuItem onClick={() => setMouse({ ...mouse, follow: 'double' })}> - Double Click - </MenuItem> - <MenuItem onClick={() => setMouse({ ...mouse, follow: 'right' })}> - Right Click - </MenuItem> - </MenuList> - </Portal> - </Menu> - </Flex> - <Flex alignItems="center" justifyContent="space-between"> - <Text>Follow Emacs by...</Text> - <Menu isLazy placement="right"> - <MenuButton as={Button} rightIcon={<ChevronDownIcon />} colorScheme="" color="black"> - <Text>{behavior.follow[0].toUpperCase() + behavior.follow.slice(1)}</Text> - </MenuButton> - <Portal> - {' '} - <MenuList bgColor="gray.200" zIndex="popover"> - <MenuItem onClick={() => setBehavior({ ...behavior, follow: 'color' })}> - Just coloring the currently opened node - </MenuItem> - <MenuItem onClick={() => setBehavior({ ...behavior, follow: 'local' })}> - Opening the local graph - </MenuItem> - <MenuItem onClick={() => setBehavior({ ...behavior, follow: 'zoom' })}> - Zooming to the current node - </MenuItem> - </MenuList> - </Portal> - </Menu> - </Flex> - <Flex alignItems="center" justifyContent="space-between"> - <Flex> - <Text>Local graph</Text> - <InfoTooltip infoText="When in local mode and clicking a new node, should I add that node's local graph or open the new one?" /> - </Flex> - <Menu isLazy placement="right"> - <MenuButton as={Button} rightIcon={<ChevronDownIcon />} colorScheme="" color="black"> - <Text>{behavior.localSame === 'add' ? 'Add' : 'Replace'}</Text> - </MenuButton> - <Portal> - {' '} - <MenuList bgColor="gray.200" zIndex="popover"> - <MenuItem onClick={() => setBehavior({ ...behavior, localSame: 'replace' })}> - Open that nodes graph - </MenuItem> - <MenuItem onClick={() => setBehavior({ ...behavior, localSame: 'add' })}> - Add node to local graph - </MenuItem> - </MenuList> - </Portal> - </Menu> - </Flex> - <SliderWithInfo - label="Zoom speed" - value={behavior.zoomSpeed} - min={0} - max={4000} - step={100} - onChange={(value) => setBehavior({ ...behavior, zoomSpeed: value })} - /> - <SliderWithInfo - label="Zoom padding" - value={behavior.zoomPadding} - min={0} - max={400} - step={1} - onChange={(value) => setBehavior({ ...behavior, zoomPadding: value })} - infoText="How much to zoom out to accomodate all nodes when changing the view." - /> - </VStack> - ) -} |