From 06f18215dd3484049845518366cc46c494791251 Mon Sep 17 00:00:00 2001 From: Connor Turland Date: Mon, 29 Sep 2014 16:04:36 -0400 Subject: [PATCH] bug fixes for mapping experience. able to store multiple references to synapses on each edge --- app/assets/javascripts/src/JIT.js | 3 +- app/assets/javascripts/src/Metamaps.JIT.js | 40 ++++++--- app/assets/javascripts/src/Metamaps.Router.js | 1 + app/assets/javascripts/src/Metamaps.js | 83 +++++++++++++------ app/assets/stylesheets/application.css | 2 +- app/assets/stylesheets/clean.css | 8 ++ 6 files changed, 95 insertions(+), 42 deletions(-) diff --git a/app/assets/javascripts/src/JIT.js b/app/assets/javascripts/src/JIT.js index 1cc4b8e1..bc3f23c3 100644 --- a/app/assets/javascripts/src/JIT.js +++ b/app/assets/javascripts/src/JIT.js @@ -7081,7 +7081,8 @@ Graph.Plot = { var l = Metamaps.Mouse.synapseStartCoordinates.length; for (var i = l - 1; i >= 0; i -= 1) { start = Metamaps.Mouse.synapseStartCoordinates[i]; - Metamaps.JIT.renderMidArrow(start, end, 13, false, canvas, 0.5, true); + Metamaps.JIT.renderMidArrow(start, end, 13, false, canvas, 0.3, true); + Metamaps.JIT.renderMidArrow(start, end, 13, false, canvas, 0.7, true); } ctx.restore(); } diff --git a/app/assets/javascripts/src/Metamaps.JIT.js b/app/assets/javascripts/src/Metamaps.JIT.js index 41481c56..3c5b79c9 100644 --- a/app/assets/javascripts/src/Metamaps.JIT.js +++ b/app/assets/javascripts/src/Metamaps.JIT.js @@ -20,6 +20,7 @@ Metamaps.JIT = { */ prepareVizData: function () { var self = Metamaps.JIT; + var synapsesToRemove = []; var topic; var mapping; var node; @@ -39,7 +40,12 @@ Metamaps.JIT = { Metamaps.Synapses.each(function (s) { edge = s.createEdge(); - if (nodes[edge.nodeFrom] && nodes[edge.nodeTo]) { + if(Metamaps.Topics.get(s.get('node1_id')) === undefined || Metamaps.Topics.get(s.get('node2_id')) === undefined) { + // this means it's an invalid synapse + synapsesToRemove.push(s); + } + else if (nodes[edge.nodeFrom] && nodes[edge.nodeTo]) { + existingEdge = _.findWhere(edges, { nodeFrom: edge.nodeFrom, nodeTo: edge.nodeTo @@ -53,15 +59,24 @@ Metamaps.JIT = { // for when you're dealing with multiple relationships between the same two topics if (Metamaps.Active.Map) { mapping = s.getMapping(); - existingEdge['$mappingIDs'].push(mapping.isNew() ? mapping.cid : mapping.id); + existingEdge.data['$mappingIDs'].push(mapping.id); } - existingEdge['$synapseIDs'].push(s.id); + existingEdge.data['$synapseIDs'].push(s.id); } else { // for when you're dealing with a topic that has relationships to many different nodes nodes[edge.nodeFrom].adjacencies.push(edge); + edges.push(edge); } } }); + + // clean up the synapses array in case of any faulty data + _.each(synapsesToRemove, function (synapse) { + mapping = synapse.getMapping(); + Metamaps.Synapses.remove(synapse); + Metamaps.Mappings.remove(mapping); + }); + _.each(nodes, function (node) { self.vizData.push(node); }); @@ -319,7 +334,7 @@ Metamaps.JIT = { if (Metamaps.Mouse.boxStartCoordinates) { Metamaps.Visualize.mGraph.busy = false; Metamaps.Mouse.boxEndCoordinates = eventInfo.getPos(); - Metamaps.JIT.zoomToBox(); + Metamaps.JIT.zoomToBox(e); return; } @@ -816,8 +831,8 @@ Metamaps.JIT = { } else if (tempInit && tempNode2 != null) { // this means you want to create a synapse between two existing topics Metamaps.Create.newTopic.addSynapse = false; - Metamaps.Create.newSynapse.topic1id = tempNode.id; - Metamaps.Create.newSynapse.topic2id = tempNode2.id; + Metamaps.Create.newSynapse.topic1id = tempNode.getData('topic').id; + Metamaps.Create.newSynapse.topic2id = tempNode2.getData('topic').id; tempNode2.setData('dim', 25, 'current'); Metamaps.Visualize.mGraph.plot(); midpoint.x = tempNode.pos.getc().x + (tempNode2.pos.getc().x - tempNode.pos.getc().x) / 2; @@ -1414,9 +1429,9 @@ Metamaps.JIT = { var v2 = intermediatePoint.$add(normal.$scale(-1)); if (newSynapse) { - ctx.strokeStyle = "#222222"; + ctx.strokeStyle = "#4fc059"; ctx.lineWidth = 2; - ctx.globalAlpha = 0.4; + ctx.globalAlpha = 1; } ctx.beginPath(); ctx.moveTo(from.x, from.y); @@ -1465,8 +1480,7 @@ Metamaps.JIT = { y: posChild.y }, 13, false, canvas, 0.7); } else if (directionCat == "from-to") { - var direction = adj.data.$direction; - var inv = (direction && direction.length > 1 && direction[0] != adj.nodeFrom.id); + var inv = (direction[0] != adj.nodeFrom.id); self.renderMidArrow({ x: pos.x, y: pos.y @@ -1502,7 +1516,7 @@ Metamaps.JIT = { canvas.translate(-1*offsetX,-1*offsetY); }, - zoomToBox: function () { + zoomToBox: function (event) { var sX = Metamaps.Mouse.boxStartCoordinates.x, sY = Metamaps.Mouse.boxStartCoordinates.y, eX = Metamaps.Mouse.boxEndCoordinates.x, @@ -1538,14 +1552,14 @@ Metamaps.JIT = { var cogY = (sY + eY)/2; canvas.translate(-1* cogX, -1* cogY); - + $(document).trigger(Metamaps.JIT.events.zoom, [event]); Metamaps.Mouse.boxStartCoordinates = false; Metamaps.Mouse.boxEndCoordinates = false; Metamaps.Visualize.mGraph.plot(); }, - zoomExtents: function () { + zoomExtents: function (event) { Metamaps.JIT.centerMap(); var height = $(document).height(), width = $(document).width(), diff --git a/app/assets/javascripts/src/Metamaps.Router.js b/app/assets/javascripts/src/Metamaps.Router.js index dadc3771..b8df146a 100644 --- a/app/assets/javascripts/src/Metamaps.Router.js +++ b/app/assets/javascripts/src/Metamaps.Router.js @@ -130,6 +130,7 @@ Metamaps.GlobalUI.Search.unlock(); Metamaps.GlobalUI.Search.close(0, true); + Metamaps.Loading.show(); Metamaps.Map.end(); Metamaps.Map.launch(id); }, diff --git a/app/assets/javascripts/src/Metamaps.js b/app/assets/javascripts/src/Metamaps.js index ba648acf..83ece7d7 100644 --- a/app/assets/javascripts/src/Metamaps.js +++ b/app/assets/javascripts/src/Metamaps.js @@ -217,15 +217,15 @@ Metamaps.Backbone.init = function () { else return false; }, getTopic1: function () { - return Metamaps.Topic.get(this.get('node1_id')); + return Metamaps.Topics.get(this.get('node1_id')); }, getTopic2: function () { - return Metamaps.Topic.get(this.get('node2_id')); + return Metamaps.Topics.get(this.get('node2_id')); }, getDirection: function () { return [ - this.get('node1_id'), - this.get('node2_id') + this.getTopic1().get('node').id, + this.getTopic2().get('node').id ]; }, getMapping: function () { @@ -1232,11 +1232,15 @@ Metamaps.Visualize = { topic.updateNode(); n.eachAdjacency(function (edge) { - l = edge.getData('synapseIDs').length; - for (i = 0; i < l; i++) { - synapse = Metamaps.Synapses.get(edge.getData('synapseIDs')[i]); - synapse.set('edge', edge); - synapse.updateEdge(); + if(!edge.getData('init')) { + edge.setData('init', true); + + l = edge.getData('synapseIDs').length; + for (i = 0; i < l; i++) { + synapse = Metamaps.Synapses.get(edge.getData('synapseIDs')[i]); + synapse.set('edge', edge); + synapse.updateEdge(); + } } }); @@ -1254,11 +1258,15 @@ Metamaps.Visualize = { mapping = topic.getMapping(); n.eachAdjacency(function (edge) { - l = edge.getData('synapseIDs').length; - for (i = 0; i < l; i++) { - synapse = Metamaps.Synapses.get(edge.getData('synapseIDs')[i]); - synapse.set('edge', edge); - synapse.updateEdge(); + if(!edge.getData('init')) { + edge.setData('init', true); + + l = edge.getData('synapseIDs').length; + for (i = 0; i < l; i++) { + synapse = Metamaps.Synapses.get(edge.getData('synapseIDs')[i]); + synapse.set('edge', edge); + synapse.updateEdge(); + } } }); @@ -1274,7 +1282,6 @@ Metamaps.Visualize = { /** * render does the heavy lifting of creating the engine that renders the graph with the properties we desire * - * @param vizData a json structure containing the data to be rendered. */ render: function () { var self = Metamaps.Visualize, RGraphSettings, FDSettings; @@ -2902,6 +2909,8 @@ Metamaps.Topic = { var newnode = topic.createNode(); + var midpoint = {}, pixelPos; + if (!$.isEmptyObject(Metamaps.Visualize.mGraph.graph.nodes)) { Metamaps.Visualize.mGraph.graph.addNode(newnode); Metamaps.Visualize.mGraph.graph.eachNode(function (n) { @@ -2927,8 +2936,15 @@ Metamaps.Topic = { nodeOnViz.setPos(new $jit.Complex(mapping.get('xloc'), mapping.get('yloc')), "end"); } if (Metamaps.Create.newTopic.addSynapse) { - Metamaps.Create.newSynapse.topic1id = tempNode.id; - Metamaps.Create.newSynapse.topic2id = nodeOnViz.id; + Metamaps.Create.newSynapse.topic1id = tempNode.getData('topic').id; + + // position the form + midpoint.x = tempNode.pos.getc().x + (nodeOnViz.pos.getc().x - tempNode.pos.getc().x) / 2; + midpoint.y = tempNode.pos.getc().y + (nodeOnViz.pos.getc().y - tempNode.pos.getc().y) / 2; + pixelPos = Metamaps.Util.coordsToPixels(midpoint); + $('#new_synapse').css('left', pixelPos.x + "px"); + $('#new_synapse').css('top', pixelPos.y + "px"); + // show the form Metamaps.Create.newSynapse.open(); Metamaps.Visualize.mGraph.fx.animate({ modes: ["node-property:dim"], @@ -2970,14 +2986,21 @@ Metamaps.Topic = { }); } + + var successCallback = function (topicModel, response) { + if (Metamaps.Active.Map) { + mapping.save({ topic_id: topicModel.id }); + } + + if (Metamaps.Create.newTopic.addSynapse) { + Metamaps.Create.newSynapse.topic2id = topicModel.id; + } + }; + if (!Metamaps.Settings.sandbox && createNewInDB) { if (topic.isNew()) { topic.save(null, { - success: function (topicModel, response) { - if (Metamaps.Active.Map) { - mapping.save({ topic_id: topicModel.id }); - } - }, + success: successCallback, error: function (model, response) { console.log('error saving topic to database'); } @@ -3116,12 +3139,13 @@ Metamaps.Synapse = { //for each node in this array we will create a synapse going to the position2 node. var synapsesToCreate = []; - node2 = Metamaps.Visualize.mGraph.graph.getNode(Metamaps.Create.newSynapse.topic2id); - topic2 = node2.getData('topic'); + topic2 = Metamaps.Topics.get(Metamaps.Create.newSynapse.topic2id); + node2 = topic2.get('node'); var len = Metamaps.Selected.Nodes.length; if (len == 0) { - synapsesToCreate[0] = Metamaps.Visualize.mGraph.graph.getNode(Metamaps.Create.newSynapse.topic1id); + topic1 = Metamaps.Topics.get(Metamaps.Create.newSynapse.topic1id); + synapsesToCreate[0] = topic1.get('node'); } else if (len > 0) { synapsesToCreate = Metamaps.Selected.Nodes; } @@ -3150,6 +3174,8 @@ Metamaps.Synapse = { }, getSynapseFromAutocomplete: function (id) { var self = Metamaps.Synapse, + topic1, + topic2, node1, node2; @@ -3161,8 +3187,10 @@ Metamaps.Synapse = { }); Metamaps.Mappings.add(mapping); - node1 = Metamaps.Visualize.mGraph.graph.getNode(Metamaps.Create.newSynapse.topic1id); - node2 = Metamaps.Visualize.mGraph.graph.getNode(Metamaps.Create.newSynapse.topic2id); + topic1 = Metamaps.Topics.get(Metamaps.Create.newSynapse.topic1id); + node1 = topic1.get('node'); + topic1 = Metamaps.Topics.get(Metamaps.Create.newSynapse.topic2id); + node2 = topic2.get('node'); Metamaps.Create.newSynapse.hide(); self.renderSynapse(mapping, synapse, node1, node2, true); @@ -3220,6 +3248,7 @@ Metamaps.Map = { Metamaps.Filter.checkMappers(); Metamaps.Realtime.startActiveMap(); + Metamaps.Loading.hide(); } $.ajax({ diff --git a/app/assets/stylesheets/application.css b/app/assets/stylesheets/application.css index 8ae9967a..cebb5434 100644 --- a/app/assets/stylesheets/application.css +++ b/app/assets/stylesheets/application.css @@ -862,7 +862,7 @@ label[for="user_remember_me"] { .sidebarFilterBox { display:none; - width: 304px; + width: 319px; padding: 16px 0; overflow-y: auto; } diff --git a/app/assets/stylesheets/clean.css b/app/assets/stylesheets/clean.css index 918af0c3..06f7ea90 100644 --- a/app/assets/stylesheets/clean.css +++ b/app/assets/stylesheets/clean.css @@ -606,6 +606,14 @@ background-color: #9150bc; } +.github-fork-ribbon-wrapper { + display:none; +} + +.homePage .github-fork-ribbon-wrapper { + display: block; +} + /* end home page */ /* infoAndHelp */