Commit c67e7993 authored by Przemyslaw Kaminski's avatar Przemyslaw Kaminski

[texts] control of side panel inside it, not in parent

parent a07f4b19
...@@ -9,6 +9,9 @@ ...@@ -9,6 +9,9 @@
top: 60px; top: 60px;
width: 28%; width: 28%;
} }
#page-wrapper .side-panel .header {
float: right;
}
.simple-layout { .simple-layout {
height: 100%; height: 100%;
......
...@@ -8,6 +8,8 @@ ...@@ -8,6 +8,8 @@
position: fixed position: fixed
top: 60px top: 60px
width: 28% width: 28%
.header
float: right
.simple-layout .simple-layout
height: 100% height: 100%
......
...@@ -52,20 +52,9 @@ textsWithForestCpt = R.hooksComponentWithModule thisModule "textsWithForest" cpt ...@@ -52,20 +52,9 @@ textsWithForestCpt = R.hooksComponentWithModule thisModule "textsWithForest" cpt
, textsProps: textProps@{ session } } _ = do , textsProps: textProps@{ session } } _ = do
controls <- initialControls controls <- initialControls
R.useEffect' $ do
let trigger _ = do
snd controls.showSidePanel $ const InitialClosed
R2.setTrigger controls.triggers.triggerSidePanel trigger
pure $ Forest.forestLayoutWithTopBar forestProps [ pure $ Forest.forestLayoutWithTopBar forestProps [
topBar { controls } [] topBar { controls } []
, H.div { className: "col-md-10" } [ , textsLayout (Record.merge textProps { controls }) []
H.div {id: "page-wrapper"} [
H.div {className: "container-fluid"} [
textsLayout (Record.merge textProps { controls }) []
]
]
]
, H.div { className: "side-panel" } [ , H.div { className: "side-panel" } [
sidePanel { controls, session } [] sidePanel { controls, session } []
] ]
...@@ -84,12 +73,13 @@ topBarCpt :: R.Component TopBarProps ...@@ -84,12 +73,13 @@ topBarCpt :: R.Component TopBarProps
topBarCpt = R.hooksComponentWithModule thisModule "topBar" cpt topBarCpt = R.hooksComponentWithModule thisModule "topBar" cpt
where where
cpt { controls } _ = do cpt { controls } _ = do
pure $ -- empty for now because the button is moved to the side panel
H.ul { className: "nav navbar-nav" } [ pure $ H.div {} []
H.li {} [ -- H.ul { className: "nav navbar-nav" } [
sidePanelToggleButton { state: controls.showSidePanel } [] -- H.li {} [
] -- sidePanelToggleButton { state: controls.showSidePanel } []
] -- head (goes to top bar) -- ]
-- ] -- head (goes to top bar)
------------------------------------------------------------------------ ------------------------------------------------------------------------
type CommonProps = ( type CommonProps = (
...@@ -360,10 +350,17 @@ sidePanel = R.createElement sidePanelCpt ...@@ -360,10 +350,17 @@ sidePanel = R.createElement sidePanelCpt
sidePanelCpt :: R.Component SidePanelProps sidePanelCpt :: R.Component SidePanelProps
sidePanelCpt = R.hooksComponentWithModule thisModule "sidePanel" cpt sidePanelCpt = R.hooksComponentWithModule thisModule "sidePanel" cpt
where where
cpt { controls: { showSidePanel: (showSidePanel /\ _) cpt { controls: { triggers: { triggerAnnotatedDocIdChange
, triggers: { triggerAnnotatedDocIdChange
, triggerSidePanel } } , triggerSidePanel } }
, session } _ = do , session } _ = do
showSidePanel <- R.useState' InitialClosed
R.useEffect' $ do
let trigger _ = do
snd showSidePanel $ const Opened
R2.setTrigger triggerSidePanel trigger
(mCorpusId /\ setMCorpusId) <- R.useState' Nothing (mCorpusId /\ setMCorpusId) <- R.useState' Nothing
(mListId /\ setMListId) <- R.useState' Nothing (mListId /\ setMListId) <- R.useState' Nothing
(mNodeId /\ setMNodeId) <- R.useState' Nothing (mNodeId /\ setMNodeId) <- R.useState' Nothing
...@@ -386,12 +383,18 @@ sidePanelCpt = R.hooksComponentWithModule thisModule "sidePanel" cpt ...@@ -386,12 +383,18 @@ sidePanelCpt = R.hooksComponentWithModule thisModule "sidePanel" cpt
-- log "[sidePanel] clearing triggerAnnotatedDocIdChange" -- log "[sidePanel] clearing triggerAnnotatedDocIdChange"
R2.clearTrigger triggerAnnotatedDocIdChange R2.clearTrigger triggerAnnotatedDocIdChange
let mainStyle = case showSidePanel of let mainStyle = case fst showSidePanel of
Opened -> { display: "block" } Opened -> { display: "block" }
_ -> { display: "none" } _ -> { display: "none" }
pure $ H.div { style: mainStyle } [ pure $ H.div { style: mainStyle } [
sidePanelDocView { mCorpusId, mListId, mNodeId, session } [] H.div { className: "header" } [
H.span { className: "btn btn-danger"
, on: { click: \_ -> snd showSidePanel $ const Closed } } [
H.span { className: "fa fa-times" } []
]
]
, sidePanelDocView { mCorpusId, mListId, mNodeId, session } []
] ]
type SidePanelDocView = ( type SidePanelDocView = (
......
...@@ -40,16 +40,13 @@ emptySidePanelTriggers = do ...@@ -40,16 +40,13 @@ emptySidePanelTriggers = do
type TextsLayoutControls = ( type TextsLayoutControls = (
showSidePanel :: R.State SidePanelState triggers :: Record SidePanelTriggers
, triggers :: Record SidePanelTriggers
) )
initialControls :: R.Hooks (Record TextsLayoutControls) initialControls :: R.Hooks (Record TextsLayoutControls)
initialControls = do initialControls = do
showSidePanel <- R.useState' Opened
triggers <- emptySidePanelTriggers triggers <- emptySidePanelTriggers
pure $ { pure $ {
showSidePanel triggers
, triggers
} }
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment