Re-format the src/display/ files to enforce the ESLint no-var rule

This was done automatically, using `gulp lint --fix`.

src/display/pattern_helper.js

@@ -15,7 +15,7 @@
 
 import { FormatError, info, Util } from "../shared/util.js";
 
-var ShadingIRs = {};
+const ShadingIRs = {};
 
 function applyBoundingBox(ctx, bbox) {
   if (!bbox || typeof Path2D === "undefined") {
@@ -30,26 +30,26 @@ function applyBoundingBox(ctx, bbox) {
 
 ShadingIRs.RadialAxial = {
   fromIR: function RadialAxial_fromIR(raw) {
-    var type = raw[1];
+    const type = raw[1];
-    var bbox = raw[2];
+    const bbox = raw[2];
-    var colorStops = raw[3];
+    const colorStops = raw[3];
-    var p0 = raw[4];
+    const p0 = raw[4];
-    var p1 = raw[5];
+    const p1 = raw[5];
-    var r0 = raw[6];
+    const r0 = raw[6];
-    var r1 = raw[7];
+    const r1 = raw[7];
     return {
       type: "Pattern",
       getPattern: function RadialAxial_getPattern(ctx) {
         applyBoundingBox(ctx, bbox);
-        var grad;
+        let grad;
         if (type === "axial") {
           grad = ctx.createLinearGradient(p0[0], p0[1], p1[0], p1[1]);
         } else if (type === "radial") {
           grad = ctx.createRadialGradient(p0[0], p0[1], r0, p1[0], p1[1], r1);
         }
 
-        for (var i = 0, ii = colorStops.length; i < ii; ++i) {
+        for (let i = 0, ii = colorStops.length; i < ii; ++i) {
-          var c = colorStops[i];
+          const c = colorStops[i];
           grad.addColorStop(c[0], c[1]);
         }
         return grad;
@@ -58,14 +58,14 @@ ShadingIRs.RadialAxial = {
   },
 };
 
-var createMeshCanvas = (function createMeshCanvasClosure() {
+const createMeshCanvas = (function createMeshCanvasClosure() {
   function drawTriangle(data, context, p1, p2, p3, c1, c2, c3) {
     // Very basic Gouraud-shaded triangle rasterization algorithm.
-    var coords = context.coords,
+    const coords = context.coords,
       colors = context.colors;
-    var bytes = data.data,
+    const bytes = data.data,
       rowSize = data.width * 4;
-    var tmp;
+    let tmp;
     if (coords[p1 + 1] > coords[p2 + 1]) {
       tmp = p1;
       p1 = p2;
@@ -90,30 +90,30 @@ var createMeshCanvas = (function createMeshCanvasClosure() {
       c1 = c2;
       c2 = tmp;
     }
-    var x1 = (coords[p1] + context.offsetX) * context.scaleX;
+    const x1 = (coords[p1] + context.offsetX) * context.scaleX;
-    var y1 = (coords[p1 + 1] + context.offsetY) * context.scaleY;
+    const y1 = (coords[p1 + 1] + context.offsetY) * context.scaleY;
-    var x2 = (coords[p2] + context.offsetX) * context.scaleX;
+    const x2 = (coords[p2] + context.offsetX) * context.scaleX;
-    var y2 = (coords[p2 + 1] + context.offsetY) * context.scaleY;
+    const y2 = (coords[p2 + 1] + context.offsetY) * context.scaleY;
-    var x3 = (coords[p3] + context.offsetX) * context.scaleX;
+    const x3 = (coords[p3] + context.offsetX) * context.scaleX;
-    var y3 = (coords[p3 + 1] + context.offsetY) * context.scaleY;
+    const y3 = (coords[p3 + 1] + context.offsetY) * context.scaleY;
     if (y1 >= y3) {
       return;
     }
-    var c1r = colors[c1],
+    const c1r = colors[c1],
       c1g = colors[c1 + 1],
       c1b = colors[c1 + 2];
-    var c2r = colors[c2],
+    const c2r = colors[c2],
       c2g = colors[c2 + 1],
       c2b = colors[c2 + 2];
-    var c3r = colors[c3],
+    const c3r = colors[c3],
       c3g = colors[c3 + 1],
       c3b = colors[c3 + 2];
 
-    var minY = Math.round(y1),
+    const minY = Math.round(y1),
       maxY = Math.round(y3);
-    var xa, car, cag, cab;
+    let xa, car, cag, cab;
-    var xb, cbr, cbg, cbb;
+    let xb, cbr, cbg, cbb;
-    for (var y = minY; y <= maxY; y++) {
+    for (let y = minY; y <= maxY; y++) {
       if (y < y2) {
         let k;
         if (y < y1) {
@@ -154,10 +154,10 @@ var createMeshCanvas = (function createMeshCanvasClosure() {
       cbr = c1r - (c1r - c3r) * k;
       cbg = c1g - (c1g - c3g) * k;
       cbb = c1b - (c1b - c3b) * k;
-      var x1_ = Math.round(Math.min(xa, xb));
+      const x1_ = Math.round(Math.min(xa, xb));
-      var x2_ = Math.round(Math.max(xa, xb));
+      const x2_ = Math.round(Math.max(xa, xb));
-      var j = rowSize * y + x1_ * 4;
+      let j = rowSize * y + x1_ * 4;
-      for (var x = x1_; x <= x2_; x++) {
+      for (let x = x1_; x <= x2_; x++) {
         k = (xa - x) / (xa - xb);
         if (k < 0) {
           k = 0;
@@ -173,17 +173,17 @@ var createMeshCanvas = (function createMeshCanvasClosure() {
   }
 
   function drawFigure(data, figure, context) {
-    var ps = figure.coords;
+    const ps = figure.coords;
-    var cs = figure.colors;
+    const cs = figure.colors;
-    var i, ii;
+    let i, ii;
     switch (figure.type) {
       case "lattice":
         var verticesPerRow = figure.verticesPerRow;
         var rows = Math.floor(ps.length / verticesPerRow) - 1;
         var cols = verticesPerRow - 1;
         for (i = 0; i < rows; i++) {
-          var q = i * verticesPerRow;
+          let q = i * verticesPerRow;
-          for (var j = 0; j < cols; j++, q++) {
+          for (let j = 0; j < cols; j++, q++) {
             drawTriangle(
               data,
               context,
@@ -239,30 +239,30 @@ var createMeshCanvas = (function createMeshCanvasClosure() {
   ) {
     // we will increase scale on some weird factor to let antialiasing take
     // care of "rough" edges
-    var EXPECTED_SCALE = 1.1;
+    const EXPECTED_SCALE = 1.1;
     // MAX_PATTERN_SIZE is used to avoid OOM situation.
-    var MAX_PATTERN_SIZE = 3000; // 10in @ 300dpi shall be enough
+    const MAX_PATTERN_SIZE = 3000; // 10in @ 300dpi shall be enough
     // We need to keep transparent border around our pattern for fill():
     // createPattern with 'no-repeat' will bleed edges across entire area.
-    var BORDER_SIZE = 2;
+    const BORDER_SIZE = 2;
 
-    var offsetX = Math.floor(bounds[0]);
+    const offsetX = Math.floor(bounds[0]);
-    var offsetY = Math.floor(bounds[1]);
+    const offsetY = Math.floor(bounds[1]);
-    var boundsWidth = Math.ceil(bounds[2]) - offsetX;
+    const boundsWidth = Math.ceil(bounds[2]) - offsetX;
-    var boundsHeight = Math.ceil(bounds[3]) - offsetY;
+    const boundsHeight = Math.ceil(bounds[3]) - offsetY;
 
-    var width = Math.min(
+    const width = Math.min(
       Math.ceil(Math.abs(boundsWidth * combinesScale[0] * EXPECTED_SCALE)),
       MAX_PATTERN_SIZE
     );
-    var height = Math.min(
+    const height = Math.min(
       Math.ceil(Math.abs(boundsHeight * combinesScale[1] * EXPECTED_SCALE)),
       MAX_PATTERN_SIZE
     );
-    var scaleX = boundsWidth / width;
+    const scaleX = boundsWidth / width;
-    var scaleY = boundsHeight / height;
+    const scaleY = boundsHeight / height;
 
-    var context = {
+    const context = {
       coords,
       colors,
       offsetX: -offsetX,
@@ -271,10 +271,10 @@ var createMeshCanvas = (function createMeshCanvasClosure() {
       scaleY: 1 / scaleY,
     };
 
-    var paddedWidth = width + BORDER_SIZE * 2;
+    const paddedWidth = width + BORDER_SIZE * 2;
-    var paddedHeight = height + BORDER_SIZE * 2;
+    const paddedHeight = height + BORDER_SIZE * 2;
 
-    var canvas, tmpCanvas, i, ii;
+    let canvas, tmpCanvas, i, ii;
     if (webGLContext.isEnabled) {
       canvas = webGLContext.drawFigures({
         width,
@@ -299,11 +299,11 @@ var createMeshCanvas = (function createMeshCanvasClosure() {
         paddedHeight,
         false
       );
-      var tmpCtx = tmpCanvas.context;
+      const tmpCtx = tmpCanvas.context;
 
-      var data = tmpCtx.createImageData(width, height);
+      const data = tmpCtx.createImageData(width, height);
       if (backgroundColor) {
-        var bytes = data.data;
+        const bytes = data.data;
         for (i = 0, ii = bytes.length; i < ii; i += 4) {
           bytes[i] = backgroundColor[0];
           bytes[i + 1] = backgroundColor[1];
@@ -332,32 +332,32 @@ var createMeshCanvas = (function createMeshCanvasClosure() {
 ShadingIRs.Mesh = {
   fromIR: function Mesh_fromIR(raw) {
     // var type = raw[1];
-    var coords = raw[2];
+    const coords = raw[2];
-    var colors = raw[3];
+    const colors = raw[3];
-    var figures = raw[4];
+    const figures = raw[4];
-    var bounds = raw[5];
+    const bounds = raw[5];
-    var matrix = raw[6];
+    const matrix = raw[6];
-    var bbox = raw[7];
+    const bbox = raw[7];
-    var background = raw[8];
+    const background = raw[8];
     return {
       type: "Pattern",
       getPattern: function Mesh_getPattern(ctx, owner, shadingFill) {
         applyBoundingBox(ctx, bbox);
-        var scale;
+        let scale;
         if (shadingFill) {
           scale = Util.singularValueDecompose2dScale(ctx.mozCurrentTransform);
         } else {
           // Obtain scale from matrix and current transformation matrix.
           scale = Util.singularValueDecompose2dScale(owner.baseTransform);
           if (matrix) {
-            var matrixScale = Util.singularValueDecompose2dScale(matrix);
+            const matrixScale = Util.singularValueDecompose2dScale(matrix);
             scale = [scale[0] * matrixScale[0], scale[1] * matrixScale[1]];
           }
         }
 
         // Rasterizing on the main thread since sending/queue large canvases
         // might cause OOM.
-        var temporaryPatternCanvas = createMeshCanvas(
+        const temporaryPatternCanvas = createMeshCanvas(
           bounds,
           scale,
           coords,
@@ -399,7 +399,7 @@ ShadingIRs.Dummy = {
 };
 
 function getShadingPatternFromIR(raw) {
-  var shadingIR = ShadingIRs[raw[0]];
+  const shadingIR = ShadingIRs[raw[0]];
   if (!shadingIR) {
     throw new Error(`Unknown IR type: ${raw[0]}`);
   }
@@ -409,13 +409,13 @@ function getShadingPatternFromIR(raw) {
 /**
  * @type {any}
  */
-var TilingPattern = (function TilingPatternClosure() {
+const TilingPattern = (function TilingPatternClosure() {
-  var PaintType = {
+  const PaintType = {
     COLORED: 1,
     UNCOLORED: 2,
   };
 
-  var MAX_PATTERN_SIZE = 3000; // 10in @ 300dpi shall be enough
+  const MAX_PATTERN_SIZE = 3000; // 10in @ 300dpi shall be enough
 
   // eslint-disable-next-line no-shadow
   function TilingPattern(IR, color, ctx, canvasGraphicsFactory, baseTransform) {
@@ -435,14 +435,14 @@ var TilingPattern = (function TilingPatternClosure() {
 
   TilingPattern.prototype = {
     createPatternCanvas: function TilinPattern_createPatternCanvas(owner) {
-      var operatorList = this.operatorList;
+      const operatorList = this.operatorList;
-      var bbox = this.bbox;
+      const bbox = this.bbox;
-      var xstep = this.xstep;
+      const xstep = this.xstep;
-      var ystep = this.ystep;
+      const ystep = this.ystep;
-      var paintType = this.paintType;
+      const paintType = this.paintType;
-      var tilingType = this.tilingType;
+      const tilingType = this.tilingType;
-      var color = this.color;
+      const color = this.color;
-      var canvasGraphicsFactory = this.canvasGraphicsFactory;
+      const canvasGraphicsFactory = this.canvasGraphicsFactory;
 
       info("TilingType: " + tilingType);
 
@@ -466,17 +466,17 @@ var TilingPattern = (function TilingPatternClosure() {
       //   TODO: Fix the implementation, to allow this scenario to be painted
       //   correctly.
 
-      var x0 = bbox[0],
+      const x0 = bbox[0],
         y0 = bbox[1],
         x1 = bbox[2],
         y1 = bbox[3];
 
       // Obtain scale from matrix and current transformation matrix.
-      var matrixScale = Util.singularValueDecompose2dScale(this.matrix);
+      const matrixScale = Util.singularValueDecompose2dScale(this.matrix);
-      var curMatrixScale = Util.singularValueDecompose2dScale(
+      const curMatrixScale = Util.singularValueDecompose2dScale(
         this.baseTransform
       );
-      var combinedScale = [
+      const combinedScale = [
         matrixScale[0] * curMatrixScale[0],
         matrixScale[1] * curMatrixScale[1],
       ];
@@ -484,25 +484,25 @@ var TilingPattern = (function TilingPatternClosure() {
       // Use width and height values that are as close as possible to the end
       // result when the pattern is used. Too low value makes the pattern look
       // blurry. Too large value makes it look too crispy.
-      var dimx = this.getSizeAndScale(
+      const dimx = this.getSizeAndScale(
         xstep,
         this.ctx.canvas.width,
         combinedScale[0]
       );
-      var dimy = this.getSizeAndScale(
+      const dimy = this.getSizeAndScale(
         ystep,
         this.ctx.canvas.height,
         combinedScale[1]
       );
 
-      var tmpCanvas = owner.cachedCanvases.getCanvas(
+      const tmpCanvas = owner.cachedCanvases.getCanvas(
         "pattern",
         dimx.size,
         dimy.size,
         true
       );
-      var tmpCtx = tmpCanvas.context;
+      const tmpCtx = tmpCanvas.context;
-      var graphics = canvasGraphicsFactory.createCanvasGraphics(tmpCtx);
+      const graphics = canvasGraphicsFactory.createCanvasGraphics(tmpCtx);
       graphics.groupLevel = owner.groupLevel;
 
       this.setFillAndStrokeStyleToContext(graphics, paintType, color);
@@ -535,8 +535,8 @@ var TilingPattern = (function TilingPatternClosure() {
       // Use the destination canvas's size if it is bigger than the hard-coded
       // limit of MAX_PATTERN_SIZE to avoid clipping patterns that cover the
       // whole canvas.
-      var maxSize = Math.max(MAX_PATTERN_SIZE, realOutputSize);
+      const maxSize = Math.max(MAX_PATTERN_SIZE, realOutputSize);
-      var size = Math.ceil(step * scale);
+      let size = Math.ceil(step * scale);
       if (size >= maxSize) {
         size = maxSize;
       } else {
@@ -547,8 +547,8 @@ var TilingPattern = (function TilingPatternClosure() {
 
     clipBbox: function clipBbox(graphics, bbox, x0, y0, x1, y1) {
       if (Array.isArray(bbox) && bbox.length === 4) {
-        var bboxWidth = x1 - x0;
+        const bboxWidth = x1 - x0;
-        var bboxHeight = y1 - y0;
+        const bboxHeight = y1 - y0;
         graphics.ctx.rect(x0, y0, bboxWidth, bboxHeight);
         graphics.clip();
         graphics.endPath();
@@ -589,7 +589,7 @@ var TilingPattern = (function TilingPatternClosure() {
       ctx.setTransform.apply(ctx, this.baseTransform);
       ctx.transform.apply(ctx, this.matrix);
 
-      var temporaryPatternCanvas = this.createPatternCanvas(owner);
+      const temporaryPatternCanvas = this.createPatternCanvas(owner);
 
       return ctx.createPattern(temporaryPatternCanvas, "repeat");
     },

src/display/text_layer.js

@@ -52,10 +52,10 @@ import {
 /**
  * @type {(renderParameters: TextLayerRenderParameters) => TextLayerRenderTask}
  */
-var renderTextLayer = (function renderTextLayerClosure() {
+const renderTextLayer = (function renderTextLayerClosure() {
-  var MAX_TEXT_DIVS_TO_RENDER = 100000;
+  const MAX_TEXT_DIVS_TO_RENDER = 100000;
 
-  var NonWhitespaceRegexp = /\S/;
+  const NonWhitespaceRegexp = /\S/;
 
   function isAllWhitespace(str) {
     return !NonWhitespaceRegexp.test(str);
@@ -63,8 +63,8 @@ var renderTextLayer = (function renderTextLayerClosure() {
 
   function appendText(task, geom, styles) {
     // Initialize all used properties to keep the caches monomorphic.
-    var textDiv = document.createElement("span");
+    const textDiv = document.createElement("span");
-    var textDivProperties = {
+    const textDivProperties = {
       angle: 0,
       canvasWidth: 0,
       isWhitespace: false,
@@ -83,14 +83,14 @@ var renderTextLayer = (function renderTextLayerClosure() {
       return;
     }
 
-    var tx = Util.transform(task._viewport.transform, geom.transform);
+    const tx = Util.transform(task._viewport.transform, geom.transform);
-    var angle = Math.atan2(tx[1], tx[0]);
+    let angle = Math.atan2(tx[1], tx[0]);
-    var style = styles[geom.fontName];
+    const style = styles[geom.fontName];
     if (style.vertical) {
       angle += Math.PI / 2;
     }
-    var fontHeight = Math.sqrt(tx[2] * tx[2] + tx[3] * tx[3]);
+    const fontHeight = Math.sqrt(tx[2] * tx[2] + tx[3] * tx[3]);
-    var fontAscent = fontHeight;
+    let fontAscent = fontHeight;
     if (style.ascent) {
       fontAscent = style.ascent * fontAscent;
     } else if (style.descent) {
@@ -152,17 +152,17 @@ var renderTextLayer = (function renderTextLayerClosure() {
     }
 
     if (task._enhanceTextSelection) {
-      var angleCos = 1,
+      let angleCos = 1,
         angleSin = 0;
       if (angle !== 0) {
         angleCos = Math.cos(angle);
         angleSin = Math.sin(angle);
       }
-      var divWidth =
+      const divWidth =
         (style.vertical ? geom.height : geom.width) * task._viewport.scale;
-      var divHeight = fontHeight;
+      const divHeight = fontHeight;
 
-      var m, b;
+      let m, b;
       if (angle !== 0) {
         m = [angleCos, angleSin, -angleSin, angleCos, left, top];
         b = Util.getAxialAlignedBoundingBox([0, 0, divWidth, divHeight], m);
@@ -186,9 +186,9 @@ var renderTextLayer = (function renderTextLayerClosure() {
     if (task._canceled) {
       return;
     }
-    var textDivs = task._textDivs;
+    const textDivs = task._textDivs;
-    var capability = task._capability;
+    const capability = task._capability;
-    var textDivsLength = textDivs.length;
+    const textDivsLength = textDivs.length;
 
     // No point in rendering many divs as it would make the browser
     // unusable even after the divs are rendered.
@@ -199,7 +199,7 @@ var renderTextLayer = (function renderTextLayerClosure() {
     }
 
     if (!task._textContentStream) {
-      for (var i = 0; i < textDivsLength; i++) {
+      for (let i = 0; i < textDivsLength; i++) {
         task._layoutText(textDivs[i]);
       }
     }
@@ -220,13 +220,13 @@ var renderTextLayer = (function renderTextLayerClosure() {
   }
 
   function expand(task) {
-    var bounds = task._bounds;
+    const bounds = task._bounds;
-    var viewport = task._viewport;
+    const viewport = task._viewport;
 
-    var expanded = expandBounds(viewport.width, viewport.height, bounds);
+    const expanded = expandBounds(viewport.width, viewport.height, bounds);
-    for (var i = 0; i < expanded.length; i++) {
+    for (let i = 0; i < expanded.length; i++) {
-      var div = bounds[i].div;
+      const div = bounds[i].div;
-      var divProperties = task._textDivProperties.get(div);
+      const divProperties = task._textDivProperties.get(div);
       if (divProperties.angle === 0) {
         divProperties.paddingLeft = bounds[i].left - expanded[i].left;
         divProperties.paddingTop = bounds[i].top - expanded[i].top;
@@ -243,10 +243,10 @@ var renderTextLayer = (function renderTextLayerClosure() {
         c = m[0],
         s = m[1];
       // Finding intersections with expanded box.
-      var points = [[0, 0], [0, b.size[1]], [b.size[0], 0], b.size];
+      const points = [[0, 0], [0, b.size[1]], [b.size[0], 0], b.size];
       var ts = new Float64Array(64);
       points.forEach(function (p, j) {
-        var t = Util.applyTransform(p, m);
+        const t = Util.applyTransform(p, m);
         ts[j + 0] = c && (e.left - t[0]) / c;
         ts[j + 4] = s && (e.top - t[1]) / s;
         ts[j + 8] = c && (e.right - t[0]) / c;
@@ -269,7 +269,7 @@ var renderTextLayer = (function renderTextLayerClosure() {
       });
       // Not based on math, but to simplify calculations, using cos and sin
       // absolute values to not exceed the box (it can but insignificantly).
-      var boxScale = 1 + Math.min(Math.abs(c), Math.abs(s));
+      const boxScale = 1 + Math.min(Math.abs(c), Math.abs(s));
       divProperties.paddingLeft = findPositiveMin(ts, 32, 16) / boxScale;
       divProperties.paddingTop = findPositiveMin(ts, 48, 16) / boxScale;
       divProperties.paddingRight = findPositiveMin(ts, 0, 16) / boxScale;
@@ -279,7 +279,7 @@ var renderTextLayer = (function renderTextLayerClosure() {
   }
 
   function expandBounds(width, height, boxes) {
-    var bounds = boxes.map(function (box, i) {
+    const bounds = boxes.map(function (box, i) {
       return {
         x1: box.left,
         y1: box.top,
@@ -291,9 +291,9 @@ var renderTextLayer = (function renderTextLayerClosure() {
       };
     });
     expandBoundsLTR(width, bounds);
-    var expanded = new Array(boxes.length);
+    const expanded = new Array(boxes.length);
     bounds.forEach(function (b) {
-      var i = b.index;
+      const i = b.index;
       expanded[i] = {
         left: b.x1New,
         top: 0,
@@ -305,7 +305,7 @@ var renderTextLayer = (function renderTextLayerClosure() {
     // Rotating on 90 degrees and extending extended boxes. Reusing the bounds
     // array and objects.
     boxes.map(function (box, i) {
-      var e = expanded[i],
+      const e = expanded[i],
         b = bounds[i];
       b.x1 = box.top;
       b.y1 = width - e.right;
@@ -318,7 +318,7 @@ var renderTextLayer = (function renderTextLayerClosure() {
     expandBoundsLTR(height, bounds);
 
     bounds.forEach(function (b) {
-      var i = b.index;
+      const i = b.index;
       expanded[i].top = b.x1New;
       expanded[i].bottom = b.x2New;
     });
@@ -332,7 +332,7 @@ var renderTextLayer = (function renderTextLayerClosure() {
     });
 
     // First we see on the horizon is a fake boundary.
-    var fakeBoundary = {
+    const fakeBoundary = {
       x1: -Infinity,
       y1: -Infinity,
       x2: 0,
@@ -341,7 +341,7 @@ var renderTextLayer = (function renderTextLayerClosure() {
       x1New: 0,
       x2New: 0,
     };
-    var horizon = [
+    const horizon = [
       {
         start: -Infinity,
         end: Infinity,
@@ -352,17 +352,17 @@ var renderTextLayer = (function renderTextLayerClosure() {
     bounds.forEach(function (boundary) {
       // Searching for the affected part of horizon.
       // TODO red-black tree or simple binary search
-      var i = 0;
+      let i = 0;
       while (i < horizon.length && horizon[i].end <= boundary.y1) {
         i++;
       }
-      var j = horizon.length - 1;
+      let j = horizon.length - 1;
       while (j >= 0 && horizon[j].start >= boundary.y2) {
         j--;
       }
 
-      var horizonPart, affectedBoundary;
+      let horizonPart, affectedBoundary;
-      var q,
+      let q,
         k,
         maxXNew = -Infinity;
       for (q = i; q <= j; q++) {
@@ -415,13 +415,13 @@ var renderTextLayer = (function renderTextLayerClosure() {
       }
 
       // Fixing the horizon.
-      var changedHorizon = [],
+      let changedHorizon = [],
         lastBoundary = null;
       for (q = i; q <= j; q++) {
         horizonPart = horizon[q];
         affectedBoundary = horizonPart.boundary;
         // Checking which boundary will be visible.
-        var useBoundary =
+        const useBoundary =
           affectedBoundary.x2 > boundary.x2 ? affectedBoundary : boundary;
         if (lastBoundary === useBoundary) {
           // Merging with previous.
@@ -461,7 +461,7 @@ var renderTextLayer = (function renderTextLayerClosure() {
         if (affectedBoundary.x2New !== undefined) {
           continue;
         }
-        var used = false;
+        let used = false;
         for (
           k = i - 1;
           !used && k >= 0 && horizon[k].start >= affectedBoundary.y1;
@@ -492,7 +492,7 @@ var renderTextLayer = (function renderTextLayerClosure() {
 
     // Set new x2 for all unset boundaries.
     horizon.forEach(function (horizonPart) {
-      var affectedBoundary = horizonPart.boundary;
+      const affectedBoundary = horizonPart.boundary;
       if (affectedBoundary.x2New === undefined) {
         affectedBoundary.x2New = Math.max(width, affectedBoundary.x2);
       }
@@ -689,7 +689,7 @@ var renderTextLayer = (function renderTextLayerClosure() {
       const transformBuf = [],
         paddingBuf = [];
 
-      for (var i = 0, ii = this._textDivs.length; i < ii; i++) {
+      for (let i = 0, ii = this._textDivs.length; i < ii; i++) {
         const div = this._textDivs[i];
         const divProps = this._textDivProperties.get(div);
 
@@ -742,7 +742,7 @@ var renderTextLayer = (function renderTextLayerClosure() {
 
   // eslint-disable-next-line no-shadow
   function renderTextLayer(renderParameters) {
-    var task = new TextLayerRenderTask({
+    const task = new TextLayerRenderTask({
       textContent: renderParameters.textContent,
       textContentStream: renderParameters.textContentStream,
       container: renderParameters.container,

src/display/webgl.js

@@ -50,12 +50,12 @@ class WebGLContext {
 
 var WebGLUtils = (function WebGLUtilsClosure() {
   function loadShader(gl, code, shaderType) {
-    var shader = gl.createShader(shaderType);
+    const shader = gl.createShader(shaderType);
     gl.shaderSource(shader, code);
     gl.compileShader(shader);
-    var compiled = gl.getShaderParameter(shader, gl.COMPILE_STATUS);
+    const compiled = gl.getShaderParameter(shader, gl.COMPILE_STATUS);
     if (!compiled) {
-      var errorMsg = gl.getShaderInfoLog(shader);
+      const errorMsg = gl.getShaderInfoLog(shader);
       throw new Error("Error during shader compilation: " + errorMsg);
     }
     return shader;
@@ -67,21 +67,21 @@ var WebGLUtils = (function WebGLUtilsClosure() {
     return loadShader(gl, code, gl.FRAGMENT_SHADER);
   }
   function createProgram(gl, shaders) {
-    var program = gl.createProgram();
+    const program = gl.createProgram();
-    for (var i = 0, ii = shaders.length; i < ii; ++i) {
+    for (let i = 0, ii = shaders.length; i < ii; ++i) {
       gl.attachShader(program, shaders[i]);
     }
     gl.linkProgram(program);
-    var linked = gl.getProgramParameter(program, gl.LINK_STATUS);
+    const linked = gl.getProgramParameter(program, gl.LINK_STATUS);
     if (!linked) {
-      var errorMsg = gl.getProgramInfoLog(program);
+      const errorMsg = gl.getProgramInfoLog(program);
       throw new Error("Error during program linking: " + errorMsg);
     }
     return program;
   }
   function createTexture(gl, image, textureId) {
     gl.activeTexture(textureId);
-    var texture = gl.createTexture();
+    const texture = gl.createTexture();
     gl.bindTexture(gl.TEXTURE_2D, texture);
 
     // Set the parameters so we can render any size image.
@@ -95,7 +95,7 @@ var WebGLUtils = (function WebGLUtilsClosure() {
     return texture;
   }
 
-  var currentGL, currentCanvas;
+  let currentGL, currentCanvas;
   function generateGL() {
     if (currentGL) {
       return;
@@ -108,7 +108,7 @@ var WebGLUtils = (function WebGLUtilsClosure() {
     });
   }
 
-  var smaskVertexShaderCode =
+  const smaskVertexShaderCode =
     "\
   attribute vec2 a_position;                                    \
   attribute vec2 a_texCoord;                                    \
@@ -124,7 +124,7 @@ var WebGLUtils = (function WebGLUtilsClosure() {
     v_texCoord = a_texCoord;                                    \
   }                                                             ";
 
-  var smaskFragmentShaderCode =
+  const smaskFragmentShaderCode =
     "\
   precision mediump float;                                      \
                                                                 \
@@ -154,10 +154,10 @@ var WebGLUtils = (function WebGLUtilsClosure() {
     gl_FragColor = imageColor;                                  \
   }                                                             ";
 
-  var smaskCache = null;
+  let smaskCache = null;
 
   function initSmaskGL() {
-    var canvas, gl;
+    let canvas, gl;
 
     generateGL();
     canvas = currentCanvas;
@@ -166,12 +166,12 @@ var WebGLUtils = (function WebGLUtilsClosure() {
     currentGL = null;
 
     // setup a GLSL program
-    var vertexShader = createVertexShader(gl, smaskVertexShaderCode);
+    const vertexShader = createVertexShader(gl, smaskVertexShaderCode);
-    var fragmentShader = createFragmentShader(gl, smaskFragmentShaderCode);
+    const fragmentShader = createFragmentShader(gl, smaskFragmentShaderCode);
-    var program = createProgram(gl, [vertexShader, fragmentShader]);
+    const program = createProgram(gl, [vertexShader, fragmentShader]);
     gl.useProgram(program);
 
-    var cache = {};
+    const cache = {};
     cache.gl = gl;
     cache.canvas = canvas;
     cache.resolutionLocation = gl.getUniformLocation(program, "u_resolution");
@@ -179,12 +179,12 @@ var WebGLUtils = (function WebGLUtilsClosure() {
     cache.backdropLocation = gl.getUniformLocation(program, "u_backdrop");
     cache.subtypeLocation = gl.getUniformLocation(program, "u_subtype");
 
-    var texCoordLocation = gl.getAttribLocation(program, "a_texCoord");
+    const texCoordLocation = gl.getAttribLocation(program, "a_texCoord");
-    var texLayerLocation = gl.getUniformLocation(program, "u_image");
+    const texLayerLocation = gl.getUniformLocation(program, "u_image");
-    var texMaskLocation = gl.getUniformLocation(program, "u_mask");
+    const texMaskLocation = gl.getUniformLocation(program, "u_mask");
 
     // provide texture coordinates for the rectangle.
-    var texCoordBuffer = gl.createBuffer();
+    const texCoordBuffer = gl.createBuffer();
     gl.bindBuffer(gl.ARRAY_BUFFER, texCoordBuffer);
     // prettier-ignore
     gl.bufferData(gl.ARRAY_BUFFER, new Float32Array([
@@ -204,13 +204,13 @@ var WebGLUtils = (function WebGLUtilsClosure() {
   }
 
   function composeSMask(layer, mask, properties) {
-    var width = layer.width,
+    const width = layer.width,
       height = layer.height;
 
     if (!smaskCache) {
       initSmaskGL();
     }
-    var cache = smaskCache,
+    const cache = smaskCache,
       canvas = cache.canvas,
       gl = cache.gl;
     canvas.width = width;
@@ -235,12 +235,12 @@ var WebGLUtils = (function WebGLUtilsClosure() {
     );
 
     // Create a textures
-    var texture = createTexture(gl, layer, gl.TEXTURE0);
+    const texture = createTexture(gl, layer, gl.TEXTURE0);
-    var maskTexture = createTexture(gl, mask, gl.TEXTURE1);
+    const maskTexture = createTexture(gl, mask, gl.TEXTURE1);
 
     // Create a buffer and put a single clipspace rectangle in
     // it (2 triangles)
-    var buffer = gl.createBuffer();
+    const buffer = gl.createBuffer();
     gl.bindBuffer(gl.ARRAY_BUFFER, buffer);
     // prettier-ignore
     gl.bufferData(gl.ARRAY_BUFFER, new Float32Array([
@@ -270,7 +270,7 @@ var WebGLUtils = (function WebGLUtilsClosure() {
     return canvas;
   }
 
-  var figuresVertexShaderCode =
+  const figuresVertexShaderCode =
     "\
   attribute vec2 a_position;                                    \
   attribute vec3 a_color;                                       \
@@ -289,7 +289,7 @@ var WebGLUtils = (function WebGLUtilsClosure() {
     v_color = vec4(a_color / 255.0, 1.0);                       \
   }                                                             ";
 
-  var figuresFragmentShaderCode =
+  const figuresFragmentShaderCode =
     "\
   precision mediump float;                                      \
                                                                 \
@@ -299,10 +299,10 @@ var WebGLUtils = (function WebGLUtilsClosure() {
     gl_FragColor = v_color;                                     \
   }                                                             ";
 
-  var figuresCache = null;
+  let figuresCache = null;
 
   function initFiguresGL() {
-    var canvas, gl;
+    let canvas, gl;
 
     generateGL();
     canvas = currentCanvas;
@@ -311,12 +311,12 @@ var WebGLUtils = (function WebGLUtilsClosure() {
     currentGL = null;
 
     // setup a GLSL program
-    var vertexShader = createVertexShader(gl, figuresVertexShaderCode);
+    const vertexShader = createVertexShader(gl, figuresVertexShaderCode);
-    var fragmentShader = createFragmentShader(gl, figuresFragmentShaderCode);
+    const fragmentShader = createFragmentShader(gl, figuresFragmentShaderCode);
-    var program = createProgram(gl, [vertexShader, fragmentShader]);
+    const program = createProgram(gl, [vertexShader, fragmentShader]);
     gl.useProgram(program);
 
-    var cache = {};
+    const cache = {};
     cache.gl = gl;
     cache.canvas = canvas;
     cache.resolutionLocation = gl.getUniformLocation(program, "u_resolution");
@@ -332,7 +332,7 @@ var WebGLUtils = (function WebGLUtilsClosure() {
     if (!figuresCache) {
       initFiguresGL();
     }
-    var cache = figuresCache,
+    const cache = figuresCache,
       canvas = cache.canvas,
       gl = cache.gl;
 
@@ -342,8 +342,8 @@ var WebGLUtils = (function WebGLUtilsClosure() {
     gl.uniform2f(cache.resolutionLocation, width, height);
 
     // count triangle points
-    var count = 0;
+    let count = 0;
-    var i, ii, rows;
+    let i, ii, rows;
     for (i = 0, ii = figures.length; i < ii; i++) {
       switch (figures[i].type) {
         case "lattice":
@@ -356,23 +356,23 @@ var WebGLUtils = (function WebGLUtilsClosure() {
       }
     }
     // transfer data
-    var coords = new Float32Array(count * 2);
+    const coords = new Float32Array(count * 2);
-    var colors = new Uint8Array(count * 3);
+    const colors = new Uint8Array(count * 3);
-    var coordsMap = context.coords,
+    const coordsMap = context.coords,
       colorsMap = context.colors;
-    var pIndex = 0,
+    let pIndex = 0,
       cIndex = 0;
     for (i = 0, ii = figures.length; i < ii; i++) {
-      var figure = figures[i],
+      const figure = figures[i],
         ps = figure.coords,
         cs = figure.colors;
       switch (figure.type) {
         case "lattice":
           var cols = figure.verticesPerRow;
           rows = (ps.length / cols) | 0;
-          for (var row = 1; row < rows; row++) {
+          for (let row = 1; row < rows; row++) {
-            var offset = row * cols + 1;
+            let offset = row * cols + 1;
-            for (var col = 1; col < cols; col++, offset++) {
+            for (let col = 1; col < cols; col++, offset++) {
               coords[pIndex] = coordsMap[ps[offset - cols - 1]];
               coords[pIndex + 1] = coordsMap[ps[offset - cols - 1] + 1];
               coords[pIndex + 2] = coordsMap[ps[offset - cols]];
@@ -410,7 +410,7 @@ var WebGLUtils = (function WebGLUtilsClosure() {
           }
           break;
         case "triangles":
-          for (var j = 0, jj = ps.length; j < jj; j++) {
+          for (let j = 0, jj = ps.length; j < jj; j++) {
             coords[pIndex] = coordsMap[ps[j]];
             coords[pIndex + 1] = coordsMap[ps[j] + 1];
             colors[cIndex] = colorsMap[cs[j]];
@@ -436,13 +436,13 @@ var WebGLUtils = (function WebGLUtilsClosure() {
     }
     gl.clear(gl.COLOR_BUFFER_BIT);
 
-    var coordsBuffer = gl.createBuffer();
+    const coordsBuffer = gl.createBuffer();
     gl.bindBuffer(gl.ARRAY_BUFFER, coordsBuffer);
     gl.bufferData(gl.ARRAY_BUFFER, coords, gl.STATIC_DRAW);
     gl.enableVertexAttribArray(cache.positionLocation);
     gl.vertexAttribPointer(cache.positionLocation, 2, gl.FLOAT, false, 0, 0);
 
-    var colorsBuffer = gl.createBuffer();
+    const colorsBuffer = gl.createBuffer();
     gl.bindBuffer(gl.ARRAY_BUFFER, colorsBuffer);
     gl.bufferData(gl.ARRAY_BUFFER, colors, gl.STATIC_DRAW);
     gl.enableVertexAttribArray(cache.colorLocation);