From 785a8190a665a408563487e1027131098be6a671 Mon Sep 17 00:00:00 2001
From: meganrogge <merogge@microsoft.com>
Date: Tue, 8 Mar 2022 20:41:49 -0600
Subject: [PATCH] clean up

---
 src/browser/services/DecorationService.ts | 62 ++++++++++++++---------
 1 file changed, 37 insertions(+), 25 deletions(-)

diff --git a/src/browser/services/DecorationService.ts b/src/browser/services/DecorationService.ts
index f21be5df..bb5bd125 100644
--- a/src/browser/services/DecorationService.ts
+++ b/src/browser/services/DecorationService.ts
@@ -10,6 +10,10 @@ import { Disposable } from 'common/Lifecycle';
 import { IBufferService, IInstantiationService } from 'common/services/Services';
 import { IDecorationOptions, IDecoration, IMarker } from 'xterm';
 
+const enum ScrollbarConstants {
+  WIDTH = 7
+}
+
 export class DecorationService extends Disposable implements IDecorationService {
 
   private _container: HTMLElement | undefined;
@@ -22,7 +26,7 @@ export class DecorationService extends Disposable implements IDecorationService
 
   private _scrollbarDecorationCanvas: CanvasRenderingContext2D | null = null;
   private _scrollbarDecorationNode: HTMLCanvasElement | undefined;
-  private _scrollbarDecorations:  { marker: IMarker, color?: string}[] = [];
+  private _scrollbarDecorations:  { marker: IMarker, color: string }[] = [];
 
   constructor(@IInstantiationService private readonly _instantiationService: IInstantiationService, @IBufferService private readonly _bufferService: IBufferService) { super(); }
 
@@ -57,16 +61,6 @@ export class DecorationService extends Disposable implements IDecorationService
     return bufferDecoration;
   }
 
-  private _queueRefresh(): void {
-    if (this._animationFrame !== undefined) {
-      return;
-    }
-    this._animationFrame = window.requestAnimationFrame(() => {
-      this.refresh();
-      this._animationFrame = undefined;
-    });
-  }
-
   public refresh(shouldRecreate?: boolean): void {
     this._refreshBufferDecorations(shouldRecreate);
     this._refreshScollbarDecorations();
@@ -83,9 +77,15 @@ export class DecorationService extends Disposable implements IDecorationService
     this._scrollbarDecorationNode?.remove();
   }
 
-  private _registerScrollbarDecoration(marker: IMarker, color?: string): IDecoration | undefined {
-    this._scrollbarDecorations.push({ marker, color });
-    return this._addScrollbarDecoration(marker, color);
+
+  private _queueRefresh(): void {
+    if (this._animationFrame !== undefined) {
+      return;
+    }
+    this._animationFrame = window.requestAnimationFrame(() => {
+      this.refresh();
+      this._animationFrame = undefined;
+    });
   }
 
   private _refreshBufferDecorations(shouldRecreate?: boolean): void {
@@ -97,37 +97,49 @@ export class DecorationService extends Disposable implements IDecorationService
     }
   }
 
+  private _registerScrollbarDecoration(marker: IMarker, color: string): IDecoration | undefined {
+    this._scrollbarDecorations.push({ marker, color });
+    return this._addScrollbarDecoration(marker, color);
+  }
+
   private _refreshScollbarDecorations(): void {
     if (!this._scrollbarDecorationCanvas || !this._viewportElement || !this._scrollbarDecorationNode) {
       return;
     }
-    this._scrollbarDecorationNode.style.width = '7px';
+    this._scrollbarDecorationNode.style.width = `${ScrollbarConstants.WIDTH}px`;
     this._scrollbarDecorationNode.style.height = `${this._viewportElement.clientHeight}px`;
-    this._scrollbarDecorationNode.width = Math.floor(7*window.devicePixelRatio);
-    this._scrollbarDecorationNode.height = Math.floor(this._viewportElement.clientHeight*window.devicePixelRatio);
+    this._scrollbarDecorationNode.width = Math.floor(ScrollbarConstants.WIDTH * window.devicePixelRatio);
+    this._scrollbarDecorationNode.height = Math.floor(this._viewportElement.clientHeight * window.devicePixelRatio);
     this._scrollbarDecorationCanvas.clearRect(0, 0, this._scrollbarDecorationCanvas.canvas.width, this._scrollbarDecorationCanvas.canvas.height);
+
     for (const scrollbarDecoration of this._scrollbarDecorations) {
       this._addScrollbarDecoration(scrollbarDecoration.marker, scrollbarDecoration.color);
     }
   }
 
-  private _addScrollbarDecoration(marker: IMarker, color?: string): IDecoration | undefined {
-    if (!this._scrollbarDecorationCanvas || !this._viewportElement?.clientHeight) {
+  private _addScrollbarDecoration(marker: IMarker, color: string): IDecoration | undefined {
+    if (!this._scrollbarDecorationCanvas || !this._scrollbarDecorationNode) {
       return;
     }
     this._scrollbarDecorationCanvas.lineWidth = 1;
-    if (color) {
-      this._scrollbarDecorationCanvas.strokeStyle = color;
-    }
+    this._scrollbarDecorationCanvas.strokeStyle = color;
     this._scrollbarDecorationCanvas.strokeRect(
       0,
-      (marker.line / this._bufferService.buffers.active.lines.length) * Math.floor(this._viewportElement.clientHeight * window.devicePixelRatio),
-      Math.floor(7 * window.devicePixelRatio),
+      this._scrollbarDecorationNode.height * (marker.line / this._bufferService.buffers.active.lines.length),
+      this._scrollbarDecorationNode.width,
       window.devicePixelRatio
     );
     if (this._scrollbarDecorationNode) {
       const scrollbarDecoration = new ScrollbarDecoration({ marker, scrollbarDecorationColor: color }, this._scrollbarDecorationNode);
-      scrollbarDecoration.onDispose(() => this._scrollbarDecorationCanvas?.clearRect(0, 0, this._scrollbarDecorationCanvas.canvas.width, this._scrollbarDecorationCanvas.canvas.height));
+      scrollbarDecoration.onDispose(() => {
+        this._scrollbarDecorationCanvas?.clearRect(
+          0,
+          0,
+          this._scrollbarDecorationCanvas.canvas.width,
+          this._scrollbarDecorationCanvas.canvas.height
+        );
+      });
+      return scrollbarDecoration;
     }
     return undefined;
   }