diff --git a/src/Gargantext/Components/GraphExplorer/Sigmajs.js b/src/Gargantext/Components/GraphExplorer/Sigmajs.js index 4cc4680c4132928f93228853edce4933442b4e9b..f8977406c7d522baf04d2d02ad46c3041c95e235 100644 --- a/src/Gargantext/Components/GraphExplorer/Sigmajs.js +++ b/src/Gargantext/Components/GraphExplorer/Sigmajs.js @@ -50,7 +50,6 @@ exports.getSigmaRef = function() { }; exports.goToImpl = function(cam) { return function(props) { - console.log("goTo", cam, props); return cam.goTo(props); }; }; @@ -66,17 +65,10 @@ exports.pauseForceAtlas2 = function() { } }; -exports.cursor_size = 10; +var trackMouse = function(cursorSize, e) { -// TODO -//exports.shift_key = false; -exports.shift_key = true; - -exports.trackMouse = function(e) { - - if(!exports.shift_key) { + if(!e.shiftKey) { var partialGraph = window.sigmaGargInstance; - console.log('FUN t.minimap:trackMouse'); // new sigma.js 2D mouse context var ctx = partialGraph.renderers[0].contexts.mouse; ctx.globalCompositeOperation = "source-over"; @@ -91,7 +83,7 @@ exports.trackMouse = function(e) { var coord = window.sigma.utils.mouseCoords(e) var x = (coord.x + coord.clientX) / 2 // ; // sigma.utils.getX(e); var y = (coord.y + coord.clientY) /2 // ; // sigma.utils.getY(e); - console.log(coord); + console.log('trackMouse', coord); // optional: make more labels appear on circle hover (/!\ costly /!\ esp. on large graphs) // if (partialGraph.conf.moreLabelsUnderArea) { // // convert screen => mouse => cam @@ -119,8 +111,7 @@ exports.trackMouse = function(e) { ctx.fillStyle = "#71C3FF"; ctx.globalAlpha = 0.5; ctx.beginPath(); - ctx.arc(x, y, 30.0, 0, Math.PI * 2, true); - //ctx.arc(x, y, partialGraph.gui.circleSize, 0, Math.PI * 2, true); + ctx.arc(x, y, cursorSize, 0, Math.PI * 2, true); ctx.closePath(); ctx.fill(); ctx.stroke(); @@ -130,11 +121,12 @@ exports.trackMouse = function(e) { }; -exports.sigmaOnMouseMove = function(e) { +exports.sigmaOnMouseMove = function(props) { + return function(e) { return function() { - console.log('sigmaOnMouseMove'); if(typeof(window.sigmaGargInstance) !== "undefined") { - if(exports.cursor_size>0) exports.trackMouse(e); + if(props.cursorSize > 0) trackMouse(props.cursorSize, e); } }; + }; }; diff --git a/src/Gargantext/Components/GraphExplorer/Sigmajs.purs b/src/Gargantext/Components/GraphExplorer/Sigmajs.purs index 377979db392ed060a02b2ef91e1f17ebc2beee96..5c1c7859e46d1cb78b1d3b3778389333914a6005 100644 --- a/src/Gargantext/Components/GraphExplorer/Sigmajs.purs +++ b/src/Gargantext/Components/GraphExplorer/Sigmajs.purs @@ -6,6 +6,7 @@ import Data.Nullable (Nullable) import Effect (Effect) import Effect.Uncurried (EffectFn1, EffectFn2, mkEffectFn1, runEffectFn1) import React (Children, ReactClass, ReactElement, ReactRef, SyntheticEventHandler, createElement, unsafeCreateElement) +import React.SyntheticEvent (SyntheticMouseEvent) import Record.Unsafe (unsafeGet) import Thermite (EventHandler) import Unsafe.Coerce (unsafeCoerce) @@ -260,7 +261,7 @@ type SigmaInstance = { | SigmaInstance' } type CameraInstance = { | CameraInstance' } foreign import setSigmaRef :: EffectFn1 (Nullable ReactRef) Unit foreign import getSigmaRef :: Effect SigmaInstance -foreign import sigmaOnMouseMove :: forall o. o -> Effect Unit +foreign import sigmaOnMouseMove :: {cursorSize :: Number} -> SyntheticMouseEvent -> Effect Unit cameras :: SigmaInstance -> Array CameraInstance cameras = unsafeGet "cameras" diff --git a/src/Gargantext/Config.purs b/src/Gargantext/Config.purs index d974cc6048893da7bfd0860615e780cad4a139e0..076deb6fd6780fe1b7f523fb781f760a5bf1918f 100644 --- a/src/Gargantext/Config.purs +++ b/src/Gargantext/Config.purs @@ -26,7 +26,7 @@ endConfig = endConfig' V10 endConfig' :: ApiVersion -> EndConfig endConfig' v = { front : frontRelative - , back : backLocal v } + , back : backDemo v } -- , back : backDemo v } ------------------------------------------------------------------------ diff --git a/src/Gargantext/Pages/Corpus/Graph.purs b/src/Gargantext/Pages/Corpus/Graph.purs index 1d9a23d0c83b5cc58064ba50ebd740aea17ce30d..23c2adb75f3a9f9fb3b2378d3c70ca35c8f2117c 100644 --- a/src/Gargantext/Pages/Corpus/Graph.purs +++ b/src/Gargantext/Pages/Corpus/Graph.purs @@ -63,6 +63,7 @@ data Action | ChangeNodeSize Number | DisplayEdges | ToggleMultiNodeSelection + | ChangeCursorSize Number -- | Zoom Boolean newtype SelectedNode = SelectedNode {id :: String, label :: String} @@ -74,6 +75,8 @@ derive instance ordSelectedNode :: Ord SelectedNode instance showSelectedNode :: Show SelectedNode where show (SelectedNode node) = node.label +_cursorSize :: forall s a. Lens' { cursorSize :: a | s } a +_cursorSize = prop (SProxy :: SProxy "cursorSize") _multiNodeSelection :: forall s a. Lens' { multiNodeSelection :: a | s } a _multiNodeSelection = prop (SProxy :: SProxy "multiNodeSelection") @@ -117,6 +120,7 @@ newtype State = State , sigmaGraphData :: Maybe SigmaGraphData , legendData :: Array Legend , selectedNodes :: Set SelectedNode + , cursorSize :: Number , multiNodeSelection :: Boolean , showSidePanel :: Boolean , showControls :: Boolean @@ -135,6 +139,7 @@ initialState = State , sigmaGraphData : Nothing , legendData : [] , selectedNodes : Set.empty + , cursorSize : 0.0 , multiNodeSelection : false , showSidePanel : false , showControls : false @@ -200,6 +205,11 @@ performAction ToggleMultiNodeSelection _ _ = modifyState_ $ \(State s) -> do State $ s # _multiNodeSelection %~ not +performAction (ChangeCursorSize size) _ _ = + modifyState_ $ \(State s) -> + State $ s # _cursorSize .~ size + + --performAction (Zoom True) _ _ = -- modifyState_ $ \() -> do -- State $ @@ -513,10 +523,16 @@ specOld = fold [treespec treeSpec, graphspec $ simpleSpec performAction render'] ] ] -} - {-, li [className "col-md-2"] - [ span [] [text "Selector"],input [_type "range", _id "myRange", value "90"] + , li [className "col-md-1"] + [ span [] [text "Selector"] + , input [ _type "range" + , _id "cursorSizeRange" + , min "0" + , max "100" + , defaultValue (show st.cursorSize) + , onChange \e -> d $ ChangeCursorSize (numberTargetValue e) + ] ] - -} , li [className "col-md-1"] [ span [] [text "Labels"],input [_type "range" , _id "labelSizeRange" @@ -586,7 +602,7 @@ specOld = fold [treespec treeSpec, graphspec $ simpleSpec performAction render'] , div [className "row"] [div [if (st.showSidePanel && st.showTree) then className "col-md-10" else if (st.showSidePanel || st.showTree) then className "col-md-10" else className "col-md-12"] [ div [style {height: "95%"} - ,onMouseMove sigmaOnMouseMove] $ + ,onMouseMove (sigmaOnMouseMove {cursorSize: st.cursorSize})] $ [ ] <>