SlideButton.purs 2.3 KB
Newer Older
1 2 3 4
module Gargantext.Components.GraphExplorer.SlideButton
  ( Props
  , sizeButton
  , labelSizeButton
5
  , mouseSelectorSizeButton
6 7 8 9 10
  ) where

import Global (readFloat)
import Prelude
import Data.Tuple.Nested ((/\))
11
import Effect (Effect)
12 13 14
import Reactix as R
import Reactix.DOM.HTML as H

15 16
import Gargantext.Hooks.Sigmax as Sigmax
import Gargantext.Hooks.Sigmax.Sigma as Sigma
17 18
import Gargantext.Utils.Reactix as R2

19 20 21 22 23 24 25
type Props = (
    state :: R.State Number
  , caption :: String
  , min :: Number
  , max :: Number
  , onChange :: forall e. e -> Effect Unit
  )
26 27 28 29 30 31 32

sizeButton :: Record Props -> R.Element
sizeButton props = R.createElement sizeButtonCpt props []

sizeButtonCpt :: R.Component Props
sizeButtonCpt = R.hooksComponent "SizeButton" cpt
  where
33
    cpt {state, caption, min, max, onChange} _ = do
34 35 36 37 38 39 40 41 42
      let (value /\ setValue) = state
      pure $
        H.span {}
          [ H.label {} [ H.text caption ]
          , H.input { type: "range"
                    , className: "form-control"
                    , min: show min
                    , max: show max
                    , defaultValue: value
43
                    , on: {input: onChange}
44 45 46
                    }
          ]

47
labelSizeButton :: R.Ref Sigmax.Sigma -> R.State Number -> R.Element
48 49
labelSizeButton sigmaRef state =
  sizeButton {
50
      state
51
    , caption: "Label Size"
52 53
    , min: 5.0
    , max: 30.0
54
    , onChange: \e -> do
55
      let sigma = R.readRef sigmaRef
56
      let newValue = readFloat $ R2.unsafeEventValue e
57
      let (_ /\ setValue) = state
58 59
      Sigmax.dependOnSigma sigma "[labelSizeButton] sigma: Nothing" $ \s -> do
        Sigma.setSettings s {
60
          defaultLabelSize: newValue
61 62
        , drawLabels: true
        , labelSizeRatio: newValue / 2.5
63
        }
64 65
      setValue $ const newValue
    }
66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83

mouseSelectorSizeButton :: R.Ref Sigmax.Sigma -> R.State Number -> R.Element
mouseSelectorSizeButton sigmaRef state =
  sizeButton {
      state
    , caption: "Selector Size"
    , min: 1.0
    , max: 50.0
    , onChange: \e -> do
      let sigma = R.readRef sigmaRef
      let (_ /\ setValue) = state
      let newValue = readFloat $ R2.unsafeEventValue e
      Sigmax.dependOnSigma sigma "[mouseSelectorSizeButton] sigma: Nothing" $ \s -> do
        Sigma.setSettings s {
          mouseSelectorSize: newValue
        }
      setValue $ const newValue
  }