SWF Diagram Viewer - Orthogonal lines

Scope: Serverless Workflow Diagram Editor

Goal: Move from the use of regular poly-lines to the use of orthogonal poly-lines.

Actions

• Usage of orthogonal polylines, instead of actual regular ones
• Usage of multiple end nodes, instead to connectors pointing a single end node, each ending state will point to its "own" ending node
  • 
• Nodes with 1 incoming connection must be connected to top magnet
  • 
• Nodes with 1 outgoing connection must be connected to the bottom magnet
  • 
• Long transitions crossing multiple layers shall not overlap states
  • 
• States with multiple outgoing transitions crossing multiple layers must not overlap each other horizontally
  • 
• Two transitions with same source and target shall not overlap each other (check kubesmarts).
  • 
• Transition labels when present must be placed in the middle of the longest segment, and should remain on the same position on mouse hover
  • 
• States with a backward transition to its source state, in the immediate layer above, shall not be overlaped by its backward transition 
  • 
• Long backward transitions shall not overlap states in the way to its target
  • 
• Close KOGITO-7197 once this work done

Examples of overlapping identified issues

*filling-a-glass-of-water.sw.json

• lines-overlapping.png:  
  
• [^book-lending.sw.json]
• orchestration.sw.json
   

Known Issues

• Transitions pointing to immediate layer below may overlap nodes depending on the distribution of states in that layer
  • 
• States with multiple transitions crossing multiple layers may overlap each other vertically
  • 
• Transitions may cross other transitions depending on the state's distribution
  • 

Acceptance criteria

All actions listed above are fulfilled.