make render a callback and use async apply for ease of use

This commit is contained in:
Connor Turland 2017-09-19 09:58:59 -04:00
parent a4c905df4e
commit 3406f2e04d
6 changed files with 44 additions and 43 deletions

View file

@ -4,6 +4,7 @@ import React from 'react'
import ReactDOM from 'react-dom'
import { Router, browserHistory } from 'react-router'
import { merge } from 'lodash'
import apply from 'async/apply'
import { notifyUser } from './index.js'
import ImportDialog from './ImportDialog'
@ -157,7 +158,7 @@ const ReactApp = {
}
},
getContextMenuProps: function() {
const self = ReactApp
const { render } = ReactApp
return {
// values
contextMenu: !!(ContextMenu.clickedNode || ContextMenu.clickedEdge),
@ -167,15 +168,15 @@ const ReactApp = {
contextFetchingSiblingsData: ContextMenu.fetchingSiblingsData,
contextSiblingsData: ContextMenu.siblingsData,
// functions
contextDelete: ContextMenu.delete,
contextRemove: ContextMenu.remove,
contextHide: ContextMenu.hide,
contextCenterOn: ContextMenu.centerOn,
contextPopoutTopic: ContextMenu.popoutTopic,
contextUpdatePermissions: ContextMenu.updatePermissions,
contextOnMetacodeSelect: ContextMenu.onMetacodeSelect,
contextFetchSiblings: ContextMenu.fetchSiblings,
contextPopulateSiblings: ContextMenu.populateSiblings
contextDelete: apply(ContextMenu.delete, render),
contextRemove: apply(ContextMenu.remove, render),
contextHide: apply(ContextMenu.hide, render),
contextCenterOn: apply(ContextMenu.centerOn, render),
contextPopoutTopic: apply(ContextMenu.popoutTopic, render),
contextUpdatePermissions: apply(ContextMenu.updatePermissions, render),
contextOnMetacodeSelect: apply(ContextMenu.onMetacodeSelect, render),
contextFetchSiblings: apply(ContextMenu.fetchSiblings, render),
contextPopulateSiblings: apply(ContextMenu.populateSiblings, render)
}
},
getTopicProps: function() {

View file

@ -350,7 +350,7 @@ const JIT = {
// Add also a click handler to nodes
onClick: function(node, eventInfo, e) {
// remove the rightclickmenu
ContextMenu.reset()
ContextMenu.reset(ReactApp.render)
if (Mouse.boxStartCoordinates) {
if (e.ctrlKey) {
@ -391,7 +391,7 @@ const JIT = {
// Add also a click handler to nodes
onRightClick: function(node, eventInfo, e) {
// remove the rightclickmenu
ContextMenu.reset()
ContextMenu.reset(ReactApp.render)
if (Mouse.boxStartCoordinates) {
Create.newSynapse.hide()
@ -1007,7 +1007,7 @@ const JIT = {
TopicCard.hideCard()
SynapseCard.hideCard()
Create.newTopic.hide()
ContextMenu.reset()
ContextMenu.reset(ReactApp.render)
// reset the draw synapse positions to false
Mouse.synapseStartCoordinates = []
Mouse.synapseEndCoordinates = null
@ -1355,7 +1355,7 @@ const JIT = {
// select the node
Control.selectNode(node, e)
ContextMenu.selectNode(node, {x: e.clientX, y: e.clientY})
ContextMenu.selectNode(ReactApp.render, node, {x: e.clientX, y: e.clientY})
}, // selectNodeOnRightClickHandler,
selectEdgeOnClickHandler: function(adj, e) {
@ -1406,7 +1406,7 @@ const JIT = {
e.stopPropagation()
if (Visualize.mGraph.busy) return
Control.selectEdge(adj)
ContextMenu.selectEdge(adj, {x: e.clientX, y: e.clientY})
ContextMenu.selectEdge(ReactApp.render, adj, {x: e.clientX, y: e.clientY})
}, // selectEdgeOnRightClickHandler
SmoothPanning: function() {
const sx = Visualize.mGraph.canvas.scaleOffsetX

View file

@ -138,7 +138,7 @@ const Map = {
if (Active.Map) {
$('.main').removeClass('compressed')
AutoLayout.resetSpiral()
ContextMenu.reset()
ContextMenu.reset(ReactApp.render)
TopicCard.hideCard()
SynapseCard.hideCard()
Create.newTopic.hide(true) // true means force (and override pinned)

View file

@ -69,7 +69,7 @@ const Topic = {
},
end: function() {
if (Active.Topic) {
ContextMenu.reset()
ContextMenu.reset(ReactApp.render)
TopicCard.hideCard()
SynapseCard.hideCard()
}

View file

@ -1,6 +1,5 @@
import Control from '../Control'
import DataModel from '../DataModel'
import { ReactApp } from '../GlobalUI'
import Selected from '../Selected'
import Topic from '../Topic'
@ -10,58 +9,58 @@ const ContextMenu = {
pos: {x: 0, y: 0},
fetchingSiblingsData: false,
siblingsData: null,
selectNode: (node, pos) => {
selectNode: (render, node, pos) => {
ContextMenu.pos = pos
ContextMenu.clickedNode = node
ContextMenu.clickedEdge = null
ContextMenu.fetchingSiblingsData = false
ContextMenu.siblingsData = null
ReactApp.render()
render()
},
selectEdge: (edge, pos) => {
selectEdge: (render, edge, pos) => {
ContextMenu.pos = pos
ContextMenu.clickedNode = null
ContextMenu.clickedEdge = edge
ContextMenu.fetchingSiblingsData = false
ContextMenu.siblingsData = null
ReactApp.render()
render()
},
reset: () => {
reset: (render) => {
ContextMenu.fetchingSiblingsData = false
ContextMenu.siblingsData = null
ContextMenu.clickedNode = null
ContextMenu.clickedEdge = null
ReactApp.render()
render()
},
delete: () => {
delete: (render) => {
Control.deleteSelected()
ContextMenu.reset()
ContextMenu.reset(render)
},
remove: () => {
remove: (render) => {
Control.removeSelectedEdges()
Control.removeSelectedNodes()
ContextMenu.reset()
ContextMenu.reset(render)
},
hide: () => {
hide: (render) => {
Control.hideSelectedEdges()
Control.hideSelectedNodes()
ContextMenu.reset()
ContextMenu.reset(render)
},
centerOn: (id) => {
centerOn: (render, id) => {
Topic.centerOn(id)
ContextMenu.reset()
ContextMenu.reset(render)
},
popoutTopic: (id) => {
ContextMenu.reset()
popoutTopic: (render, id) => {
ContextMenu.reset(render)
const win = window.open('/topics/' + id, '_blank')
win.focus()
},
updatePermissions: (permission) => {
updatePermissions: (render, permission) => {
// will be 'commons' 'public' or 'private'
Control.updateSelectedPermissions(permission)
ContextMenu.reset()
ContextMenu.reset(render)
},
onMetacodeSelect: (id, metacodeId) => {
onMetacodeSelect: (render, id, metacodeId) => {
if (Selected.Nodes.length > 1) {
// batch update multiple topics
Control.updateSelectedMetacodes(metacodeId)
@ -71,16 +70,16 @@ const ContextMenu = {
metacode_id: metacodeId
})
}
ContextMenu.reset()
ContextMenu.reset(render)
},
fetchSiblings: (node, metacodeId) => {
fetchSiblings: (render, node, metacodeId) => {
Topic.fetchSiblings(node, metacodeId)
ContextMenu.reset()
ContextMenu.reset(render)
},
populateSiblings: function(id) {
populateSiblings: (render, id) => {
// depending on how many topics are selected, do different things
ContextMenu.fetchingSiblingsData = true
ReactApp.render()
render()
const topics = DataModel.Topics.map(function(t) { return t.id })
const topicsString = topics.join()
@ -93,7 +92,7 @@ const ContextMenu = {
data[key] = `${DataModel.Metacodes.get(key).get('name')} (${data[key]})`
}
ContextMenu.siblingsData = data
ReactApp.render()
render()
}
$.ajax({

View file

@ -21,6 +21,7 @@
"homepage": "https://github.com/metamaps/metamaps#readme",
"dependencies": {
"ajaxq": "0.0.7",
"async": "2.5.0",
"attachmediastream": "2.0.0",
"autolinker": "1.4.3",
"babel-cli": "6.26.0",