Fixed line drawings

src/common

@@ -1 +1 @@
-Subproject commit 1f4a6dea021dfb35f5f8ba34e32b7c174cd8cf3e
+Subproject commit 71b309744d7760ffc4ecdc14a1f68dbe2a25d419

src/ui/battle/Targetting.ts

@@ -78,19 +78,21 @@ module TK.SpaceTac.UI {
          * Draw a vector, with line and gradation
          */
         drawVector(color: number, x1: number, y1: number, x2: number, y2: number, gradation = 0) {
-            let line = this.drawn_info;
-            line.lineStyle(6, color);
-            line.beginPath();
-            line.moveTo(x1, y1);
-            line.lineTo(x2, y2);
-            line.strokePath();
-            line.beginPath();
-            line.lineStyle(2, 0x000000, 0.6);
-            line.moveTo(x1, y1);
-            line.lineTo(x2, y2);
-            line.closePath();
-            line.strokePath();
-            line.visible = true;
+            let graphics = this.drawn_info;
+            graphics.addLine({
+                start: { x: x1, y: y1 },
+                end: { x: x2, y: y2 },
+                width: 6,
+                color: color
+            });
+            graphics.addLine({
+                start: { x: x1, y: y1 },
+                end: { x: x2, y: y2 },
+                width: 2,
+                color: 0,
+                alpha: 0.6
+            });
+            graphics.setVisible(true);
 
             if (gradation) {
                 let dx = x2 - x1;
@@ -99,10 +101,14 @@ module TK.SpaceTac.UI {
                 let angle = Math.atan2(dy, dx);
                 dx = Math.cos(angle);
                 dy = Math.sin(angle);
-                line.lineStyle(3, color);
+                graphics.lineStyle(3, color);
                 for (let d = gradation; d <= dist; d += gradation) {
-                    line.moveTo(x1 + dx * d + dy * 10, y1 + dy * d - dx * 10);
-                    line.lineTo(x1 + dx * d - dy * 10, y1 + dy * d + dx * 10);
+                    graphics.addLine({
+                        start: { x: x1 + dx * d + dy * 10, y: y1 + dy * d - dx * 10 },
+                        end: { x: x1 + dx * d - dy * 10, y: y1 + dy * d + dx * 10 },
+                        width: 3,
+                        color: color,
+                    });
                 }
             }
         }

src/ui/common/UIGraphics.ts

@@ -10,6 +10,14 @@ module TK.SpaceTac.UI {
         angle: { start: number, span: number }
     }
 
+    export interface UIGraphicsLineOptions {
+        start: { x: number, y: number }
+        end: { x: number, y: number }
+        color: number,
+        alpha?: number,
+        width?: number
+    }
+
     /**
      * UI component that supports drawing simple shapes (circles, lines...)
      */
@@ -72,5 +80,17 @@ module TK.SpaceTac.UI {
                 this.strokeCircle(x, y, options.radius);
             }
         }
+
+        /**
+         * Add a line
+         */
+        addLine(options: UIGraphicsLineOptions): void {
+            this.beginPath();
+            this.lineStyle(coalesce(options.width, 1), options.color, coalesce(options.alpha, 1));
+            this.moveTo(options.start.x, options.start.y);
+            this.lineTo(options.end.x, options.end.y);
+            this.closePath();
+            this.strokePath();
+        }
     }
 }

src/ui/map/UniverseMapView.ts

@@ -79,11 +79,12 @@ module TK.SpaceTac.UI {
 
                 let result = builder.in(this.starlinks_group).graphics("starlink");
                 if (loc1 && loc2) {
-                    result.lineStyle(0.01, 0x6cc7ce);
-                    result.beginPath();
-                    result.moveTo(starlink.first.x - 0.5 + loc1.x, starlink.first.y - 0.5 + loc1.y);
-                    result.lineTo(starlink.second.x - 0.5 + loc2.x, starlink.second.y - 0.5 + loc2.y);
-                    result.strokePath();
+                    result.addLine({
+                        start: { x: starlink.first.x + loc1.x, y: starlink.first.y + loc1.y },
+                        end: { x: starlink.second.x + loc2.x, y: starlink.second.y + loc2.y },
+                        color: 0x6cc7ce,
+                        width: 0.01,
+                    });
                 }
                 result.setDataEnabled();
                 result.data.set("link", starlink);