diff --git a/app/assets/javascripts/Jit/filters.js b/app/assets/javascripts/Jit/filters.js index 33d2097c..09902aeb 100644 --- a/app/assets/javascripts/Jit/filters.js +++ b/app/assets/javascripts/Jit/filters.js @@ -43,7 +43,7 @@ function switchVisible(category, duration) { function hideCategory(category, duration) { if (duration == null) duration = 500; - console.graph.eachNode( function (n) { + Mconsole.graph.eachNode( function (n) { if (n.getData('itemcatname') == category) { n.setData('alpha', 0, 'end'); n.eachAdjacency(function(adj) { @@ -51,7 +51,7 @@ function hideCategory(category, duration) { }); } }); - console.fx.animate({ + Mconsole.fx.animate({ modes: ['node-property:alpha', 'edge-property:alpha'], duration: duration @@ -60,7 +60,7 @@ function hideCategory(category, duration) { function showCategory(category, duration) { if (duration == null) duration = 500; - console.graph.eachNode( function (n) { + Mconsole.graph.eachNode( function (n) { if (n.getData('itemcatname') == category) { n.setData('alpha', 1, 'end'); n.eachAdjacency(function(adj) { @@ -68,7 +68,7 @@ function showCategory(category, duration) { }); } }); - console.fx.animate({ + Mconsole.fx.animate({ modes: ['node-property:alpha', 'edge-property:alpha'], duration: duration @@ -77,13 +77,13 @@ function showCategory(category, duration) { function hideAll(duration) { if (duration == null) duration = 500; - console.graph.eachNode( function (n) { + Mconsole.graph.eachNode( function (n) { n.setData('alpha', 0, 'end'); n.eachAdjacency(function(adj) { adj.setData('alpha', 0, 'end'); }); }); - console.fx.animate({ + Mconsole.fx.animate({ modes: ['node-property:alpha', 'edge-property:alpha'], duration: duration @@ -92,13 +92,13 @@ function hideAll(duration) { function showAll(duration) { if (duration == null) duration = 500; - console.graph.eachNode( function (n) { + Mconsole.graph.eachNode( function (n) { n.setData('alpha', 1, 'end'); n.eachAdjacency(function(adj) { adj.setData('alpha', 1, 'end'); }); }); - console.fx.animate({ + Mconsole.fx.animate({ modes: ['node-property:alpha', 'edge-property:alpha'], duration: duration diff --git a/app/assets/javascripts/Jit/graphsettings.js b/app/assets/javascripts/Jit/graphsettings.js index ba113813..d0e3109e 100644 --- a/app/assets/javascripts/Jit/graphsettings.js +++ b/app/assets/javascripts/Jit/graphsettings.js @@ -40,15 +40,21 @@ function graphSettings(type) { }, //Add Tips Tips: { - enable: true, + enable: false, onShow: function (tip, node) { - //count connections - var count = 0; - node.eachAdjacency(function () { - count++; - }); - //display node info in tooltip - tip.innerHTML = "
" + node.name + "
" + "
connections: " + count + "
"; + + //display node info in tooltip + var html = + '

' + node.getData("itemcatname") + '

' + + '' + node.getData(' + + '
' + node.name + '' + + '
Added by: ' + node.getData('username') + '
' + + '

' + node.getData('desc') + '

' + + '' + node.getData('link') + ''; + + tip.innerHTML = '
'; + $jit.id('item_' + node.id).innerHTML = html; + $("#_tooltip .scroll").mCustomScrollbar(); } }, // Add node events @@ -66,7 +72,7 @@ function graphSettings(type) { onDragMove: function (node, eventInfo, e) { var pos = eventInfo.getPos(); node.pos.setc(pos.x, pos.y); - console.plot(); + Mconsole.plot(); }, //Implement the same handler for touchscreens onTouchMove: function (node, eventInfo, e) { @@ -77,7 +83,7 @@ function graphSettings(type) { onClick: function (node) { if (!node) return; //set final styles - console.graph.eachNode(function (n) { + Mconsole.graph.eachNode(function (n) { if (n.id != node.id) delete n.selected; n.setData('dim', 25, 'end'); n.eachAdjacency(function (adj) { @@ -102,25 +108,11 @@ function graphSettings(type) { delete node.selected; } //trigger animation to final styles - console.fx.animate({ + Mconsole.fx.animate({ modes: ['node-property:dim', 'edge-property:lineWidth:color'], duration: 500 }); - // Build the right column relations list. - // This is done by traversing the clicked node connections. - var html = - '

' + node.getData("itemcatname") + '

' + - '' + node.getData(' + - '
' + node.name + '' + - '
Added by: ' + node.getData('username') + '
' + - '

' + node.getData('desc') + '

' + - '' + node.getData('link') + ''; - - //append connections information - $jit.id('showcard').innerHTML = '
'; - $jit.id('item_' + node.id).innerHTML = html; - $("#showcard .scroll").mCustomScrollbar(); } }, //Number of iterations for the FD algorithm @@ -131,65 +123,14 @@ function graphSettings(type) { // on label creation and only for DOM labels (not native canvas ones). onCreateLabel: function (domElement, node) { // Create a 'name' and 'close' buttons and add them - // to the main node label - var nameContainer = document.createElement('span'), - style = nameContainer.style; - nameContainer.className = 'name'; - nameContainer.innerHTML = '
' + node.name + '
'; - domElement.appendChild(nameContainer); - style.fontSize = "0.9em"; - style.color = "#222222"; - //Toggle a node selection when clicking - //its name. This is done by animating some - //node styles like its dimension and the color - //and lineWidth of its adjacencies. - nameContainer.onclick = function () { - //set final styles - console.graph.eachNode(function (n) { - if (n.id != node.id) delete n.selected; - n.setData('dim', 25, 'end'); - n.eachAdjacency(function (adj) { - adj.setDataset('end', { - lineWidth: 0.4, - color: '#222222' - }); - adj.setData('showDesc', false, 'current'); - }); - }); - if (!node.selected) { - node.selected = true; - node.setData('dim', 35, 'end'); - node.eachAdjacency(function (adj) { - adj.setDataset('end', { - lineWidth: 3, - color: '#FFF' - }); - adj.setData('showDesc', true, 'current'); - }); - } else { - delete node.selected; - } - //trigger animation to final styles - console.fx.animate({ - modes: ['node-property:dim', - 'edge-property:lineWidth:color'], - duration: 500 - }); - // Build the right column relations list. - // This is done by traversing the clicked node connections. - var html = - '

' + node.getData("itemcatname") + '

' + - '' + node.getData(' + - '
' + node.name + '' + - '
Added by: ' + node.getData('username') + '
' + - '

' + node.getData('desc') + '

' + - '' + node.getData('link') + ''; - - //append connections information - $jit.id('showcard').innerHTML = '
'; - $jit.id('item_' + node.id).innerHTML = html; - $("#showcard .scroll").mCustomScrollbar(); - }; + // to the main node label + var nameContainer = document.createElement('span'), + style = nameContainer.style; + nameContainer.className = 'name'; + nameContainer.innerHTML = '
' + node.name + '
'; + domElement.appendChild(nameContainer); + style.fontSize = "0.9em"; + style.color = "#222222"; }, // Change node styles when DOM labels are placed // or moved. @@ -268,16 +209,16 @@ function graphSettings(type) { type: 'HTML', //Change cursor style when hovering a node onMouseEnter: function () { - //rg.canvas.getElement().style.cursor = 'move'; + //Mconsole.canvas.getElement().style.cursor = 'move'; }, onMouseLeave: function () { - //rg.canvas.getElement().style.cursor = ''; + //Mconsole.canvas.getElement().style.cursor = ''; }, //Update node positions when dragged onDragMove: function (node, eventInfo, e) { var pos = eventInfo.getPos(); node.pos.setc(pos.x, pos.y); - rg.plot(); + Mconsole.plot(); }, //Implement the same handler for touchscreens onTouchMove: function (node, eventInfo, e) { @@ -288,7 +229,7 @@ function graphSettings(type) { onClick: function (node) { if (!node) return; //set final styles - rg.graph.eachNode(function (n) { + Mconsole.graph.eachNode(function (n) { if (n.id != node.id) delete n.selected; n.setData('dim', 25, 'end'); n.eachAdjacency(function (adj) { @@ -313,7 +254,7 @@ function graphSettings(type) { delete node.selected; } //trigger animation to final styles - rg.fx.animate({ + Mconsole.fx.animate({ modes: ['node-property:dim', 'edge-property:lineWidth:color'], duration: 500 @@ -334,7 +275,7 @@ function graphSettings(type) { $("#showcard .scroll").mCustomScrollbar(); } }, - //Number of iterations for the rg algorithm + //Number of iterations for the Mconsole algorithm iterations: 200, //Edge length levelDistance: 200, @@ -345,7 +286,7 @@ function graphSettings(type) { // to the main node label domElement.innerHTML = '
' + node.name + '
'; domElement.onclick = function () { - rg.onClick(node.id, { + Mconsole.onClick(node.id, { onComplete: function () { var html = '

' + node.getData("itemcatname") + '

' + @@ -379,4 +320,71 @@ function graphSettings(type) { } return t; -} \ No newline at end of file +} + + +// defining custom node type +var nodeSettings = { + 'customNode': { + 'render': function (node, canvas) { + var pos = node.pos.getc(true), + dim = node.getData('dim'), + cat = node.getData('itemcatname'), + ctx = canvas.getCtx(); + ctx.drawImage(imgArray[cat], pos.x - dim, pos.y - dim, dim*2, dim*2); + + }, + 'contains': function(node, pos) { + var npos = node.pos.getc(true), + dim = node.getData('dim'); + return this.nodeHelper.circle.contains(npos, pos, dim); + } + } + } + + +// defining custom edges + var edgeSettings = { + 'customEdge': { + 'render': function(adj, canvas) { + //get nodes cartesian coordinates + var pos = adj.nodeFrom.pos.getc(true); + var posChild = adj.nodeTo.pos.getc(true); + + var directionCat = adj.getData("category"); + //label placement on edges + //plot arrow edge + if (directionCat == "none") { + this.edgeHelper.line.render({ x: pos.x, y: pos.y }, { x: posChild.x, y: posChild.y }, canvas); + } + else if (directionCat == "both") { + renderMidArrow({ x: pos.x, y: pos.y }, { x: posChild.x, y: posChild.y }, 13, true, canvas); + renderMidArrow({ x: pos.x, y: pos.y }, { x: posChild.x, y: posChild.y }, 13, false, canvas); + } + else if (directionCat == "from-to") { + var direction = adj.data.$direction; + var inv = (direction && direction.length>1 && direction[0] != adj.nodeFrom.id); + renderMidArrow({ x: pos.x, y: pos.y }, { x: posChild.x, y: posChild.y }, 13, inv, canvas); + } + + //check for edge label in data + var desc = adj.getData("desc") + ' (' + adj.getData("userid") + ',' + adj.getData("id") + ')'; + var showDesc = adj.getData("showDesc"); + if( desc != "" && showDesc ) { + //now adjust the label placement + var radius = canvas.getSize(); + var x = parseInt((pos.x + posChild.x - (desc.length * 5)) /2); + var y = parseInt((pos.y + posChild.y) /2); + canvas.getCtx().fillStyle = '#000'; + canvas.getCtx().font = 'bold 14px arial'; + //canvas.getCtx().fillText(desc, x, y); + } + }, 'contains' : function(adj, pos) { + var from = adj.nodeFrom.pos.getc(true), + to = adj.nodeTo.pos.getc(true); + return containsMidArrow(from, to, pos, this.edge.epsilon); + } + } + } + + diff --git a/app/assets/javascripts/Jit/jit2.0.0.js b/app/assets/javascripts/Jit/jit2.0.0.js index 41875588..b3e14085 100644 --- a/app/assets/javascripts/Jit/jit2.0.0.js +++ b/app/assets/javascripts/Jit/jit2.0.0.js @@ -2360,8 +2360,8 @@ Extras.Classes.Tips = new Class({ }, hide: function(triggerCallback) { - this.tip.style.display = 'none'; - triggerCallback && this.config.onHide(); + this.tip.style.display = 'none'; + triggerCallback && this.config.onHide(); } }); diff --git a/app/assets/javascripts/Jit/loadgraphs.js b/app/assets/javascripts/Jit/loadgraphs.js index 8c9d4d7c..d9739633 100644 --- a/app/assets/javascripts/Jit/loadgraphs.js +++ b/app/assets/javascripts/Jit/loadgraphs.js @@ -1,4 +1,4 @@ -var labelType, useGradients, nativeTextSupport, animate, json, console, gType; +var labelType, useGradients, nativeTextSupport, animate, json, Mconsole, gType; (function() { var ua = navigator.userAgent, @@ -46,75 +46,72 @@ imgArray['Trajectory'] = new Image(); imgArray['Trajectory'].src = '/assets/traj imgArray['Action'] = new Image(); imgArray['Action'].src = '/assets/action.png'; imgArray['Activity'] = new Image(); imgArray['Activity'].src = '/assets/activity.png'; + +// defining code to draw edges with arrows pointing in the middle of them +var renderMidArrow = function(from, to, dim, swap, canvas){ + var ctx = canvas.getCtx(); + // invert edge direction + if (swap) { + var tmp = from; + from = to; + to = tmp; + } + // vect represents a line from tip to tail of the arrow + var vect = new $jit.Complex(to.x - from.x, to.y - from.y); + // scale it + vect.$scale(dim / vect.norm()); + // compute the midpoint of the edge line + var midPoint = new $jit.Complex((to.x + from.x) / 2, (to.y + from.y) / 2); + // move midpoint by half the "length" of the arrow so the arrow is centered on the midpoint + midPoint.x += (vect.x / 0.7); + midPoint.y += (vect.y / 0.7); + // compute the tail intersection point with the edge line + var intermediatePoint = new $jit.Complex(midPoint.x - vect.x, +midPoint.y - vect.y); + // vector perpendicular to vect + var normal = new $jit.Complex(-vect.y / 2, vect.x / 2); + var v1 = intermediatePoint.add(normal); + var v2 = intermediatePoint.$add(normal.$scale(-1)); + + ctx.beginPath(); + ctx.moveTo(from.x, from.y); + ctx.lineTo(to.x, to.y); + ctx.stroke(); + ctx.beginPath(); + ctx.moveTo(v1.x, v1.y); + ctx.lineTo(midPoint.x, midPoint.y); + ctx.lineTo(v2.x, v2.y); + ctx.stroke(); +}; + +var containsMidArrow = function(posFrom, posTo, pos, epsilon) { + return $jit.EdgeHelper.line.contains(posFrom, posTo, pos, epsilon); +}; + function initialize(type){ + viewMode = "graph"; gType = type; // init custom node type - $jit.ForceDirected.Plot.NodeTypes.implement({ - 'customNode': { - 'render': function (node, canvas) { - var pos = node.pos.getc(true), - dim = node.getData('dim'), - cat = node.getData('itemcatname'), - ctx = canvas.getCtx(); - ctx.drawImage(imgArray[cat], pos.x - dim, pos.y - dim, dim*2, dim*2); - - }, - 'contains': function(node, pos) { - var npos = node.pos.getc(true), - dim = node.getData('dim'); - return this.nodeHelper.circle.contains(npos, pos, dim); - } - } - }); + $jit.ForceDirected.Plot.NodeTypes.implement(nodeSettings); //implement an edge type - $jit.ForceDirected.Plot.EdgeTypes.implement({ - 'customEdge': { - 'render': function(adj, canvas) { - //get nodes cartesian coordinates - var pos = adj.nodeFrom.pos.getc(true); - var posChild = adj.nodeTo.pos.getc(true); - - var directionCat = adj.getData("category"); - //label placement on edges - //plot arrow edge - if (directionCat == "none") { - this.edgeHelper.line.render({ x: pos.x, y: pos.y }, { x: posChild.x, y: posChild.y }, canvas); - } - else if (directionCat == "both") { - this.edgeHelper.arrow.render({ x: pos.x, y: pos.y }, { x: posChild.x, y: posChild.y }, 40, false, canvas); - this.edgeHelper.arrow.render({ x: pos.x, y: pos.y }, { x: posChild.x, y: posChild.y }, 40, true, canvas); - } - else if (directionCat == "from-to") { - var direction = adj.data.$direction; - var inv = (direction && direction.length>1 && direction[0] != adj.nodeFrom.id); - this.edgeHelper.arrow.render({ x: pos.x, y: pos.y }, { x: posChild.x, y: posChild.y }, 40, inv, canvas); - } - - //check for edge label in data - var desc = adj.getData("desc") + ' (' + adj.getData("userid") + ',' + adj.getData("id") + ')'; - var showDesc = adj.getData("showDesc"); - if( desc != "" && showDesc ) { - //now adjust the label placement - var radius = canvas.getSize(); - var x = parseInt((pos.x + posChild.x - (desc.length * 5)) /2); - var y = parseInt((pos.y + posChild.y) /2); - canvas.getCtx().fillStyle = '#000'; - canvas.getCtx().font = 'bold 14px arial'; - //canvas.getCtx().fillText(desc, x, y); - } - } - } - }); + $jit.ForceDirected.Plot.EdgeTypes.implement(edgeSettings); + // end + + // init custom node type + $jit.RGraph.Plot.NodeTypes.implement(nodeSettings); + //implement an edge type + $jit.RGraph.Plot.EdgeTypes.implement(edgeSettings); // end if ( type == "centered") { - console = new $jit.RGraph(graphSettings(type)); + // init Rgraph + Mconsole = new $jit.RGraph(graphSettings(type)); } else if ( type == "arranged" || type == "chaotic" ) { // init ForceDirected - console = new $jit.ForceDirected(graphSettings(type)); + Mconsole = new $jit.ForceDirected(graphSettings(type)); } else { alert("You didn't specify a type!"); @@ -122,7 +119,7 @@ function initialize(type){ } // load JSON data. - console.loadJSON(json); + Mconsole.loadJSON(json); // choose how to plot and animate the data onto the screen var chooseAnimate; @@ -130,11 +127,11 @@ function initialize(type){ if ( type == "centered") { // compute positions incrementally and animate. //trigger small animation - console.graph.eachNode(function(n) { + Mconsole.graph.eachNode(function(n) { var pos = n.getPos(); pos.setc(-200, -200); }); - console.compute('end'); + Mconsole.compute('end'); chooseAnimate = { modes:['polar'], @@ -143,7 +140,7 @@ function initialize(type){ } else if ( type == "arranged" ) { // compute positions incrementally and animate. - console.graph.eachNode(function(n) { + Mconsole.graph.eachNode(function(n) { var pos = n.getPos(); pos.setc(0, 0); var newPos = new $jit.Complex(); @@ -160,7 +157,7 @@ function initialize(type){ } else if ( type == "chaotic" ) { // compute positions incrementally and animate. - console.compute() + Mconsole.compute() chooseAnimate = { modes: ['linear'], @@ -172,10 +169,10 @@ function initialize(type){ $(document).ready(function() { if ( type == "centered") { - console.fx.animate(chooseAnimate); + Mconsole.fx.animate(chooseAnimate); } else if ( type == "arranged" || type == "chaotic") { - console.animate(chooseAnimate); + Mconsole.animate(chooseAnimate); } }); // end diff --git a/app/assets/javascripts/application.js b/app/assets/javascripts/application.js index 6c10b5ee..4ac916f3 100644 --- a/app/assets/javascripts/application.js +++ b/app/assets/javascripts/application.js @@ -16,6 +16,8 @@ //= require jquery_ujs //= require_tree . +// other options are 'graph' +var viewMode = "list"; $(document).ready(function() { @@ -150,7 +152,6 @@ obj = document.getElementById('container'); var switchAll = $(this).attr('id'); - console.log(switchAll); if ( switchAll === "showAll" || switchAll === "hideAll") { if (switchAll == "showAll") { @@ -226,12 +227,13 @@ event.preventDefault(); coor = ""; if (gType == "arranged" || gType == "chaotic") { - console.graph.eachNode(function(n) { + Mconsole.graph.eachNode(function(n) { coor = coor + n.data.$mappingid + '/' + n.pos.x + '/' + n.pos.y + ','; }); coor = coor.slice(0, -1); $('#map_coordinates').val(coor); $('#saveMapLayout').submit(); + } }); }); diff --git a/app/assets/stylesheets/ForceDirected.css b/app/assets/stylesheets/ForceDirected.css index 7138d1c0..f891ee06 100644 --- a/app/assets/stylesheets/ForceDirected.css +++ b/app/assets/stylesheets/ForceDirected.css @@ -7,16 +7,3 @@ span.name { cursor: pointer; } - -/*TOOLTIPS*/ -.tip { - text-align: left; - width:auto; - max-width:500px; -} - -.tip-title { - font-size: 11px; - text-align:center; - margin-bottom:2px; -} diff --git a/app/assets/stylesheets/base.css b/app/assets/stylesheets/base.css index 1cdee9b0..a05ec936 100644 --- a/app/assets/stylesheets/base.css +++ b/app/assets/stylesheets/base.css @@ -6,15 +6,12 @@ color:#444; } -#showcard{ +#showcard { width:auto; height:auto; color:#FFF; text-align: left; overflow: auto; - position:absolute; - top:200px; - left:10px; } #showcard .contributor { font-size:14px; } @@ -28,21 +25,4 @@ height:100%; margin:0; overflow:hidden; -} - -/*TOOLTIPS*/ -.tip { - color: #111; - width: 139px; - background-color: white; - border:1px solid #ccc; - -moz-box-shadow:#555 2px 2px 8px; - -webkit-box-shadow:#555 2px 2px 8px; - -o-box-shadow:#555 2px 2px 8px; - box-shadow:#555 2px 2px 8px; - opacity:0.9; - filter:alpha(opacity=90); - font-size:12px; - font-family:Verdana, Geneva, Arial, Helvetica, sans-serif; - padding:7px; } \ No newline at end of file diff --git a/app/controllers/items_controller.rb b/app/controllers/items_controller.rb index 02482ee9..e79c39f3 100644 --- a/app/controllers/items_controller.rb +++ b/app/controllers/items_controller.rb @@ -72,9 +72,8 @@ class ItemsController < ApplicationController @item.save end - @mapping = nil + @mapping = Mapping.new() if params[:item][:map] - @mapping = Mapping.new() @mapping.category = "Item" @mapping.user = @user @mapping.map = Map.find(params[:item][:map]) diff --git a/app/controllers/synapses_controller.rb b/app/controllers/synapses_controller.rb index 08ab27dd..6db25b6f 100644 --- a/app/controllers/synapses_controller.rb +++ b/app/controllers/synapses_controller.rb @@ -58,9 +58,11 @@ class SynapsesController < ApplicationController @synapse.item1 = Item.find(params[:node1_id]) @synapse.item2 = Item.find(params[:node2_id]) @synapse.permission = params[:synapse][:permission] - @synapse.user = @user + @synapse.user = @user @synapse.save + @mapping1 = Mapping.new() + @mapping2 = Mapping.new() if params[:synapse][:map] @mapping = Mapping.new() @mapping.category = "Synapse" @@ -70,7 +72,6 @@ class SynapsesController < ApplicationController @mapping.save if not Map.find(params[:synapse][:map]).items.include?(@synapse.item1) - @mapping1 = Mapping.new() @mapping1.category = "Item" @mapping1.user = @user @mapping1.map = Map.find(params[:synapse][:map]) @@ -78,7 +79,6 @@ class SynapsesController < ApplicationController @mapping1.save end if not Map.find(params[:synapse][:map]).items.include?(@synapse.item2) - @mapping2 = Mapping.new() @mapping2.category = "Item" @mapping2.user = @user @mapping2.map = Map.find(params[:synapse][:map]) @@ -89,7 +89,7 @@ class SynapsesController < ApplicationController respond_to do |format| format.html { respond_with(@user, location: user_synapse_url(@user, @synapse)) } - format.js { respond_with(@synapse) } + format.js { respond_with(@synapse, @mapping1, @mapping2) } end end diff --git a/app/views/items/create.js.erb b/app/views/items/create.js.erb index 16648f5d..c0e95bdd 100644 --- a/app/views/items/create.js.erb +++ b/app/views/items/create.js.erb @@ -1,15 +1,13 @@ $('#new_item').fadeOut('fast'); -$('#new_item')[0].reset() +$('#new_item')[0].reset(); -// if there's a map, add the node to that, if its in card view add card -map2 = document.getElementById('container'); - -if (map2 != null) { - var newnode = <%= @item.self_as_json.html_safe %>; +if(viewMode == "graph") { + var newnode = <%= @item.self_as_json.html_safe %>; - if (console != null) { - var temp = fd.graph.getNode('<%= @item.id %>'); + if (Mconsole != null) { + Mconsole.graph.addNode(newnode); + var temp = Mconsole.graph.getNode('<%= @item.id %>'); temp.setData('dim', 1, 'start'); temp.setData('dim', 40, 'end'); @@ -18,7 +16,7 @@ if (map2 != null) { temp.setPos(new $jit.Polar(5.54, 347.6), 'start'); temp.setPos(new $jit.Polar(5.54, 347.6), 'end'); } - else if (gType == "arranged") { + else if (gType == "arranged" || gType == "chaotic") { temp.setData('xloc',0); temp.setData('yloc',0); temp.setData('mappingid', '<%= @mapping.id %>'); @@ -26,19 +24,9 @@ if (map2 != null) { temp.setPos(new $jit.Complex(0, 0), 'start'); temp.setPos(new $jit.Complex(0, 0), 'end'); } - else if (gType == "chaotic") { - <% unless (@mapping.nil?) %> - temp.setData('xloc',0); - temp.setData('yloc',0); - temp.setData('mappingid', '<%= @mapping.id %>'); - <% end %> - temp.setPos(new $jit.Complex(0, 0), 'current'); - temp.setPos(new $jit.Complex(0, 0), 'start'); - temp.setPos(new $jit.Complex(0, 0), 'end'); - } - console.fx.plotNode(temp, console.canvas); - console.fx.animate({ + Mconsole.fx.plotNode(temp, Mconsole.canvas); + Mconsole.fx.animate({ modes: ['node-property:dim'], duration: 400 }); @@ -47,14 +35,13 @@ if (map2 != null) { json = newnode; initialize("chaotic"); } - console.log(temp); // add the new node to the synapse select lists $("#node1_id").prepend(""); $("#node2_id").prepend(""); } else { + alert('wrong!'); $('#cards').prepend('<%= escape_javascript(render(@item)) %>'); - $(".scroll").mCustomScrollbar(); -} - + $(".scroll").mCustomScrollbar(); +} \ No newline at end of file diff --git a/app/views/main/console.html.erb b/app/views/main/console.html.erb index 14e878b6..223fc351 100644 --- a/app/views/main/console.html.erb +++ b/app/views/main/console.html.erb @@ -20,8 +20,6 @@
-
-
@@ -44,10 +42,12 @@
-
-
+<% if authenticated? %> + <%= render :partial => 'items/new' %> + <%= render :partial => 'synapses/new' %> +<% end %>