Method drawScope

packages/2d/src/lib/code/CodeCursor.ts:164–226

* Draw the given code scope. * * @param scope - The code scope to draw.

(scope: CodeScope)

   * @param scope - The code scope to draw.
   */
  public drawScope(scope: CodeScope) {
    const progress = unwrap(scope.progress);
    for (const wrappedFragment of scope.fragments) {
      const possibleFragment = unwrap(wrappedFragment);
      if (isCodeScope(possibleFragment)) {
        this.drawScope(possibleFragment);
        continue;
      }
      if (Array.isArray(possibleFragment)) {
        this.drawScope({
          progress: scope.progress,
          fragments: possibleFragment,
        });
        continue;
      }

      const fragment = parseCodeFragment(
        possibleFragment,
        this.context,
        this.monoWidth,
      );
      const timingOffset = 0.8;
      let alpha = 1;
      let offsetY = 0;
      if (fragment.before.content !== fragment.after.content) {
        const mirrored = Math.abs(progress - 0.5) * 2;
        alpha = clampRemap(1, 1 - timingOffset, 1, 0, mirrored);

        const scale = progress < 0.5 ? 4 : -4;
        offsetY = map(
          Math.abs(fragment.after.newRows - fragment.before.newRows) / scale,
          0,
          mirrored,
        );
      }

      this.drawToken(fragment, scope, this.cursor.addY(offsetY), alpha);

      this.beforeCursor.x = this.calculateWidth(
        fragment.before,
        this.beforeCursor.x,
      );
      this.afterCursor.x = this.calculateWidth(
        fragment.after,
        this.afterCursor.x,
      );
      this.beforeCursor.y += fragment.before.newRows;
      this.afterCursor.y += fragment.after.newRows;

      this.beforeIndex += fragment.before.content.length;
      this.afterIndex += fragment.after.content.length;

      this.cursor.y += map(
        fragment.before.newRows,
        fragment.after.newRows,
        progress,
      );