Skip to content

P
purescript-gargantext
Commit ade75834 authored by Abinaya Sudhir's avatar Abinaya Sudhir
Browse files
Options

tree spec added

parent 6180e41c
Hide whitespace changes
Inline Side-by-side
Showing with 133 additions and 115 deletions
src/DocView.purs
View file @ ade75834
......@@ -67,11 +67,12 @@ newtype Hyperdata = Hyperdata
}
type State = CorpusTableData
data Action
= ChangePageSize PageSizes
| ChangePage Int
| LoadData
| ToggleFolder ID
instance decodeHyperdata :: DecodeJson Hyperdata where
......@@ -94,21 +95,6 @@ instance decodeResponse :: DecodeJson Response where
pure $ Response { cid, created, favorite, ngramCount, hyperdata }
type Name = String
type Open = Boolean
type URL = String
type ID = Int
data NTree a = NLeaf a | NNode ID Open Name (Array (NTree a))
type FTree = NTree (Tuple Name URL)
toggleNode :: forall t10. Int -> NTree t10 -> NTree t10
toggleNode sid (NNode iid open name ary) =
NNode iid nopen name $ map (toggleNode sid) ary
where
nopen = if sid == iid then not open else open
toggleNode sid a = a
layoutDocview :: Spec _ State _ Action
......@@ -121,7 +107,7 @@ layoutDocview = simpleSpec performAction render
[ div [className "col-md-3"]
[ br' []
, br' []
, div [className "tree"] [toHtml dispatch d.tree]
-- , div [className "tree"] [toHtml dispatch d.tree]
]
, div [className "col-md-9"]
[ nav []
......@@ -173,66 +159,6 @@ layoutDocview = simpleSpec performAction render
]
------------------------------------------------------------------------
-- Realistic Tree for the UI
myCorpus :: Int -> String -> NTree (Tuple String String)
myCorpus n name = NNode n false name
[ NLeaf (Tuple "Facets" "#/docView")
, NLeaf (Tuple "Graph" "#/docView")
, NLeaf (Tuple "Dashboard" "#/userPage")
]
exampleTree :: NTree (Tuple String String)
exampleTree =
NNode 1 true "My gargantext"
[ myCorpus 2 "My publications"
, myCorpus 3 "My community"
, NNode 4 false "My researchs" [ myCorpus 5 "Subject A"
, myCorpus 6 "Subject B"
, myCorpus 7 "Subject C"
]
]
------------------------------------------------------------------------
-- TODO
-- alignment to the right
nodeOptionsCorp activated = case activated of
true -> [ i [className "fab fa-whmcs" ] []]
false -> []
-- TODO
-- alignment to the right
-- on hover make other options available:
nodeOptionsView activated = case activated of
true -> [ i [className "fas fa-sync-alt" ] []
, i [className "fas fa-upload" ] []
, i [className "fas fa-share-alt"] []
]
false -> []
toHtml :: _ -> FTree -> ReactElement
toHtml d (NLeaf (Tuple name link)) =
li []
[ a [ href link]
( [ text (name <> " ")
] <> nodeOptionsView false
)
]
toHtml d (NNode id open name ary) =
ul [ ]
[ li [] $
( [ a [onClick $ (\e-> d $ ToggleFolder id)] [i [fldr open] []]
, text $ " " <> name <> " "
] <> nodeOptionsCorp false <>
if open then
map (toHtml d) ary
else []
)
]
fldr :: Boolean -> Props
fldr open = if open then className "fas fa-folder-open" else className "fas fa-folder"
performAction :: PerformAction _ State _ Action
performAction (ChangePageSize ps) _ _ = void (cotransform (\state -> changePageSize ps state ))
......@@ -256,7 +182,7 @@ performAction LoadData _ _ = void do
}
performAction (ToggleFolder i) _ _ = void (cotransform (\(TableData td) -> TableData $ td {tree = toggleNode i td.tree}))
-- performAction (ToggleFolder i) _ _ = void (cotransform (\(TableData td) -> TableData $ td {tree = toggleNode i td.tree}))
changePageSize :: PageSizes -> CorpusTableData -> CorpusTableData
......@@ -411,7 +337,7 @@ newtype TableData a
, pageSize :: PageSizes
, totalRecords :: Int
, title :: String
, tree :: FTree
-- , tree :: FTree
}
newtype Corpus
......@@ -446,7 +372,7 @@ tdata = TableData
, pageSize : PS10
, totalRecords : 100
, title : "Documents"
, tree : exampleTree
-- , tree : exampleTree
}
tdata' :: _ -> CorpusTableData
......@@ -457,7 +383,7 @@ tdata' d = TableData
, pageSize : PS10
, totalRecords : 100
, title : "Documents"
, tree : exampleTree
-- , tree : exampleTree
}
......
src/NTree.purs
View file @ ade75834
module NTree where
import Prelude
import Data.Tuple (Tuple(..))
import Prelude hiding (div)
import React (ReactElement)
import React.DOM (a, i, li, text, ul)
import React.DOM.Props (className, href)
import React.DOM (a, div, i, li, text, ul)
import React.DOM.Props (Props, className, href, onClick)
import Thermite (PerformAction, Render, Spec, cotransform, simpleSpec)
type Name = String
type Open = Boolean
type URL = String
type ID = Int
data NTree a = NLeaf a | NNode ID Open Name (Array (NTree a))
type FTree = NTree (Tuple Name URL)
data Action = ToggleFolder ID
type State = FTree
initialState :: State
initialState = NLeaf (Tuple "" "")
performAction :: PerformAction _ State _ Action
performAction (ToggleFolder i) _ _ = void (cotransform (\td -> toggleNode i td))
toggleNode :: forall t10. Int -> NTree t10 -> NTree t10
toggleNode sid (NNode iid open name ary) =
NNode iid nopen name $ map (toggleNode sid) ary
where
nopen = if sid == iid then not open else open
toggleNode sid a = a
data NTree a = NLeaf a | NNode String (Array (NTree a))
type FTree = NTree (Tuple String String)
------------------------------------------------------------------------
-- Realistic Tree for the UI
myCorpus :: Int -> String -> NTree (Tuple String String)
myCorpus n name = NNode n false name
[ NLeaf (Tuple "Facets" "#/docView")
, NLeaf (Tuple "Graph" "#/docView")
, NLeaf (Tuple "Dashboard" "#/userPage")
]
exampleTree :: NTree (Tuple String String)
exampleTree =
NNode 1 true "My gargantext"
[ myCorpus 2 "My publications"
, myCorpus 3 "My community"
, NNode 4 false "My researchs" [ myCorpus 5 "Subject A"
, myCorpus 6 "Subject B"
, myCorpus 7 "Subject C"
]
]
------------------------------------------------------------------------
-- TODO
-- alignment to the right
nodeOptionsCorp :: Boolean -> Array ReactElement
nodeOptionsCorp activated = case activated of
true -> [ i [className "fab fa-whmcs" ] []]
false -> []
-- TODO
-- alignment to the right
-- on hover make other options available:
nodeOptionsView :: Boolean -> Array ReactElement
nodeOptionsView activated = case activated of
true -> [ i [className "fas fa-sync-alt" ] []
, i [className "fas fa-upload" ] []
, i [className "fas fa-share-alt"] []
]
false -> []
toHtml :: FTree -> ReactElement
toHtml (NLeaf (Tuple name link)) =
treeview :: Spec _ State _ Action
treeview = simpleSpec performAction render
where
render :: Render State _ Action
render dispatch _ state _ =
[div [className "tree"] [toHtml dispatch state]]
toHtml :: _ -> FTree -> ReactElement
toHtml d (NLeaf (Tuple name link)) =
li []
[ a [ href link]
[ i [className "fas fa-folder"] []
, text name
]
( [ text (name <> " ")
] <> nodeOptionsView false
)
]
toHtml (NNode name ary) =
ul []
toHtml d (NNode id open name ary) =
ul [ ]
[ li [] $
[ text name
] <>
map toHtml ary
( [ a [onClick $ (\e-> d $ ToggleFolder id)] [i [fldr open] []]
, text $ " " <> name <> " "
] <> nodeOptionsCorp false <>
if open then
map (toHtml d) ary
else []
)
]
fldr :: Boolean -> Props
fldr open = if open then className "fas fa-folder-open" else className "fas fa-folder"
src/Navigation.purs
View file @ ade75834
module Navigation where
import DOM
import Gargantext.Data.Lang
import Prelude
import AddCorpusview as AC
import AnnotationDocumentView as D
import Control.Monad.Eff.Console (CONSOLE)
import Data.Array (concat)
import Data.Either (Either(..))
import Data.Foldable (fold, intercalate)
import Data.Lens (Lens', Prism', lens, over, prism)
import Data.Maybe (Maybe(Nothing, Just))
import Data.Tuple (Tuple(..))
import DocView as DV
import Landing as L
import Login as LN
import NTree as NT
import Network.HTTP.Affjax (AJAX)
import PageRouter (Routes(..))
import Prelude (class Applicative, class Bind, Unit, bind, id, map, negate, pure, unit, void, ($), (<>))
import React (ReactElement)
import React.DOM (a, div, img, li, span, text, ul, input, button, footer, p, hr, form)
import React.DOM.Props (_data, _id, _type, aria, className, href, name, placeholder, role, src, style, tabIndex, target, title)
import React.DOM (a, button, div, footer, form, hr, i, img, input, li, p, span, text, ul)
import React.DOM.Props (Props, _data, _id, _type, aria, className, href, name, onClick, placeholder, role, src, style, tabIndex, target, title)
import React.DOM.Props as RP
import SearchForm as S
import Thermite (PerformAction, Render, Spec, _render, defaultRender, focus, modifyState, simpleSpec, withState)
import Thermite (PerformAction, Render, Spec, _render, cotransform, defaultRender, focus, modifyState, simpleSpec, withState)
import UserPage as UP
import AnnotationDocumentView as D
import Gargantext.Data.Lang
type E e = (dom :: DOM, ajax :: AJAX, console :: CONSOLE | e)
type AppState =
......@@ -37,6 +37,7 @@ type AppState =
, searchState :: S.State
, userPage :: UP.State
, annotationdocumentView :: D.State
, ntreeView :: NT.State
}
initAppState :: AppState
......@@ -49,6 +50,7 @@ initAppState =
, searchState : S.initialState
, userPage : UP.initialState
, annotationdocumentView : D.initialState
, ntreeView : NT.exampleTree
}
data Action
......@@ -61,6 +63,7 @@ data Action
| SearchA S.Action
| UserPageA UP.Action
| AnnotationDocumentViewA D.Action
| TreeViewA NT.Action
performAction :: forall eff props. PerformAction ( dom :: DOM
......@@ -69,10 +72,12 @@ performAction :: forall eff props. PerformAction ( dom :: DOM
performAction (SetRoute route) _ _ = void do
modifyState $ _ {currentRoute = pure route}
performAction _ _ _ = void do
performAction _ _ _ = void do
modifyState id
---- Lens and Prism
_landingState :: Lens' AppState L.State
_landingState = lens (\s -> s.landingState) (\s ss -> s{landingState = ss})
......@@ -151,6 +156,16 @@ _annotationdocumentviewAction = prism AnnotationDocumentViewA \action ->
_-> Left action
_treeState :: Lens' AppState NT.State
_treeState = lens (\s -> s.ntreeView) (\s ss -> s {ntreeView = ss})
_treeAction :: Prism' Action NT.Action
_treeAction = prism TreeViewA \action ->
case action of
TreeViewA caction -> Right caction
_-> Left action
pagesComponent :: forall props eff. AppState -> Spec (E eff) AppState props Action
pagesComponent s =
......@@ -185,11 +200,9 @@ layout0 :: forall eff props. Spec (E eff) AppState props Action
layout0 layout =
fold
[ layoutSidebar
-- TODO Add layoutTree
--, exampleTree'
, divSearchBar
, focus _treeState _treeAction NT.treeview
, divSearchBar
, innerLayout $ layout
, layoutFooter
]
where
......@@ -202,11 +215,11 @@ layout0 layout =
]
]
-- TODO Add Tree to the template
-- exampleTree' :: forall props eff. Spec (dom :: DOM |eff) AppState props Action
-- exampleTree' = simpleSpec performAction render
-- where
-- render :: Render AppState props Action
-- render dispatch _ state _ = DV.toHtml dispatch DV.exampleTree
-- exampleTree' :: forall props eff. Spec (dom :: DOM |eff) AppState props Action
-- exampleTree' = simpleSpec performAction render
-- where
-- render :: Render AppState props Action
-- render dispatch _ state _ = [ toHtml dispatch exampleTree]
layoutSidebar :: forall props eff. Spec (dom :: DOM |eff) AppState props Action
......
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