graphExplorer layout

src/GraphExplorer.purs

+module GraphExplorer where
+
+import React.DOM (button, button', div, form', input, li', menu, text, ul, ul')
+import React.DOM.Props (_id, _type, className, name, placeholder, value)
+import Thermite (Spec, defaultPerformAction, simpleSpec)
+
+newtype State = State {mode :: String}
+
+data Action = NoOp
+
+initialState :: State
+initialState = State {mode : "select"}
+
+spec :: forall eff props. Spec eff State props Action
+spec = simpleSpec defaultPerformAction render
+  where
+    render _ _ _ _ =
+      [  div [className "row"] [
+            div [className "col-md-12"]
+            [ menu [_id "toolbar"]
+              [ ul'
+                [ li'
+                  [--GraphLoader here
+                  ]
+                , li'
+                  [ button [className "btn btn-success btn-sm"] [text "Change Type"]
+                  ]
+                , li'
+                  [ button [className "btn btn-primary btn-sm"] [text "Change Level"]
+                  ]
+                , li'
+                  [ form'
+                    [ input [_type "text", name "query", placeholder "Select Topics"] []
+                    , input [_type "submit", value "Search"] []
+                    ]
+                  ]
+                , li'
+                  [ button' [text "Screenshot"]]
+                , li'
+                  [ button' [text "Save"] -- TODO: Implement Save!
+                  ]
+                ]
+              ]
+            ]
+           ]
+         , div [className "row"]
+           [ div [className "col-md-8"]
+             [ div [] [text "GraphExplorer here...."]
+             ]
+           , div [className "col-md-4"]
+             [ div [_id "sidepanel"]
+               [ text "SidePanel for contextual information"
+               ]
+             ]
+           ]
+         ]

src/Navigation.purs

@@ -34,6 +34,7 @@ import Tabview as TV
 import Thermite (PerformAction, Render, Spec, _render, cotransform, defaultPerformAction, defaultRender, focus, modifyState, simpleSpec, withState)
 import Unsafe.Coerce (unsafeCoerce)
 import UserPage as UP
+import GraphExplorer as GE
 
 type E e = (dom :: DOM, ajax :: AJAX, console :: CONSOLE | e)
 
@@ -52,6 +53,7 @@ type AppState =
   , corpusAnalysis :: CA.State
   , showLogin :: Boolean
   , showCorpus :: Boolean
+  , graphExplorer :: GE.State
   }
 
 initAppState :: AppState
@@ -70,6 +72,7 @@ initAppState =
   , corpusAnalysis : CA.initialState
   , showLogin : false
   , showCorpus : false
+  , graphExplorer : GE.initialState
   }
 
 data Action
@@ -84,6 +87,7 @@ data Action
   | AnnotationDocumentViewA  D.Action
   | TreeViewA  NT.Action
   | TabViewA TV.Action
+  | GraphExplorerA GE.Action
   | Search String
   | Go
   | CorpusAnalysisA CA.Action
@@ -125,7 +129,6 @@ performAction _ _ _ = void do
 _landingState :: Lens' AppState L.State
 _landingState = lens (\s -> s.landingState) (\s ss -> s{landingState = ss})
 
-
 _landingAction :: Prism' Action L.Action
 _landingAction = prism LandingA \action ->
   case action of
@@ -233,6 +236,16 @@ _corpusAction = prism CorpusAnalysisA \action ->
     _-> Left action
 
 
+_graphExplorerState :: Lens' AppState GE.State
+_graphExplorerState = lens (\s -> s.graphExplorer) (\s ss -> s{graphExplorer = ss})
+
+_graphExplorerAction :: Prism' Action GE.Action
+_graphExplorerAction = prism GraphExplorerA \action ->
+  case action of
+    GraphExplorerA caction -> Right caction
+    _-> Left action
+
+
 pagesComponent :: forall props eff. AppState -> Spec (E eff) AppState props Action
 pagesComponent s =
   case s.currentRoute of
@@ -256,6 +269,7 @@ pagesComponent s =
     selectSpec Tabview   = layout0 $ focus _tabviewState  _tabviewAction  TV.tab1
     -- To be removed
     selectSpec SearchView = layout0 $ focus _searchState _searchAction  S.searchSpec
+    selectSpec PGraphExplorer = focus _graphExplorerState _graphExplorerAction  GE.spec
     selectSpec _ = simpleSpec defaultPerformAction defaultRender
 
 routingSpec :: forall props eff. Spec (dom :: DOM |eff) AppState props Action
@@ -579,3 +593,8 @@ dispatchAction dispatcher _ CorpusAnalysis = do
   _ <- dispatcher $ SetRoute  $ CorpusAnalysis
   --_ <- dispatcher $ CorpusAnalysisA $ CA.NoOp
   pure unit
+
+dispatchAction dispatcher _ PGraphExplorer = do
+  _ <- dispatcher $ SetRoute  $ PGraphExplorer
+  --_ <- dispatcher $ GraphExplorerA $ GE.NoOp
+  pure unit

src/PageRouter.purs

@@ -25,6 +25,7 @@ data Routes
   | AnnotationDocumentView Int
   | Tabview
   | CorpusAnalysis
+  | PGraphExplorer
 
 
 instance showRoutes :: Show Routes where
@@ -37,6 +38,7 @@ instance showRoutes :: Show Routes where
   show (AnnotationDocumentView i)  = "DocumentView"
   show Tabview   = "Tabview"
   show CorpusAnalysis   = "corpus"
+  show PGraphExplorer = "graphExplorer"
 
 int :: Match Int
 int = floor <$> num
@@ -52,6 +54,7 @@ routing =
   <|> docviewRoute
   <|> addcorpusRoute
   <|> corpusAnalysis
+  <|> graphExplorer
   <|> home
   where
     tabview  = Tabview   <$ route "tabview"
@@ -61,7 +64,8 @@ routing =
     docviewRoute   = DocView    <$ route "docView"
     addcorpusRoute = AddCorpus  <$ route "addCorpus"
     loginRoute     = Login      <$ route "login"
-    corpusAnalysis  = CorpusAnalysis <$ route "corpus"
+    corpusAnalysis = CorpusAnalysis <$ route "corpus"
+    graphExplorer  = PGraphExplorer <$ route "graphExplorer"
     home           = Home       <$ lit ""
     route str      = lit "" *> lit str