aboutsummaryrefslogtreecommitdiffstats
path: root/packages/instant/src/index.umd.ts
diff options
context:
space:
mode:
authorLeonid Logvinov <logvinov.leon@gmail.com>2019-01-09 19:02:25 +0800
committerLeonid Logvinov <logvinov.leon@gmail.com>2019-01-09 19:02:25 +0800
commitea14913b412e78ff458bdfba47182f7363e776e5 (patch)
tree3ee220bfbbd9923b5e1adc36ee51f9b5d39ad640 /packages/instant/src/index.umd.ts
parent5868c91cfb54cfa9177572b201d88d1168bf5b06 (diff)
parent5dd55491b86bf8577405e37d0f2d668aa1273b10 (diff)
downloaddexon-sol-tools-ea14913b412e78ff458bdfba47182f7363e776e5.tar
dexon-sol-tools-ea14913b412e78ff458bdfba47182f7363e776e5.tar.gz
dexon-sol-tools-ea14913b412e78ff458bdfba47182f7363e776e5.tar.bz2
dexon-sol-tools-ea14913b412e78ff458bdfba47182f7363e776e5.tar.lz
dexon-sol-tools-ea14913b412e78ff458bdfba47182f7363e776e5.tar.xz
dexon-sol-tools-ea14913b412e78ff458bdfba47182f7363e776e5.tar.zst
dexon-sol-tools-ea14913b412e78ff458bdfba47182f7363e776e5.zip
Merge development
Diffstat (limited to 'packages/instant/src/index.umd.ts')
-rw-r--r--packages/instant/src/index.umd.ts128
1 files changed, 98 insertions, 30 deletions
diff --git a/packages/instant/src/index.umd.ts b/packages/instant/src/index.umd.ts
index 5010347b3..d172f4145 100644
--- a/packages/instant/src/index.umd.ts
+++ b/packages/instant/src/index.umd.ts
@@ -2,43 +2,63 @@ import * as _ from 'lodash';
import * as React from 'react';
import * as ReactDOM from 'react-dom';
-import { DEFAULT_ZERO_EX_CONTAINER_SELECTOR, INJECTED_DIV_CLASS, INJECTED_DIV_ID } from './constants';
+import {
+ DEFAULT_ZERO_EX_CONTAINER_SELECTOR,
+ GIT_SHA as GIT_SHA_FROM_CONSTANT,
+ INJECTED_DIV_CLASS,
+ INJECTED_DIV_ID,
+ NPM_PACKAGE_VERSION,
+} from './constants';
import { ZeroExInstantOverlay, ZeroExInstantOverlayProps } from './index';
+import { analytics } from './util/analytics';
import { assert } from './util/assert';
+import { util } from './util/util';
-export const render = (props: ZeroExInstantOverlayProps, selector: string = DEFAULT_ZERO_EX_CONTAINER_SELECTOR) => {
- assert.isValidOrderSource('orderSource', props.orderSource);
- if (!_.isUndefined(props.defaultSelectedAssetData)) {
- assert.isHexString('defaultSelectedAssetData', props.defaultSelectedAssetData);
+const isInstantRendered = (): boolean => !!document.getElementById(INJECTED_DIV_ID);
+
+const validateInstantRenderConfig = (config: ZeroExInstantConfig, selector: string) => {
+ assert.isValidOrderSource('orderSource', config.orderSource);
+ if (!_.isUndefined(config.defaultSelectedAssetData)) {
+ assert.isHexString('defaultSelectedAssetData', config.defaultSelectedAssetData);
+ }
+ if (!_.isUndefined(config.additionalAssetMetaDataMap)) {
+ assert.isValidAssetMetaDataMap('additionalAssetMetaDataMap', config.additionalAssetMetaDataMap);
}
- if (!_.isUndefined(props.additionalAssetMetaDataMap)) {
- assert.isValidAssetMetaDataMap('props.additionalAssetMetaDataMap', props.additionalAssetMetaDataMap);
+ if (!_.isUndefined(config.defaultAssetBuyAmount)) {
+ assert.isNumber('defaultAssetBuyAmount', config.defaultAssetBuyAmount);
}
- if (!_.isUndefined(props.defaultAssetBuyAmount)) {
- assert.isNumber('props.defaultAssetBuyAmount', props.defaultAssetBuyAmount);
+ if (!_.isUndefined(config.networkId)) {
+ assert.isNumber('networkId', config.networkId);
}
- if (!_.isUndefined(props.networkId)) {
- assert.isNumber('props.networkId', props.networkId);
+ if (!_.isUndefined(config.availableAssetDatas)) {
+ assert.areValidAssetDatas('availableAssetDatas', config.availableAssetDatas);
}
- if (!_.isUndefined(props.availableAssetDatas)) {
- assert.areValidAssetDatas('availableAssetDatas', props.availableAssetDatas);
+ if (!_.isUndefined(config.onClose)) {
+ assert.isFunction('onClose', config.onClose);
}
- if (!_.isUndefined(props.onClose)) {
- assert.isFunction('props.onClose', props.onClose);
+ if (!_.isUndefined(config.zIndex)) {
+ assert.isNumber('zIndex', config.zIndex);
}
- if (!_.isUndefined(props.zIndex)) {
- assert.isNumber('props.zIndex', props.zIndex);
+ if (!_.isUndefined(config.affiliateInfo)) {
+ assert.isValidAffiliateInfo('affiliateInfo', config.affiliateInfo);
}
- if (!_.isUndefined(props.affiliateInfo)) {
- assert.isValidAffiliateInfo('props.affiliateInfo', props.affiliateInfo);
+ if (!_.isUndefined(config.provider)) {
+ assert.isWeb3Provider('provider', config.provider);
}
- if (!_.isUndefined(props.provider)) {
- assert.isWeb3Provider('props.provider', props.provider);
+ if (!_.isUndefined(config.walletDisplayName)) {
+ assert.isString('walletDisplayName', config.walletDisplayName);
}
- if (!_.isUndefined(props.shouldDisableAnalyticsTracking)) {
- assert.isBoolean('props.shouldDisableAnalyticsTracking', props.shouldDisableAnalyticsTracking);
+ if (!_.isUndefined(config.shouldDisablePushToHistory)) {
+ assert.isBoolean('shouldDisablePushToHistory', config.shouldDisablePushToHistory);
+ }
+ if (!_.isUndefined(config.shouldDisableAnalyticsTracking)) {
+ assert.isBoolean('shouldDisableAnalyticsTracking', config.shouldDisableAnalyticsTracking);
}
assert.isString('selector', selector);
+};
+
+// Render instant and return a callback that allows you to remove it from the DOM.
+const renderInstant = (config: ZeroExInstantConfig, selector: string) => {
const appendToIfExists = document.querySelector(selector);
assert.assert(!_.isNull(appendToIfExists), `Could not find div with selector: ${selector}`);
const appendTo = appendToIfExists as Element;
@@ -46,14 +66,62 @@ export const render = (props: ZeroExInstantOverlayProps, selector: string = DEFA
injectedDiv.setAttribute('id', INJECTED_DIV_ID);
injectedDiv.setAttribute('class', INJECTED_DIV_CLASS);
appendTo.appendChild(injectedDiv);
+ const closeInstant = () => {
+ analytics.trackInstantClosed();
+ if (!_.isUndefined(config.onClose)) {
+ config.onClose();
+ }
+ appendTo.removeChild(injectedDiv);
+ };
const instantOverlayProps = {
- ...props,
- onClose: () => {
- appendTo.removeChild(injectedDiv);
- if (!_.isUndefined(props.onClose)) {
- props.onClose();
- }
- },
+ ...config,
+ // If we are using the history API, just go back to close
+ onClose: () => (config.shouldDisablePushToHistory ? closeInstant() : window.history.back()),
};
ReactDOM.render(React.createElement(ZeroExInstantOverlay, instantOverlayProps), injectedDiv);
+ return closeInstant;
};
+
+export interface ZeroExInstantConfig extends ZeroExInstantOverlayProps {
+ shouldDisablePushToHistory?: boolean;
+}
+
+export const render = (config: ZeroExInstantConfig, selector: string = DEFAULT_ZERO_EX_CONTAINER_SELECTOR) => {
+ validateInstantRenderConfig(config, selector);
+ if (config.shouldDisablePushToHistory) {
+ if (!isInstantRendered()) {
+ renderInstant(config, selector);
+ }
+ return;
+ }
+ // Before we render, push to history saying that instant is showing for this part of the history.
+ window.history.pushState({ zeroExInstantShowing: true }, '0x Instant');
+ let removeInstant = renderInstant(config, selector);
+ // If the integrator defined a popstate handler, save it to __zeroExInstantIntegratorsPopStateHandler
+ // unless we have already done so on a previous render.
+ const anyWindow = window as any;
+ const popStateExistsAndNotSetPreviously = window.onpopstate && !anyWindow.__zeroExInstantIntegratorsPopStateHandler;
+ anyWindow.__zeroExInstantIntegratorsPopStateHandler = popStateExistsAndNotSetPreviously
+ ? anyWindow.onpopstate.bind(window)
+ : util.boundNoop;
+ const onPopStateHandler = (e: PopStateEvent) => {
+ anyWindow.__zeroExInstantIntegratorsPopStateHandler(e);
+ const newState = e.state;
+ if (newState && newState.zeroExInstantShowing) {
+ // We have returned to a history state that expects instant to be rendered.
+ if (!isInstantRendered()) {
+ removeInstant = renderInstant(config, selector);
+ }
+ } else {
+ // History has changed to a different state.
+ if (isInstantRendered()) {
+ removeInstant();
+ }
+ }
+ };
+ window.onpopstate = onPopStateHandler;
+};
+
+// Write version info to the exported object for debugging
+export const GIT_SHA = GIT_SHA_FROM_CONSTANT;
+export const NPM_VERSION = NPM_PACKAGE_VERSION;