From 25039a036c13336eba82904ecb53f6517286c0b5 Mon Sep 17 00:00:00 2001 From: Steve Klebanoff Date: Tue, 30 Oct 2018 10:18:00 -0700 Subject: WIP: Progress ticker with finishing --- packages/instant/src/constants.ts | 1 + packages/instant/src/util/progress.ts | 89 +++++++++++++++++++++++++++++++++++ 2 files changed, 90 insertions(+) create mode 100644 packages/instant/src/util/progress.ts (limited to 'packages/instant/src') diff --git a/packages/instant/src/constants.ts b/packages/instant/src/constants.ts index 424f35ecb..a21de2a0f 100644 --- a/packages/instant/src/constants.ts +++ b/packages/instant/src/constants.ts @@ -7,3 +7,4 @@ export const GWEI_IN_WEI = new BigNumber(1000000000); export const DEFAULT_GAS_PRICE = GWEI_IN_WEI.mul(6); export const ETH_GAS_STATION_API_BASE_URL = 'https://ethgasstation.info'; export const COINBASE_API_BASE_URL = 'https://api.coinbase.com/v2'; +export const PROGRESS_TICK_INTERVAL_MS = 100; diff --git a/packages/instant/src/util/progress.ts b/packages/instant/src/util/progress.ts new file mode 100644 index 000000000..33b1cc313 --- /dev/null +++ b/packages/instant/src/util/progress.ts @@ -0,0 +1,89 @@ +import { Dispatch } from 'redux'; + +import { PROGRESS_TICK_INTERVAL_MS } from '../constants'; +import { Action, actions } from '../redux/actions'; + +const curTimeUnix = () => { + return new Date().getTime(); +}; + +enum TickingState { + Ticking, + Finishing, +} +interface TickingNormalState { + state: TickingState.Ticking; +} +interface TickingFinishingState { + state: TickingState.Finishing; + increasePercentageEveryTick: number; +} +type TickingStatus = TickingNormalState | TickingFinishingState; + +const TICKS_PER_SECOND = 1000 / PROGRESS_TICK_INTERVAL_MS; +export class Progress { + private _startTimeUnix: number; + private _expectedTimeMs: number; + private _intervalId: number; + private _percentageDone: number; + private _tickingStatus: TickingStatus; + + // TODO: take in dispatch + constructor(expectedTimeMs: number) { + const curTime = curTimeUnix(); + this._startTimeUnix = curTime; + this._expectedTimeMs = expectedTimeMs; + this._percentageDone = 0; + this._intervalId = window.setInterval(this._tick.bind(this), PROGRESS_TICK_INTERVAL_MS); // TODO: is bind necessary? + this._tickingStatus = { state: TickingState.Ticking }; + // TODO: clear interval + } + + public setFinishing(): void { + const percentLeft = 100 - this._percentageDone; + console.log('percentLeft', percentLeft); + const increasePercentageEveryTick = percentLeft / TICKS_PER_SECOND; + console.log('increase Tick', increasePercentageEveryTick); + this._tickingStatus = { + state: TickingState.Finishing, + increasePercentageEveryTick, + }; + } + + private _tick(): void { + const percentageDone = + this._tickingStatus.state === TickingState.Finishing + ? this._tickFinishing(this._tickingStatus) + : this._tickNormal(); + + // TODO: max 100 + + this._percentageDone = percentageDone; + console.log('percentageDone', this._percentageDone); + // TODO: max 95 + if (percentageDone >= 100) { + this._clearInterval(); + } + return; + } + + // TODO: take param and move out + private _tickNormal(): number { + const elapsedTimeMs = curTimeUnix() - this._startTimeUnix; + // TODO: zero and negative check, use mins and maxs everywhere + const percentageDone = elapsedTimeMs / this._expectedTimeMs * 100; + return percentageDone; + } + + private _tickFinishing(finishingState: TickingFinishingState): number { + return this._percentageDone + finishingState.increasePercentageEveryTick; + } + + private _clearInterval(): void { + return window.clearInterval(this._intervalId); + } + + // reset function + + // end function +} -- cgit