GraphEditor automatically hides if no props are selected

This commit is contained in:
Aria Minaei 2021-10-01 21:35:51 +02:00
parent 4b2a6471dc
commit f273388195
2 changed files with 16 additions and 3 deletions

View file

@ -155,7 +155,9 @@ const Content: React.FC<{}> = () => {
[], [],
) )
const graphEditorAvailable = val(layoutP.graphEditorDims.isAvailable)
const graphEditorOpen = val(layoutP.graphEditorDims.isOpen) const graphEditorOpen = val(layoutP.graphEditorDims.isOpen)
return ( return (
<Container ref={containerRef}> <Container ref={containerRef}>
<LeftBackground style={{width: `${val(layoutP.leftDims.width)}px`}} /> <LeftBackground style={{width: `${val(layoutP.leftDims.width)}px`}} />
@ -165,7 +167,7 @@ const Content: React.FC<{}> = () => {
{graphEditorOpen && ( {graphEditorOpen && (
<GraphEditor key={key + '-graphEditor'} layoutP={layoutP} /> <GraphEditor key={key + '-graphEditor'} layoutP={layoutP} />
)} )}
<GraphEditorToggle layoutP={layoutP} /> {graphEditorAvailable && <GraphEditorToggle layoutP={layoutP} />}
<RightOverlay layoutP={layoutP} /> <RightOverlay layoutP={layoutP} />
</FrameStampPositionProvider> </FrameStampPositionProvider>
</Container> </Container>

View file

@ -70,6 +70,7 @@ export type SequenceEditorPanelLayout = {
rightDims: DimsOfPanelPart rightDims: DimsOfPanelPart
dopeSheetDims: DimsOfPanelPart dopeSheetDims: DimsOfPanelPart
graphEditorDims: DimsOfPanelPart & { graphEditorDims: DimsOfPanelPart & {
isAvailable: boolean
isOpen: boolean isOpen: boolean
padding: {top: number; bottom: number} padding: {top: number; bottom: number}
} }
@ -135,6 +136,13 @@ export function sequenceEditorPanelLayout(
studio.atomP.historic.panels.sequenceEditor.graphEditor, studio.atomP.historic.panels.sequenceEditor.graphEditor,
) )
const selectedPropsByObject = val(
historicStateP.sequenceEditor.selectedPropsByObject,
)
const graphEditorAvailable =
!!selectedPropsByObject && Object.keys(selectedPropsByObject).length > 0
const { const {
leftDims, leftDims,
rightDims, rightDims,
@ -158,7 +166,9 @@ export function sequenceEditorPanelLayout(
screenY: panelDims.screenY, screenY: panelDims.screenY,
} }
const graphEditorOpen = graphEditorState?.isOpen === true const graphEditorOpen =
graphEditorAvailable && graphEditorState?.isOpen === true
const graphEditorHeight = Math.floor( const graphEditorHeight = Math.floor(
(graphEditorOpen (graphEditorOpen
? clamp(graphEditorState?.height ?? 0.5, 0.1, 0.7) ? clamp(graphEditorState?.height ?? 0.5, 0.1, 0.7)
@ -177,6 +187,7 @@ export function sequenceEditorPanelLayout(
// const graphEditorHeight = panelDims.height - dopeSheetDims.height // const graphEditorHeight = panelDims.height - dopeSheetDims.height
const graphEditorDims: SequenceEditorPanelLayout['graphEditorDims'] = { const graphEditorDims: SequenceEditorPanelLayout['graphEditorDims'] = {
isAvailable: graphEditorAvailable,
isOpen: graphEditorOpen, isOpen: graphEditorOpen,
width: rightDims.width, width: rightDims.width,
height: graphEditorHeight, height: graphEditorHeight,
@ -201,7 +212,7 @@ export function sequenceEditorPanelLayout(
horizontalScrollbarDims, horizontalScrollbarDims,
} }
}, },
[panelDims, graphEditorState], [panelDims, graphEditorState, graphEditorAvailable],
) )
const graphEditorVerticalSpace = prism.memo( const graphEditorVerticalSpace = prism.memo(