Commit 4eb2785d authored by Alexandre Delanoë's avatar Alexandre Delanoë

Merge branch '286-dev-css-fix-for-graph-height' of...

Merge branch '286-dev-css-fix-for-graph-height' of ssh://gitlab.iscpif.fr:20022/gargantext/purescript-gargantext into dev-merge
parents e5d313ec 7e6102b9
...@@ -535,8 +535,20 @@ li .leaf:hover a.settings { ...@@ -535,8 +535,20 @@ li .leaf:hover a.settings {
color: black; color: black;
} }
.forest-layout-raw-tree { .forest-layout {
padding-top: 60px; background-color: #fff;
position: fixed;
top: 3.7em;
width: 15%;
z-index: 999;
}
.left-handed .forest-layout {
left: 80%;
}
.right-handed .forest-layout {
left: 2%;
} }
.code-editor .editor .code-area { .code-editor .editor .code-area {
...@@ -646,22 +658,42 @@ li .leaf:hover a.settings { ...@@ -646,22 +658,42 @@ li .leaf:hover a.settings {
cursor: pointer; cursor: pointer;
} }
.side-panel { .left-handed .side-panel {
left: 2%;
padding: 0.3em;
position: fixed;
top: 3.7em;
background-color: #fff;
width: 28%;
}
.left-handed .side-panel .header {
float: left;
}
.left-handed .side-panel .corpus-doc-view .annotated-field-wrapper .annotated-field-runs {
max-height: 200px;
overflow-y: scroll;
}
.left-handed .side-panel .corpus-doc-view .list-group .list-group-item-heading {
display: inline-block;
width: 60px;
}
.right-handed .side-panel {
left: 70%; left: 70%;
padding: 5px; padding: 0.3em;
position: fixed; position: fixed;
top: 60px; top: 3.7em;
background-color: #fff; background-color: #fff;
width: 28%; width: 28%;
} }
.side-panel .header { .right-handed .side-panel .header {
float: right; float: right;
} }
.side-panel .corpus-doc-view .annotated-field-wrapper .annotated-field-runs { .right-handed .side-panel .corpus-doc-view .annotated-field-wrapper .annotated-field-runs {
max-height: 200px; max-height: 200px;
overflow-y: scroll; overflow-y: scroll;
} }
.side-panel .corpus-doc-view .list-group .list-group-item-heading { .right-handed .side-panel .corpus-doc-view .list-group .list-group-item-heading {
display: inline-block; display: inline-block;
width: 60px; width: 60px;
} }
......
{"version":3,"sourceRoot":"","sources":["../../src/sass/_menu.sass","../../src/sass/_context_menu.sass","../../src/sass/_graph.sass","../../src/sass/_login.sass","../../src/sass/_tree.sass","../../src/sass/_code_editor.sass","../../src/sass/_styles.sass","../../src/sass/_range_slider.sass","../../src/sass/_annotation.sass","../../src/sass/_folder_view.sass"],"names":[],"mappings":"AAAA;AAEA;AACA;AACA;AACA;AACA;AAEA;EACI;EACA;;;AAEJ;EACI;EACA;EACA;EACA;;;AAEJ;EACE;;;AAEF;AACI;EACA;;;AAEJ;AACI;EACA;;;AAGJ;AACA;EACI;;;AAEJ;EACI;EACA;EACA;EACA;;;AAEJ;EACE;EACA;;;AAEF;EACE;;;AC7CF;EACE;EACA;EACA;EACA;EACA;;;AAEF;EACE;;;AAEF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;;AAEF;EACE;EACA;EACA;;;AAEF;EACE;;;AClBF;EACE;EACA;EACA;;;AAEF;AAkCE;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAxCA;EAZA;EACA;EAEA;EAWE;EACA;EACA;EACA;;AAEA;EACE;EACA;;AAEF;EACE;EACA;;AAGA;EACE;EACA;;AACN;EACE;;AACF;EACE;;AAEF;EApCA;EACA;EAEA;EAmCE;EACA;;AACF;EACE;;AACF;EACE;;AAWF;EAEE;EACA;EACA;EACA;EAEA;EACA;EACA;;AAEA;EACE;;AAEJ;EACE;;AAEA;EACE;;AAEJ;EACE;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;;;ACrFJ;EAEE;;;AAQF;EACE;;AACA;EACE;EACA;;;AAEJ;EACE;;;AAEF;EACE;;;AAEF;EACE;;;AAEF;EACE;;;AAGF;EACE;;AAEE;EACE;EACA;;AACA;EACE;;;AAIJ;EACE;EACA;EACA;EACA;;;AAKJ;EACE;EACA;EACA;;;AAGJ;EACE;EACA;EACA;EACA;EACA;;AACA;EACE;EACA;;AACF;EACE;EACA;;AACA;EACE;EACA;EACA;EACA;;AACA;EACE;;AACF;EACE;EACA;EACA;EACA;;AACA;EACE;;AACN;EACE;EACA;EACA;EACA;;;AAGN;EACE;EACA;EACA;EACA;EACA;;AAGE;EACE;;;AAEN;EACE;EACA;EACA;EACA;EACA;;AAGE;EACE;;;AAEN;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;;;AAEJ;EACE;EACA;;;AAGF;EACE;EACA;EACA;EACA;;AACA;EACE;EACA;;;AAGF;EACE;;;AAEJ;EACI;EACA;;;AAGF;EACE;;;AAEJ;EACE;;;AAEF;EACE;EACA;;;AAEF;EACE;EACA;EACA;;;AAEF;EACE;EACA;;;AAEF;EACE;;;ACzKF;EACE;;;AAGA;EACE;EACA;EACA;;AAEA;EACE;EACA;;AAGA;EACE;;AACF;EACE;;AAEJ;EACE;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;;;AAGN;EACE;;;AAIA;EACE;;AACA;EACE;EACA;EACA;EACA;;AACF;EACE;EACA;EACA;EACA;EACA;;AACF;EACE;;AACF;EACE;EACA;EACA;EAEA;EACA;EACA;;AAEA;EACE;;AACF;EACE;;AAGN;EACE;;AACF;EACE;;AACA;EACE;EACA;;AAEE;EACE;EACA;;AACF;EACE;EACA;;AAIR;EACE;;AACF;EACE;;AACA;EACE;EACA;;AAEE;EACE;EACA;;AACF;EACE;EACA;;AACF;EACE;EACA;;AAEV;EACE;;AACF;EACE;;AAEE;EACE;;AACF;EACE;;AACN;EACE;;AAEE;EACE;;;AAGR;EACE;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EAEE;EACA;EACA;EACA;EACA;;AAEF;EACE;EACA;EACA;;AAEF;EACE;;;AAIF;EACE;;AAEA;EACE;;;AAGN;EACE;;AACF;EACE;;AACF;EACE;;;AAEJ;EACE;;;ACpJE;EACE;EACA;EACA;EACA;;AACA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AACA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EApCR;EACA;EACA;EACA;EACA;EACA;EACA;EAlBA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AA0CM;EACE;EACA;EACA;EACA;EACA;EA5CR;EACA;EACA;EACA;EACA;EACA;EACA;EAlBA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAkDE;EACE;EACA;EACA;EACA;EACA;EACA;;AACF;EACE;EACA;EACA;;AACA;EACE;EACA;;AACF;EACE;EACA;;AACF;EACE;EACA;;AAGE;EACE;;AAEF;EACE;;;ACtFZ;EACE;;;AACF;EAEE;EACA;EACA;EACA;EACA;EACA;;AACA;EACE;;AAGE;EACE;EACA;;AAEF;EACE;EACA;;;AAER;EACE;;AACA;EACE;;AACF;EACE;EACA;EACA;;;AAIA;EACE;;AACA;EACE;EACA;;AACF;EACE;;AACA;EACE;;AACJ;EACE;;;AAER;EACE;;;AAEF;EACE;;;AAEF;EACE;;;AAEF;AAGI;EACE;;AACF;EACE;;;AAEN;EACE;EACA;EACA;;;AAIA;EACE;;AACF;EACE;;;AAEJ;EACE;;AACA;EACE;;;AAEJ;EACE;EACA;;;ACjFF;EACE;AACA;EACA;;AAEA;EACE;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;;AAEF;EACE;EACA;EACA;EACA;;AAEF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EAEA;EAEA;EAEA;;AAEA;EACE;EAEA;EACA;EACA;;;AAGN;EACE;;;ACxBJ;EACE;;AAEA;EANE;EACA;;AAQF;EAbE;EACA;;AAeF;EAhBE;EACA;;AAkBF;EAnBE;EACA;;AAqBF;EA1BE;EACA,kBANyB;;AAkC3B;EA7BE;EACA,kBAPqB;;AAsCvB;EAhCE;EACA,kBAJoB;;;AAuCtB;EApCE;EACA,kBANyB;;AA4C3B;EAvCE;EACA,kBAPqB;;AAgDvB;EA1CE;EACA,kBAJoB;;;ACRxB;EACE;EACA;EACA;EACA","file":"sass.css"} {"version":3,"sourceRoot":"","sources":["../../src/sass/_menu.sass","../../src/sass/_context_menu.sass","../../src/sass/_graph.sass","../../src/sass/_login.sass","../../src/sass/_tree.sass","../../src/sass/_code_editor.sass","../../src/sass/_styles.sass","../../src/sass/_range_slider.sass","../../src/sass/_annotation.sass","../../src/sass/_folder_view.sass"],"names":[],"mappings":"AAAA;AAEA;AACA;AACA;AACA;AACA;AAEA;EACI;EACA;;;AAEJ;EACI;EACA;EACA;EACA;;;AAEJ;EACE;;;AAEF;AACI;EACA;;;AAEJ;AACI;EACA;;;AAGJ;AACA;EACI;;;AAEJ;EACI;EACA;EACA;EACA;;;AAEJ;EACE;EACA;;;AAEF;EACE;;;AC7CF;EACE;EACA;EACA;EACA;EACA;;;AAEF;EACE;;;AAEF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;;;AAEF;EACE;EACA;EACA;;;AAEF;EACE;;;AClBF;EACE;EACA;EACA;;;AAEF;AAkCE;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAxCA;EAZA;EACA;EAEA;EAWE;EACA;EACA;EACA;;AAEA;EACE;EACA;;AAEF;EACE;EACA;;AAGA;EACE;EACA;;AACN;EACE;;AACF;EACE;;AAEF;EApCA;EACA;EAEA;EAmCE;EACA;;AACF;EACE;;AACF;EACE;;AAWF;EAEE;EACA;EACA;EACA;EAEA;EACA;EACA;;AAEA;EACE;;AAEJ;EACE;;AAEA;EACE;;AAEJ;EACE;EACA;;;AAGF;EACE;EACA;EACA;EACA;EACA;;;ACrFJ;EAEE;;;AAQF;EACE;;AACA;EACE;EACA;;;AAEJ;EACE;;;AAEF;EACE;;;AAEF;EACE;;;AAEF;EACE;;;AAGF;EACE;;AAEE;EACE;EACA;;AACA;EACE;;;AAIJ;EACE;EACA;EACA;EACA;;;AAKJ;EACE;EACA;EACA;;;AAGJ;EACE;EACA;EACA;EACA;EACA;;AACA;EACE;EACA;;AACF;EACE;EACA;;AACA;EACE;EACA;EACA;EACA;;AACA;EACE;;AACF;EACE;EACA;EACA;EACA;;AACA;EACE;;AACN;EACE;EACA;EACA;EACA;;;AAGN;EACE;EACA;EACA;EACA;EACA;;AAGE;EACE;;;AAEN;EACE;EACA;EACA;EACA;EACA;;AAGE;EACE;;;AAEN;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;;;AAEJ;EACE;EACA;;;AAGF;EACE;EACA;EACA;EACA;;AACA;EACE;EACA;;;AAGF;EACE;;;AAEJ;EACI;EACA;;;AAGF;EACE;;;AAEJ;EACE;;;AAEF;EACE;EACA;;;AAEF;EACE;EACA;EACA;;;AAEF;EACE;EACA;;;AAEF;EACE;;;ACzKF;EACE;;;AAGA;EACE;EACA;EACA;;AAEA;EACE;EACA;;AAGA;EACE;;AACF;EACE;;AAEJ;EACE;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;;;AAGN;EACE;;;AAIA;EACE;;AACA;EACE;EACA;EACA;EACA;;AACF;EACE;EACA;EACA;EACA;EACA;;AACF;EACE;;AACF;EACE;EACA;EACA;EAEA;EACA;EACA;;AAEA;EACE;;AACF;EACE;;AAGN;EACE;;AACF;EACE;;AACA;EACE;EACA;;AAEE;EACE;EACA;;AACF;EACE;EACA;;AAIR;EACE;;AACF;EACE;;AACA;EACE;EACA;;AAEE;EACE;EACA;;AACF;EACE;EACA;;AACF;EACE;EACA;;AAEV;EACE;;AACF;EACE;;AAEE;EACE;;AACF;EACE;;AACN;EACE;;AAEE;EACE;;;AAGR;EACE;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EAEE;EACA;EACA;EACA;EACA;;AAEF;EACE;EACA;EACA;;AAEF;EACE;;;AAIF;EACE;;AAEA;EACE;;;AAGN;EACE;;AACF;EACE;;AACF;EACE;;;AAEJ;EACE;EACA;EACA;EACA;EACA;;;AAEA;EACE;;;AAEF;EACE;;;AC9JA;EACE;EACA;EACA;EACA;;AACA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AACA;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EApCR;EACA;EACA;EACA;EACA;EACA;EACA;EAlBA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AA0CM;EACE;EACA;EACA;EACA;EACA;EA5CR;EACA;EACA;EACA;EACA;EACA;EACA;EAlBA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAkDE;EACE;EACA;EACA;EACA;EACA;EACA;;AACF;EACE;EACA;EACA;;AACA;EACE;EACA;;AACF;EACE;EACA;;AACF;EACE;EACA;;AAGE;EACE;;AAEF;EACE;;;ACtFZ;EACE;;;AAEA;EAEE;EACA;EACA;EACA;EACA;EACA;;AACA;EACE;;AAGE;EACE;EACA;;AAEF;EACE;EACA;;;AAER;EAEE;EACA;EACA;EACA;EACA;EACA;;AACA;EACE;;AAGE;EACE;EACA;;AAEF;EACE;EACA;;;AAEV;EACE;;AACA;EACE;;AACF;EACE;EACA;EACA;;;AAIA;EACE;;AACA;EACE;EACA;;AACF;EACE;;AACA;EACE;;AACJ;EACE;;;AAER;EACE;;;AAEF;EACE;;;AAEF;EACE;;;AAEF;AAGI;EACE;;AACF;EACE;;;AAEN;EACE;EACA;EACA;;;AAIA;EACE;;AACF;EACE;;;AAEJ;EACE;;AACA;EACE;;;AAEJ;EACE;EACA;;;ACtGF;EACE;AACA;EACA;;AAEA;EACE;EACA;;AAEA;EACE;EACA;EACA;EACA;EACA;;AAEF;EACE;EACA;EACA;EACA;;AAEF;EACE;EACA;EACA;EACA;EACA;EACA;EACA;EAEA;EAEA;EAEA;;AAEA;EACE;EAEA;EACA;EACA;;;AAGN;EACE;;;ACxBJ;EACE;;AAEA;EANE;EACA;;AAQF;EAbE;EACA;;AAeF;EAhBE;EACA;;AAkBF;EAnBE;EACA;;AAqBF;EA1BE;EACA,kBANyB;;AAkC3B;EA7BE;EACA,kBAPqB;;AAsCvB;EAhCE;EACA,kBAJoB;;;AAuCtB;EApCE;EACA,kBANyB;;AA4C3B;EAvCE;EACA,kBAPqB;;AAgDvB;EA1CE;EACA,kBAJoB;;;ACRxB;EACE;EACA;EACA;EACA","file":"sass.css"}
\ No newline at end of file \ No newline at end of file
module Gargantext.Components.Forest module Gargantext.Components.Forest
( forest ( forest
, forestLayout , forestLayout
, forestLayoutWithTopBar
, forestLayoutMain
, forestLayoutRaw
, Common , Common
, Props , Props
) where ) where
import Data.Array as A import Gargantext.Prelude
import Data.Maybe (Maybe, fromMaybe)
import Data.Tuple.Nested ((/\))
import Reactix as R
import Reactix.DOM.HTML as H
import Record.Extra as RX
import Toestand as T
import Data.Array as A
import Data.Maybe (Maybe)
import Gargantext.AsyncTasks as GAT import Gargantext.AsyncTasks as GAT
import Gargantext.Components.Forest.Tree (treeLoader) import Gargantext.Components.Forest.Tree (treeLoader)
import Gargantext.Components.TopBar (topBar)
import Gargantext.Ends (Frontends, Backend) import Gargantext.Ends (Frontends, Backend)
import Gargantext.Prelude
import Gargantext.Routes (AppRoute) import Gargantext.Routes (AppRoute)
import Gargantext.Sessions (Session(..), Sessions, OpenNodes, unSessions) import Gargantext.Sessions (Session(..), Sessions, OpenNodes, unSessions)
import Gargantext.Types (Handed, reverseHanded, switchHanded) import Gargantext.Types (Handed, switchHanded)
import Gargantext.Utils.Reactix as R2 import Gargantext.Utils.Reactix as R2
import Gargantext.Utils.Toestand as T2 import Gargantext.Utils.Toestand as T2
import Reactix as R
import Reactix.DOM.HTML as H
import Record.Extra as RX
import Toestand as T
here :: R2.Here here :: R2.Here
here = R2.here "Gargantext.Components.Forest" here = R2.here "Gargantext.Components.Forest"
...@@ -40,13 +35,13 @@ type Common = ...@@ -40,13 +35,13 @@ type Common =
) )
type Props = type Props =
( backend :: T.Box (Maybe Backend) ( backend :: T.Box (Maybe Backend)
, forestOpen :: T.Box OpenNodes , forestOpen :: T.Box OpenNodes
, reloadForest :: T2.ReloadS , reloadForest :: T2.ReloadS
, sessions :: T.Box Sessions , sessions :: T.Box Sessions
, showLogin :: T.Box Boolean , showLogin :: T.Box Boolean
, showTree :: T.Box Boolean , showTree :: T.Box Boolean
, tasks :: T.Box GAT.Storage , tasks :: T.Box GAT.Storage
| Common | Common
) )
...@@ -56,7 +51,6 @@ type TreeExtra = ( ...@@ -56,7 +51,6 @@ type TreeExtra = (
forest :: R2.Component Props forest :: R2.Component Props
forest = R.createElement forestCpt forest = R.createElement forestCpt
forestCpt :: R.Component Props forestCpt :: R.Component Props
forestCpt = here.component "forest" cpt where forestCpt = here.component "forest" cpt where
cpt props@{ backend cpt props@{ backend
...@@ -86,7 +80,7 @@ forestCpt = here.component "forest" cpt where ...@@ -86,7 +80,7 @@ forestCpt = here.component "forest" cpt where
-- TODO If `reloadForest` is set, `reload` state should be updated -- TODO If `reloadForest` is set, `reload` state should be updated
-- TODO fix tasks ref -- TODO fix tasks ref
pure $ H.div { className: "forest " <> if showTree' then "" else "d-none" } pure $ H.div { className: "forest " <> if showTree' then "" else "d-none" }
(A.cons (plus handed' showLogin) (trees handed' sessions')) (A.cons (plus { handed, showLogin }) (trees handed' sessions'))
where where
common = RX.pick props :: Record Common common = RX.pick props :: Record Common
trees handed' sessions' = (tree handed') <$> unSessions sessions' trees handed' sessions' = (tree handed') <$> unSessions sessions'
...@@ -102,107 +96,41 @@ forestCpt = here.component "forest" cpt where ...@@ -102,107 +96,41 @@ forestCpt = here.component "forest" cpt where
, session: s , session: s
, tasks } [] , tasks } []
plus :: Handed -> T.Box Boolean -> R.Element type Plus =
plus handed showLogin = H.div { className: "row" } ( handed :: T.Box Handed
[ H.button { className: buttonClass , showLogin :: T.Box Boolean )
, on: { click }
, title } plus :: R2.Leaf Plus
[ H.div { className: divClass } [ H.text " Log in/out " ] -- fa-lg plus p = R.createElement plusCpt p []
, H.div {} [ H.text " " ] ] plusCpt :: R.Component Plus
] plusCpt = here.component "plus" cpt where
cpt { handed, showLogin } _ = do
handed' <- T.useLive T.unequal handed
pure $ H.div { className: "row" }
[ H.button { className: buttonClass handed'
, on: { click }
, title }
[ H.div { className: divClass } [ H.text " Log in/out " ] -- fa-lg
, H.div {} [ H.text " " ] ]
]
--, H.div { "type": "", className: "fa fa-plus-circle fa-lg"} [] --, H.div { "type": "", className: "fa fa-plus-circle fa-lg"} []
--, H.div { "type": "", className: "fa fa-minus-circle fa-lg"} [] --, H.div { "type": "", className: "fa fa-minus-circle fa-lg"} []
-- TODO same as the one in the Login Modal (same CSS) -- TODO same as the one in the Login Modal (same CSS)
-- [ H.i { className: "material-icons md-36"} [] ] -- [ H.i { className: "material-icons md-36"} [] ]
where where
click _ = do click _ = do
-- _ <- T.write Nothing backend -- _ <- T.write Nothing backend
T.write_ true showLogin T.write_ true showLogin
title = "Add or remove connections to the server(s)." title = "Add or remove connections to the server(s)."
divClass = "fa fa-universal-access" divClass = "fa fa-universal-access"
buttonClass = buttonClass handed' =
"btn btn-primary col-5 " <> switchHanded "mr-1 ml-auto" "ml-1 mr-auto" handed "btn btn-primary col-5 " <> switchHanded "mr-1 ml-auto" "ml-1 mr-auto" handed'
forestLayout :: R2.Component Props forestLayout :: R2.Component Props
forestLayout = R.createElement forestLayoutCpt forestLayout = R.createElement forestLayoutCpt
forestLayoutCpt :: R.Component Props forestLayoutCpt :: R.Component Props
forestLayoutCpt = here.component "forestLayout" cpt where forestLayoutCpt = here.component "forestLayout" cpt where
cpt props@{ handed } children = cpt p _ = do
pure $ R.fragment pure $ H.div { className: "forest-layout" }
[ topBar { handed } [] [ forest p [] ]
, forestLayoutMain props children ]
-- Renders its first child component in the top bar and the rest in
-- the main view.
forestLayoutWithTopBar :: R2.Component Props
forestLayoutWithTopBar = R.createElement forestLayoutWithTopBarCpt
forestLayoutWithTopBarCpt :: R.Component Props
forestLayoutWithTopBarCpt = here.component "forestLayoutWithTopBar" cpt where
cpt props@{ handed } children = do
let { head: topBarChild, tail: mainChildren } =
fromMaybe { head: H.div {} [], tail: [] } $ A.uncons children
pure $ R.fragment
[ topBar { handed } [ topBarChild ]
, forestLayoutMain props mainChildren ]
forestLayoutMain :: R2.Component Props
forestLayoutMain = R.createElement forestLayoutMainCpt
forestLayoutMainCpt :: R.Component Props
forestLayoutMainCpt = here.component "forestLayoutMain" cpt where
cpt props@{ reloadMainPage } children =
pure $ forestLayoutRaw props [ mainPage {} children ]
forestLayoutRaw :: R2.Component Props
forestLayoutRaw = R.createElement forestLayoutRawCpt
forestLayoutRawCpt :: R.Component Props
forestLayoutRawCpt = here.component "forestLayoutRaw" cpt where
cpt p@{ backend
, forestOpen
, frontends
, reloadForest
, reloadMainPage
, reloadRoot
, route
, sessions
, showTree
, showLogin
, tasks } children = do
handed' <- T.useLive T.unequal p.handed
pure $ R2.row $ reverseHanded handed' $
[ H.div { className: "col-md-2 forest-layout-raw-tree" }
[ forest' p.handed ]
] <> children
where
forest' handed =
forest { backend
, frontends
, forestOpen
, handed
, reloadForest
, reloadMainPage
, reloadRoot
, route
, sessions
, showTree
, showLogin
, tasks } []
mainPage :: R2.Component ()
mainPage = R.createElement mainPageCpt
-- mainPageCpt :: R.Memo ()
-- mainPageCpt = R.memo (here.component "mainPage" cpt) where
mainPageCpt :: R.Component ()
mainPageCpt = here.component "mainPage" cpt
where
cpt _ children = do
pure $ H.div { className: "col-md-10" }
[ H.div { id: "page-wrapper" }
[ H.div { className: "container-fluid" } children ]
]
...@@ -2,7 +2,6 @@ module Gargantext.Components.GraphExplorer where ...@@ -2,7 +2,6 @@ module Gargantext.Components.GraphExplorer where
import Gargantext.Prelude hiding (max,min) import Gargantext.Prelude hiding (max,min)
import DOM.Simple.Types (Element)
import Data.Array as A import Data.Array as A
import Data.FoldableWithIndex (foldMapWithIndex) import Data.FoldableWithIndex (foldMapWithIndex)
import Data.Int (toNumber) import Data.Int (toNumber)
...@@ -12,7 +11,16 @@ import Data.Nullable (null, Nullable) ...@@ -12,7 +11,16 @@ import Data.Nullable (null, Nullable)
import Data.Sequence as Seq import Data.Sequence as Seq
import Data.Set as Set import Data.Set as Set
import Data.Tuple (Tuple(..)) import Data.Tuple (Tuple(..))
import DOM.Simple.Types (Element)
import Effect.Aff (Aff) import Effect.Aff (Aff)
import Math as Math
import Partial.Unsafe (unsafePartial)
import Reactix as R
import Reactix.DOM.HTML as RH
import Record as Record
import Record.Extra as RX
import Toestand as T
import Gargantext.AsyncTasks as GAT import Gargantext.AsyncTasks as GAT
import Gargantext.Components.App.Data (Boxes) import Gargantext.Components.App.Data (Boxes)
import Gargantext.Components.Graph as Graph import Gargantext.Components.Graph as Graph
...@@ -32,13 +40,6 @@ import Gargantext.Types as Types ...@@ -32,13 +40,6 @@ import Gargantext.Types as Types
import Gargantext.Utils.Range as Range import Gargantext.Utils.Range as Range
import Gargantext.Utils.Reactix as R2 import Gargantext.Utils.Reactix as R2
import Gargantext.Utils.Toestand as T2 import Gargantext.Utils.Toestand as T2
import Math as Math
import Partial.Unsafe (unsafePartial)
import Reactix as R
import Reactix.DOM.HTML as RH
import Record as Record
import Record.Extra as RX
import Toestand as T
here :: R2.Here here :: R2.Here
here = R2.here "Gargantext.Components.GraphExplorer" here = R2.here "Gargantext.Components.GraphExplorer"
......
module Gargantext.Components.MainPage where
import Gargantext.Prelude
import Data.Tuple.Nested ((/\))
import Reactix as R
import Reactix.DOM.HTML as H
import Toestand as T
import Web.HTML.Event.EventTypes (offline)
import Gargantext.Components.App.Data (Boxes)
import Gargantext.Routes as GR
import Gargantext.Types as GT
import Gargantext.Utils.Reactix as R2
here :: R2.Here
here = R2.here "Gargantext.Components.MainPage"
type MainPage =
(
boxes :: Boxes
)
mainPage :: R2.Component MainPage
mainPage = R.createElement mainPageCpt
mainPageCpt :: R.Component MainPage
mainPageCpt = here.component "mainPage" cpt
where
cpt { boxes: { handed
, route } } children = do
handed' <- T.useLive T.unequal handed
route' <- T.useLive T.unequal route
let classNameOffsetPre /\ className /\ classNameOffsetPost = case route' of
GR.PGraphExplorer _ _ -> "" /\ "col-md-12" /\ ""
_ -> case handed' of
GT.LeftHanded -> "" /\ "col-md-10" /\ "col-md-2"
GT.RightHanded -> "col-md-2" /\ "col-md-10" /\ ""
pure $ H.div { className: "row" }
[ H.div { className: classNameOffsetPre } []
, H.div { className }
[ H.div { id: "page-wrapper" }
[ H.div { className: "container-fluid" } children ]
]
, H.div { className: classNameOffsetPost } []
]
This diff is collapsed.
.cache-toggle .cache-toggle
cursor: pointer cursor: pointer
.side-panel .left-handed
//background-color: $dark .side-panel
left: 70% //background-color: $dark
padding: 5px left: 2%
position: fixed padding: 0.3em
top: 60px position: fixed
background-color: #fff top: 3.7em
width: 28% background-color: #fff
.header width: 28%
float: right .header
.corpus-doc-view float: left
.annotated-field-wrapper .corpus-doc-view
.annotated-field-runs .annotated-field-wrapper
max-height: 200px .annotated-field-runs
overflow-y: scroll max-height: 200px
.list-group overflow-y: scroll
.list-group-item-heading .list-group
display: inline-block .list-group-item-heading
width: 60px display: inline-block
width: 60px
.right-handed
.side-panel
//background-color: $dark
left: 70%
padding: 0.3em
position: fixed
top: 3.7em
background-color: #fff
width: 28%
.header
float: right
.corpus-doc-view
.annotated-field-wrapper
.annotated-field-runs
max-height: 200px
overflow-y: scroll
.list-group
.list-group-item-heading
display: inline-block
width: 60px
.simple-layout .simple-layout
height: 100% height: 100%
......
...@@ -168,5 +168,15 @@ li ...@@ -168,5 +168,15 @@ li
.ok-to-use .ok-to-use
color: black color: black
.forest-layout-raw-tree .forest-layout
padding-top: 60px background-color: #fff
position: fixed
top: 3.7em
width: 15%
z-index: 999
.left-handed
.forest-layout
left: 80%
.right-handed
.forest-layout
left: 2%
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