[graph] screenshot works properly now, with storing camera position

src/Gargantext/Components/Graph.purs

@@ -16,6 +16,7 @@ import FFI.Simple (delay)
 import Reactix as R
 import Reactix.DOM.HTML as RH
 
+import Gargantext.Components.GraphExplorer.Types as GET
 import Gargantext.Hooks.Sigmax as Sigmax
 import Gargantext.Hooks.Sigmax.Types as SigmaxTypes
 import Gargantext.Hooks.Sigmax.Sigma as Sigma
@@ -24,10 +25,11 @@ type OnProps  = ()
 
 data Stage = Init | Ready | Cleanup
 
-type Props sigma forceatlas2 =
-  ( elRef :: R.Ref (Nullable Element)
+type Props sigma forceatlas2 = (
+    elRef :: R.Ref (Nullable Element)
   , forceAtlas2Settings :: forceatlas2
   , graph :: SigmaxTypes.SGraph
+  , mCamera :: Maybe GET.Camera
   , multiSelectEnabledRef :: R.Ref Boolean
   , selectedNodeIds :: R.State SigmaxTypes.NodeIds
   , showEdges :: R.State SigmaxTypes.ShowEdgesState
@@ -84,12 +86,17 @@ graphCpt = R.hooksComponent "G.C.Graph" cpt
 
                 Sigmax.setEdges sig false
 
-                log2 "[graph] startForceAtlas" props.startForceAtlas
+                -- log2 "[graph] startForceAtlas" props.startForceAtlas
                 if props.startForceAtlas then
                   Sigma.startForceAtlas2 sig props.forceAtlas2Settings
                 else
                   Sigma.stopForceAtlas2 sig
 
+                case props.mCamera of
+                  Nothing -> pure unit
+                  Just (GET.Camera { ratio, x, y }) -> do
+                    Sigma.updateCamera sig { ratio, x, y }
+
                 pure unit
           Just sig -> do
             pure unit

src/Gargantext/Components/GraphExplorer.purs

@@ -50,8 +50,8 @@ type LayoutProps =
 
 type Props = (
     graph :: SigmaxT.SGraph
-  , graphData :: GET.GraphData
   , graphVersion :: R.State Int
+  , hyperdataGraph :: GET.HyperdataGraph
   , mMetaData :: Maybe GET.MetaData
   | LayoutProps
   )
@@ -76,8 +76,10 @@ explorerLayoutView graphVersion p = R.createElement el p []
       useLoader graphId (getNodes session graphVersion) handler
       where
         handler loaded =
-          explorer (Record.merge props { graph, graphData: loaded, graphVersion, mMetaData })
-          where (Tuple mMetaData graph) = convert loaded
+          explorer (Record.merge props { graph, graphVersion, hyperdataGraph: loaded, mMetaData })
+          where
+            GET.HyperdataGraph { graph: hyperdataGraph } = loaded
+            (Tuple mMetaData graph) = convert hyperdataGraph
 
 --------------------------------------------------------------
 explorer :: Record Props -> R.Element
@@ -88,10 +90,10 @@ explorerCpt = R.hooksComponent "G.C.GraphExplorer.explorer" cpt
   where
     cpt props@{ frontends
               , graph
-              , graphData
               , graphId
               , graphVersion
               , handed
+              , hyperdataGraph
               , mCurrentRoute
               , mMetaData
               , session
@@ -105,7 +107,7 @@ explorerCpt = R.hooksComponent "G.C.GraphExplorer.explorer" cpt
       dataRef <- R.useRef graph
       graphRef <- R.useRef null
       graphVersionRef       <- R.useRef (fst graphVersion)
-      controls              <- Controls.useGraphControls graph graphData graphId session forceAtlasS
+      controls              <- Controls.useGraphControls graph graphId hyperdataGraph session forceAtlasS
       multiSelectEnabledRef <- R.useRef $ fst controls.multiSelectEnabled
 
       R.useEffect' $ do
@@ -151,6 +153,7 @@ explorerCpt = R.hooksComponent "G.C.GraphExplorer.explorer" cpt
                                   , elRef: graphRef
                                   , graphId
                                   , graph
+                                  , hyperdataGraph
                                   , mMetaData
                                   , multiSelectEnabledRef
                                   }
@@ -222,6 +225,7 @@ type GraphProps = (
   , elRef                 :: R.Ref (Nullable Element)
   , graphId               :: GET.GraphId
   , graph                 :: SigmaxT.SGraph
+  , hyperdataGraph        :: GET.HyperdataGraph
   , mMetaData             :: Maybe GET.MetaData
   , multiSelectEnabledRef :: R.Ref Boolean
 )
@@ -233,7 +237,13 @@ graphView props = R.createElement graphViewCpt props []
 graphViewCpt :: R.Component GraphProps
 graphViewCpt = R.hooksComponent "GraphView" cpt
   where
-    cpt {controls, elRef, graphId, graph, mMetaData, multiSelectEnabledRef} _children = do
+    cpt { controls
+        , elRef
+        , graphId
+        , graph
+        , hyperdataGraph: GET.HyperdataGraph { mCamera }
+        , mMetaData
+        , multiSelectEnabledRef } _children = do
       -- TODO Cache this?
       let louvainGraph =
             if (fst controls.showLouvain) then
@@ -252,6 +262,7 @@ graphViewCpt = R.hooksComponent "GraphView" cpt
           elRef
         , forceAtlas2Settings: Graph.forceAtlas2Settings
         , graph
+        , mCamera
         , multiSelectEnabledRef
         , selectedNodeIds: controls.selectedNodeIds
         , showEdges: controls.showEdges
@@ -315,7 +326,7 @@ modeGraphType Types.Sources = "star"
 modeGraphType Types.Terms = "def"
 
 
-getNodes :: Session -> R.State Int -> GET.GraphId -> Aff GET.GraphData
+getNodes :: Session -> R.State Int -> GET.GraphId -> Aff GET.HyperdataGraph
 getNodes session (graphVersion /\ _) graphId = get session $ NodeAPI Types.Graph (Just graphId) ("?version=" <> show graphVersion)
 
 

src/Gargantext/Components/GraphExplorer/API.purs

 module Gargantext.Components.GraphExplorer.API where
 
-import Data.Maybe (Maybe)
+import Data.Maybe (Maybe(..))
 import Effect.Aff (Aff)
 
 import Gargantext.Components.GraphExplorer.Types as GET
@@ -84,10 +84,10 @@ updateGraphVersions { graphId, session } = post session (GR.GraphAPI graphId $ "
 
 type CloneGraphParams =
   (
-    graphData :: GET.GraphData
+    hyperdataGraph :: GET.HyperdataGraph
   , id :: Int
   , session :: Session
   )
 
 cloneGraph :: Record CloneGraphParams -> Aff Int
-cloneGraph { graphData, id, session } = post session (GR.GraphAPI id $ "clone") graphData
+cloneGraph { hyperdataGraph, id, session } = post session (GR.GraphAPI id $ "clone") hyperdataGraph

src/Gargantext/Components/GraphExplorer/Button.purs

@@ -59,7 +59,7 @@ centerButton sigmaRef = simpleButton {
 
 type CameraButtonProps = (
     id :: Int
-  , graphData :: GET.GraphData
+  , hyperdataGraph :: GET.HyperdataGraph
   , session :: Session
   , sigmaRef :: R.Ref Sigmax.Sigma
   )
@@ -67,7 +67,7 @@ type CameraButtonProps = (
 
 cameraButton :: Record CameraButtonProps -> R.Element
 cameraButton { id
-             , graphData: GET.GraphData graphData'
+             , hyperdataGraph: GET.HyperdataGraph { graph: GET.GraphData hyperdataGraph }
              , session
              , sigmaRef } = simpleButton {
     onClick: \_ -> do
@@ -86,10 +86,20 @@ cameraButton { id
                                      , show $ fromEnum $ DDT.second nowt ]
         edges <- Sigmax.getEdges s
         nodes <- Sigmax.getNodes s
-        let graphData = GET.GraphData $ graphData' { edges = map GEU.stEdgeToGET edges
+        let graphData = GET.GraphData $ hyperdataGraph { edges = map GEU.stEdgeToGET edges
                                                        , nodes = map GEU.stNodeToGET nodes }
+        let cameras = map Sigma.toCamera $ Sigma.cameras s
+        let camera = case cameras of
+              [c] -> GET.Camera { ratio: c.ratio
+                                , x: c.x
+                                , y: c.y }
+              _   -> GET.Camera { ratio: 1.0
+                               , x: 0.0
+                               , y: 0.0 }
+        let hyperdataGraph = GET.HyperdataGraph { graph: graphData
+                                                , mCamera: Just camera }
         launchAff_ $ do
-          _ <- cloneGraph { id, graphData, session }
-          uploadArbitraryDataURL session id (Just $ nowStr <> "-" <> "screenshot.png") screen
+          clonedGraphId <- cloneGraph { id, hyperdataGraph, session }
+          uploadArbitraryDataURL session clonedGraphId (Just $ nowStr <> "-" <> "screenshot.png") screen
   , text: "Screenshot"
   }

src/Gargantext/Components/GraphExplorer/Controls.purs

@@ -38,9 +38,9 @@ type Controls =
   , edgeWeight :: R.State Range.NumberRange
   , forceAtlasState :: R.State SigmaxT.ForceAtlasState
   , graph           :: SigmaxT.SGraph
-  , graphData       :: GET.GraphData
   , graphId         :: GET.GraphId
   , graphStage      :: R.State Graph.Stage
+  , hyperdataGraph  :: GET.HyperdataGraph
   , multiSelectEnabled :: R.State Boolean
   , nodeSize        :: R.State Range.NumberRange
   , removedNodeIds  :: R.State SigmaxT.NodeIds
@@ -163,7 +163,7 @@ controlsCpt = R.hooksComponent "GraphControls" cpt
                                                , selectedNodeIds: props.selectedNodeIds } ]
                 , RH.li {} [ mouseSelectorSizeButton props.sigmaRef localControls.mouseSelectorSize ]
                 , RH.li {} [ cameraButton { id: props.graphId
-                                          , graphData: props.graphData
+                                          , hyperdataGraph: props.hyperdataGraph
                                           , session: props.session
                                           , sigmaRef: props.sigmaRef } ]
                 ]
@@ -171,12 +171,12 @@ controlsCpt = R.hooksComponent "GraphControls" cpt
             ]
 
 useGraphControls :: SigmaxT.SGraph
-                 -> GET.GraphData
                  -> GET.GraphId
+                 -> GET.HyperdataGraph
                  -> Session
                  -> SigmaxT.ForceAtlasState
                  -> R.Hooks (Record Controls)
-useGraphControls graph graphData graphId session forceAtlasS = do
+useGraphControls graph graphId hyperdataGraph session forceAtlasS = do
   edgeConfluence <- R.useState' $ Range.Closed { min: 0.0, max: 1.0 }
   edgeWeight <- R.useState' $ Range.Closed {
       min: 0.0
@@ -200,9 +200,9 @@ useGraphControls graph graphData graphId session forceAtlasS = do
        , edgeWeight
        , forceAtlasState
        , graph
-       , graphData
        , graphId
        , graphStage
+       , hyperdataGraph
        , multiSelectEnabled
        , nodeSize
        , removedNodeIds

src/Gargantext/Components/GraphExplorer/Types.purs

 module Gargantext.Components.GraphExplorer.Types where
 
-import Data.Argonaut (class DecodeJson, decodeJson, class EncodeJson, encodeJson, (.:), jsonEmptyObject, (~>), (:=))
+import Data.Argonaut (class DecodeJson, decodeJson, class EncodeJson, encodeJson, (.:), (.:?), jsonEmptyObject, (~>), (:=))
 import Data.Array ((!!), length)
 import Data.Generic.Rep (class Generic)
 import Data.Generic.Rep.Eq (genericEq)
@@ -286,8 +286,42 @@ instance showSideTab :: Show SideTab where
   show SideTabCommunity = "Community"
 
 
+newtype Camera = Camera {
+    ratio :: Number
+  , x     :: Number
+  , y     :: Number
+  }
 
+instance decodeCamera :: DecodeJson Camera where
+  decodeJson json = do
+    obj   <- decodeJson json
+    ratio <- obj .: "ratio"
+    x     <- obj .: "x"
+    y     <- obj .: "y"
+    pure $ Camera { ratio, x, y }
+
+instance jsonEncodeCamera :: EncodeJson Camera where
+  encodeJson (Camera c) =
+       "ratio" := c.ratio
+     ~> "x"     := c.x
+     ~> "y"     := c.y
+     ~> jsonEmptyObject
 
 
+newtype HyperdataGraph = HyperdataGraph {
+    graph   :: GraphData
+  , mCamera :: Maybe Camera
+  }
 
-
+instance decodeHyperdataGraph :: DecodeJson HyperdataGraph where
+  decodeJson json = do
+    obj             <- decodeJson json
+    graph   <- obj .: "graph"
+    mCamera <- obj .:? "camera"
+    pure $ HyperdataGraph { graph, mCamera }
+
+instance jsonEncodeHyperdataGraph :: EncodeJson HyperdataGraph where
+  encodeJson (HyperdataGraph c) =
+      "camera"  := c.mCamera
+     ~> "graph"  := c.graph
+     ~> jsonEmptyObject

src/Gargantext/Hooks/Sigmax/Sigma.purs

@@ -286,6 +286,22 @@ cameras s = Object.values cs
     -- For some reason, `sigma.cameras` is an object with integer keys.
     cs = s .. "cameras" :: Object.Object CameraInstance
 
+toCamera :: CameraInstance -> Record CameraProps
+toCamera c = { angle, ratio, x, y }
+  where
+    angle = c .. "angle" :: Number
+    ratio = c .. "ratio" :: Number
+    x = c .. "x" :: Number
+    y = c .. "y" :: Number
+
+updateCamera :: Sigma -> { ratio :: Number, x :: Number, y :: Number } -> Effect Unit
+updateCamera sig { ratio, x, y } = do
+  let camera = sig .. "camera"
+  _ <- pure $ (camera .= "ratio") ratio
+  _ <- pure $ (camera .= "x") x
+  _ <- pure $ (camera .= "y") y
+  pure unit
+
 goTo :: Record CameraProps -> CameraInstance -> Effect Unit
 goTo props cam = pure $ cam ... "goTo" $ [props]
 

src/Gargantext/Text/BreakWords.purs

@@ -10,6 +10,7 @@ import Effect (Effect)
 import Data.Maybe (Maybe(..))
 import Data.String.CodeUnits (length, slice) -- TODO: double check i'm the right choice
 import Data.String.Regex (Regex)
+
 import Gargantext.Utils.Regex (cloneRegex, execRegex, getRegexLastIndex)
 import Gargantext.Utils.Array (push)