>>> continue

src/Gargantext/Components/Nodes/Corpus/Phylo.purs

@@ -54,9 +54,11 @@ phyloLayoutCpt = here.component "phyloLayout" cpt where
 fetchPhyloJSON :: Aff (Either String PhyloDataSet)
 fetchPhyloJSON =
   let
+    -- @WIP remove dumb data
+    url = "http://localhost:5000/js/knowledge-phylomemy.json"
+    -- url = "http://localhost:5000/js/vaccines_countries_06_2021.json"
     request = AX.defaultRequest
-      -- @WIP remove dumb data
-      { url = "http://localhost:5000/js/knowledge-phylomemy.json"
+      { url = url
       , method = Left GET
       , responseFormat = ResponseFormat.string
       }

src/Gargantext/Components/PhyloExplorer/Draw.js

 exports._drawPhylo = drawPhylo;
-exports._highlightSource = highlightSource;
+exports._drawWordCloud = drawWordCloud;
 
 // set javascript date from a string year
 function yearToDate(year) {
@@ -236,39 +236,6 @@ function findValueByPrefix(prefix) {
   return null;
 }
 
-function highlightSource() {
-  let checkSource = document.getElementById("checkSource");
-  let value = checkSource.options[checkSource.selectedIndex].value;
-  let groups = d3.selectAll(".group-inner");
-
-  if (window.highlighted == true) {
-    (groups.filter(".source-focus").nodes()).map(g => g.classList.add("group-unfocus"))
-  }
-
-  // unselected all the groups
-  (groups.nodes()).map(g => g.classList.remove("source-focus"));
-  if (window.ldView == true) {
-    (groups.nodes()).map(function(g){return g.style.fill = "#f5eee6";});
-  } else {
-    (groups.nodes()).map(function(g){return g.style.fill = "#fff";});
-  }
-  d3.selectAll(".peak").classed("peak-focus-source", false);
-
-  // select the relevant ones
-  if (value != "unselect") {
-    let selected = groups.filter(".source-" + value).nodes();
-    drawWordCloud(selected)
-    selected.map(function(g){
-      g.classList.remove("group-unfocus");
-      g.classList.add("source-focus");
-      g.style.fill = "#a6bddb";
-      let bid = g.getAttribute("bId")
-      d3.select("#peak-" + bid)
-        .classed("peak-focus-source", true);
-    })
-  }
- }
-
  function drawWordCloud (groups) {
 
     let labels = {},

src/Gargantext/Components/PhyloExplorer/Draw.purs

 module Gargantext.Components.PhyloExplorer.Draw
   ( drawPhylo
   , highlightSource
-  , highlightSource'
   , unhide
   , setGlobalDependencies, setGlobalD3Reference
   ) where
 
 import Gargantext.Prelude
 
-import Control.Monad.Except (runExcept)
 import DOM.Simple (Window)
-import DOM.Simple.Console (log, log2)
 import Data.Either (Either(..))
 import Data.Foldable (for_)
 import Data.FoldableWithIndex (forWithIndex_)
 import Data.Maybe (Maybe(..), maybe)
 import Effect (Effect)
 import Effect.Class (liftEffect)
-import Effect.Ref as Ref
-import Effect.Uncurried (EffectFn7, runEffectFn7)
-import FFI.Simple (applyTo, getProperty, getProperty', setProperty, setProperty', (..), (...), (.=), (.?))
+import Effect.Uncurried (EffectFn1, EffectFn7, runEffectFn1, runEffectFn7)
+import FFI.Simple (applyTo, getProperty, (..), (.=), (.?))
 import Gargantext.Components.PhyloExplorer.Types (AncestorLink, Branch, BranchLink, GlobalTerm(..), Group(..), Link, Period, PhyloDataSet(..))
 import Gargantext.Utils.Reactix (getElementById)
 import Graphics.D3.Base (D3, D3Eff)
 import Graphics.D3.Selection as D3S
 import Graphics.D3.Util (ffi)
-import Unsafe.Coerce (unsafeCoerce)
 
 foreign import _drawPhylo :: EffectFn7
   (Array Branch)
@@ -48,8 +43,17 @@ drawPhylo ::
   -> Effect Unit
 drawPhylo = runEffectFn7 _drawPhylo
 
+foreign import _drawWordCloud :: forall a. EffectFn1 (Array a) Unit
+
+drawWordCloud :: forall a. Array a -> Effect Unit
+drawWordCloud = runEffectFn1 _drawWordCloud
+
 -----------------------------------------------------------
 
+orDie :: forall err a. Maybe a -> err -> Either err a
+orDie (Just a) _   = Right a
+orDie Nothing  err = Left err
+
 -- @XXX: FFI.Simple `(...)` throws error (JavaScript issue)
 --       need to decompose computation
 --
@@ -59,20 +63,22 @@ applyTo_ src name args =
   let fn = getProperty name src
   in applyTo fn src args
 
+infixl 4 applyTo_ as ~~
 
 -- @WIP: DOM.Simple lack of "ClassList" module
 addClass :: forall el. el -> Array String -> Effect Unit
-addClass el args = pure $ applyTo_ (el .. "classList") "add" args
+addClass el args = pure $ (el .. "classList") ~~ "add" $ args
 
 removeClass :: forall el. el -> Array String -> Effect Unit
-removeClass el args = pure $ applyTo_ (el .. "classList") "remove" args
-
------------------------------------------------------------
+removeClass el args = pure $ (el .. "classList") ~~ "remove" $ args
 
-foreign import _highlightSource :: Effect Unit
+-- @WIP: "Graphics.D3.Selection" lack of "filter" function
+-- @WIP: "Graphics.D3.Selection" lack of "nodes" function
+selectionFilter :: forall d. String -> D3S.Selection d -> D3Eff (D3S.Selection D3S.Void)
+selectionFilter = ffi ["query", "selection", ""] "selection.filter(query)"
 
-highlightSource :: Effect Unit
-highlightSource = _highlightSource
+selectionNodes :: forall d el. D3S.Selection d -> D3Eff (Array el)
+selectionNodes = ffi ["selection", ""] "selection.nodes()"
 
 -----------------------------------------------------------
 
@@ -104,26 +110,24 @@ setGlobalDependencies w (PhyloDataSet o)
         let
           idx' = show idx
           val' = show val
-        -- For each entries in group.foundation array,
-        -- increment consequently the global window.keys array
-        in case (freq .? val') of
-          Nothing -> pure $ (freq .= val') 0
-          Just v  -> pure $ (freq .= val') (v +1)
-        -- For each entries in group.foundation array,
-        -- if the global window.terms does not have it in property,
-        -- append an item to the global window.terms
-        *> case (terms .? val') of
-          Just _  -> pure unit
-          Nothing -> void <<< pure $ (terms .= val') $ GlobalTerm
-            { label: l .. idx'
-            , fdt  : val'
-            }
-
-    -- @XXX: FFI.Simple `(...)` throws error (JavaScript issue)
-    --       need to decompose computation
-    void do
-      new <- pure $ applyTo (terms .. "flat") terms []
-      pure $ (w .= "terms") new
+        in
+          -- For each entries in group.foundation array,
+          -- increment consequently the global window.keys array
+          case (freq .? val') of
+            Nothing -> pure $ (freq .= val') 0
+            Just v  -> pure $ (freq .= val') (v +1)
+        *>
+          -- For each entries in group.foundation array,
+          -- if the global window.terms does not have it in property,
+          -- append an item to the global window.terms
+          case (terms .? val') of
+            Just _  -> pure unit
+            Nothing -> void <<< pure $ (terms .= val') $ GlobalTerm
+              { label: l .. idx'
+              , fdt  : val'
+              }
+
+    pure $ terms ~~ "flat" $ []
 
 -- @XXX: prevent PureScript from not injecting D3
 setGlobalD3Reference :: Window -> D3 -> Effect Unit
@@ -146,35 +150,15 @@ unhide name = pure unit
 
 -----------------------------------------------------------
 
-
-
-
-orDie :: forall err a. Maybe a -> err -> Either err a
-orDie (Just a) _   = Right a
-orDie Nothing  err = Left err
-
--- @WIP: "Graphics.D3.Selection" lack of "filter" function
--- @WIP: "Graphics.D3.Selection" lack of "nodes" function
-selectionFilter :: forall d. String -> D3S.Selection d -> D3Eff (D3S.Selection D3S.Void)
-selectionFilter = ffi ["query", "selection", ""] "selection.filter(query)"
-
-selectionNodes :: forall d el. D3S.Selection d -> D3Eff (Array el)
-selectionNodes = ffi ["selection", ""] "selection.nodes()"
-
-
-highlightSource' :: Window -> Effect Unit
-highlightSource' window =
+highlightSource :: Window -> String -> Effect Unit
+highlightSource window value =
   let
     hasHighlight = maybe false identity (window .? "highlighted")
     hasLdView    = maybe false identity (window .? "ldView")
-    -- @WIP
-    value = "string"
 
   in do
-
     groups <- D3S.rootSelectAll ".group-inner"
 
-
     if hasHighlight
     then
           selectionFilter ".source-focus" groups
@@ -204,16 +188,12 @@ highlightSource' window =
     if (value == "unselect")
     then
       pure unit
-    else
-          selectionFilter (".source-" <> value) groups
-      >>= selectionNodes
-      >>= flip for_ (selectNodeGroup)
-      -- @WIP drawWordCloud
-
-    pure unit
-
-
+    else do
+      arr <- selectionFilter (".source-" <> value) groups
+        >>= selectionNodes
 
+      drawWordCloud arr
+      for_ arr selectNodeGroup
 
   where
 
@@ -223,7 +203,7 @@ highlightSource' window =
       pure $ (style .= "fill") hex
 
 
-    selectNodeGroup :: forall el. el -> D3Eff Unit
+    selectNodeGroup :: forall el. el -> Effect Unit
     selectNodeGroup el = do
       removeClass el [ "group-unfocus" ]
       addClass el [ "source-focus" ]
@@ -234,7 +214,3 @@ highlightSource' window =
       void $
             D3S.rootSelect ("#peak-" <> bid)
         >>= D3S.classed "peak-focus-source" true
-
-
-drawWordCloud groups = do
-  labels <- Ref.new ()

src/Gargantext/Components/PhyloExplorer/Layout.purs

@@ -6,7 +6,7 @@ import Gargantext.Prelude
 
 import DOM.Simple (window)
 import Data.Array as Array
-import Gargantext.Components.PhyloExplorer.Draw (drawPhylo, highlightSource, highlightSource', setGlobalD3Reference, setGlobalDependencies, unhide)
+import Gargantext.Components.PhyloExplorer.Draw (drawPhylo, highlightSource, setGlobalD3Reference, setGlobalDependencies, unhide)
 import Gargantext.Components.PhyloExplorer.Types (PhyloDataSet(..))
 import Gargantext.Utils (nbsp)
 import Gargantext.Utils.Reactix as R2
@@ -94,7 +94,7 @@ layoutCpt = here.component "layout" cpt where
           { id: "checkSource"
           , className: "select-source"
           , defaultValue: ""
-          , on: { change: \_ -> highlightSource' window }
+          , on: { change: \e -> highlightSource window e.target.value }
           } $
           [
             H.option