[GraphExplorer] label size & threshold work now

9e37faed · Przemyslaw Kaminski · 1ed34b98 · 9e37faed · 9e37faed · 9e37faed
Commit 9e37faed authored Oct 04, 2022 by Przemyslaw Kaminski
3 changed files
--- a/src/Gargantext/Components/GraphExplorer/Store.purs
+++ b/src/Gargantext/Components/GraphExplorer/Store.purs
@@ -28,105 +28,109 @@ here = R2.here "Gargantext.Components.GraphExplorer.Store"

 type Store =
  -- Data
-  ( graph              :: T.Box SigmaxT.SGraph
-  , graphId            :: T.Box GET.GraphId
-  , mMetaData          :: T.Box (Maybe GET.MetaData)
-  , hyperdataGraph     :: T.Box GET.HyperdataGraph
+  ( graph                      :: T.Box SigmaxT.SGraph
+  , graphId                    :: T.Box GET.GraphId
+  , mMetaData                  :: T.Box (Maybe GET.MetaData)
+  , hyperdataGraph             :: T.Box GET.HyperdataGraph
  -- Layout
-  , showControls       :: T.Box Boolean
-  , sideTab            :: T.Box GET.SideTab
-  , showSidebar        :: T.Box GT.SidePanelState
-  , showDoc            :: T.Box (Maybe GET.GraphSideDoc)
-  , expandSelection    :: T.Box Boolean
-  , expandNeighborhood :: T.Box Boolean
+  , showControls               :: T.Box Boolean
+  , sideTab                    :: T.Box GET.SideTab
+  , showSidebar                :: T.Box GT.SidePanelState
+  , showDoc                    :: T.Box (Maybe GET.GraphSideDoc)
+  , expandSelection            :: T.Box Boolean
+  , expandNeighborhood         :: T.Box Boolean
  -- Controls
-  , multiSelectEnabled :: T.Box Boolean
-  , edgeConfluence     :: T.Box Range.NumberRange
-  , edgeWeight         :: T.Box Range.NumberRange
-  , forceAtlasState    :: T.Box SigmaxT.ForceAtlasState
-  , graphStage         :: T.Box GET.Stage
-  , nodeSize           :: T.Box Range.NumberRange
-  , showEdges          :: T.Box SigmaxT.ShowEdgesState
-  , showLouvain        :: T.Box Boolean
-  , labelSize          :: T.Box Number
-  , mouseSelectorSize  :: T.Box Number
-  , startForceAtlas    :: T.Box Boolean
+  , multiSelectEnabled         :: T.Box Boolean
+  , edgeConfluence             :: T.Box Range.NumberRange
+  , edgeWeight                 :: T.Box Range.NumberRange
+  , forceAtlasState            :: T.Box SigmaxT.ForceAtlasState
+  , graphStage                 :: T.Box GET.Stage
+  , nodeSize                   :: T.Box Range.NumberRange
+  , showEdges                  :: T.Box SigmaxT.ShowEdgesState
+  , showLouvain                :: T.Box Boolean
+  , labelSize                  :: T.Box Number
+  , labelRenderedSizeThreshold :: T.Box Number
+  , mouseSelectorSize          :: T.Box Number
+  , startForceAtlas            :: T.Box Boolean
  -- Terms update
-  , removedNodeIds     :: T.Box SigmaxT.NodeIds
-  , selectedNodeIds    :: T.Box SigmaxT.NodeIds
+  , removedNodeIds             :: T.Box SigmaxT.NodeIds
+  , selectedNodeIds            :: T.Box SigmaxT.NodeIds
  )

 type State =
  -- Data
-  ( graph              :: SigmaxT.SGraph
-  , graphId            :: GET.GraphId
-  , mMetaData          :: Maybe GET.MetaData
-  , hyperdataGraph     :: GET.HyperdataGraph
+  ( graph                      :: SigmaxT.SGraph
+  , graphId                    :: GET.GraphId
+  , mMetaData                  :: Maybe GET.MetaData
+  , hyperdataGraph             :: GET.HyperdataGraph
  -- Layout
-  , showControls       :: Boolean
-  , sideTab            :: GET.SideTab
-  , showSidebar        :: GT.SidePanelState
-  , showDoc            :: Maybe GET.GraphSideDoc
-  , expandSelection    :: Boolean
-  , expandNeighborhood :: Boolean
+  , showControls               :: Boolean
+  , sideTab                    :: GET.SideTab
+  , showSidebar                :: GT.SidePanelState
+  , showDoc                    :: Maybe GET.GraphSideDoc
+  , expandSelection            :: Boolean
+  , expandNeighborhood         :: Boolean
  -- Controls
-  , multiSelectEnabled :: Boolean
-  , edgeConfluence     :: Range.NumberRange
-  , edgeWeight         :: Range.NumberRange
-  , forceAtlasState    :: SigmaxT.ForceAtlasState
-  , graphStage         :: GET.Stage
-  , nodeSize           :: Range.NumberRange
-  , showEdges          :: SigmaxT.ShowEdgesState
-  , showLouvain        :: Boolean
-  , labelSize          :: Number
-  , mouseSelectorSize  :: Number
-  , startForceAtlas    :: Boolean
+  , multiSelectEnabled         :: Boolean
+  , edgeConfluence             :: Range.NumberRange
+  , edgeWeight                 :: Range.NumberRange
+  , forceAtlasState            :: SigmaxT.ForceAtlasState
+  , graphStage                 :: GET.Stage
+  , nodeSize                   :: Range.NumberRange
+  , showEdges                  :: SigmaxT.ShowEdgesState
+  , showLouvain                :: Boolean
+  , labelSize                  :: Number
+  , labelRenderedSizeThreshold :: Number
+  , mouseSelectorSize          :: Number
+  , startForceAtlas            :: Boolean
  -- Terms update
-  , removedNodeIds     :: SigmaxT.NodeIds
-  , selectedNodeIds    :: SigmaxT.NodeIds
+  , removedNodeIds             :: SigmaxT.NodeIds
+  , selectedNodeIds            :: SigmaxT.NodeIds
  )

 options ::
  -- Layout
-  { showControls        :: Boolean
-  , showDoc             :: Maybe GET.GraphSideDoc
-  , showSidebar         :: GT.SidePanelState
-  , sideTab             :: GET.SideTab
-  , expandSelection     :: Boolean
-  , expandNeighborhood  :: Boolean
+  { showControls               :: Boolean
+  , showDoc                    :: Maybe GET.GraphSideDoc
+  , showSidebar                :: GT.SidePanelState
+  , sideTab                    :: GET.SideTab
+  , expandSelection            :: Boolean
+  , expandNeighborhood         :: Boolean
  -- Controls
-  , labelSize           :: Number
-  , mouseSelectorSize   :: Number
-  , multiSelectEnabled  :: Boolean
-  , edgeConfluence      :: Range.NumberRange
-  , graphStage          :: GET.Stage
-  , nodeSize            :: Range.NumberRange
-  , showLouvain         :: Boolean
-  , showEdges           :: SigmaxT.ShowEdgesState
+  , labelSize                  :: Number
+  , labelRenderedSizeThreshold :: Number
+  , mouseSelectorSize          :: Number
+  , multiSelectEnabled         :: Boolean
+  , edgeConfluence             :: Range.NumberRange
+  , graphStage                 :: GET.Stage
+  , nodeSize                   :: Range.NumberRange
+  , showLouvain                :: Boolean
+  , showEdges                  :: SigmaxT.ShowEdgesState
  -- Terms update
-  , removedNodeIds      :: SigmaxT.NodeIds
-  , selectedNodeIds     :: SigmaxT.NodeIds
+  , removedNodeIds             :: SigmaxT.NodeIds
+  , selectedNodeIds            :: SigmaxT.NodeIds
  }
 options =
  -- Layout
-  { showControls        : false
-  , sideTab             : GET.SideTabLegend
-  , showSidebar         : GT.InitialClosed
-  , showDoc             : Nothing
-  , expandSelection     : getter _.expandSelection GET.defaultCacheParams
-  , expandNeighborhood  : getter _.expandNeighborhood GET.defaultCacheParams
+  { showControls               : false
+  , sideTab                    : GET.SideTabLegend
+  , showSidebar                : GT.InitialClosed
+  , showDoc                    : Nothing
+  , expandSelection            : getter _.expandSelection GET.defaultCacheParams
+  , expandNeighborhood         : getter _.expandNeighborhood GET.defaultCacheParams
  -- Controls
-  , multiSelectEnabled  : false
-  , labelSize           : 14.0
-  , mouseSelectorSize   : 15.0
-  , edgeConfluence      : Range.Closed { min: 0.0, max: 1.0 }
-  , graphStage          : GET.Init
-  , nodeSize            : Range.Closed { min: 0.0, max: 100.0 }
-  , showLouvain         : false
-  , showEdges           : SigmaxT.EShow
+  , multiSelectEnabled         : false
+  , labelSize                  : 14.0
+  , labelRenderedSizeThreshold : 6.0
+  , mouseSelectorSize          : 15.0
+  , edgeConfluence             : Range.Closed { min: 0.0, max: 1.0 }
+  , graphStage                 : GET.Init
+  , nodeSize                   : Range.Closed { min: 0.0, max: 100.0 }
+  , showLouvain                : false
+  , showEdges                  : SigmaxT.EShow
  -- Terms update
-  , removedNodeIds      : Set.empty
-  , selectedNodeIds     : Set.empty
+  , removedNodeIds             : Set.empty
+  , selectedNodeIds            : Set.empty
  }

 context :: R.Context (Record Store)

--- a/src/Gargantext/Components/GraphExplorer/Toolbar/Controls.purs
+++ b/src/Gargantext/Components/GraphExplorer/Toolbar/Controls.purs
@@ -16,7 +16,7 @@ import Gargantext.Components.GraphExplorer.Resources as Graph
 import Gargantext.Components.GraphExplorer.Store as GraphStore
 import Gargantext.Components.GraphExplorer.Toolbar.Buttons (centerButton, cameraButton, edgesToggleButton, louvainToggleButton, pauseForceAtlasButton, multiSelectEnabledButton)
 import Gargantext.Components.GraphExplorer.Toolbar.RangeControl (edgeConfluenceControl, edgeWeightControl, nodeSizeControl)
-import Gargantext.Components.GraphExplorer.Toolbar.SlideButton (labelSizeButton, mouseSelectorSizeButton)
+import Gargantext.Components.GraphExplorer.Toolbar.SlideButton (labelSizeButton, labelRenderedSizeThresholdButton, mouseSelectorSizeButton)
 import Gargantext.Components.GraphExplorer.Types as GET
 import Gargantext.Hooks.Session (useSession)
 import Gargantext.Hooks.Sigmax.ForceAtlas2 as ForceAtlas
@@ -56,6 +56,9 @@ controlsCpt = R.memo' $ here.component "controls" cpt where
    , graphId
    , graphStage
    , hyperdataGraph
+    , labelRenderedSizeThreshold
+    , labelSize
+    , mouseSelectorSize
    , multiSelectEnabled
    , nodeSize
    , selectedNodeIds
@@ -63,8 +66,6 @@ controlsCpt = R.memo' $ here.component "controls" cpt where
    , showLouvain
    , showSidebar
    , sideTab
-    , mouseSelectorSize
-    , labelSize
    } <- GraphStore.use

    forceAtlasState'    <- R2.useLive' forceAtlasState
@@ -262,6 +263,24 @@ controlsCpt = R.memo' $ here.component "controls" cpt where
            , state: nodeSize }

          ]
+        ,
+          H.div
+          { className: "d-flex justify-content-between" }
+          [
+            -- change level
+            -- file upload
+            -- run demo
+            -- search button
+            -- search topics
+            labelRenderedSizeThresholdButton sigmaRef labelRenderedSizeThreshold
+          -- ,
+          --   -- labels size: 1-4
+          --   nodeSizeControl
+          --   { range: nodeSizeRange
+          --   , state: nodeSize }
+
+          ]
+
        ]
      ]


--- a/src/Gargantext/Components/GraphExplorer/Toolbar/SlideButton.purs
+++ b/src/Gargantext/Components/GraphExplorer/Toolbar/SlideButton.purs
@@ -2,6 +2,7 @@ module Gargantext.Components.GraphExplorer.Toolbar.SlideButton
  ( Props
  , sizeButton
  , labelSizeButton
+  , labelRenderedSizeThresholdButton
  , mouseSelectorSizeButton
  ) where

@@ -73,14 +74,35 @@ labelSizeButton sigmaRef state =
        Just newValue ->
          Sigmax.dependOnSigma sigma "[labelSizeButton] sigma: Nothing" $ \s -> do
            Sigma.setSettings s {
-              defaultLabelSize: newValue
+                defaultLabelSize: newValue
              , drawLabels: true
+              , labelSize: newValue
              , maxNodeSize: newValue / 2.5
                --, labelSizeRatio: newValue / 2.5
              }
            T.write_ newValue state
    }

+labelRenderedSizeThresholdButton :: R.Ref Sigmax.Sigma -> T.Box Number -> R.Element
+labelRenderedSizeThresholdButton sigmaRef state =
+  sizeButton {
+      state
+    , caption: "Label rendered size threshold"
+    , min: 0.0
+    , max: 10.0
+    , onChange: \e -> do
+      let sigma = R.readRef sigmaRef
+      let newValue' = DN.fromString $ R.unsafeEventValue e
+      case newValue' of
+        Nothing -> pure unit
+        Just newValue ->
+          Sigmax.dependOnSigma sigma "[labelRenderdSizeThresholdButton] sigma: Nothing" $ \s -> do
+            Sigma.setSettings s {
+                labelRenderedSizeThreshold: newValue
+              }
+            T.write_ newValue state
+    }
+
 mouseSelectorSizeButton :: R.Ref Sigmax.Sigma -> T.Box Number -> R.Element
 mouseSelectorSizeButton sigmaRef state =
  sizeButton {