DEFINITIONS
   "LibraryRegex.def";
   VISB_SVG_BOX == rec(height:2000, width:1150);

   VISB_SVG_OBJECTS == { kid,lA,lB • (kid,lA,lB) : LINES | // for highlighting
      rec(`id`: kid, svg_class: "line",
           x1: prj2(lA), x2: prj2(lB), y1: prj1(lA), y2: prj1(lB), class: "tl-disabled", `stroke-width`: 1.5, title:"")
   };
   VISB_SVG_OBJECTS_copy == { kid,lA,lB • (kid,lA,lB) : LINES | // to show lines
      rec(svg_class: "line",
           x1: prj2(lA), x2: prj2(lB), y1: prj1(lA), y2: prj1(lB), stroke: "black", `stroke-width`: 0.25, title:"")
   };

   VISB_SVG_UPDATES7 == { geokante, dweg • (geokante, dweg) : DWeg_Geo_Kanten | 
       LET SM, CE BE SM = { sm | sm : Route_ID7_Successful & REGEX_MATCH(prj2(sm),"^"^dweg^".*") }
                   & CE = { ce | ce : Route_ID7_Counterexamples & REGEX_MATCH(prj2(ce),"^"^dweg^".*") }
       IN 
          IF CE /= {} THEN rec(`id`: geokante, class: "tl-highlight", title: prj2(CHOOSE(CE)))
          ELSIF SM /= {} THEN rec(`id`: geokante, class: "tl-success", title: prj2(CHOOSE(SM)))
          ELSE rec(`id`: geokante, class: "tl-disabled", title: "")
          END
       END
   };

    VISB_SVG_CONTENTS_STYLES ==
'''
  <style>
        .tl-disabled {
            stroke : none;
            opacity: 0.0
        }
        .tl-success {
            stroke : green;
            opacity : 0.7
        }
        @keyframes warning-blink {
      25% {opacity: 0.4;}
      40% {opacity: 0.8; fill: yellow;}
      75% {opacity: 0.4;}
      100% {opacity: 0.6; fill: orange;}
        }
        .tl-highlight {
            stroke : red;
            //opacity: 0.7;
            //animation-name: warning-blink;
            //animation-iteration-count: 20;
            //animation-duration: 3s;
        }
   </style>
''';