Fix up a bunch of typescript issues

These came to light with the typescript compiler upgrade that is
coming up soon with the bazel upgrade.

A lot of the changes in this patch arose from the changes in the
imports. For some reason we can no longer import modules the way we
used to. I'm not really sure how it ever worked. The upstream
documentation agrees with the changes we had to make here. It's
possible that the old version of typescript simply did things
differently when it comes to importing modules.

Change-Id: I054b5269c90cc94276e9f856d8cd79c8de2946f2
diff --git a/y2020/BUILD b/y2020/BUILD
index 208b04a..f54ec84 100644
--- a/y2020/BUILD
+++ b/y2020/BUILD
@@ -243,7 +243,6 @@
         "//y2020/www:camera_main_bundle",
         "//y2020/www:field_main_bundle",
         "//y2020/www:files",
-        "//y2020/www:flatbuffers",
     ],
 )
 
diff --git a/y2020/www/BUILD b/y2020/www/BUILD
index 5e11d7c..bc9c016 100644
--- a/y2020/www/BUILD
+++ b/y2020/www/BUILD
@@ -15,6 +15,7 @@
         "//aos/network/www:proxy",
         "//y2020/vision:vision_ts_fbs",
         "//y2020/vision/sift:sift_ts_fbs",
+        "@com_github_google_flatbuffers//ts:flatbuffers_ts",
     ],
 )
 
@@ -61,25 +62,12 @@
     visibility = ["//visibility:public"],
 )
 
-genrule(
-    name = "flatbuffers",
-    srcs = [
-        "@com_github_google_flatbuffers//:flatjs",
-    ],
-    outs = [
-        "flatbuffers.js",
-    ],
-    cmd = "cp $(location @com_github_google_flatbuffers//:flatjs) $@",
-    visibility = ["//y2020:__subpackages__"],
-)
-
 aos_downloader_dir(
     name = "www_files",
     srcs = [
         ":camera_main_bundle",
         ":field_main_bundle",
         ":files",
-        ":flatbuffers",
     ],
     dir = "www",
     visibility = ["//visibility:public"],
diff --git a/y2020/www/camera_main.ts b/y2020/www/camera_main.ts
index e13452e..8667a8e 100644
--- a/y2020/www/camera_main.ts
+++ b/y2020/www/camera_main.ts
@@ -1,7 +1,7 @@
-import {Connection} from 'aos/network/www/proxy';
+import {Connection} from 'org_frc971/aos/network/www/proxy';
 
 import {ImageHandler} from './image_handler';
-import {ConfigHandler} from 'aos/network/www/config_handler';
+import {ConfigHandler} from 'org_frc971/aos/network/www/config_handler';
 
 const conn = new Connection();
 
diff --git a/y2020/www/camera_viewer.html b/y2020/www/camera_viewer.html
index 4a61d7a..aafec55 100644
--- a/y2020/www/camera_viewer.html
+++ b/y2020/www/camera_viewer.html
@@ -1,6 +1,5 @@
 <html>
   <head>
-    <script src="flatbuffers.js"></script>
     <script src="camera_main_bundle.min.js" defer></script>
     <link rel="stylesheet" href="styles.css">
   </head>
diff --git a/y2020/www/field.html b/y2020/www/field.html
index ad449db..c75e7bf 100644
--- a/y2020/www/field.html
+++ b/y2020/www/field.html
@@ -1,6 +1,5 @@
 <html>
   <head>
-    <script src="flatbuffers.js"></script>
     <script src="field_main_bundle.min.js" defer></script>
     <link rel="stylesheet" href="styles.css">
   </head>
diff --git a/y2020/www/field_handler.ts b/y2020/www/field_handler.ts
index ffb4aee..c0b6c50 100644
--- a/y2020/www/field_handler.ts
+++ b/y2020/www/field_handler.ts
@@ -1,8 +1,15 @@
-import {aos} from 'aos/configuration_generated';
-import {aos} from 'aos/network/connect_generated';
-import {Connection} from 'aos/network/www/proxy';
-import {frc971} from 'frc971/control_loops/drivetrain/drivetrain_status_generated';
-import {frc971} from 'y2020/vision/sift/sift_generated';
+import * as configuration from 'org_frc971/aos/configuration_generated';
+import * as connect from 'org_frc971/aos/network/connect_generated';
+import {Connection} from 'org_frc971/aos/network/www/proxy';
+import * as flatbuffers_builder from 'org_frc971/external/com_github_google_flatbuffers/ts/builder';
+import {ByteBuffer} from 'org_frc971/external/com_github_google_flatbuffers/ts/byte-buffer';
+import * as drivetrain from 'org_frc971/frc971/control_loops/drivetrain/drivetrain_status_generated';
+import * as sift from 'org_frc971/y2020/vision/sift/sift_generated';
+
+import DrivetrainStatus = drivetrain.frc971.control_loops.drivetrain.Status;
+import ImageMatchResult = sift.frc971.vision.sift.ImageMatchResult;
+import Connect = connect.aos.message_bridge.Connect;
+import Channel = configuration.aos.Channel;
 
 import {FIELD_LENGTH, FIELD_WIDTH, FT_TO_M, IN_TO_M} from './constants';
 
@@ -83,7 +90,7 @@
 
 export class FieldHandler {
   private canvas = document.createElement('canvas');
-  private imageMatchResult: frc971.vision.sift.ImageMatchResult|null = null;
+  private imageMatchResult: ImageMatchResult|null = null;
   private drivetrainStatus: DrivetrainStatus|null = null;
 
   constructor(private readonly connection: Connection) {
@@ -93,42 +100,46 @@
       this.sendConnect();
     });
     this.connection.addHandler(
-        frc971.vision.sift.ImageMatchResult.getFullyQualifiedName(), (res) => {
+        ImageMatchResult.getFullyQualifiedName(), (res) => {
           this.handleImageMatchResult(res);
         });
-    this.connection.addHandler(frc971.control_loops.drivetrain.Status.getFullyQualifiedName(), (data) => {
-      this.handleDrivetrainStatus(data);
-    });
+    this.connection.addHandler(
+        DrivetrainStatus.getFullyQualifiedName(), (data) => {
+          this.handleDrivetrainStatus(data);
+        });
   }
 
   private handleImageMatchResult(data: Uint8Array): void {
-    const fbBuffer = new flatbuffers.ByteBuffer(data);
-    this.imageMatchResult =
-        frc971.vision.sift.ImageMatchResult.getRootAsImageMatchResult(fbBuffer);
+    const fbBuffer = new ByteBuffer(data);
+    this.imageMatchResult = ImageMatchResult.getRootAsImageMatchResult(
+        fbBuffer as unknown as flatbuffers.ByteBuffer);
   }
 
   private handleDrivetrainStatus(data: Uint8Array): void {
-    const fbBuffer = new flatbuffers.ByteBuffer(data);
-    this.drivetrainStatus = frc971.control_loops.drivetrain.Status.getRootAsStatus(fbBuffer);
+    const fbBuffer = new ByteBuffer(data);
+    this.drivetrainStatus = DrivetrainStatus.getRootAsStatus(
+        fbBuffer as unknown as flatbuffers.ByteBuffer);
   }
 
   private sendConnect(): void {
-    const builder = new flatbuffers.Builder(512);
+    const builder =
+        new flatbuffers_builder.Builder(512) as unknown as flatbuffers.Builder;
     const channels: flatbuffers.Offset[] = [];
     for (const channel of REQUIRED_CHANNELS) {
       const nameFb = builder.createString(channel.name);
       const typeFb = builder.createString(channel.type);
-      aos.Channel.startChannel(builder);
-      aos.Channel.addName(builder, nameFb);
-      aos.Channel.addType(builder, typeFb);
-      const channelFb = aos.Channel.endChannel(builder);
+      Channel.startChannel(builder);
+      Channel.addName(builder, nameFb);
+      Channel.addType(builder, typeFb);
+      const channelFb = Channel.endChannel(builder);
       channels.push(channelFb);
     }
 
-    const channelsFb = aos.message_bridge.Connect.createChannelsToTransferVector(builder, channels);
-    aos.message_bridge.Connect.startConnect(builder);
-    aos.message_bridge.Connect.addChannelsToTransfer(builder, channelsFb);
-    const connect = aos.message_bridge.Connect.endConnect(builder);
+    const channelsFb =
+        Connect.createChannelsToTransferVector(builder, channels);
+    Connect.startConnect(builder);
+    Connect.addChannelsToTransfer(builder, channelsFb);
+    const connect = Connect.endConnect(builder);
     builder.finish(connect);
     this.connection.sendConnectMessage(builder);
   }
@@ -214,7 +225,7 @@
     ctx.lineTo(0.5, -0.5);
     ctx.stroke();
     ctx.beginPath();
-    ctx.arc(0, 0, 0.25, -Math.PI/4, Math.PI/4);
+    ctx.arc(0, 0, 0.25, -Math.PI / 4, Math.PI / 4);
     ctx.stroke();
     ctx.restore();
   }
@@ -233,10 +244,10 @@
     ctx.restore();
   }
 
-  draw(): void  {
+  draw(): void {
     this.reset();
     this.drawField();
-    //draw cameras
+    // draw cameras
     if (this.imageMatchResult) {
       for (let i = 0; i < this.imageMatchResult.cameraPosesLength(); i++) {
         const pose = this.imageMatchResult.cameraPoses(i);
diff --git a/y2020/www/field_main.ts b/y2020/www/field_main.ts
index 163c817..7e2e392 100644
--- a/y2020/www/field_main.ts
+++ b/y2020/www/field_main.ts
@@ -1,4 +1,4 @@
-import {Connection} from 'aos/network/www/proxy';
+import {Connection} from 'org_frc971/aos/network/www/proxy';
 
 import {FieldHandler} from './field_handler';
 
diff --git a/y2020/www/image_handler.ts b/y2020/www/image_handler.ts
index c84fa23..121ab75 100644
--- a/y2020/www/image_handler.ts
+++ b/y2020/www/image_handler.ts
@@ -1,8 +1,18 @@
-import {aos} from 'aos/configuration_generated';
-import {Connection} from 'aos/network/www/proxy';
-import {aos} from 'aos/network/connect_generated';
-import {frc971} from 'y2020/vision/sift/sift_generated'
-import {frc971} from 'y2020/vision/vision_generated';
+import * as configuration from 'org_frc971/aos/configuration_generated';
+import * as connect from 'org_frc971/aos/network/connect_generated';
+import {Connection} from 'org_frc971/aos/network/www/proxy';
+import * as flatbuffers_builder from 'org_frc971/external/com_github_google_flatbuffers/ts/builder';
+import {ByteBuffer} from 'org_frc971/external/com_github_google_flatbuffers/ts/byte-buffer';
+import {Long} from 'org_frc971/external/com_github_google_flatbuffers/ts/long';
+import * as sift from 'org_frc971/y2020/vision/sift/sift_generated'
+import * as vision from 'org_frc971/y2020/vision/vision_generated';
+
+import Channel = configuration.aos.Channel;
+import Configuration = configuration.aos.Configuration;
+import Connect = connect.aos.message_bridge.Connect;
+import CameraImage = vision.frc971.vision.CameraImage;
+import ImageMatchResult = sift.frc971.vision.sift.ImageMatchResult;
+import Feature = sift.frc971.vision.sift.Feature;
 
 /*
  * All the messages that are required to show an image with metadata.
@@ -11,43 +21,43 @@
 const REQUIRED_CHANNELS = [
   {
     name: '/pi1/camera',
-    type: frc971.vision.CameraImage.getFullyQualifiedName(),
+    type: CameraImage.getFullyQualifiedName(),
   },
   {
     name: '/pi2/camera',
-    type: frc971.vision.CameraImage.getFullyQualifiedName(),
+    type: CameraImage.getFullyQualifiedName(),
   },
   {
     name: '/pi3/camera',
-    type: frc971.vision.CameraImage.getFullyQualifiedName(),
+    type: CameraImage.getFullyQualifiedName(),
   },
   {
     name: '/pi4/camera',
-    type: frc971.vision.CameraImage.getFullyQualifiedName(),
+    type: CameraImage.getFullyQualifiedName(),
   },
   {
     name: '/pi5/camera',
-    type: frc971.vision.CameraImage.getFullyQualifiedName(),
+    type: CameraImage.getFullyQualifiedName(),
   },
   {
     name: '/pi1/camera/detailed',
-    type: frc971.vision.sift.ImageMatchResult.getFullyQualifiedName(),
+    type: ImageMatchResult.getFullyQualifiedName(),
   },
   {
     name: '/pi2/camera/detailed',
-    type: frc971.vision.sift.ImageMatchResult.getFullyQualifiedName(),
+    type: ImageMatchResult.getFullyQualifiedName(),
   },
   {
     name: '/pi3/camera/detailed',
-    type: frc971.vision.sift.ImageMatchResult.getFullyQualifiedName(),
+    type: ImageMatchResult.getFullyQualifiedName(),
   },
   {
     name: '/pi4/camera/detailed',
-    type: frc971.vision.sift.ImageMatchResult.getFullyQualifiedName(),
+    type: ImageMatchResult.getFullyQualifiedName(),
   },
   {
     name: '/pi5/camera/detailed',
-    type: frc971.vision.sift.ImageMatchResult.getFullyQualifiedName(),
+    type: ImageMatchResult.getFullyQualifiedName(),
   },
 ];
 
@@ -56,10 +66,10 @@
   private select = document.createElement('select');
 
   private imageBuffer: Uint8ClampedArray|null = null;
-  private image: frc971.vision.CameraImage|null = null;
-  private imageTimestamp: flatbuffers.Long|null = null;
-  private result: frc971.vision.sift.ImageMatchResult|null = null;
-  private resultTimestamp: flatbuffers.Long|null = null;
+  private image: CameraImage|null = null;
+  private imageTimestamp: Long|null = null;
+  private result: ImageMatchResult|null = null;
+  private resultTimestamp: Long|null = null;
   private width = 0;
   private height = 0;
   private selectedIndex = 0;
@@ -77,32 +87,33 @@
       this.sendConnect();
     });
     this.connection.addHandler(
-        frc971.vision.sift.ImageMatchResult.getFullyQualifiedName(), (data) => {
+        ImageMatchResult.getFullyQualifiedName(), (data) => {
           this.handleImageMetadata(data);
         });
-    this.connection.addHandler(
-      frc971.vision.CameraImage.getFullyQualifiedName(), (data) => {
-        this.handleImage(data);
-      });
+    this.connection.addHandler(CameraImage.getFullyQualifiedName(), (data) => {
+      this.handleImage(data);
+    });
   }
 
   private sendConnect(): void {
-    const builder = new flatbuffers.Builder(512);
+    const builder =
+        new flatbuffers_builder.Builder(512) as unknown as flatbuffers.Builder;
     const channels: flatbuffers.Offset[] = [];
     for (const channel of REQUIRED_CHANNELS) {
       const nameFb = builder.createString(channel.name);
       const typeFb = builder.createString(channel.type);
-      aos.Channel.startChannel(builder);
-      aos.Channel.addName(builder, nameFb);
-      aos.Channel.addType(builder, typeFb);
-      const channelFb = aos.Channel.endChannel(builder);
+      Channel.startChannel(builder);
+      Channel.addName(builder, nameFb);
+      Channel.addType(builder, typeFb);
+      const channelFb = Channel.endChannel(builder);
       channels.push(channelFb);
     }
 
-    const channelsFb = aos.message_bridge.Connect.createChannelsToTransferVector(builder, channels);
-    aos.message_bridge.Connect.startConnect(builder);
-    aos.message_bridge.Connect.addChannelsToTransfer(builder, channelsFb);
-    const connect = aos.message_bridge.Connect.endConnect(builder);
+    const channelsFb =
+        Connect.createChannelsToTransferVector(builder, channels);
+    Connect.startConnect(builder);
+    Connect.addChannelsToTransfer(builder, channelsFb);
+    const connect = Connect.endConnect(builder);
     builder.finish(connect);
     this.connection.sendConnectMessage(builder);
   }
@@ -120,8 +131,9 @@
       this.imageSkipCount = 3;
     }
 
-    const fbBuffer = new flatbuffers.ByteBuffer(data);
-    this.image = frc971.vision.CameraImage.getRootAsCameraImage(fbBuffer);
+    const fbBuffer = new ByteBuffer(data);
+    this.image = CameraImage.getRootAsCameraImage(
+        fbBuffer as unknown as flatbuffers.ByteBuffer);
     this.imageTimestamp = this.image.monotonicTimestampNs();
 
     this.width = this.image.cols();
@@ -134,7 +146,8 @@
   }
 
   convertImage(): void {
-    this.imageBuffer = new Uint8ClampedArray(this.width * this.height * 4); // RGBA
+    this.imageBuffer =
+        new Uint8ClampedArray(this.width * this.height * 4);  // RGBA
     // Read four bytes (YUYV) from the data and transform into two pixels of
     // RGBA for canvas
     for (let j = 0; j < this.height; j++) {
@@ -170,9 +183,9 @@
 
   handleImageMetadata(data: Uint8Array): void {
     console.log('got an image match result to process');
-    const fbBuffer = new flatbuffers.ByteBuffer(data);
-    this.result =
-        frc971.vision.sift.ImageMatchResult.getRootAsImageMatchResult(fbBuffer);
+    const fbBuffer = new ByteBuffer(data);
+    this.result = ImageMatchResult.getRootAsImageMatchResult(
+        fbBuffer as unknown as flatbuffers.ByteBuffer);
     this.resultTimestamp = this.result.imageMonotonicTimestampNs();
     this.draw();
   }