boundingbox* migrated

src/boundingbox.ts

@@ -3,58 +3,76 @@
 //
 // Copyright Mohit Muthanna 2010
 
+import { RenderContext } from './types/common';
+
 // Bounding boxes for interactive notation
 
 export class BoundingBox {
-  static copy(that) {
+  protected y: number;
+  protected x: number;
+  protected w: number;
+  protected h: number;
+
+  static copy(that: BoundingBox): BoundingBox {
     return new BoundingBox(that.x, that.y, that.w, that.h);
   }
 
-  constructor(x, y, w, h) {
+  constructor(x: number, y: number, w: number, h: number) {
     this.x = x;
     this.y = y;
     this.w = w;
     this.h = h;
   }
-  getX() {
+
+  getX(): number {
     return this.x;
   }
-  getY() {
+
+  getY(): number {
     return this.y;
   }
-  getW() {
+
+  getW(): number {
     return this.w;
   }
-  getH() {
+
+  getH(): number {
     return this.h;
   }
-  setX(x) {
+
+  setX(x: number): this {
     this.x = x;
     return this;
   }
-  setY(y) {
+
+  setY(y: number): this {
     this.y = y;
     return this;
   }
-  setW(w) {
+
+  setW(w: number): this {
     this.w = w;
     return this;
   }
-  setH(h) {
+
+  setH(h: number): this {
     this.h = h;
     return this;
   }
-  move(x, y) {
+
+  move(x: number, y: number): this {
     this.x += x;
     this.y += y;
+    return this;
   }
-  clone() {
+
+  clone(): BoundingBox {
     return BoundingBox.copy(this);
   }
 
   // Merge my box with given box. Creates a bigger bounding box unless
   // the given box is contained in this one.
-  mergeWith(boundingBox, ctx) {
+  mergeWith(boundingBox: BoundingBox, ctx?: RenderContext): this {
     const that = boundingBox;
 
     const new_x = this.x < that.x ? this.x : that.x;
@@ -71,7 +89,7 @@ export class BoundingBox {
     return this;
   }
 
-  draw(ctx, x, y) {
+  draw(ctx: RenderContext, x?: number, y?: number): void {
     if (!x) x = 0;
     if (!y) y = 0;
     ctx.rect(this.x + x, this.y + y, this.w, this.h);

src/boundingboxcomputation.ts

@@ -10,7 +10,12 @@
 // nvg.js#L449
 
 export class BoundingBoxComputation {
-  constructor(x1, y1, x2, y2) {
+  x1: number;
+  y1: number;
+  protected x2: number;
+  protected y2: number;
+
+  constructor(x1?: number, y1?: number, x2?: number, y2?: number) {
     // pass in initial points if you want
     this.x1 = Number.NaN;
     this.y1 = Number.NaN;
@@ -21,20 +26,20 @@ export class BoundingBoxComputation {
     this.addPoint(x2, y2);
   }
 
-  width() {
+  width(): number {
     return this.x2 - this.x1;
   }
 
-  height() {
+  height(): number {
     return this.y2 - this.y1;
   }
 
-  noOp() {
+  noOp(): void {
     // do nothing
   }
 
-  addPoint(x, y) {
-    if (x != null) {
+  addPoint(x: number | undefined, y: number | undefined): void {
+    if (x != undefined) {
       if (isNaN(this.x1) || isNaN(this.x2)) {
         this.x1 = x;
         this.x2 = x;
@@ -43,7 +48,7 @@ export class BoundingBoxComputation {
       if (x > this.x2) this.x2 = x;
     }
 
-    if (y != null) {
+    if (y != undefined) {
       if (isNaN(this.y1) || isNaN(this.y2)) {
         this.y1 = y;
         this.y2 = y;
@@ -53,23 +58,32 @@ export class BoundingBoxComputation {
     }
   }
 
-  addX(x) {
-    this.addPoint(x, null);
+  addX(x: number): void {
+    this.addPoint(x, undefined);
   }
 
-  addY(y) {
-    this.addPoint(null, y);
+  addY(y: number): void {
+    this.addPoint(undefined, y);
   }
 
-  addQuadraticCurve(p0x, p0y, p1x, p1y, p2x, p2y) {
+  addQuadraticCurve(p0x: number, p0y: number, p1x: number, p1y: number, p2x: number, p2y: number): void {
     const cp1x = p0x + (2 / 3) * (p1x - p0x); // CP1 = QP0 + 2/3 *(QP1-QP0)
     const cp1y = p0y + (2 / 3) * (p1y - p0y); // CP1 = QP0 + 2/3 *(QP1-QP0)
     const cp2x = cp1x + (1 / 3) * (p2x - p0x); // CP2 = CP1 + 1/3 *(QP2-QP0)
     const cp2y = cp1y + (1 / 3) * (p2y - p0y); // CP2 = CP1 + 1/3 *(QP2-QP0)
     this.addBezierCurve(p0x, p0y, cp1x, cp1y, cp2x, cp2y, p2x, p2y);
   }
 
-  addBezierCurve(p0x, p0y, p1x, p1y, p2x, p2y, p3x, p3y) {
+  addBezierCurve(
+    p0x: number,
+    p0y: number,
+    p1x: number,
+    p1y: number,
+    p2x: number,
+    p2y: number,
+    p3x: number,
+    p3y: number
+  ): void {
     // from http://blog.hackers-cafe.net/2009/06/how-to-calculate-bezier-curves-bounding.html
     const p0 = [p0x, p0y];
     const p1 = [p1x, p1y];
@@ -80,7 +94,7 @@ export class BoundingBoxComputation {
     this.addPoint(p0[0], p0[1]);
     this.addPoint(p3[0], p3[1]);
 
-    const f = (t, i) =>
+    const f = (t: number, i: number) =>
       Math.pow(1 - t, 3) * p0[i] +
       3 * Math.pow(1 - t, 2) * t * p1[i] +
       3 * (1 - t) * Math.pow(t, 2) * p2[i] +

src/types/common.d.ts

@@ -69,6 +69,8 @@ export interface RenderContext {
   setLineCap(cap_type: string): RenderContext;
   setLineDash(dash: string): RenderContext;
   scale(x: number, y: number): RenderContext;
+  // eslint-disable-next-line
+  rect(x: number, y: number, width: number, height: number, attributes?: any): RenderContext;
   resize(width: number, height: number): RenderContext;
   fillRect(x: number, y: number, width: number, height: number): RenderContext;
   clearRect(x: number, y: number, width: number, height: number): RenderContext;