From c0b35280f6e47db9103c5b70c4bd47933ff9db0c Mon Sep 17 00:00:00 2001 From: Robert Best Date: Sat, 22 Oct 2016 02:58:13 -0400 Subject: [PATCH] Middle.mouse.click features (Open contained link & copy text to clipboard) (#792) * changed the code to be based off of the current dev branch * Update JIT.js * Update Util.js * Update JIT.js A few logical operators were replaced with their stricter counterpart. * Update JIT.js * Update index.js * Update Util.js --- frontend/src/Metamaps/JIT.js | 67 ++++++++++++++++++++---------- frontend/src/Metamaps/Map/index.js | 4 ++ frontend/src/Metamaps/Util.js | 12 ++++++ 3 files changed, 61 insertions(+), 22 deletions(-) diff --git a/frontend/src/Metamaps/JIT.js b/frontend/src/Metamaps/JIT.js index 593cf52e..73c1b600 100644 --- a/frontend/src/Metamaps/JIT.js +++ b/frontend/src/Metamaps/JIT.js @@ -21,6 +21,7 @@ import Topic from './Topic' import TopicCard from './TopicCard' import Util from './Util' import Visualize from './Visualize' +import clipboard from 'clipboard-js' /* * Metamaps.Erb @@ -410,14 +411,13 @@ const JIT = { Mouse.boxStartCoordinates = null Mouse.boxEndCoordinates = null } - // console.log('called zoom to box') } if (e.shiftKey) { Visualize.mGraph.busy = false Mouse.boxEndCoordinates = eventInfo.getPos() JIT.selectWithBox(e) - // console.log('called select with box') + return } } @@ -427,13 +427,10 @@ const JIT = { // clicking on a edge, node, or clicking on blank part of canvas? if (node.nodeFrom) { JIT.selectEdgeOnClickHandler(node, e) - // console.log('called selectEdgeOnClickHandler') } else if (node && !node.nodeFrom) { JIT.selectNodeOnClickHandler(node, e) - // console.log('called selectNodeOnClickHandler') } else { JIT.canvasClickHandler(eventInfo.getPos(), e) - // console.log('called canvasClickHandler') } // if }, // Add also a click handler to nodes @@ -1333,6 +1330,9 @@ const JIT = { if (Visualize.mGraph.busy) return const self = JIT + + //Copy topic title to clipboard + if(e.button===1 && e.ctrlKey) clipboard.copy(node.name); // catch right click on mac, which is often like ctrl+click if (navigator.platform.indexOf('Mac') !== -1 && e.ctrlKey) { @@ -1354,25 +1354,45 @@ const JIT = { // wait a certain length of time, then check again, then run this code setTimeout(function () { if (!JIT.nodeWasDoubleClicked()) { - const nodeAlreadySelected = node.selected - - if (!e.shiftKey) { - Control.deselectAllNodes() - Control.deselectAllEdges() - } - - if (nodeAlreadySelected) { - Control.deselectNode(node) + var nodeAlreadySelected = node.selected + + if(e.button!==1){ + if (!e.shiftKey) { + Control.deselectAllNodes() + Control.deselectAllEdges() + } + + if (nodeAlreadySelected) { + Control.deselectNode(node) + } else { + Control.selectNode(node, e) + } + + // trigger animation to final styles + Visualize.mGraph.fx.animate({ + modes: ['edge-property:lineWidth:color:alpha'], + duration: 500 + }) + Visualize.mGraph.plot() + } else { - Control.selectNode(node, e) + if(!e.ctrlKey){ + var len = Selected.Nodes.length; + + for (let i = 0; i < len; i += 1) { + let n = Selected.Nodes[i]; + let result = Metamaps.Util.openLink(Metamaps.Topics.get(n.id).attributes.link); + + if (!result) { //if link failed to open + break; + } + } + + if(!node.selected){ + Metamaps.Util.openLink(Metamaps.Topics.get(node.id).attributes.link); + } + } } - - // trigger animation to final styles - Visualize.mGraph.fx.animate({ - modes: ['edge-property:lineWidth:color:alpha'], - duration: 500 - }) - Visualize.mGraph.plot() } }, Mouse.DOUBLE_CLICK_TOLERANCE) } @@ -1598,6 +1618,9 @@ const JIT = { if (Visualize.mGraph.busy) return const self = JIT + var synapseText = adj.data.$synapses[0].attributes.desc; + //Copy synapse label to clipboard + if(e.button===1 && e.ctrlKey && synapseText !== "") clipboard.copy(synapseText); // catch right click on mac, which is often like ctrl+click if (navigator.platform.indexOf('Mac') !== -1 && e.ctrlKey) { diff --git a/frontend/src/Metamaps/Map/index.js b/frontend/src/Metamaps/Map/index.js index e5f50633..7aa98cc3 100644 --- a/frontend/src/Metamaps/Map/index.js +++ b/frontend/src/Metamaps/Map/index.js @@ -44,6 +44,10 @@ const Map = { $('#wrapper').on('contextmenu', function (e) { return false }) + + $('#wrapper').mousedown(function (e){ + if(e.button === 1)return false; + }); $('.starMap').click(function () { if ($(this).is('.starred')) self.unstar() diff --git a/frontend/src/Metamaps/Util.js b/frontend/src/Metamaps/Util.js index 445a898c..49797ab4 100644 --- a/frontend/src/Metamaps/Util.js +++ b/frontend/src/Metamaps/Util.js @@ -124,6 +124,18 @@ const Util = { checkURLisYoutubeVideo: function (url) { return (url.match(/^https?:\/\/(?:www\.)?youtube.com\/watch\?(?=[^?]*v=\w+)(?:[^\s?]+)?$/) != null) }, + openLink: function(url){ + var win = (url !== "") ? window.open(url, '_blank') : "empty"; + + if (win) { + //Browser has allowed it to be opened + return true; + } else { + //Browser has blocked it + alert('Please allow popups in order to open the link'); + return false; + } + }, mdToHTML: text => { // use safe: true to filter xss return new HtmlRenderer({ safe: true })