UNPKG

bloom-layout

Version:
290 lines (213 loc) 9.23 kB
var _typeof = typeof Symbol === "function" && typeof Symbol.iterator === "symbol" ? function (obj) { return typeof obj; } : function (obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; import warning from 'warning'; import invariant from 'invariant'; import { createLocation } from './LocationUtils'; import { addLeadingSlash, stripTrailingSlash, hasBasename, stripBasename, createPath } from './PathUtils'; import createTransitionManager from './createTransitionManager'; import { canUseDOM, addEventListener, removeEventListener, getConfirmation, supportsHistory, supportsPopStateOnHashChange, isExtraneousPopstateEvent } from './DOMUtils'; var PopStateEvent = 'popstate'; var HashChangeEvent = 'hashchange'; var getHistoryState = function getHistoryState() { try { return window.history.state || {}; } catch (e) { // IE 11 sometimes throws when accessing window.history.state // See https://github.com/ReactTraining/history/pull/289 return {}; } }; /** * Creates a history object that uses the HTML5 history API including * pushState, replaceState, and the popstate event. */ var createBrowserHistory = function createBrowserHistory() { var props = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {}; invariant(canUseDOM, 'Browser history needs a DOM'); var globalHistory = window.history; var canUseHistory = supportsHistory(); var needsHashChangeListener = !supportsPopStateOnHashChange(); var _props$forceRefresh = props.forceRefresh, forceRefresh = _props$forceRefresh === undefined ? false : _props$forceRefresh, _props$getUserConfirm = props.getUserConfirmation, getUserConfirmation = _props$getUserConfirm === undefined ? getConfirmation : _props$getUserConfirm, _props$keyLength = props.keyLength, keyLength = _props$keyLength === undefined ? 6 : _props$keyLength; var basename = props.basename ? stripTrailingSlash(addLeadingSlash(props.basename)) : ''; var getDOMLocation = function getDOMLocation(historyState) { var _ref = historyState || {}, key = _ref.key, state = _ref.state; var _window$location = window.location, pathname = _window$location.pathname, search = _window$location.search, hash = _window$location.hash; var path = pathname + search + hash; warning(!basename || hasBasename(path, basename), 'You are attempting to use a basename on a page whose URL path does not begin ' + 'with the basename. Expected path "' + path + '" to begin with "' + basename + '".'); if (basename) path = stripBasename(path, basename); return createLocation(path, state, key); }; var createKey = function createKey() { return Math.random().toString(36).substr(2, keyLength); }; var transitionManager = createTransitionManager(); var setState = function setState(nextState) { _extends(history, nextState); history.length = globalHistory.length; transitionManager.notifyListeners(history.location, history.action); }; var handlePopState = function handlePopState(event) { // Ignore extraneous popstate events in WebKit. if (isExtraneousPopstateEvent(event)) return; handlePop(getDOMLocation(event.state)); }; var handleHashChange = function handleHashChange() { handlePop(getDOMLocation(getHistoryState())); }; var forceNextPop = false; var handlePop = function handlePop(location) { if (forceNextPop) { forceNextPop = false; setState(); } else { var action = 'POP'; transitionManager.confirmTransitionTo(location, action, getUserConfirmation, function (ok) { if (ok) { setState({ action: action, location: location }); } else { revertPop(location); } }); } }; var revertPop = function revertPop(fromLocation) { var toLocation = history.location; // TODO: We could probably make this more reliable by // keeping a list of keys we've seen in sessionStorage. // Instead, we just default to 0 for keys we don't know. var toIndex = allKeys.indexOf(toLocation.key); if (toIndex === -1) toIndex = 0; var fromIndex = allKeys.indexOf(fromLocation.key); if (fromIndex === -1) fromIndex = 0; var delta = toIndex - fromIndex; if (delta) { forceNextPop = true; go(delta); } }; var initialLocation = getDOMLocation(getHistoryState()); var allKeys = [initialLocation.key]; // Public interface var createHref = function createHref(location) { return basename + createPath(location); }; var push = function push(path, state) { warning(!((typeof path === 'undefined' ? 'undefined' : _typeof(path)) === 'object' && path.state !== undefined && state !== undefined), 'You should avoid providing a 2nd state argument to push when the 1st ' + 'argument is a location-like object that already has state; it is ignored'); var action = 'PUSH'; var location = createLocation(path, state, createKey(), history.location); transitionManager.confirmTransitionTo(location, action, getUserConfirmation, function (ok) { if (!ok) return; var href = createHref(location); var key = location.key, state = location.state; if (canUseHistory) { globalHistory.pushState({ key: key, state: state }, null, href); if (forceRefresh) { window.location.href = href; } else { var prevIndex = allKeys.indexOf(history.location.key); var nextKeys = allKeys.slice(0, prevIndex === -1 ? 0 : prevIndex + 1); nextKeys.push(location.key); allKeys = nextKeys; setState({ action: action, location: location }); } } else { warning(state === undefined, 'Browser history cannot push state in browsers that do not support HTML5 history'); window.location.href = href; } }); }; var replace = function replace(path, state) { warning(!((typeof path === 'undefined' ? 'undefined' : _typeof(path)) === 'object' && path.state !== undefined && state !== undefined), 'You should avoid providing a 2nd state argument to replace when the 1st ' + 'argument is a location-like object that already has state; it is ignored'); var action = 'REPLACE'; var location = createLocation(path, state, createKey(), history.location); transitionManager.confirmTransitionTo(location, action, getUserConfirmation, function (ok) { if (!ok) return; var href = createHref(location); var key = location.key, state = location.state; if (canUseHistory) { globalHistory.replaceState({ key: key, state: state }, null, href); if (forceRefresh) { window.location.replace(href); } else { var prevIndex = allKeys.indexOf(history.location.key); if (prevIndex !== -1) allKeys[prevIndex] = location.key; setState({ action: action, location: location }); } } else { warning(state === undefined, 'Browser history cannot replace state in browsers that do not support HTML5 history'); window.location.replace(href); } }); }; var go = function go(n) { globalHistory.go(n); }; var goBack = function goBack() { return go(-1); }; var goForward = function goForward() { return go(1); }; var listenerCount = 0; var checkDOMListeners = function checkDOMListeners(delta) { listenerCount += delta; if (listenerCount === 1) { addEventListener(window, PopStateEvent, handlePopState); if (needsHashChangeListener) addEventListener(window, HashChangeEvent, handleHashChange); } else if (listenerCount === 0) { removeEventListener(window, PopStateEvent, handlePopState); if (needsHashChangeListener) removeEventListener(window, HashChangeEvent, handleHashChange); } }; var isBlocked = false; var block = function block() { var prompt = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : false; var unblock = transitionManager.setPrompt(prompt); if (!isBlocked) { checkDOMListeners(1); isBlocked = true; } return function () { if (isBlocked) { isBlocked = false; checkDOMListeners(-1); } return unblock(); }; }; var listen = function listen(listener) { var unlisten = transitionManager.appendListener(listener); checkDOMListeners(1); return function () { checkDOMListeners(-1); unlisten(); }; }; var history = { length: globalHistory.length, action: 'POP', location: initialLocation, createHref: createHref, push: push, replace: replace, go: go, goBack: goBack, goForward: goForward, block: block, listen: listen }; return history; }; export default createBrowserHistory;