[Echarts] Options to view data, download as image

src/Gargantext/Components/Annotation/AnnotatedField.purs

@@ -47,8 +47,7 @@ annotatedFieldComponent :: R.Component Props
 annotatedFieldComponent = R.hooksComponent "AnnotatedField" cpt
   where
     runs props =
-      HTML.div { className: "annotated-field-runs" } $
-        annotateRun <$> compile props
+      HTML.div { className: "annotated-field-runs" } (map annotateRun $ compile props)
     cpt props _ = do
       menu /\ setMenu <- R.useState $ \_ -> pure Nothing
       let wrapperProps =
@@ -99,9 +98,9 @@ annotateRun (Tuple text list) = R.createElement annotatedRunComponent { text, li
 
 annotatedRunComponent :: R.Component RunProps
 annotatedRunComponent = R.staticComponent "AnnotatedRun" cpt
-  where cpt { text, list } _ = maybe' (\_ -> unstyled text) (styled text) list
-        styled text list = HTML.span { className: className list } [ HTML.text text ]
-        unstyled text = HTML.span {} [ HTML.text text ]
-        className list = "annotation-run " <> termClass list
+  where cpt    { text, list } _ = maybe' (\_ -> unstyled text) (styled text) list
+        styled   text  list     = HTML.span { className: className list } [ HTML.text text ]
+        unstyled text           = HTML.span {} [ HTML.text text ]
+        className      list     = "annotation-run " <> termClass list
 
 

src/Gargantext/Components/Charts/Options/ECharts.purs

@@ -7,7 +7,7 @@ import CSS.Common (normal)
 import Data.Array (length)
 import Gargantext.Components.Charts.Options.Color (transparent, violet, black)
 import Gargantext.Components.Charts.Options.Data (DataLegend, DataAxis, dataSerie)
-import Gargantext.Components.Charts.Options.Font (IconOptions(..), Shape(..), TextStyle, chartFontStyle, chartFontWeight, icon, mkTooltip, Tooltip)
+import Gargantext.Components.Charts.Options.Font (IconOptions(..), Shape(..), TextStyle, chartFontStyle, chartFontWeight, icon, mkTooltip, Tooltip, ToolBox, mkToolBox)
 import Gargantext.Components.Charts.Options.Legend (legendType, LegendMode(..), PlainOrScroll(..), selectedMode, Orientation(..), orient)
 import Gargantext.Components.Charts.Options.Position (Align(..), LeftRelativePosition(..), TopRelativePosition(..), numberPosition, percentPosition, relativePosition)
 import Gargantext.Components.Charts.Options.Series (Series, SeriesName, Chart(..), seriesPieD1)
@@ -162,7 +162,7 @@ data Options = Options
   }
 
 tooltipTriggerAxis :: Tooltip
-tooltipTriggerAxis = mkTooltip {trigger: "axis"}
+tooltipTriggerAxis = mkTooltip { trigger: "axis"}
 
 opts :: Options -> Option
 opts (Options { mainTitle
@@ -182,6 +182,7 @@ opts (Options { mainTitle
   , yAxis
   , dataZoom: if addZoom then [zoom Slider, zoom Inside] else []
   , children : unsafeCoerce [] -- TODO
+  , toolbox: mkToolBox
   }
 
 data Zoom = Slider | Inside

src/Gargantext/Components/Charts/Options/Font.purs

@@ -17,6 +17,13 @@ module Gargantext.Components.Charts.Options.Font
   , Tooltip
   , TooltipOptional
   , mkTooltip
+  , ToolBox
+  , mkToolBox
+  , Feature
+  , DataView
+  , MagicType
+  , Save
+  , Restore
   ) where
 
 import Prelude (Unit, ($), (<<<), (<>))
@@ -109,5 +116,48 @@ type TooltipOptional =
   , formatter :: Formatter
   )
 
+-----------------------------------------------------------------
+-- | ToolBox
+mkToolBox :: ToolBox
+mkToolBox = { feature: { dataView    : { show: true, readOnly : false, title : "View data"}
+                       , saveAsImage : { show : true, pixelRatio : 10, title : "Save as image"}
+                       -- , magicType   : { show : true, "type" : ["line", "bar", "pie", "stack", "tiled"], title : "Type"}
+                       , restore     : {show : true, title : "Restore"}
+                     }
+            , orient : "vertical"
+          }
+
+
+---------------------------------------
+type ToolBox = { feature :: Feature 
+               , orient  :: String}
+type Feature = { dataView :: DataView
+               , saveAsImage   :: Save
+               --, magicType :: MagicType
+               , restore :: Restore
+               }
+
+---------------------------------------
+type Save = { show :: Boolean
+            , pixelRatio :: Int
+            , title :: String
+          }
+
+type Restore = { show :: Boolean
+               , title :: String}
+
+type MagicType = { show :: Boolean
+                 , "type" :: Array String  -- TODO use line bar types
+                 , title :: String
+               }
+---------------------------------------
+
+type DataView = { show :: Boolean
+                , readOnly :: Boolean
+                , title :: String
+              }
+
+---------------------------------------
+
 mkTooltip :: forall o. Optional o TooltipOptional => Record o -> Tooltip
 mkTooltip = unsafeCoerce

src/Gargantext/Components/Charts/Options/Type.purs

@@ -4,7 +4,7 @@ import Prelude
 
 import Gargantext.Components.Charts.Options.Color (Color)
 import Gargantext.Components.Charts.Options.Data (DataLegend, DataAxis)
-import Gargantext.Components.Charts.Options.Font (TextStyle, Tooltip)
+import Gargantext.Components.Charts.Options.Font (TextStyle, Tooltip, ToolBox)
 import Gargantext.Components.Charts.Options.Legend (LegendType, Orient, SelectedMode)
 import Gargantext.Components.Charts.Options.Position (LeftRelativePosition, Position, TopRelativePosition)
 import Gargantext.Components.Charts.Options.Series (Series)
@@ -42,6 +42,7 @@ type Option =
   , series   :: Array Series
   , dataZoom :: Array DataZoom
   , children :: R.Children
+  , toolbox   :: ToolBox
   }
 
 type Title =

src/Gargantext/Pages/Layout/Specs.purs

@@ -85,7 +85,8 @@ layout0 layout =
     outerLayout :: Spec AppState {} Action
     outerLayout =
       cont $ fold
-      [ withState \st ->
+      [ -- over _render \render d p s c ->  [logLinks d s] ,
+       withState \st ->
           case st.loginState.authData of
             Just (AuthData {tree_id}) ->
               ls $ cmapProps (const {root: tree_id}) as
@@ -302,15 +303,11 @@ liNav (LiNav { title : title'
                       ]
                 ]
 
-divDropdownRight :: (Action -> Effect Unit) -> AppState -> ReactElement
-divDropdownRight d s =
-  ul [className "nav navbar-nav pull-right"]
-     [ li [className "dropdown"]
-       [ case s.loginState.authData of
+
+logLinks :: (Action -> Effect Unit) -> AppState -> ReactElement
+logLinks d s = case s.loginState.authData of
            Nothing -> loginLink
            Just _  -> logoutLink
-       ]
-     ]
   where
     loginLink =
       a [ aria {hidden : true}
@@ -332,6 +329,14 @@ divDropdownRight d s =
         ]
         [text " Logout"]
 
+
+divDropdownRight :: (Action -> Effect Unit) -> AppState -> ReactElement
+divDropdownRight d s =
+  ul [className "nav navbar-nav pull-right"]
+     [ li [className "dropdown"]
+          [ logLinks d s ]
+    ]
+
 layoutFooter :: Spec AppState {} Action
 layoutFooter = simpleSpec performAction render
   where