Updated connections so that there are ports on node top and bottom, a…

…nd arrows are anchored at node center instead of on the specific ports, in response to #89 and #31.

No longer need input and output ports, so changed to use just a single port type.
Note: now this is annoying when there are cyclic connections as they are displayed over the top of each other.

oaiorebuilder/content/graphs/ContextmenuConnection.js

@@ -2,32 +2,35 @@
  * Connection figure that provides a context menu to set the connection type
  * The types are sourced from ontrelationships, which is populated from an ontology (see uifunctions.js)
  */
-lore.ore.graph.ContextmenuConnection=function()
-{draw2d.Connection.call(this);
-var grey = new draw2d.Color(174,174,174);
-var darkgrey = new draw2d.Color(51,51,51);
-var theArrow = new draw2d.ArrowConnectionDecorator();
-theArrow.setColor(grey);
-this.setTargetDecorator(theArrow);
-this.setRouter(new draw2d.BezierConnectionRouter());
-this.label = new draw2d.Label();
-this.label.setColor(darkgrey);
-this.addFigure(this.label, new draw2d.ManhattanMidpointLocator(this));
-this.setRelationshipType("http://purl.org/vocab/frbr/core#","partOf");
-this.sourcePort=null;this.targetPort=null;
-this.lineSegments=new Array();
-this.setColor(grey);
-this.setLineWidth(1);
+lore.ore.graph.ContextmenuConnection=function(){
+	draw2d.Connection.call(this);
+	var grey = new draw2d.Color(174,174,174);
+	var darkgrey = new draw2d.Color(51,51,51);
+	var theArrow = new draw2d.ArrowConnectionDecorator();
+	theArrow.setColor(grey);
+	this.setTargetDecorator(theArrow);
+	this.setRouter(new draw2d.BezierConnectionRouter());
+	//this.setRouter(new draw2d.ManhattanConnectionRouter());
+	this.label = new draw2d.Label();
+	this.label.setColor(darkgrey);
+	this.addFigure(this.label, new draw2d.ManhattanMidpointLocator(this));
+    this.setRelationshipType("http://purl.org/dc/elements/1.1/","relation");
+	this.sourcePort=null;
+    this.targetPort=null;
+	this.lineSegments=new Array();
+	this.setColor(grey);
+	this.setLineWidth(1);
+	this.setSourceAnchor(new draw2d.ChopboxConnectionAnchor());
+	this.setTargetAnchor(new draw2d.ChopboxConnectionAnchor());
 };
 lore.ore.graph.ContextmenuConnection.prototype=new draw2d.Connection();
-lore.ore.graph.ContextmenuConnection.prototype.setRelationshipType=function(enamespace, etype)
-{this.edgetype=etype;
-this.edgens=enamespace;
-lore.ui.nodegrid.setSource({"Relationship":etype, "Schema": enamespace});
-this.label.setText(etype);
+lore.ore.graph.ContextmenuConnection.prototype.setRelationshipType=function(enamespace, etype){
+	this.edgetype=etype;
+	this.edgens=enamespace;
+	lore.ui.nodegrid.setSource({"Relationship":etype, "Schema": enamespace});
+	this.label.setText(etype);
 };
-lore.ore.graph.ContextmenuConnection.prototype.getContextMenu=function()
-{
+lore.ore.graph.ContextmenuConnection.prototype.getContextMenu=function() {
 	var menu=new draw2d.Menu();
 	var oThis = this;
 	// sort the menu entries

oaiorebuilder/content/graphs/InputPort.js

@@ -1,12 +1,16 @@
-/* Input port that accepts connections from ContextmenuConnections 
+/* Port that accepts connections from ContextmenuConnections 
  * 
  */
-lore.ore.graph.InputPort=function(_5320){draw2d.InputPort.call(this,_5320);};
-lore.ore.graph.InputPort.prototype=new draw2d.InputPort;
-lore.ore.graph.InputPort.prototype.type="lore.ore.graph.InputPort";
-lore.ore.graph.InputPort.prototype.onDrop=function(port){
-if(port.getMaxFanOut&&port.getMaxFanOut()<=port.getFanOut()){return;}
-if(this.parentNode.id==port.parentNode.id){}
-else{var _5322=new draw2d.CommandConnect(this.parentNode.workflow,port,this);
-_5322.setConnection(new lore.ore.graph.ContextmenuConnection());
-this.parentNode.workflow.getCommandStack().execute(_5322);}};
+lore.ore.graph.Port = function(uirep) {
+    draw2d.Port.call(this,uirep);
+};
+lore.ore.graph.Port.prototype = new draw2d.Port;
+lore.ore.graph.Port.prototype.type = "lore.ore.graph.Port";
+lore.ore.graph.Port.prototype.onDrop = function(port) {
+	if (this.parentNode.id != port.parentNode.id) {
+		var _5322 = new draw2d.CommandConnect(this.parentNode.workflow, this,
+				port);
+		_5322.setConnection(new lore.ore.graph.ContextmenuConnection());
+		this.parentNode.workflow.getCommandStack().execute(_5322);
+	}
+};

oaiorebuilder/content/graphs/ResourceFigure.js

@@ -138,6 +138,12 @@ if(this.inputPort!=null){
 	this.inputPort.setPosition(-5,this.height/2);
 }
 
+if(this.inputPort2!=null){
+    this.inputPort2.setPosition(this.width/2,-5);
+}
+if(this.outputPort2!=null){
+    this.outputPort2.setPosition(this.width/2,this.height+5);
+}
 };
 lore.ore.graph.ResourceFigure.prototype.setTitle=function(title){
 	this.header.innerHTML=title;
@@ -281,19 +287,35 @@ lore.ore.graph.ResourceFigure.prototype.setWorkflow=function(_4679){
 	if(_4679!=null&&this.inputPort==null){
 		var orange = new draw2d.Color(255,204,51);
 		var grey = new draw2d.Color(174,174,174);
-		this.inputPort=new lore.ore.graph.InputPort();
+		this.inputPort=new lore.ore.graph.Port();
 		this.inputPort.setWorkflow(_4679);
 		this.inputPort.setName("input");
 		this.inputPort.setBackgroundColor(orange);
 		this.inputPort.setColor(grey);
 		this.addPort(this.inputPort,-5,this.height/2);
-		this.outputPort=new lore.ore.graph.OutputPort();
-		this.outputPort.setMaxFanOut(5);
+
+        this.inputPort2=new lore.ore.graph.Port();
+        this.inputPort2.setWorkflow(_4679);
+        this.inputPort2.setName("input2");
+        this.inputPort2.setBackgroundColor(orange);
+        this.inputPort2.setColor(grey);
+        this.addPort(this.inputPort2,this.width/2,-5)
+
+		this.outputPort=new lore.ore.graph.Port();
 		this.outputPort.setWorkflow(_4679);
 		this.outputPort.setName("output");
 		this.outputPort.setBackgroundColor(orange);
 		this.outputPort.setColor(grey);
-		this.addPort(this.outputPort,this.width+5,this.height/2);}
+		this.addPort(this.outputPort,this.width+5,this.height/2);
+
+        this.outputPort2=new lore.ore.graph.Port();
+        this.outputPort2.setWorkflow(_4679);
+        this.outputPort2.setName("output2");
+        this.outputPort2.setBackgroundColor(orange);
+        this.outputPort2.setColor(grey);
+        this.addPort(this.outputPort2,this.width/2,this.height+5);
+
+    }
 };
 
 lore.ore.graph.ResourceFigure.prototype.toggle=function(){