Fix stencil fixer shifting values it should only scale, and add inter…

…action nodes to glyph menu
SynBioDex · Jan 25, 2021 · bb14543 · bb14543
1 parent f1e6071
commit bb14543
Show file tree

Hide file tree

Showing 7 changed files with 124 additions and 1 deletion.
diff --git a/SBOLCanvasFrontend/src/app/glyph-menu/glyph-menu.component.html b/SBOLCanvasFrontend/src/app/glyph-menu/glyph-menu.component.html
@@ -78,6 +78,26 @@
     </mat-expansion-panel>
 
 
+    <!-------------------------------------    Interaction nodes panel   --------------------------------------->
+    <mat-expansion-panel [expanded]="true" *ngIf="!componentDefinitionMode &&
+            (interactionNodeDict | keyvalue | searchfilter: searchPhrase).length > 0">
+      <mat-expansion-panel-header>
+        <mat-panel-title>
+          Interaction Nodes
+        </mat-panel-title>
+        <mat-panel-description>
+        </mat-panel-description>
+      </mat-expansion-panel-header>
+      <mat-grid-list cols="4" rowHeight="60px" gutterSize="5px">
+        <mat-grid-tile *ngFor="let pair of interactionNodeDict | keyvalue | searchfilter: searchPhrase">
+          <button mat-button (click)="onInteractionNodeGlyphClicked(pair.key)" [matTooltip]="pair.key">
+            <svg #canvasElement [attr.elementType]="elementTypes.INTERACTION_NODE" [attr.glyphStyle]="pair.key" width="52px" height="52px" [innerHTML]="pair.value"></svg>
+          </button>
+        </mat-grid-tile>
+      </mat-grid-list>
+    </mat-expansion-panel>
+
+
     <!-------------------------------------    Utils panel   --------------------------------------->
     <mat-expansion-panel [expanded]="true" *ngIf="
                     (!componentDefinitionMode && stringMatches('backbone dna strand circuit', searchPhrase))

diff --git a/SBOLCanvasFrontend/src/app/glyph-menu/glyph-menu.component.ts b/SBOLCanvasFrontend/src/app/glyph-menu/glyph-menu.component.ts
@@ -36,6 +36,7 @@ export class GlyphMenuComponent implements OnInit, AfterViewInit {
   public utilsDict = {};
   public sequenceFeatureDict = {};
   public interactionsDict = {};
+  public interactionNodeDict={};
   public molecularSpeciesDict = {};
 
   public componentDefinitionMode = false;
@@ -51,6 +52,11 @@ export class GlyphMenuComponent implements OnInit, AfterViewInit {
     this.graphService.addMolecularSpecies(name);
   }
 
+  onInteractionNodeGlyphClicked(name: string){
+    // name = name.charAt(0).toUpperCase()+name.slice(1);
+    // this.graphService.addInteractionNode(name);
+  }
+
   onInteractionGlyphClicked(name: string) {
     name = name.charAt(0).toUpperCase() + name.slice(1); // Capitalize first letter because bah humbug.
     this.graphService.addInteraction(name);
@@ -106,6 +112,7 @@ export class GlyphMenuComponent implements OnInit, AfterViewInit {
     const sequenceFeatureElts   = this.glyphService.getSequenceFeatureElements();
     const molecularSpeciesElts  = this.glyphService.getMolecularSpeciesElements();
     const interactionElts       = this.glyphService.getInteractionElements();
+    const interactionNodeElts   = this.glyphService.getInteractionNodeElements();
     const utilElts              = this.glyphService.getUtilElements();
 
     for (const name in sequenceFeatureElts) {
@@ -126,6 +133,10 @@ export class GlyphMenuComponent implements OnInit, AfterViewInit {
       const svg = interactionElts[name];
       this.interactionsDict[name] = this.sanitizer.bypassSecurityTrustHtml(svg.innerHTML);
     }
+    for(const name in interactionNodeElts){
+      const svg = interactionNodeElts[name];
+      this.interactionNodeDict[name] = this.sanitizer.bypassSecurityTrustHtml(svg.innerHTML);
+    }
   }
 
   addStrand() {

diff --git a/SBOLCanvasFrontend/src/app/glyph.service.ts b/SBOLCanvasFrontend/src/app/glyph.service.ts
@@ -70,6 +70,12 @@ export class GlyphService {
     'assets/glyph_stencils/interactions/degradation.xml',
   ];
 
+  private interactionNodeXMLs: string[] = [
+    'assets/glyph_stencils/interaction_nodes/association.xml',
+    'assets/glyph_stencils/interaction_nodes/dissociation.xml',
+    'assets/glyph_stencils/interaction_nodes/process.xml',
+  ]
+
   private indicatorXMLs: string[] = [
     'assets/glyph_stencils/indicators/composite.xml',
     'assets/glyph_stencils/indicators/variant.xml',
@@ -85,12 +91,14 @@ export class GlyphService {
   private sequenceFeatures: any = {};
   private molecularSpecies: any = {};
   private interactions: any = {};
+  private interactionNodes: any = {};
   private indicators: any = {};
   private utils: any = {};
 
   constructor() {
     this.loadXMLs(this.sequenceFeatureXMLs, this.sequenceFeatures);
     this.loadXMLs(this.molecularSpeciesXMLs, this.molecularSpecies);
+    this.loadXMLs(this.interactionNodeXMLs, this.interactionNodes);
     this.loadXMLs(this.interactionXMLs, this.interactions);
     this.loadXMLs(this.indicatorXMLs, this.indicators);
     this.loadXMLs(this.utilXMLs, this.utils);
@@ -150,6 +158,10 @@ export class GlyphService {
     return this.indicators;
   }
 
+  getInteractionNodeGlyphs(){
+    return this.interactionNodes;
+  }
+
   getUtilElements() {
     return this.getElements(this.utils)
   }
@@ -158,6 +170,10 @@ export class GlyphService {
     return this.getElements(this.interactions);
   }
 
+  getInteractionNodeElements(){
+    return this.getElements(this.interactionNodes);
+  }
+
   getMolecularSpeciesElements() {
     return this.getElements(this.molecularSpecies);
   }

diff --git a/SBOLCanvasFrontend/src/assets/glyph_stencils/interaction_nodes/association.xml b/SBOLCanvasFrontend/src/assets/glyph_stencils/interaction_nodes/association.xml
@@ -0,0 +1,24 @@
+<shapes>
+<shape aspect="fixed" h="48" name="association" strokewidth="inherit" w="48" centered="True">
+    <connections />
+    <foreground>
+        <strokewidth width="2.88" />
+        <linejoin join="round" />
+        <linecap cap="round" />
+        <miterlimit limit="4" />
+        <dashpattern pattern="none" />
+        <dashed dashed="1" />
+        <alpha alpha="1" />
+        <strokealpha alpha="1" />
+        <fillalpha alpha="1" />
+        <path>
+            <move x="24.477593984962404" y="8.418496240601502" />
+            <arc large-arc-flag="0.0" rx="15.83224060150376" ry="15.569563909774436" sweep-flag="1.0" x="39.88" x-axis-rotation="0.0" y="24.32237593984962" />
+            <arc large-arc-flag="0.0" rx="15.83224060150376" ry="15.569563909774436" sweep-flag="1.0" x="23.785082706766914" x-axis-rotation="0.0" y="39.581503759398494" />
+            <arc large-arc-flag="0.0" rx="15.83224060150376" ry="15.569563909774436" sweep-flag="1.0" x="8.21551879699248" x-axis-rotation="0.0" y="23.820902255639098" />
+            <arc large-arc-flag="0.0" rx="15.83224060150376" ry="15.569563909774436" sweep-flag="1.0" x="24.1193984962406" x-axis-rotation="0.0" y="8.418496240601502" />
+        </path>
+        <stroke />
+    </foreground>
+</shape>
+</shapes>
diff --git a/SBOLCanvasFrontend/src/assets/glyph_stencils/interaction_nodes/dissociation.xml b/SBOLCanvasFrontend/src/assets/glyph_stencils/interaction_nodes/dissociation.xml
@@ -0,0 +1,32 @@
+<shapes>
+<shape aspect="fixed" h="48" name="dissociation" strokewidth="inherit" w="48" centered="True">
+    <connections />
+    <foreground>
+        <strokewidth width="2.88" />
+        <linejoin join="round" />
+        <linecap cap="round" />
+        <miterlimit limit="4" />
+        <dashpattern pattern="none" />
+        <dashed dashed="1" />
+        <alpha alpha="1" />
+        <strokealpha alpha="1" />
+        <fillalpha alpha="1" />
+        <path>
+            <move x="24.47332339791356" y="8.676154992548433" />
+            <arc large-arc-flag="0.0" rx="15.832667660208646" ry="15.335678092399407" sweep-flag="1.0" x="39.88" x-axis-rotation="0.0" y="24.343159463487332" />
+            <arc large-arc-flag="0.0" rx="15.832667660208646" ry="15.335678092399407" sweep-flag="1.0" x="23.787004470938896" x-axis-rotation="0.0" y="39.32384500745157" />
+            <arc large-arc-flag="0.0" rx="15.832667660208646" ry="15.335678092399407" sweep-flag="1.0" x="8.21466467958271" x-axis-rotation="0.0" y="23.84616989567809" />
+            <arc large-arc-flag="0.0" rx="15.832667660208646" ry="15.335678092399407" sweep-flag="1.0" x="24.11833084947839" x-axis-rotation="0.0" y="8.676154992548433" />
+        </path>
+        <fillstroke />
+        <path>
+            <move x="24.33132637853949" y="14.734694485842025" />
+            <arc large-arc-flag="0.0" rx="9.584798807749628" ry="9.300804769001491" sweep-flag="1.0" x="33.655797317436665" x-axis-rotation="0.0" y="24.224828614008942" />
+            <arc large-arc-flag="0.0" rx="9.584798807749628" ry="9.300804769001491" sweep-flag="1.0" x="23.905335320417286" x-axis-rotation="0.0" y="33.312637853949326" />
+            <arc large-arc-flag="0.0" rx="9.584798807749628" ry="9.300804769001491" sweep-flag="1.0" x="14.486199701937405" x-axis-rotation="0.0" y="23.9408345752608" />
+            <arc large-arc-flag="0.0" rx="9.584798807749628" ry="9.300804769001491" sweep-flag="1.0" x="24.11833084947839" x-axis-rotation="0.0" y="14.734694485842025" />
+        </path>
+        <stroke />
+    </foreground>
+</shape>
+</shapes>
diff --git a/SBOLCanvasFrontend/src/assets/glyph_stencils/interaction_nodes/process.xml b/SBOLCanvasFrontend/src/assets/glyph_stencils/interaction_nodes/process.xml
@@ -0,0 +1,18 @@
+<shapes>
+<shape aspect="fixed" h="48" name="process" strokewidth="inherit" w="48" centered="True">
+    <connections />
+    <foreground>
+        <strokewidth width="2.88" />
+        <linejoin join="round" />
+        <linecap cap="round" />
+        <miterlimit limit="4" />
+        <dashpattern pattern="none" />
+        <dashed dashed="1" />
+        <alpha alpha="1" />
+        <strokealpha alpha="1" />
+        <fillalpha alpha="1" />
+        <rect h="31.76" w="31.76" x="8.12" y="8.12" />
+        <fillstroke />
+    </foreground>
+</shape>
+</shapes>
diff --git a/resources/xmlFixer.py b/resources/xmlFixer.py
@@ -23,6 +23,8 @@
 
 INF = 1000
 
+SHIFT_EXCLUDE_LIST =['rx','ry','x-axis-rotation'] #they contain x and y, but should only be scaled
+
 def main():
 	args = parse_args()
 
@@ -161,7 +163,7 @@ def shift_x_or_y_direction(shape, distance, x_or_y):
 		for child in path.getchildren():
 			for key, val in child.attrib.items():
 				val = float(val)
-				if x_or_y in key.lower():
+				if x_or_y in key.lower() and key.lower() not in SHIFT_EXCLUDE_LIST:
 					val += distance
 				child.attrib[key] = str(val)