Added Circular type to the backbone

SBOLCanvasBackend/src/utils/MxToSBOL.java

@@ -406,7 +406,7 @@ private void createComponentDefinition(SBOLDocument document, mxGraph graph, mxG
 				glyphInfo.getDisplayID(), glyphInfo.getVersion(), SBOLData.types.getValue(glyphInfo.getPartType()));
 		if (glyphInfo.getOtherTypes() != null) {
 			for (String type : glyphInfo.getOtherTypes()) {
-				compDef.addType(new URI(type));
+				compDef.addType(SBOLData.types.getValue(type));
 			}
 		}
 

SBOLCanvasBackend/src/utils/SBOLData.java

@@ -43,6 +43,7 @@ public class SBOLData {
 		types.put("RNA molecule", ComponentDefinition.RNA_MOLECULE);
 		types.put("RNA region", ComponentDefinition.RNA_REGION);
 		types.put("Small molecule", ComponentDefinition.SMALL_MOLECULE);
+		types.put("Circular", URI.create("http://identifiers.org/so/SO:0000988"));
 
 		roles = new BiMap<String, URI>();
 		roles.put("Gen (Engineered Region)", SequenceOntology.ENGINEERED_REGION);

SBOLCanvasBackend/src/utils/SBOLToMx.java

@@ -562,10 +562,10 @@ private GlyphInfo genGlyphInfo(ComponentDefinition glyphCD) {
 		// There will only be one important type
 		ArrayList<String> otherTypes = new ArrayList<String>();
 		for (URI glyphType : glyphCD.getTypes()) {
-			if (SBOLData.types.containsValue(glyphType)) {
+			if (SBOLData.types.containsValue(glyphType) && glyphInfo.getPartType() == null) {
 				glyphInfo.setPartType(SBOLData.types.getKey(glyphType));
 			} else {
-				otherTypes.add(glyphType.toString());
+				otherTypes.add(SBOLData.types.getKey(glyphType));
 			}
 		}
 		glyphInfo.setOtherTypes(otherTypes.toArray(new String[0]));

SBOLCanvasFrontend/src/app/glyphInfo.ts

@@ -38,6 +38,7 @@ export class GlyphInfo extends Info {
         this.version = version
         this.partType = partType
         this.partRole = partRole
+        this.otherTypes = []
 
         // try to make a prefix from the part role
         const partRolePrefix = partRole && (partRole.match(/(\w+?) \(/) || [])[1];

SBOLCanvasFrontend/src/app/graph-base.ts

@@ -312,7 +312,7 @@ export class GraphBase {
                         }
                         cell.geometry.width = GraphBase.defaultModuleWidth
                         cell.geometry.height = GraphBase.defaultModuleHeight
-                    } else if (glyphDict[cell.value] instanceof GlyphInfo && glyphDict[cell.value].partType === 'DNA region') {
+                    } else if (glyphDict[cell.value] instanceof GlyphInfo && glyphDict[cell.value].partType === 'DNA region' || glyphDict[cell.value].partType === 'Circular') {
                         // sequence feature
                         if (!cell.style) {
                             cell.style = GraphBase.STYLE_SEQUENCE_FEATURE + glyphDict[cell.value].partRole
@@ -329,7 +329,7 @@ export class GraphBase {
                                     cell.geometry.x = 0
                                 }
                                 else{
-                                    cell.style = cell.style = "sequenceFeatureGlyphCir (Circular Backbone Right)"
+                                    cell.style = "sequenceFeatureGlyphCir (Circular Backbone Right)"
                                     cell.stayAtEnd = true
                                     leftCirFound = false
                                 }                                

SBOLCanvasFrontend/src/app/graph-helpers.ts

@@ -79,6 +79,11 @@ export class GraphHelpers extends GraphBase {
         }
         return glyphInfo
     }
+
+    protected getGlyphInfo(cell: mxCell): GlyphInfo {
+        const glyphInfo = this.getFromInfoDict(cell.getValue()) as GlyphInfo
+        return glyphInfo
+    }
 
     protected async updateSelectedGlyphInfo(this: GraphService, info: GlyphInfo) {
         this.graph.getModel().beginUpdate()

SBOLCanvasFrontend/src/app/graph.service.ts

@@ -842,6 +842,10 @@ export class GraphService extends GraphHelpers {
 
             const circuitContainer = selection.isCircuitContainer() ? selection : selection.getParent()
 
+            // Add additional type to Circuit Container if Circular present
+            const circuitContainerGlyphInfo = (this.getGlyphInfo(circuitContainer))
+            circuitContainerGlyphInfo.otherTypes.push("Circular")
+
             // there cannot be more than one circular backbone on a circuit container
             if(circuitContainer.isCircularBackboneOnCircuitContainer()) return
 

SBOLCanvasFrontend/src/app/info-editor/info-editor.component.html

@@ -10,7 +10,7 @@
     </mat-select>
   </mat-form-field>
 
-  <mat-form-field floatLabel = "always" *ngIf="glyphInfo.partType.startsWith('DNA')">
+  <mat-form-field floatLabel = "always" *ngIf="glyphInfo.partType.startsWith('DNA') || glyphInfo.partType.startsWith('Circular')">
     <mat-label>Part role</mat-label>
     <mat-select id="partRole" value="{{glyphInfo.partRole}}" (selectionChange)="dropDownChange($event)" matTooltipShowDelay="1000" matTooltip="Clarifies the potential function of the entity.">
       <mat-option value="">IDK (Unspecified)</mat-option>
@@ -20,7 +20,7 @@
     </mat-select>
   </mat-form-field>
 
-  <mat-form-field floatLabel = "always" *ngIf="glyphInfo.partType.startsWith('DNA')">
+  <mat-form-field floatLabel = "always" *ngIf="glyphInfo.partType.startsWith('DNA') || glyphInfo.partType.startsWith('Circular')">
     <mat-label>Role refinement</mat-label>
     <mat-select panelWidth="null" id="partRefinement" value="{{glyphInfo.partRefine}}" (selectionChange)="dropDownChange($event)" matTooltipShowDelay="1000" matTooltip="Optional. More specific version of the part role.">
       <mat-option value="">None</mat-option>