Skip to content

P
purescript-gargantext
Commit 4eb2785d authored by Alexandre Delanoë's avatar Alexandre Delanoë
Browse files
Options

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
Hide whitespace changes
Inline Side-by-side
Showing with 288 additions and 241 deletions
dist/styles/sass.css
View file @ 4eb2785d
...@@ -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;
} }
......
dist/styles/sass.css.map
View file @ 4eb2785d
{"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
src/Gargantext/Components/Forest.purs
View file @ 4eb2785d
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 ]
]
src/Gargantext/Components/GraphExplorer.purs
View file @ 4eb2785d
...@@ -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"
......
src/Gargantext/Components/MainPage.purs 0 → 100644
View file @ 4eb2785d
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 } []
]
src/Gargantext/Components/Router.purs
View file @ 4eb2785d
...@@ -2,7 +2,7 @@ module Gargantext.Components.Router (router) where ...@@ -2,7 +2,7 @@ module Gargantext.Components.Router (router) where
import Gargantext.Prelude import Gargantext.Prelude
import Data.Array (fromFoldable) import Data.Array as A
import Data.Maybe (Maybe(..)) import Data.Maybe (Maybe(..))
import Data.Tuple.Nested ((/\)) import Data.Tuple.Nested ((/\))
import Reactix as R import Reactix as R
...@@ -19,6 +19,7 @@ import Gargantext.Components.GraphExplorer.Sidebar as GES ...@@ -19,6 +19,7 @@ import Gargantext.Components.GraphExplorer.Sidebar as GES
import Gargantext.Components.GraphExplorer.Sidebar.Types as GEST import Gargantext.Components.GraphExplorer.Sidebar.Types as GEST
import Gargantext.Components.Lang (LandingLang(LL_EN)) import Gargantext.Components.Lang (LandingLang(LL_EN))
import Gargantext.Components.Login (login) import Gargantext.Components.Login (login)
import Gargantext.Components.MainPage as MainPage
import Gargantext.Components.Nodes.Annuaire (annuaireLayout) import Gargantext.Components.Nodes.Annuaire (annuaireLayout)
import Gargantext.Components.Nodes.Annuaire.User (userLayout) import Gargantext.Components.Nodes.Annuaire.User (userLayout)
import Gargantext.Components.Nodes.Annuaire.User.Contact (contactLayout) import Gargantext.Components.Nodes.Annuaire.User.Contact (contactLayout)
...@@ -35,9 +36,9 @@ import Gargantext.Config (defaultFrontends, defaultBackends) ...@@ -35,9 +36,9 @@ import Gargantext.Config (defaultFrontends, defaultBackends)
import Gargantext.Ends (Backend) import Gargantext.Ends (Backend)
import Gargantext.Routes (AppRoute) import Gargantext.Routes (AppRoute)
import Gargantext.Routes as GR import Gargantext.Routes as GR
import Gargantext.Sessions as Sessions
import Gargantext.Sessions (Session, WithSession) import Gargantext.Sessions (Session, WithSession)
import Gargantext.Types (CorpusId, ListId, NodeID, NodeType(..), SessionId, SidePanelState(..)) import Gargantext.Sessions as Sessions
import Gargantext.Types (CorpusId, Handed(..), ListId, NodeID, NodeType(..), SessionId, SidePanelState(..), reverseHanded)
import Gargantext.Utils.Reactix as R2 import Gargantext.Utils.Reactix as R2
here :: R2.Here here :: R2.Here
...@@ -52,56 +53,28 @@ type Props' = ( backend :: Backend, route' :: AppRoute | Props ) ...@@ -52,56 +53,28 @@ type Props' = ( backend :: Backend, route' :: AppRoute | Props )
router :: R2.Leaf Props router :: R2.Leaf Props
router props = R.createElement routerCpt props [] router props = R.createElement routerCpt props []
routerCpt :: R.Component Props routerCpt :: R.Component Props
routerCpt = here.component "router" cpt where routerCpt = here.component "router" cpt where
cpt props@{ boxes } _ = do cpt props@{ boxes: boxes@{ handed } } _ = do
pure $ R.fragment handed' <- T.useLive T.unequal handed
[ loginModal { boxes } []
, topBar { boxes } []
, forest { boxes } []
, sidePanel { boxes } []
]
renderRoute :: R2.Component Props
renderRoute = R.createElement renderRouteCpt
renderRouteCpt :: R.Component Props
renderRouteCpt = here.component "renderRoute" cpt where
cpt props@{ boxes } _ = do
let sessionNodeProps sId nId = Record.merge { nodeId: nId, sessionId: sId } props
route' <- T.useLive T.unequal boxes.route let handedClassName = case handed' of
LeftHanded -> "left-handed"
RightHanded -> "right-handed"
pure $ R.fragment pure $ R.fragment
[ case route' of ([ loginModal { boxes } []
GR.Annuaire s n -> annuaire (sessionNodeProps s n) [] , topBar { boxes } [] ] <>
GR.ContactPage s a n -> contact (Record.merge { annuaireId: a } $ sessionNodeProps s n) [] [ H.div { className: handedClassName } $ reverseHanded handed' $
GR.Corpus s n -> corpus (sessionNodeProps s n) [] [ forest { boxes } []
GR.CorpusDocument s c l n -> corpusDocument (Record.merge { corpusId: c, listId: l } $ sessionNodeProps s n) [] , mainPage { boxes } []
GR.Dashboard s n -> dashboard (sessionNodeProps s n) [] , sidePanel { boxes } []
GR.Document s l n -> document (Record.merge { listId: l } $ sessionNodeProps s n) [] ]
GR.Folder s n -> corpus (sessionNodeProps s n) [] ])
GR.FolderPrivate s n -> corpus (sessionNodeProps s n) []
GR.FolderPublic s n -> corpus (sessionNodeProps s n) []
GR.FolderShared s n -> corpus (sessionNodeProps s n) []
GR.Home -> home { boxes } []
GR.Lists s n -> lists (sessionNodeProps s n) []
GR.Login -> login' boxes
GR.PGraphExplorer s g -> graphExplorer (sessionNodeProps s g) []
GR.RouteFile s n -> routeFile (sessionNodeProps s n) []
GR.RouteFrameCalc s n -> routeFrame (Record.merge { nodeType: NodeFrameCalc } $ sessionNodeProps s n) []
GR.RouteFrameCode s n -> routeFrame (Record.merge { nodeType: NodeFrameNotebook } $ sessionNodeProps s n) []
GR.RouteFrameWrite s n -> routeFrame (Record.merge { nodeType: NodeFrameWrite } $ sessionNodeProps s n) []
GR.Team s n -> team (sessionNodeProps s n) []
GR.Texts s n -> texts (sessionNodeProps s n) []
GR.UserPage s n -> user (sessionNodeProps s n) []
]
loginModal :: R2.Component Props loginModal :: R2.Component Props
loginModal = R.createElement loginModalCpt loginModal = R.createElement loginModalCpt
loginModalCpt :: R.Component Props loginModalCpt :: R.Component Props
loginModalCpt = here.component "loginModal" cpt loginModalCpt = here.component "loginModal" cpt
where where
...@@ -110,33 +83,8 @@ loginModalCpt = here.component "loginModal" cpt ...@@ -110,33 +83,8 @@ loginModalCpt = here.component "loginModal" cpt
pure $ if showLogin' then login' boxes else H.div {} [] pure $ if showLogin' then login' boxes else H.div {} []
type AuthedProps =
( content :: Session -> R.Element
| SessionProps )
authed :: R2.Component AuthedProps
authed = R.createElement authedCpt
authedCpt :: R.Component AuthedProps
authedCpt = here.component "authed" cpt where
cpt props@{ boxes: { session, sessions }
, content
, sessionId } _ = do
sessions' <- T.useLive T.unequal sessions
let session' = Sessions.lookup sessionId sessions'
R.useEffect' $ do
T.write_ session' session
case session' of
Nothing -> pure $ home homeProps []
Just s -> pure $ R.fragment [ content s, footer {} [] ]
where
homeProps = RE.pick props :: Record Props
topBar :: R2.Component Props topBar :: R2.Component Props
topBar = R.createElement topBarCpt topBar = R.createElement topBarCpt
topBarCpt :: R.Component Props topBarCpt :: R.Component Props
topBarCpt = here.component "topBar" cpt where topBarCpt = here.component "topBar" cpt where
cpt props@{ boxes: boxes@{ handed cpt props@{ boxes: boxes@{ handed
...@@ -149,10 +97,15 @@ topBarCpt = here.component "topBar" cpt where ...@@ -149,10 +97,15 @@ topBarCpt = here.component "topBar" cpt where
pure $ TopBar.topBar { handed } children pure $ TopBar.topBar { handed } children
mainPage :: R2.Component Props
mainPage = R.createElement mainPageCpt
mainPageCpt :: R.Component Props
mainPageCpt = here.component "mainPage" cpt where
cpt { boxes } _ = do
pure $ MainPage.mainPage { boxes } [ renderRoute { boxes } [] ]
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@{ boxes: boxes@{ backend cpt props@{ boxes: boxes@{ backend
...@@ -165,24 +118,22 @@ forestCpt = here.component "forest" cpt where ...@@ -165,24 +118,22 @@ forestCpt = here.component "forest" cpt where
, sessions , sessions
, showLogin , showLogin
, showTree , showTree
, tasks } , tasks } } _ = do
} _ = do pure $ Forest.forestLayout { backend
pure $ Forest.forestLayoutMain { backend , forestOpen
, forestOpen , frontends: defaultFrontends
, frontends: defaultFrontends , handed
, handed , reloadForest
, reloadForest , reloadMainPage
, reloadMainPage , reloadRoot
, reloadRoot , route
, route , sessions
, sessions , showLogin
, showLogin , showTree
, showTree , tasks } []
, tasks } [ renderRoute { boxes } [] ]
sidePanel :: R2.Component Props sidePanel :: R2.Component Props
sidePanel = R.createElement sidePanelCpt sidePanel = R.createElement sidePanelCpt
sidePanelCpt :: R.Component Props sidePanelCpt :: R.Component Props
sidePanelCpt = here.component "sidePanel" cpt where sidePanelCpt = here.component "sidePanel" cpt where
cpt props@{ boxes: boxes@{ graphVersion cpt props@{ boxes: boxes@{ graphVersion
...@@ -202,6 +153,63 @@ sidePanelCpt = here.component "sidePanel" cpt where ...@@ -202,6 +153,63 @@ sidePanelCpt = here.component "sidePanel" cpt where
Opened -> pure $ openedSidePanel (Record.merge { session: s } props) [] Opened -> pure $ openedSidePanel (Record.merge { session: s } props) []
_ -> pure $ H.div {} [] _ -> pure $ H.div {} []
renderRoute :: R2.Component Props
renderRoute = R.createElement renderRouteCpt
renderRouteCpt :: R.Component Props
renderRouteCpt = here.component "renderRoute" cpt where
cpt props@{ boxes } _ = do
let sessionNodeProps sId nId = Record.merge { nodeId: nId, sessionId: sId } props
route' <- T.useLive T.unequal boxes.route
pure $ R.fragment
[ case route' of
GR.Annuaire s n -> annuaire (sessionNodeProps s n) []
GR.ContactPage s a n -> contact (Record.merge { annuaireId: a } $ sessionNodeProps s n) []
GR.Corpus s n -> corpus (sessionNodeProps s n) []
GR.CorpusDocument s c l n -> corpusDocument (Record.merge { corpusId: c, listId: l } $ sessionNodeProps s n) []
GR.Dashboard s n -> dashboard (sessionNodeProps s n) []
GR.Document s l n -> document (Record.merge { listId: l } $ sessionNodeProps s n) []
GR.Folder s n -> corpus (sessionNodeProps s n) []
GR.FolderPrivate s n -> corpus (sessionNodeProps s n) []
GR.FolderPublic s n -> corpus (sessionNodeProps s n) []
GR.FolderShared s n -> corpus (sessionNodeProps s n) []
GR.Home -> home { boxes } []
GR.Lists s n -> lists (sessionNodeProps s n) []
GR.Login -> login' boxes
GR.PGraphExplorer s g -> graphExplorer (sessionNodeProps s g) []
GR.RouteFile s n -> routeFile (sessionNodeProps s n) []
GR.RouteFrameCalc s n -> routeFrame (Record.merge { nodeType: NodeFrameCalc } $ sessionNodeProps s n) []
GR.RouteFrameCode s n -> routeFrame (Record.merge { nodeType: NodeFrameNotebook } $ sessionNodeProps s n) []
GR.RouteFrameWrite s n -> routeFrame (Record.merge { nodeType: NodeFrameWrite } $ sessionNodeProps s n) []
GR.Team s n -> team (sessionNodeProps s n) []
GR.Texts s n -> texts (sessionNodeProps s n) []
GR.UserPage s n -> user (sessionNodeProps s n) []
]
type AuthedProps =
( content :: Session -> R.Element
| SessionProps )
authed :: R2.Component AuthedProps
authed = R.createElement authedCpt
authedCpt :: R.Component AuthedProps
authedCpt = here.component "authed" cpt where
cpt props@{ boxes: { session, sessions }
, content
, sessionId } _ = do
sessions' <- T.useLive T.unequal sessions
let session' = Sessions.lookup sessionId sessions'
R.useEffect' $ do
T.write_ session' session
case session' of
Nothing -> pure $ home homeProps []
Just s -> pure $ R.fragment [ content s, footer {} [] ]
where
homeProps = RE.pick props :: Record Props
openedSidePanel :: R2.Component (WithSession Props) openedSidePanel :: R2.Component (WithSession Props)
openedSidePanel = R.createElement openedSidePanelCpt openedSidePanel = R.createElement openedSidePanelCpt
...@@ -389,7 +397,7 @@ listsCpt = here.component "lists" cpt where ...@@ -389,7 +397,7 @@ listsCpt = here.component "lists" cpt where
login' :: Boxes -> R.Element login' :: Boxes -> R.Element
login' { backend, sessions, showLogin: visible } = login' { backend, sessions, showLogin: visible } =
login { backend login { backend
, backends: fromFoldable defaultBackends , backends: A.fromFoldable defaultBackends
, sessions , sessions
, visible } , visible }
......
src/sass/_styles.sass
View file @ 4eb2785d
.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%
......
src/sass/_tree.sass
View file @ 4eb2785d
...@@ -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