From 688d469641cd74acd01455d70841f0bb38f99f4b Mon Sep 17 00:00:00 2001 From: Voltrex Date: Wed, 22 Sep 2021 06:31:48 +0330 Subject: [PATCH] refactor(utils): apply optimizations Refactored the `utils.js` file by removing redundant code, adding missing typings and improving readability. --- core/src/utils.ts | 154 +++++++++++++++++++++++----------------------- 1 file changed, 76 insertions(+), 78 deletions(-) diff --git a/core/src/utils.ts b/core/src/utils.ts index f6f1084..63f5339 100644 --- a/core/src/utils.ts +++ b/core/src/utils.ts @@ -1,44 +1,49 @@ import { BoardPiece, BoardBase } from './board/base' -export const BIG_POSITIVE_NUMBER = 10 ** 9 + 7 -export const BIG_NEGATIVE_NUMBER = -BIG_POSITIVE_NUMBER - -export function showMessage(message = '') { - const messageDOM = document.querySelector('.message') - if (!messageDOM) { - console.error('Message DOM is null!') - return - } +export const BIG_POSITIVE_NUMBER: number = 10 ** 9 + 7 +export const BIG_NEGATIVE_NUMBER: number = -BIG_POSITIVE_NUMBER + +export function showMessage(message: string = ''): void { + const messageDOM: Element | null = document + .querySelector('.message') + + if (!messageDOM) + return console.error('Message DOM is null!') + messageDOM.classList.remove('hidden') - const messageContentDOM = document.querySelector('.message-body-content') - if (!messageContentDOM) { - console.error('Message body content DOM is null!') - return - } + const messageContentDOM: Element | null = document + .querySelector('.message-body-content') + + if (!messageContentDOM) + return console.error('Message body content DOM is null!') + messageContentDOM.innerHTML = message - const messageDismissDOM = document.querySelector('.message-body-dismiss') - if (!messageDismissDOM) { - console.error('Message body dismiss DOM is null!') - return - } - const dismissHandler = () => { + const messageDismissDOM: Element | null = document + .querySelector('.message-body-dismiss') + + if (!messageDismissDOM) + return console.error('Message body dismiss DOM is null!') + + const dismissHandler = (): void => { messageDOM.classList.add('invisible') - messageDOM.addEventListener('transitionend', () => { + messageDOM.addEventListener('transitionend', (): void => { messageDOM.classList.add('hidden') messageDOM.classList.remove('invisible') }) + messageDismissDOM.removeEventListener('click', dismissHandler) } + messageDismissDOM.addEventListener('click', dismissHandler) } /** * - * @param coord Coordinate of point to be checked - * @param columnXBegin X-Coordinate of N-th column - * @param radius Radius of a piece + * @param {{ x: number; y: number }} coord The Coordinates of the point to be checked. + * @param {number} columnXBegin The X-Coordinate of N-th column. + * @param {number} radius The radius of a piece. */ export function isCoordOnColumn( coord: { x: number; y: number }, @@ -48,26 +53,20 @@ export function isCoordOnColumn( return (coord.x - columnXBegin) * (coord.x - columnXBegin) <= radius * radius } -export function getColumnFromCoord(coord: { x: number; y: number }) { - for (let i = 0; i < BoardBase.COLUMNS; i++) { - if ( - isCoordOnColumn( - coord, - 3 * BoardBase.PIECE_RADIUS * i + +export function getColumnFromCoord(coord: { x: number; y: number }): number { + for (let i: number = 0; i < BoardBase.COLUMNS; i++) + if (isCoordOnColumn(coord, 3 * BoardBase.PIECE_RADIUS * i + BoardBase.MASK_X_BEGIN + - 2 * BoardBase.PIECE_RADIUS, - BoardBase.PIECE_RADIUS - ) - ) { + 2 * BoardBase.PIECE_RADIUS, BoardBase.PIECE_RADIUS)) return i - } - } + return -1 } export function getRandomColumnNumber(): number { return Math.floor(Math.random() * BoardBase.COLUMNS) } + export function choose(choice: Array): any { return choice[Math.floor(Math.random() * choice.length)] } @@ -75,20 +74,22 @@ export function choose(choice: Array): any { /** * @see https://esdiscuss.org/topic/promises-async-functions-and-requestanimationframe-together */ -export function animationFrame() { - let resolve = null - const promise = new Promise((r) => (resolve = r)) - if (resolve) { +export function animationFrame(): Promise { + let resolve: Function | null = null + const promise: Promise = new Promise((r: Function): Function => (resolve = r)) + + if (resolve) window.requestAnimationFrame(resolve) - } + return promise } export function clone(array: Array>): Array> { - let arr = [] - for (let i = 0; i < array.length; i++) { + const arr: Array> = [] + + for (let i: number = 0; i < array.length; i++) arr[i] = array[i].slice() - } + return arr } @@ -97,38 +98,36 @@ export function getMockPlayerAction( boardPiece: BoardPiece, column: number ): { - success: boolean + success: boolean; map: Array> } { - const clonedMap = clone(map) - if ( - clonedMap[0][column] !== BoardPiece.EMPTY || - column < 0 || - column >= BoardBase.COLUMNS - ) { + const clonedMap: Array> = clone(map) + + if (clonedMap[0][column] !== BoardPiece.EMPTY || + column < 0 || column >= BoardBase.COLUMNS) return { success: false, - map: clonedMap, + map: clonedMap } - } - let isColumnEverFilled = false - let row = 0 - for (let i = 0; i < BoardBase.ROWS - 1; i++) { + let isColumnEverFilled: boolean = false + let row: number = 0 + for (let i: number = 0; i < BoardBase.ROWS - 1; i++) if (clonedMap[i + 1][column] !== BoardPiece.EMPTY) { isColumnEverFilled = true row = i + break } - } - if (!isColumnEverFilled) { + + if (!isColumnEverFilled) row = BoardBase.ROWS - 1 - } + clonedMap[row][column] = boardPiece return { success: true, - map: clonedMap, + map: clonedMap } } @@ -136,45 +135,44 @@ export function getMockPlayerAction( * From Mozilla Developer Network * https://developer.mozilla.org/en-US/docs/Web/Events/resize */ -export function onresize() { - var callbacks: Array = [], - running = false +export function onresize(): { add: Function } { + const callbacks: Array = [] + let running: boolean = false - // fired on resize event + // Fired on resize event. function resize() { if (!running) { running = true - if (window.requestAnimationFrame) { + if (window.requestAnimationFrame) window.requestAnimationFrame(runCallbacks) - } else { + else setTimeout(runCallbacks, 66) - } } } - // run the actual callbacks + // Run the actual callbacks. function runCallbacks() { - callbacks.forEach(function (callback) { + callbacks.forEach((callback: Function): void => { callback() }) + running = false } - // adds callback to loop - function addCallback(callback: Function) { - if (callback) { + // Adds callback to loop. + function addCallback(callback: Function): void { + if (callback) callbacks.push(callback) - } } return { - // public method to add additional callback - add: function (callback: Function) { - if (!callbacks.length) { + // Public method to add additional callback. + add: (callback: Function) => { + if (!callbacks.length) window.addEventListener('resize', resize) - } + addCallback(callback) - }, + } } }