@testgorilla/tgo-typing-test 2.0.0 → 2.0.1

package/lib/utils/misc.d.ts

@@ -0,0 +1,80 @@
+import { MonkeyTypes } from '../types/types';
+export declare const QuoteNetworkErrorMessage = "Text not loading.";
+export declare function emitQuoteNetworkError(): void;
+export declare const QuoteNetworkError$: import("rxjs").Observable<string>;
+export declare function isColorLight(hex: string): boolean;
+export declare function isColorDark(hex: string): boolean;
+export declare function getLanguage(lang: string): Promise<MonkeyTypes.LanguageObject>;
+export declare function getCurrentLanguage(languageName: string): Promise<MonkeyTypes.LanguageObject>;
+export declare function smooth(arr: number[], windowSize: number, getter?: (value: number) => number): number[];
+export declare function stdDev(array: number[]): number;
+export declare function mean(array: number[]): number;
+export declare function median(arr: number[]): number;
+export declare function getLastChar(word: string): string;
+export declare function capitalizeFirstLetterOfEachWord(str: string): string;
+export declare function isASCIILetter(c: string): boolean;
+export declare function kogasa(cov: number): number;
+export declare function whorf(speed: number, wordlen: number): number;
+export declare function roundTo2(num: number): number;
+export declare function findLineByLeastSquares(values_y: number[]): number[][];
+export declare function getGibberish(): string;
+export declare function secondsToString(sec: number, alwaysShowMinutes?: boolean, alwaysShowHours?: boolean, delimiter?: ':' | 'text', showSeconds?: boolean, showDays?: boolean): string;
+export declare function getNumbers(len: number, start?: number): string;
+export declare function convertNumberToArabicIndic(numString: string): string;
+export declare function getSpecials(): string;
+export declare function getASCII(): string;
+export declare function getArrows(): string;
+export declare function getPositionString(number: number): string;
+export declare function findGetParameter(parameterName: string, getOverride?: string): string | null;
+export declare function objectToQueryString<T extends string | number | boolean>(obj: Record<string, T | T[]>): string;
+declare global {
+    interface Document {
+        mozCancelFullScreen?: () => Promise<void>;
+        msRequestFullscreen?: () => Promise<void>;
+        msExitFullscreen?: () => Promise<void>;
+        webkitExitFullscreen?: () => Promise<void>;
+        mozFullScreenElement?: Element;
+        msFullscreenElement?: Element;
+        webkitFullscreenElement?: Element;
+    }
+    interface HTMLElement {
+        msRequestFullscreen?: () => Promise<void>;
+        mozRequestFullScreen?: () => Promise<void>;
+        webkitRequestFullscreen?: () => Promise<void>;
+    }
+}
+export declare function toggleFullscreen(): void;
+export declare function remove_non_ascii(str: string): string;
+export declare function escapeRegExp(str: string): string;
+export declare function escapeHTML(str: string): string;
+export declare function cleanTypographySymbols(textToClean: string): string;
+export declare function isUsernameValid(name: string): boolean;
+export declare function mapRange(x: number, in_min: number, in_max: number, out_min: number, out_max: number): number;
+export declare function canQuickRestart(mode: string, words: number, time: number, CustomText: MonkeyTypes.CustomText): boolean;
+export declare function clearTimeouts(timeouts: (number | NodeJS.Timeout)[]): void;
+export declare function setCharAt(str: string, index: number, chr: string): string;
+export declare function regexIndexOf(string: string, regex: RegExp, startpos: number): number;
+export declare function convertRGBtoHEX(rgb: string): string | undefined;
+export declare const trailingComposeChars: RegExp;
+export declare function convertRemToPixels(rem: number): number;
+export declare function getMode2(config: MonkeyTypes.Config, randomQuote: MonkeyTypes.Quote): string;
+/**
+ * Gets an integer between min and max, both are inclusive.
+ * @param min
+ * @param max
+ * @returns Random integer betwen min and max.
+ */
+export declare function randomIntFromRange(min: number, max: number): number;
+/**
+ * Shuffle an array of elements using the Fisher–Yates algorithm.
+ * This function mutates the input array.
+ * @param elements
+ */
+export declare function shuffle<T>(elements: T[]): void;
+export declare function randomElementFromArray<T>(array: T[]): T;
+export declare function randomElementFromObject<T extends object>(object: T): T[keyof T];
+export declare function createErrorMessage(error: unknown, message: string): string;
+export declare function getDiscordAvatarUrl(discordId?: string, discordAvatar?: string, discordAvatarSize?: number): Promise<string | null>;
+export declare function getLevel(xp: number): number;
+export declare function getXpForLevel(level: number): number;
+export declare function abbreviateNumber(num: number): string;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@testgorilla/tgo-typing-test",
-  "version": "2.0.0",
+  "version": "2.0.1",
   "peerDependencies": {
     "@angular/common": "~19.2.17",
     "@angular/core": "~19.2.17",
@@ -8,9 +8,22 @@
     "jest-preset-angular": "14.4.2",
     "rxjs": "~7.8.1"
   },
-  "typings": "src/lib/types",
+  "typings": "index.d.ts",
   "sideEffects": false,
   "license": "PROPRIETARY",
   "displayName": "Typing Test",
-  "description": "Typing Test component"
-}
+  "description": "Typing Test component",
+  "module": "fesm2022/testgorilla-tgo-typing-test.mjs",
+  "exports": {
+    "./package.json": {
+      "default": "./package.json"
+    },
+    ".": {
+      "types": "./index.d.ts",
+      "default": "./fesm2022/testgorilla-tgo-typing-test.mjs"
+    }
+  },
+  "dependencies": {
+    "tslib": "^2.3.0"
+  }
+}

package/.eslintrc.json

@@ -1,46 +0,0 @@
-{
-  "extends": ["../../.eslintrc.json"],
-  "ignorePatterns": ["!**/*"],
-  "overrides": [
-    {
-      "files": ["*.ts"],
-      "extends": ["plugin:@nx/angular", "plugin:@angular-eslint/template/process-inline-templates"],
-      "rules": {
-        "@angular-eslint/directive-selector": [
-          "error",
-          {
-            "type": "attribute",
-            "prefix": "tgo",
-            "style": "camelCase"
-          }
-        ],
-        "@angular-eslint/component-selector": [
-          "error",
-          {
-            "type": "element",
-            "prefix": "tgo",
-            "style": "kebab-case"
-          }
-        ],
-        "@angular-eslint/prefer-standalone": "off"
-      }
-    },
-    {
-      "files": ["*.html"],
-      "extends": ["plugin:@nx/angular-template"],
-      "rules": {}
-    },
-    {
-      "files": ["*.json"],
-      "parser": "jsonc-eslint-parser",
-      "rules": {
-        "@nx/dependency-checks": [
-          "error",
-          {
-            "ignoredFiles": ["{projectRoot}/eslint.config.{js,cjs,mjs}"]
-          }
-        ]
-      }
-    }
-  ]
-}

package/jest.config.ts

@@ -1,21 +0,0 @@
-export default {
-  displayName: 'tgo-typing-test',
-  preset: '../../jest.preset.js',
-  setupFilesAfterEnv: ['<rootDir>/src/test-setup.ts'],
-  coverageDirectory: '../../coverage/packages/tgo-typing-test',
-  transform: {
-    '^.+\\.(ts|mjs|js|html)$': [
-      'jest-preset-angular',
-      {
-        tsconfig: '<rootDir>/tsconfig.spec.json',
-        stringifyContentPathRegex: '\\.(html|svg)$',
-      },
-    ],
-  },
-  transformIgnorePatterns: ['node_modules/(?!.*\\.mjs$)'],
-  snapshotSerializers: [
-    'jest-preset-angular/build/serializers/no-ng-attributes',
-    'jest-preset-angular/build/serializers/ng-snapshot',
-    'jest-preset-angular/build/serializers/html-comment',
-  ],
-};

package/ng-package.json

@@ -1,15 +0,0 @@
-{
-  "$schema": "../../node_modules/ng-packagr/ng-package.schema.json",
-  "dest": "../../dist/packages/tgo-typing-test",
-  "assets": [
-    {
-      "glob": "**/*",
-      "input": "./src/assets",
-      "output": "./assets"
-    }
-  ],
-  "lib": {
-    "entryFile": "./src/index.ts"
-  },
-  "allowedNonPeerDependencies": []
-}

package/project.json

@@ -1,36 +0,0 @@
-{
-  "name": "tgo-typing-test",
-  "$schema": "../../node_modules/nx/schemas/project-schema.json",
-  "sourceRoot": "packages/tgo-typing-test/src",
-  "prefix": "tgo",
-  "projectType": "library",
-  "tags": [],
-  "targets": {
-    "build": {
-      "executor": "@nx/angular:package",
-      "outputs": ["{workspaceRoot}/dist/{projectRoot}"],
-      "options": {
-        "project": "packages/tgo-typing-test/ng-package.json"
-      },
-      "configurations": {
-        "production": {
-          "tsConfig": "packages/tgo-typing-test/tsconfig.lib.prod.json"
-        },
-        "development": {
-          "tsConfig": "packages/tgo-typing-test/tsconfig.lib.json"
-        }
-      },
-      "defaultConfiguration": "production"
-    },
-    "test": {
-      "executor": "@nx/jest:jest",
-      "outputs": ["{workspaceRoot}/coverage/{projectRoot}"],
-      "options": {
-        "jestConfig": "packages/tgo-typing-test/jest.config.ts"
-      }
-    },
-    "lint": {
-      "executor": "@nx/eslint:lint"
-    }
-  }
-}

package/src/lib/components/tgo-typing-replay-input/tgo-typing-replay-input.component.html

@@ -1,30 +0,0 @@
-<div id="centerContent">
-  <div id="middle" #middle>
-    <div class="page pageTest active">
-      <div id="result" tabindex="0">
-        <div class="bottom" style="grid-column: 1/3">
-          <div id="resultReplay">
-            <div class="title">
-              Watch replay
-              <span
-                id="playpauseReplayButton"
-                class="textButton"
-                aria-label="Start replay"
-                data-balloon-pos="up"
-                style="display: inline-block"
-                (click)="playpauseReplayButtonClick()"
-                #toggleButton
-              >
-                <div id="key" class="Play" #playpauseelem>{{ playpauseelem.className }}</div>
-              </span>
-              <p id="replayStopwatch" #replayStopwatch>0s</p>
-            </div>
-            <div id="wordsWrapper">
-              <div id="replayWords" class="words"></div>
-            </div>
-          </div>
-        </div>
-      </div>
-    </div>
-  </div>
-</div>

package/src/lib/components/tgo-typing-replay-input/tgo-typing-replay-input.component.spec.ts

@@ -1,250 +0,0 @@
-import { ComponentFixture, TestBed } from '@angular/core/testing';
-import { ElementRef } from '@angular/core';
-import { TgoTypingReplayInputComponent } from './tgo-typing-replay-input.component';
-import * as config from '../../helpers/config';
-import * as replay from '../../helpers/test/replay';
-
-jest.mock('../../helpers/config');
-jest.mock('../../helpers/test/replay');
-
-describe('TgoTypingReplayInputComponent', () => {
-  let component: TgoTypingReplayInputComponent;
-  let fixture: ComponentFixture<TgoTypingReplayInputComponent>;
-
-  const mockReplayExport = JSON.stringify({
-    wordsList: ['word1', 'word2', 'word3'],
-    replayData: [
-      { timestamp: 0, char: 'w' },
-      { timestamp: 100, char: 'o' },
-    ],
-  });
-
-  beforeEach(() => {
-    jest.clearAllMocks();
-
-    TestBed.configureTestingModule({
-      imports: [TgoTypingReplayInputComponent],
-    });
-
-    fixture = TestBed.createComponent(TgoTypingReplayInputComponent);
-    component = fixture.componentInstance;
-  });
-
-  describe('when initialized', () => {
-    it('should create the component', () => {
-      expect(component).toBeDefined();
-    });
-
-    it('should have default funbox value', () => {
-      expect(component.funbox).toBe('none');
-    });
-  });
-
-  describe('#ngOnInit', () => {
-    beforeEach(() => {
-      component.replayExport = mockReplayExport;
-    });
-
-    it('should parse the replayExport JSON string', () => {
-      component.ngOnInit();
-
-      expect(component.replayExportData).toEqual({
-        wordsList: ['word1', 'word2', 'word3'],
-        replayData: [
-          { timestamp: 0, char: 'w' },
-          { timestamp: 100, char: 'o' },
-        ],
-      });
-    });
-
-    it('should call setFunbox with the funbox input value', () => {
-      component.funbox = 'custom-funbox';
-
-      component.ngOnInit();
-
-      expect(config.setFunbox).toHaveBeenCalledWith('custom-funbox');
-      expect(config.setFunbox).toHaveBeenCalledTimes(1);
-    });
-
-    it('should call replayGetWordsList with parsed wordsList', () => {
-      component.ngOnInit();
-
-      expect(replay.replayGetWordsList).toHaveBeenCalledWith(['word1', 'word2', 'word3']);
-      expect(replay.replayGetWordsList).toHaveBeenCalledTimes(1);
-    });
-
-    it('should call setReplayData with parsed replayData', () => {
-      component.ngOnInit();
-
-      expect(replay.setReplayData).toHaveBeenCalledWith([
-        { timestamp: 0, char: 'w' },
-        { timestamp: 100, char: 'o' },
-      ]);
-      expect(replay.setReplayData).toHaveBeenCalledTimes(1);
-    });
-
-    describe('when replayExport contains different data', () => {
-      it('should handle empty wordsList and replayData', () => {
-        component.replayExport = JSON.stringify({
-          wordsList: [],
-          replayData: [],
-        });
-
-        component.ngOnInit();
-
-        expect(replay.replayGetWordsList).toHaveBeenCalledWith([]);
-        expect(replay.setReplayData).toHaveBeenCalledWith([]);
-      });
-
-      it('should handle large wordsList', () => {
-        const largeWordsList = Array.from({ length: 100 }, (_, i) => `word${i}`);
-        component.replayExport = JSON.stringify({
-          wordsList: largeWordsList,
-          replayData: [],
-        });
-
-        component.ngOnInit();
-
-        expect(replay.replayGetWordsList).toHaveBeenCalledWith(largeWordsList);
-      });
-    });
-  });
-
-  describe('#ngAfterViewInit', () => {
-    let mockToggleButtonElement: HTMLElement;
-    let mockReplayStopwatchElement: HTMLElement;
-
-    beforeEach(() => {
-      component.replayExport = mockReplayExport;
-      component.ngOnInit();
-
-      // Create mock elements
-      mockToggleButtonElement = document.createElement('button');
-      mockReplayStopwatchElement = document.createElement('div');
-
-      // Mock ViewChild ElementRef
-      component.toggleButton = {
-        nativeElement: mockToggleButtonElement,
-      } as ElementRef;
-      component.replayStopwatch = {
-        nativeElement: mockReplayStopwatchElement,
-      } as ElementRef;
-    });
-
-    it('should call setToggleButton with toggleButton native element', () => {
-      component.ngAfterViewInit();
-
-      expect(replay.setToggleButton).toHaveBeenCalledWith(mockToggleButtonElement);
-      expect(replay.setToggleButton).toHaveBeenCalledTimes(1);
-    });
-
-    it('should call setReplayStopwatch with replayStopwatch native element', () => {
-      component.ngAfterViewInit();
-
-      expect(replay.setReplayStopwatch).toHaveBeenCalledWith(mockReplayStopwatchElement);
-      expect(replay.setReplayStopwatch).toHaveBeenCalledTimes(1);
-    });
-
-    it('should call initializeReplayPrompt', () => {
-      component.ngAfterViewInit();
-
-      expect(replay.initializeReplayPrompt).toHaveBeenCalledTimes(1);
-    });
-
-    it('should call loadOldReplay', () => {
-      component.ngAfterViewInit();
-
-      expect(replay.loadOldReplay).toHaveBeenCalledTimes(1);
-    });
-
-    it('should call playReplay', () => {
-      component.ngAfterViewInit();
-
-      expect(replay.playReplay).toHaveBeenCalledTimes(1);
-    });
-
-    it('should call replay initialization functions in correct order', () => {
-      const callOrder: string[] = [];
-
-      jest.mocked(replay.setToggleButton).mockImplementation(() => {
-        callOrder.push('setToggleButton');
-      });
-      jest.mocked(replay.setReplayStopwatch).mockImplementation(() => {
-        callOrder.push('setReplayStopwatch');
-      });
-      jest.mocked(replay.initializeReplayPrompt).mockImplementation(() => {
-        callOrder.push('initializeReplayPrompt');
-      });
-      jest.mocked(replay.loadOldReplay).mockImplementation(() => {
-        callOrder.push('loadOldReplay');
-        return 0;
-      });
-      jest.mocked(replay.playReplay).mockImplementation(() => {
-        callOrder.push('playReplay');
-      });
-
-      component.ngAfterViewInit();
-
-      expect(callOrder).toEqual([
-        'setToggleButton',
-        'setReplayStopwatch',
-        'initializeReplayPrompt',
-        'loadOldReplay',
-        'playReplay',
-      ]);
-    });
-  });
-
-  describe('#playpauseReplayButtonClick', () => {
-    it('should call the imported playpauseReplayButtonClick function', () => {
-      component.playpauseReplayButtonClick();
-
-      expect(replay.playpauseReplayButtonClick).toHaveBeenCalledTimes(1);
-    });
-
-    it('should call playpauseReplayButtonClick on multiple invocations', () => {
-      component.playpauseReplayButtonClick();
-      component.playpauseReplayButtonClick();
-      component.playpauseReplayButtonClick();
-
-      expect(replay.playpauseReplayButtonClick).toHaveBeenCalledTimes(3);
-    });
-  });
-
-  describe('when component lifecycle is complete', () => {
-    let mockToggleButtonElement: HTMLElement;
-    let mockReplayStopwatchElement: HTMLElement;
-
-    beforeEach(() => {
-      component.replayExport = mockReplayExport;
-      component.funbox = 'test-funbox';
-
-      mockToggleButtonElement = document.createElement('button');
-      mockReplayStopwatchElement = document.createElement('div');
-
-      component.toggleButton = {
-        nativeElement: mockToggleButtonElement,
-      } as ElementRef;
-      component.replayStopwatch = {
-        nativeElement: mockReplayStopwatchElement,
-      } as ElementRef;
-    });
-
-    it('should initialize and setup replay completely', () => {
-      // Simulate full lifecycle
-      component.ngOnInit();
-      component.ngAfterViewInit();
-
-      // Verify all initialization steps were called
-      expect(config.setFunbox).toHaveBeenCalledWith('test-funbox');
-      expect(replay.replayGetWordsList).toHaveBeenCalled();
-      expect(replay.setReplayData).toHaveBeenCalled();
-      expect(replay.setToggleButton).toHaveBeenCalledWith(mockToggleButtonElement);
-      expect(replay.setReplayStopwatch).toHaveBeenCalledWith(mockReplayStopwatchElement);
-      expect(replay.initializeReplayPrompt).toHaveBeenCalled();
-      expect(replay.loadOldReplay).toHaveBeenCalled();
-      expect(replay.playReplay).toHaveBeenCalled();
-    });
-  });
-});
-

package/src/lib/components/tgo-typing-replay-input/tgo-typing-replay-input.component.ts

@@ -1,47 +0,0 @@
-import { AfterViewInit, Component, ElementRef, Input, OnInit, ViewChild } from '@angular/core';
-import { setFunbox } from '../../helpers/config';
-import {
-  initializeReplayPrompt,
-  loadOldReplay,
-  playpauseReplayButtonClick,
-  playReplay,
-  replayGetWordsList,
-  setReplayData,
-  setReplayStopwatch,
-  setToggleButton,
-} from '../../helpers/test/replay';
-import { CommonModule } from '@angular/common';
-
-@Component({
-    selector: 'tgo-typing-replay-input',
-    imports: [CommonModule],
-    templateUrl: './tgo-typing-replay-input.component.html',
-    styleUrls: ['../../styles/index.scss']
-})
-export class TgoTypingReplayInputComponent implements OnInit, AfterViewInit {
-  @Input() replayExport: any;
-  @Input() funbox = 'none';
-  replayExportData: any;
-
-  @ViewChild('toggleButton') toggleButton!: ElementRef;
-  @ViewChild('replayStopwatch') replayStopwatch!: ElementRef;
-
-  ngOnInit(): void {
-    this.replayExportData = JSON.parse(this.replayExport);
-    setFunbox(this.funbox);
-    replayGetWordsList(this.replayExportData['wordsList']);
-    setReplayData(this.replayExportData['replayData']);
-  }
-
-  ngAfterViewInit() {
-    setToggleButton(this.toggleButton.nativeElement);
-    setReplayStopwatch(this.replayStopwatch.nativeElement);
-    initializeReplayPrompt();
-    loadOldReplay();
-    playReplay();
-  }
-
-  playpauseReplayButtonClick() {
-    playpauseReplayButtonClick();
-  }
-}

package/src/lib/components/tgo-typing-test/tgo-typing-test.component.html

@@ -1,72 +0,0 @@
-<div id="centerContent">
-    <div id="middle" #middle>
-      <div class="page pageTest active">
-        <div id="typingTest">
-          <div id="capsWarning" [ngClass]="{ hidden: (showCaps$ | async) === false }" #capsWarning>
-            Caps Lock
-          </div>
-          <div id="memoryTimer">Time left to memorise all words: 0s</div>
-          <div id="testModesNotice"></div>
-          <input
-            id="wordsInput"
-            class=""
-            tabindex="0"
-            type="text"
-            autocomplete="off"
-            autocapitalize="off"
-            autocorrect="off"
-            data-gramm="false"
-            data-gramm_editor="false"
-            data-enable-grammarly="false"
-            list="autocompleteOff"
-            (keyup)="wordsInputKeyup($event)"
-            (beforeinput)="wordsInputBeforeinput($event)"
-            (input)="wordsInputInput($event)"
-            (focus)="wordsInputFocus($event)"
-            (focusout)="wordsInputFocusOut()"
-            (copy)="wordsInputCopy($event)"
-            (paste)="wordsInputPaste($event)"
-            (compositionstart)="wordsInputCompositionstart()"
-            (compositionend)="wordsInputCompositionend()"
-            #wordsInput
-          />
-          @if (showMiniTimerAndLiveWpm) {
-            <div id="miniTimerAndLiveWpm" class="timerMain size2">
-              <div class="time" [@fadeIn]="(showTimer$ | async) ? 'show' : 'hide'">
-                {{ timeLeft$ | async }}
-              </div>
-              <div class="wpm hidden">60</div>
-              <div class="acc hidden">100%</div>
-              <div class="burst hidden">1</div>
-            </div>
-          }
-  
-          @if (outOfFocusShow$ | async) {
-            <div class="outOfFocusWarning">
-              Click or press any key to focus
-            </div>
-          }
-  
-          @if (errorEvent | async; as errorMessage) {
-            <div class="errorWarning"> 
-              {{ errorMessage }} Reload the page or <a href="https://candidates.testgorilla.com/hc/en-us/requests/new" target="_blank">contact support</a>.
-            </div>
-          }
-  
-          <div id="wordsWrapper" translate="no" #wordsWrapper (click)="wordsWrapperClick()">
-            <div id="paceCaret" class="default size2 hidden"></div>
-            @if (showCaret$ | async) {
-              <div id="caret" [@updatePositionCaret]="{
-                  value: state,
-                  params: { caretTopPos: caretTop, caretLeftPos: caretLeft }
-                }" 
-                [ngStyle]="{ 'animation-name': (caretAnimation$ | async) }" class="default size2">
-              </div>
-            }
-            <div id="words" class="size2" #words [ngClass]="{ blurred: (outOfFocusShow$ | async) }"></div>
-          </div>
-        </div>
-      </div>
-    </div>
-  </div>
-