Fic rendering bugs

font/sbolv/interaction-arrows/reactantArrow.js

@@ -6,11 +6,11 @@ function createGeometry(boxSize) {
 
     return {
 
-        left: Vec2(boxSize.x,boxSize.y * 0.5),
-        right: Vec2(1.7*boxSize.x, boxSize.y * 0.5),
-        arrowTop:Vec2(1.7 * boxSize.x, boxSize.y * 0.4), 
-        arrowBottom:Vec2(1.7 * boxSize.x, boxSize.y * 0.6),
-        arrowPick:Vec2(boxSize.x * 1.8, boxSize.y * 0.5),
+        left: Vec2(0,boxSize.y * 0.5),
+        right: Vec2(0.7*boxSize.x, boxSize.y * 0.5),
+        arrowTop:Vec2(0.7 * boxSize.x, boxSize.y * 0.4), 
+        arrowBottom:Vec2(0.7 * boxSize.x, boxSize.y * 0.6),
+        arrowPick:Vec2(boxSize.x * 0.8, boxSize.y * 0.5),
     };
 }
 

font/sbolv/rna-protein-complex.js

@@ -143,7 +143,7 @@ function createGeometry(boxSize) {
         boundingBox.attr('data-uri', glyphObject.uri);
 }
     group.add(boundingBox);
-    console.log("hello")
+
     return {
         glyph: group,
         backboneOffset: 1.2 * boxSize.y

font/sbolv/rna.js

@@ -33,7 +33,7 @@ function createGeometry(boxSize) {
     var x = boxSize.x;
     var y = boxSize.y;
     var stepSize = 3*x/14
-    var pointA = Vec2(3*x/4, 3*y/4);
+    var pointA = Vec2(5 *x/4, 3*y/4);
     var pointB = Vec2(pointA.x - stepSize, 2*y/4);
     var pointC = Vec2(pointA.x - 2*stepSize, 3*y/4 );
     var pointD = Vec2(pointA.x - 3*stepSize, 2*y/4);
@@ -43,6 +43,7 @@ function createGeometry(boxSize) {
     var pointH = Vec2(pointA.x - 7*stepSize, 2*y/4);
 
 
+
     //Coordinates of Control Points
     var controlPoint1 = createControlPoint(pointA, pointB, null);
     var controlPoint2 = createControlPoint(pointB, pointC, pointA);

lib/interactions/helper.js

@@ -80,10 +80,10 @@ function sortParticipants(participants, interactionType) {
           if (participants[i].role === "product" && i === 1) {
             break;
           }
-          else if ([i].role === "product") {
+          else if (participants[i].role === "product") {
             let temp = participants[1]
             participants[1] = participants[i];
-            participants[1] = temp
+            participants[i] = temp
           }  
         }
       }       

lib/interactions/non-covelant-binding.js

@@ -16,9 +16,9 @@ function render(design, interaction, segments, interactions) {
       }
 
       Helper.sortParticipants(interaction.participants, "non-covelant-binding");  
-
+      
       let reactantNumber = 0;
-      let offset = 0;
+      let productOffset = 0;
       let width = 0;
       for (let i in interaction.participants) {
 
@@ -31,14 +31,21 @@ function render(design, interaction, segments, interactions) {
           }
 
           interaction.participants[i].segment.isParticipant = true;
-          var segment = Segment.render(design, interaction.participants[i].segment, interactions);
 
+
+          var segment = Segment.render(design, interaction.participants[i].segment, interactions);
+
+           if (i == 0) {
+            productOffset = interaction.participants.segmentWidth;
+
+           }
 
-          if (interaction.participants[i].role === "product") {
+         if (interaction.participants[i].role === "product") {
 
-             segment.dx(110);
-
-          }
+             //segment.dx(110);
+             segment.dx(productOffset);
+
+         }
 
           else if (interaction.participants[i].segment.role === "reactant2") {
             segment.dx(220);

lib/segment.js

@@ -7,14 +7,16 @@ var Rect = require('./geom/rect'),
     nonDNATypes = require('./nonDNATypes'),
     Arrows = require('../font/sbolv/interaction-arrows/main')
 
-function renderSegment(design, segment, interactions) {
+
+function renderSegment(design, segment, interactions,) {
 
     var surface = design.surface;
 
     var glyphOffset = 0;
 
     var boundingBoxSize;
-
+
+
     /*
     *This flag is set to true if the nonDNA part is going to be displayed in a sequense of length 1
     * the purpose is to hide the backBone
@@ -269,25 +271,29 @@ function renderSegment(design, segment, interactions) {
 
         //if glyph is the first reactant in a non-covelant-binding-reaction add the arrow
         else if (segment.role === "reactant1") {
+           //deponding on the implementation of the glyph, (if it starts from negative x area) we set the offset of degradation arrow
+           var effectiveOffset = glyphProps.glyphLength ? glyphProps.glyphLength : Math.max(glyph.bbox().width, glyphLength);
            var arrowPos = Matrix();
-           var arrowOffset = Vec2(0, -boundingBoxSize.y);
+           var arrowOffset = Vec2(effectiveOffset + 5, -boundingBoxSize.y);
            var arrowTransform = Matrix.multiply( Matrix.translation(arrowOffset), arrowPos );
            var arrowProps = Arrows.ReactantArrow.render(design, glyphObject, boundingBoxSize );
            var arrowGlyph = arrowProps.glyph;
            arrowGlyph.transform({ matrix: Matrix.toSVGString(arrowTransform) });
            group.add(arrowGlyph);
+           interaction.participants.segmentWidth =  group.bbox().width
         }
 
         //if glyph is the first reactant in a non-covelant-binding-reaction modify direction of arrow
         else if (segment.role === "reactant2") {
 
            var arrowPos = Matrix();
            var arrowOffset = Vec2(0, -boundingBoxSize.y);
-           var arrowTransform = Matrix.rotate(arrowPos, 180, { x: 20, y: 0 });
+           var arrowTransform = Matrix.rotate(arrowPos, 180, { x: 0, y: 0 });
            var arrowProps = Arrows.ReactantArrow.render(design, glyphObject, boundingBoxSize );
            var arrowGlyph = arrowProps.glyph;
            arrowGlyph.transform({ matrix: Matrix.toSVGString(arrowTransform) });
            group.add(arrowGlyph);
+
         }
 
         else if (segment.role === "degradationReactant") {
@@ -403,9 +409,8 @@ function renderSegment(design, segment, interactions) {
     }
 
     group.displayList = segment;
+    //segment width before adding label
     segment.svg = group;
-
-    return group;
 }
 
 module.exports = {