diff --git a/client/source/scripts/actions/TorrentActions.js b/client/source/scripts/actions/TorrentActions.js index 26794a4e..7b3c0913 100644 --- a/client/source/scripts/actions/TorrentActions.js +++ b/client/source/scripts/actions/TorrentActions.js @@ -221,15 +221,14 @@ const TorrentActions = { return json.data; }) .then((data) => { - console.log(data); AppDispatcher.dispatchServerAction({ - type: ActionTypes.CLIENT_STOP_TORRENT_SUCCESS, + type: ActionTypes.CLIENT_SET_FILE_PRIORITY_SUCCESS, data }); }) .catch((error) => { AppDispatcher.dispatchServerAction({ - type: ActionTypes.CLIENT_STOP_TORRENT_ERROR, + type: ActionTypes.CLIENT_SET_FILE_PRIORITY_ERROR, error }); }); diff --git a/client/source/scripts/components/filesystem/DirectoryFileList.js b/client/source/scripts/components/filesystem/DirectoryFileList.js index 4e313b57..c5c5ded0 100644 --- a/client/source/scripts/components/filesystem/DirectoryFileList.js +++ b/client/source/scripts/components/filesystem/DirectoryFileList.js @@ -26,9 +26,13 @@ export default class DirectoryFiles extends React.Component { this.processPriorities(); } + componentWillReceiveProps() { + this.processPriorities(); + } + handlePriorityChange(fileIndex) { let priorities = this.state.priorities; - let priorityLevel = priorities[fileIndex]; + let priorityLevel = priorities[`${this.props.hash}-${fileIndex}`]; if (priorityLevel == null) { return; @@ -38,7 +42,7 @@ export default class DirectoryFiles extends React.Component { priorityLevel = 0; } - priorities[fileIndex] = priorityLevel; + priorities[`${this.props.hash}-${fileIndex}`] = priorityLevel; this.setState({priorities}); @@ -48,9 +52,9 @@ export default class DirectoryFiles extends React.Component { processPriorities() { let priorities = this.state.priorities; - this.props.branch.forEach(function (file, index) { - if (priorities[file.index] == null) { - priorities[file.index] = Number(file.priority); + this.props.branch.forEach((file, index) => { + if (priorities[`${this.props.hash}-${file.index}`] == null) { + priorities[`${this.props.hash}-${file.index}`] = Number(file.priority); } }); @@ -66,6 +70,11 @@ export default class DirectoryFiles extends React.Component { let files = branch.map((file, index) => { let fileSize = format.data(file.sizeBytes, '', 1); + let priorityLevel = this.state.priorities[`${this.props.hash}-${file.index}`]; + + if (priorityLevel == null) { + priorityLevel = file.priority; + } return (
-
diff --git a/client/source/scripts/components/filesystem/PriorityMeter.js b/client/source/scripts/components/filesystem/PriorityMeter.js index 307bfa66..a3fb07de 100644 --- a/client/source/scripts/components/filesystem/PriorityMeter.js +++ b/client/source/scripts/components/filesystem/PriorityMeter.js @@ -9,33 +9,19 @@ export default class PriorityMeter extends React.Component { constructor() { super(); - this.state = { - level: null - }; - METHODS_TO_BIND.forEach((method) => { this[method] = this[method].bind(this); }); } - getLevel() { - if (this.state.level == null) { - return this.props.level; - } else { - return this.state.level; - } - } - handleClick() { this.props.onChange(this.props.fileIndex); } render() { - let level = this.props.level; - return (
-
+
); } diff --git a/client/source/scripts/components/panels/TorrentDetailsView.js b/client/source/scripts/components/panels/TorrentDetailsView.js index 6204f511..7999960c 100644 --- a/client/source/scripts/components/panels/TorrentDetailsView.js +++ b/client/source/scripts/components/panels/TorrentDetailsView.js @@ -47,8 +47,15 @@ export default class TorrentDetails extends React.Component { UIStore.listen(EventTypes.UI_TORRENT_DETAILS_HASH_CHANGE, this.onTorrentDetailsHashChange); } + componentWillUpdate(nextProps, nextState) { + if (nextState.isOpen && !this.state.isOpen) { + TorrentStore.fetchTorrentDetails(); + } else if (!nextState.isOpen) { + TorrentStore.stopPollingTorrentDetails(); + } + } + componentWillUnmount() { - TorrentStore.stopPollingTorrentDetails(); TorrentStore.unlisten(EventTypes.CLIENT_TORRENT_DETAILS_CHANGE, this.onTorrentDetailsChange); UIStore.unlisten(EventTypes.UI_TORRENT_DETAILS_OPEN_CHANGE, this.onOpenChange); UIStore.unlisten(EventTypes.UI_TORRENT_DETAILS_HASH_CHANGE, this.onTorrentDetailsHashChange); @@ -61,12 +68,6 @@ export default class TorrentDetails extends React.Component { } onOpenChange() { - if (!UIStore.isTorrentDetailsOpen()) { - TorrentStore.stopPollingTorrentDetails(); - } else { - TorrentStore.fetchTorrentDetails(UIStore.getTorrentDetailsHash()); - } - this.setState({ isOpen: UIStore.isTorrentDetailsOpen() }); diff --git a/client/source/scripts/components/panels/TorrentListView.js b/client/source/scripts/components/panels/TorrentListView.js index 5b64b1a1..f5c9be60 100644 --- a/client/source/scripts/components/panels/TorrentListView.js +++ b/client/source/scripts/components/panels/TorrentListView.js @@ -32,12 +32,6 @@ class TorrentListView extends React.Component { } onOpenChange() { - if (!UIStore.isTorrentDetailsOpen()) { - TorrentStore.stopPollingTorrentDetails(); - } else { - TorrentStore.fetchTorrentDetails(UIStore.getTorrentDetailsHash()); - } - this.setState({ isTorrentDetailsOpen: UIStore.isTorrentDetailsOpen() }); diff --git a/client/source/scripts/constants/ActionTypes.js b/client/source/scripts/constants/ActionTypes.js index 6417ab48..b833b624 100644 --- a/client/source/scripts/constants/ActionTypes.js +++ b/client/source/scripts/constants/ActionTypes.js @@ -15,6 +15,8 @@ const ActionTypes = { CLIENT_FETCH_TRANSFER_HISTORY_SUCCESS: 'CLIENT_FETCH_TRANSFER_HISTORY_SUCCESS', CLIENT_REMOVE_TORRENT_ERROR: 'CLIENT_REMOVE_TORRENT_ERROR', CLIENT_REMOVE_TORRENT_SUCCESS: 'CLIENT_REMOVE_TORRENT_SUCCESS', + CLIENT_SET_FILE_PRIORITY_ERROR: 'CLIENT_SET_FILE_PRIORITY_ERROR', + CLIENT_SET_FILE_PRIORITY_SUCCESS: 'CLIENT_SET_FILE_PRIORITY_SUCCESS', CLIENT_SET_THROTTLE_ERROR: 'CLIENT_SET_THROTTLE_ERROR', CLIENT_SET_THROTTLE_SUCCESS: 'CLIENT_SET_THROTTLE_SUCCESS', CLIENT_START_TORRENT_ERROR: 'CLIENT_START_TORRENT_ERROR', diff --git a/client/source/scripts/dispatcher/AppDispatcher.js b/client/source/scripts/dispatcher/AppDispatcher.js index 2a3a5f67..008c0c5a 100644 --- a/client/source/scripts/dispatcher/AppDispatcher.js +++ b/client/source/scripts/dispatcher/AppDispatcher.js @@ -2,10 +2,16 @@ import {Dispatcher} from 'flux'; class FloodDispatcher extends Dispatcher { dispatchUIAction(action) { + if (action.type == null) { + console.trace('Undefined action.type', action); + } this.dispatch({source: 'UI_ACTION', action}); } dispatchServerAction(action) { + if (action.type == null) { + console.trace('Undefined action.type', action); + } this.dispatch({source: 'SERVER_ACTION', action}); } } diff --git a/client/source/scripts/stores/TorrentStore.js b/client/source/scripts/stores/TorrentStore.js index c374a4b1..ea4708c6 100644 --- a/client/source/scripts/stores/TorrentStore.js +++ b/client/source/scripts/stores/TorrentStore.js @@ -27,8 +27,8 @@ class TorrentStoreClass extends BaseStore { fetchTorrentDetails() { TorrentActions.fetchTorrentDetails(UIStore.getTorrentDetailsHash()); + if (this.pollTorrentDetailsIntervalID === null) { - this.stopPollingTorrentDetails(); this.startPollingTorrentDetails(); } } diff --git a/server/assets/app.js b/server/assets/app.js index 5a5c20a7..132949a0 100644 --- a/server/assets/app.js +++ b/server/assets/app.js @@ -206,7 +206,7 @@ /* 27 */ /***/ function(module, exports, __webpack_require__) { - eval("/**\n * Copyright 2013-2015, Facebook, Inc.\n * All rights reserved.\n *\n * This source code is licensed under the BSD-style license found in the\n * LICENSE file in the root directory of this source tree. An additional grant\n * of patent rights can be found in the PATENTS file in the same directory.\n *\n * @providesModule ReactMount\n */\n\n'use strict';\n\nvar DOMProperty = __webpack_require__(22);\nvar ReactBrowserEventEmitter = __webpack_require__(28);\nvar ReactCurrentOwner = __webpack_require__(4);\nvar ReactDOMFeatureFlags = __webpack_require__(40);\nvar ReactElement = __webpack_require__(41);\nvar ReactEmptyComponentRegistry = __webpack_require__(43);\nvar ReactInstanceHandles = __webpack_require__(44);\nvar ReactInstanceMap = __webpack_require__(46);\nvar ReactMarkupChecksum = __webpack_require__(47);\nvar ReactPerf = __webpack_require__(17);\nvar ReactReconciler = __webpack_require__(49);\nvar ReactUpdateQueue = __webpack_require__(52);\nvar ReactUpdates = __webpack_require__(53);\n\nvar assign = __webpack_require__(38);\nvar emptyObject = __webpack_require__(57);\nvar containsNode = __webpack_require__(58);\nvar instantiateReactComponent = __webpack_require__(61);\nvar invariant = __webpack_require__(12);\nvar setInnerHTML = __webpack_require__(18);\nvar shouldUpdateReactComponent = __webpack_require__(!(function webpackMissingModule() { var e = new Error(\"Cannot find module \\\"./shouldUpdateReactComponent\\\"\"); e.code = 'MODULE_NOT_FOUND'; throw e; }()));\nvar validateDOMNesting = __webpack_require__(69);\nvar warning = __webpack_require__(24);\n\nvar ATTR_NAME = DOMProperty.ID_ATTRIBUTE_NAME;\nvar nodeCache = {};\n\nvar ELEMENT_NODE_TYPE = 1;\nvar DOC_NODE_TYPE = 9;\nvar DOCUMENT_FRAGMENT_NODE_TYPE = 11;\n\nvar ownerDocumentContextKey = '__ReactMount_ownerDocument$' + Math.random().toString(36).slice(2);\n\n/** Mapping from reactRootID to React component instance. */\nvar instancesByReactRootID = {};\n\n/** Mapping from reactRootID to `container` nodes. */\nvar containersByReactRootID = {};\n\nif (true) {\n /** __DEV__-only mapping from reactRootID to root elements. */\n var rootElementsByReactRootID = {};\n}\n\n// Used to store breadth-first search state in findComponentRoot.\nvar findComponentRootReusableArray = [];\n\n/**\n * Finds the index of the first character\n * that's not common between the two given strings.\n *\n * @return {number} the index of the character where the strings diverge\n */\nfunction firstDifferenceIndex(string1, string2) {\n var minLen = Math.min(string1.length, string2.length);\n for (var i = 0; i < minLen; i++) {\n if (string1.charAt(i) !== string2.charAt(i)) {\n return i;\n }\n }\n return string1.length === string2.length ? -1 : minLen;\n}\n\n/**\n * @param {DOMElement|DOMDocument} container DOM element that may contain\n * a React component\n * @return {?*} DOM element that may have the reactRoot ID, or null.\n */\nfunction getReactRootElementInContainer(container) {\n if (!container) {\n return null;\n }\n\n if (container.nodeType === DOC_NODE_TYPE) {\n return container.documentElement;\n } else {\n return container.firstChild;\n }\n}\n\n/**\n * @param {DOMElement} container DOM element that may contain a React component.\n * @return {?string} A \"reactRoot\" ID, if a React component is rendered.\n */\nfunction getReactRootID(container) {\n var rootElement = getReactRootElementInContainer(container);\n return rootElement && ReactMount.getID(rootElement);\n}\n\n/**\n * Accessing node[ATTR_NAME] or calling getAttribute(ATTR_NAME) on a form\n * element can return its control whose name or ID equals ATTR_NAME. All\n * DOM nodes support `getAttributeNode` but this can also get called on\n * other objects so just return '' if we're given something other than a\n * DOM node (such as window).\n *\n * @param {?DOMElement|DOMWindow|DOMDocument|DOMTextNode} node DOM node.\n * @return {string} ID of the supplied `domNode`.\n */\nfunction getID(node) {\n var id = internalGetID(node);\n if (id) {\n if (nodeCache.hasOwnProperty(id)) {\n var cached = nodeCache[id];\n if (cached !== node) {\n !!isValid(cached, id) ? true ? invariant(false, 'ReactMount: Two valid but unequal nodes with the same `%s`: %s', ATTR_NAME, id) : invariant(false) : undefined;\n\n nodeCache[id] = node;\n }\n } else {\n nodeCache[id] = node;\n }\n }\n\n return id;\n}\n\nfunction internalGetID(node) {\n // If node is something like a window, document, or text node, none of\n // which support attributes or a .getAttribute method, gracefully return\n // the empty string, as if the attribute were missing.\n return node && node.getAttribute && node.getAttribute(ATTR_NAME) || '';\n}\n\n/**\n * Sets the React-specific ID of the given node.\n *\n * @param {DOMElement} node The DOM node whose ID will be set.\n * @param {string} id The value of the ID attribute.\n */\nfunction setID(node, id) {\n var oldID = internalGetID(node);\n if (oldID !== id) {\n delete nodeCache[oldID];\n }\n node.setAttribute(ATTR_NAME, id);\n nodeCache[id] = node;\n}\n\n/**\n * Finds the node with the supplied React-generated DOM ID.\n *\n * @param {string} id A React-generated DOM ID.\n * @return {DOMElement} DOM node with the suppled `id`.\n * @internal\n */\nfunction getNode(id) {\n if (!nodeCache.hasOwnProperty(id) || !isValid(nodeCache[id], id)) {\n nodeCache[id] = ReactMount.findReactNodeByID(id);\n }\n return nodeCache[id];\n}\n\n/**\n * Finds the node with the supplied public React instance.\n *\n * @param {*} instance A public React instance.\n * @return {?DOMElement} DOM node with the suppled `id`.\n * @internal\n */\nfunction getNodeFromInstance(instance) {\n var id = ReactInstanceMap.get(instance)._rootNodeID;\n if (ReactEmptyComponentRegistry.isNullComponentID(id)) {\n return null;\n }\n if (!nodeCache.hasOwnProperty(id) || !isValid(nodeCache[id], id)) {\n nodeCache[id] = ReactMount.findReactNodeByID(id);\n }\n return nodeCache[id];\n}\n\n/**\n * A node is \"valid\" if it is contained by a currently mounted container.\n *\n * This means that the node does not have to be contained by a document in\n * order to be considered valid.\n *\n * @param {?DOMElement} node The candidate DOM node.\n * @param {string} id The expected ID of the node.\n * @return {boolean} Whether the node is contained by a mounted container.\n */\nfunction isValid(node, id) {\n if (node) {\n !(internalGetID(node) === id) ? true ? invariant(false, 'ReactMount: Unexpected modification of `%s`', ATTR_NAME) : invariant(false) : undefined;\n\n var container = ReactMount.findReactContainerForID(id);\n if (container && containsNode(container, node)) {\n return true;\n }\n }\n\n return false;\n}\n\n/**\n * Causes the cache to forget about one React-specific ID.\n *\n * @param {string} id The ID to forget.\n */\nfunction purgeID(id) {\n delete nodeCache[id];\n}\n\nvar deepestNodeSoFar = null;\nfunction findDeepestCachedAncestorImpl(ancestorID) {\n var ancestor = nodeCache[ancestorID];\n if (ancestor && isValid(ancestor, ancestorID)) {\n deepestNodeSoFar = ancestor;\n } else {\n // This node isn't populated in the cache, so presumably none of its\n // descendants are. Break out of the loop.\n return false;\n }\n}\n\n/**\n * Return the deepest cached node whose ID is a prefix of `targetID`.\n */\nfunction findDeepestCachedAncestor(targetID) {\n deepestNodeSoFar = null;\n ReactInstanceHandles.traverseAncestors(targetID, findDeepestCachedAncestorImpl);\n\n var foundNode = deepestNodeSoFar;\n deepestNodeSoFar = null;\n return foundNode;\n}\n\n/**\n * Mounts this component and inserts it into the DOM.\n *\n * @param {ReactComponent} componentInstance The instance to mount.\n * @param {string} rootID DOM ID of the root node.\n * @param {DOMElement} container DOM element to mount into.\n * @param {ReactReconcileTransaction} transaction\n * @param {boolean} shouldReuseMarkup If true, do not insert markup\n */\nfunction mountComponentIntoNode(componentInstance, rootID, container, transaction, shouldReuseMarkup, context) {\n if (ReactDOMFeatureFlags.useCreateElement) {\n context = assign({}, context);\n if (container.nodeType === DOC_NODE_TYPE) {\n context[ownerDocumentContextKey] = container;\n } else {\n context[ownerDocumentContextKey] = container.ownerDocument;\n }\n }\n if (true) {\n if (context === emptyObject) {\n context = {};\n }\n var tag = container.nodeName.toLowerCase();\n context[validateDOMNesting.ancestorInfoContextKey] = validateDOMNesting.updatedAncestorInfo(null, tag, null);\n }\n var markup = ReactReconciler.mountComponent(componentInstance, rootID, transaction, context);\n componentInstance._renderedComponent._topLevelWrapper = componentInstance;\n ReactMount._mountImageIntoNode(markup, container, shouldReuseMarkup, transaction);\n}\n\n/**\n * Batched mount.\n *\n * @param {ReactComponent} componentInstance The instance to mount.\n * @param {string} rootID DOM ID of the root node.\n * @param {DOMElement} container DOM element to mount into.\n * @param {boolean} shouldReuseMarkup If true, do not insert markup\n */\nfunction batchedMountComponentIntoNode(componentInstance, rootID, container, shouldReuseMarkup, context) {\n var transaction = ReactUpdates.ReactReconcileTransaction.getPooled(\n /* forceHTML */shouldReuseMarkup);\n transaction.perform(mountComponentIntoNode, null, componentInstance, rootID, container, transaction, shouldReuseMarkup, context);\n ReactUpdates.ReactReconcileTransaction.release(transaction);\n}\n\n/**\n * Unmounts a component and removes it from the DOM.\n *\n * @param {ReactComponent} instance React component instance.\n * @param {DOMElement} container DOM element to unmount from.\n * @final\n * @internal\n * @see {ReactMount.unmountComponentAtNode}\n */\nfunction unmountComponentFromNode(instance, container) {\n ReactReconciler.unmountComponent(instance);\n\n if (container.nodeType === DOC_NODE_TYPE) {\n container = container.documentElement;\n }\n\n // http://jsperf.com/emptying-a-node\n while (container.lastChild) {\n container.removeChild(container.lastChild);\n }\n}\n\n/**\n * True if the supplied DOM node has a direct React-rendered child that is\n * not a React root element. Useful for warning in `render`,\n * `unmountComponentAtNode`, etc.\n *\n * @param {?DOMElement} node The candidate DOM node.\n * @return {boolean} True if the DOM element contains a direct child that was\n * rendered by React but is not a root element.\n * @internal\n */\nfunction hasNonRootReactChild(node) {\n var reactRootID = getReactRootID(node);\n return reactRootID ? reactRootID !== ReactInstanceHandles.getReactRootIDFromNodeID(reactRootID) : false;\n}\n\n/**\n * Returns the first (deepest) ancestor of a node which is rendered by this copy\n * of React.\n */\nfunction findFirstReactDOMImpl(node) {\n // This node might be from another React instance, so we make sure not to\n // examine the node cache here\n for (; node && node.parentNode !== node; node = node.parentNode) {\n if (node.nodeType !== 1) {\n // Not a DOMElement, therefore not a React component\n continue;\n }\n var nodeID = internalGetID(node);\n if (!nodeID) {\n continue;\n }\n var reactRootID = ReactInstanceHandles.getReactRootIDFromNodeID(nodeID);\n\n // If containersByReactRootID contains the container we find by crawling up\n // the tree, we know that this instance of React rendered the node.\n // nb. isValid's strategy (with containsNode) does not work because render\n // trees may be nested and we don't want a false positive in that case.\n var current = node;\n var lastID;\n do {\n lastID = internalGetID(current);\n current = current.parentNode;\n if (current == null) {\n // The passed-in node has been detached from the container it was\n // originally rendered into.\n return null;\n }\n } while (lastID !== reactRootID);\n\n if (current === containersByReactRootID[reactRootID]) {\n return node;\n }\n }\n return null;\n}\n\n/**\n * Temporary (?) hack so that we can store all top-level pending updates on\n * composites instead of having to worry about different types of components\n * here.\n */\nvar TopLevelWrapper = function () {};\nTopLevelWrapper.prototype.isReactComponent = {};\nif (true) {\n TopLevelWrapper.displayName = 'TopLevelWrapper';\n}\nTopLevelWrapper.prototype.render = function () {\n // this.props is actually a ReactElement\n return this.props;\n};\n\n/**\n * Mounting is the process of initializing a React component by creating its\n * representative DOM elements and inserting them into a supplied `container`.\n * Any prior content inside `container` is destroyed in the process.\n *\n * ReactMount.render(\n * component,\n * document.getElementById('container')\n * );\n *\n *
<-- Supplied `container`.\n *
<-- Rendered reactRoot of React\n * // ... component.\n *
\n *
\n *\n * Inside of `container`, the first element rendered is the \"reactRoot\".\n */\nvar ReactMount = {\n\n TopLevelWrapper: TopLevelWrapper,\n\n /** Exposed for debugging purposes **/\n _instancesByReactRootID: instancesByReactRootID,\n\n /**\n * This is a hook provided to support rendering React components while\n * ensuring that the apparent scroll position of its `container` does not\n * change.\n *\n * @param {DOMElement} container The `container` being rendered into.\n * @param {function} renderCallback This must be called once to do the render.\n */\n scrollMonitor: function (container, renderCallback) {\n renderCallback();\n },\n\n /**\n * Take a component that's already mounted into the DOM and replace its props\n * @param {ReactComponent} prevComponent component instance already in the DOM\n * @param {ReactElement} nextElement component instance to render\n * @param {DOMElement} container container to render into\n * @param {?function} callback function triggered on completion\n */\n _updateRootComponent: function (prevComponent, nextElement, container, callback) {\n ReactMount.scrollMonitor(container, function () {\n ReactUpdateQueue.enqueueElementInternal(prevComponent, nextElement);\n if (callback) {\n ReactUpdateQueue.enqueueCallbackInternal(prevComponent, callback);\n }\n });\n\n if (true) {\n // Record the root element in case it later gets transplanted.\n rootElementsByReactRootID[getReactRootID(container)] = getReactRootElementInContainer(container);\n }\n\n return prevComponent;\n },\n\n /**\n * Register a component into the instance map and starts scroll value\n * monitoring\n * @param {ReactComponent} nextComponent component instance to render\n * @param {DOMElement} container container to render into\n * @return {string} reactRoot ID prefix\n */\n _registerComponent: function (nextComponent, container) {\n !(container && (container.nodeType === ELEMENT_NODE_TYPE || container.nodeType === DOC_NODE_TYPE || container.nodeType === DOCUMENT_FRAGMENT_NODE_TYPE)) ? true ? invariant(false, '_registerComponent(...): Target container is not a DOM element.') : invariant(false) : undefined;\n\n ReactBrowserEventEmitter.ensureScrollValueMonitoring();\n\n var reactRootID = ReactMount.registerContainer(container);\n instancesByReactRootID[reactRootID] = nextComponent;\n return reactRootID;\n },\n\n /**\n * Render a new component into the DOM.\n * @param {ReactElement} nextElement element to render\n * @param {DOMElement} container container to render into\n * @param {boolean} shouldReuseMarkup if we should skip the markup insertion\n * @return {ReactComponent} nextComponent\n */\n _renderNewRootComponent: function (nextElement, container, shouldReuseMarkup, context) {\n // Various parts of our code (such as ReactCompositeComponent's\n // _renderValidatedComponent) assume that calls to render aren't nested;\n // verify that that's the case.\n true ? warning(ReactCurrentOwner.current == null, '_renderNewRootComponent(): Render methods should be a pure function ' + 'of props and state; triggering nested component updates from ' + 'render is not allowed. If necessary, trigger nested updates in ' + 'componentDidUpdate. Check the render method of %s.', ReactCurrentOwner.current && ReactCurrentOwner.current.getName() || 'ReactCompositeComponent') : undefined;\n\n var componentInstance = instantiateReactComponent(nextElement, null);\n var reactRootID = ReactMount._registerComponent(componentInstance, container);\n\n // The initial render is synchronous but any updates that happen during\n // rendering, in componentWillMount or componentDidMount, will be batched\n // according to the current batching strategy.\n\n ReactUpdates.batchedUpdates(batchedMountComponentIntoNode, componentInstance, reactRootID, container, shouldReuseMarkup, context);\n\n if (true) {\n // Record the root element in case it later gets transplanted.\n rootElementsByReactRootID[reactRootID] = getReactRootElementInContainer(container);\n }\n\n return componentInstance;\n },\n\n /**\n * Renders a React component into the DOM in the supplied `container`.\n *\n * If the React component was previously rendered into `container`, this will\n * perform an update on it and only mutate the DOM as necessary to reflect the\n * latest React component.\n *\n * @param {ReactComponent} parentComponent The conceptual parent of this render tree.\n * @param {ReactElement} nextElement Component element to render.\n * @param {DOMElement} container DOM element to render into.\n * @param {?function} callback function triggered on completion\n * @return {ReactComponent} Component instance rendered in `container`.\n */\n renderSubtreeIntoContainer: function (parentComponent, nextElement, container, callback) {\n !(parentComponent != null && parentComponent._reactInternalInstance != null) ? true ? invariant(false, 'parentComponent must be a valid React Component') : invariant(false) : undefined;\n return ReactMount._renderSubtreeIntoContainer(parentComponent, nextElement, container, callback);\n },\n\n _renderSubtreeIntoContainer: function (parentComponent, nextElement, container, callback) {\n !ReactElement.isValidElement(nextElement) ? true ? invariant(false, 'ReactDOM.render(): Invalid component element.%s', typeof nextElement === 'string' ? ' Instead of passing an element string, make sure to instantiate ' + 'it by passing it to React.createElement.' : typeof nextElement === 'function' ? ' Instead of passing a component class, make sure to instantiate ' + 'it by passing it to React.createElement.' :\n // Check if it quacks like an element\n nextElement != null && nextElement.props !== undefined ? ' This may be caused by unintentionally loading two independent ' + 'copies of React.' : '') : invariant(false) : undefined;\n\n true ? warning(!container || !container.tagName || container.tagName.toUpperCase() !== 'BODY', 'render(): Rendering components directly into document.body is ' + 'discouraged, since its children are often manipulated by third-party ' + 'scripts and browser extensions. This may lead to subtle ' + 'reconciliation issues. Try rendering into a container element created ' + 'for your app.') : undefined;\n\n var nextWrappedElement = new ReactElement(TopLevelWrapper, null, null, null, null, null, nextElement);\n\n var prevComponent = instancesByReactRootID[getReactRootID(container)];\n\n if (prevComponent) {\n var prevWrappedElement = prevComponent._currentElement;\n var prevElement = prevWrappedElement.props;\n if (shouldUpdateReactComponent(prevElement, nextElement)) {\n var publicInst = prevComponent._renderedComponent.getPublicInstance();\n var updatedCallback = callback && function () {\n callback.call(publicInst);\n };\n ReactMount._updateRootComponent(prevComponent, nextWrappedElement, container, updatedCallback);\n return publicInst;\n } else {\n ReactMount.unmountComponentAtNode(container);\n }\n }\n\n var reactRootElement = getReactRootElementInContainer(container);\n var containerHasReactMarkup = reactRootElement && !!internalGetID(reactRootElement);\n var containerHasNonRootReactChild = hasNonRootReactChild(container);\n\n if (true) {\n true ? warning(!containerHasNonRootReactChild, 'render(...): Replacing React-rendered children with a new root ' + 'component. If you intended to update the children of this node, ' + 'you should instead have the existing children update their state ' + 'and render the new components instead of calling ReactDOM.render.') : undefined;\n\n if (!containerHasReactMarkup || reactRootElement.nextSibling) {\n var rootElementSibling = reactRootElement;\n while (rootElementSibling) {\n if (internalGetID(rootElementSibling)) {\n true ? warning(false, 'render(): Target node has markup rendered by React, but there ' + 'are unrelated nodes as well. This is most commonly caused by ' + 'white-space inserted around server-rendered markup.') : undefined;\n break;\n }\n rootElementSibling = rootElementSibling.nextSibling;\n }\n }\n }\n\n var shouldReuseMarkup = containerHasReactMarkup && !prevComponent && !containerHasNonRootReactChild;\n var component = ReactMount._renderNewRootComponent(nextWrappedElement, container, shouldReuseMarkup, parentComponent != null ? parentComponent._reactInternalInstance._processChildContext(parentComponent._reactInternalInstance._context) : emptyObject)._renderedComponent.getPublicInstance();\n if (callback) {\n callback.call(component);\n }\n return component;\n },\n\n /**\n * Renders a React component into the DOM in the supplied `container`.\n *\n * If the React component was previously rendered into `container`, this will\n * perform an update on it and only mutate the DOM as necessary to reflect the\n * latest React component.\n *\n * @param {ReactElement} nextElement Component element to render.\n * @param {DOMElement} container DOM element to render into.\n * @param {?function} callback function triggered on completion\n * @return {ReactComponent} Component instance rendered in `container`.\n */\n render: function (nextElement, container, callback) {\n return ReactMount._renderSubtreeIntoContainer(null, nextElement, container, callback);\n },\n\n /**\n * Registers a container node into which React components will be rendered.\n * This also creates the \"reactRoot\" ID that will be assigned to the element\n * rendered within.\n *\n * @param {DOMElement} container DOM element to register as a container.\n * @return {string} The \"reactRoot\" ID of elements rendered within.\n */\n registerContainer: function (container) {\n var reactRootID = getReactRootID(container);\n if (reactRootID) {\n // If one exists, make sure it is a valid \"reactRoot\" ID.\n reactRootID = ReactInstanceHandles.getReactRootIDFromNodeID(reactRootID);\n }\n if (!reactRootID) {\n // No valid \"reactRoot\" ID found, create one.\n reactRootID = ReactInstanceHandles.createReactRootID();\n }\n containersByReactRootID[reactRootID] = container;\n return reactRootID;\n },\n\n /**\n * Unmounts and destroys the React component rendered in the `container`.\n *\n * @param {DOMElement} container DOM element containing a React component.\n * @return {boolean} True if a component was found in and unmounted from\n * `container`\n */\n unmountComponentAtNode: function (container) {\n // Various parts of our code (such as ReactCompositeComponent's\n // _renderValidatedComponent) assume that calls to render aren't nested;\n // verify that that's the case. (Strictly speaking, unmounting won't cause a\n // render but we still don't expect to be in a render call here.)\n true ? warning(ReactCurrentOwner.current == null, 'unmountComponentAtNode(): Render methods should be a pure function ' + 'of props and state; triggering nested component updates from render ' + 'is not allowed. If necessary, trigger nested updates in ' + 'componentDidUpdate. Check the render method of %s.', ReactCurrentOwner.current && ReactCurrentOwner.current.getName() || 'ReactCompositeComponent') : undefined;\n\n !(container && (container.nodeType === ELEMENT_NODE_TYPE || container.nodeType === DOC_NODE_TYPE || container.nodeType === DOCUMENT_FRAGMENT_NODE_TYPE)) ? true ? invariant(false, 'unmountComponentAtNode(...): Target container is not a DOM element.') : invariant(false) : undefined;\n\n var reactRootID = getReactRootID(container);\n var component = instancesByReactRootID[reactRootID];\n if (!component) {\n // Check if the node being unmounted was rendered by React, but isn't a\n // root node.\n var containerHasNonRootReactChild = hasNonRootReactChild(container);\n\n // Check if the container itself is a React root node.\n var containerID = internalGetID(container);\n var isContainerReactRoot = containerID && containerID === ReactInstanceHandles.getReactRootIDFromNodeID(containerID);\n\n if (true) {\n true ? warning(!containerHasNonRootReactChild, 'unmountComponentAtNode(): The node you\\'re attempting to unmount ' + 'was rendered by React and is not a top-level container. %s', isContainerReactRoot ? 'You may have accidentally passed in a React root node instead ' + 'of its container.' : 'Instead, have the parent component update its state and ' + 'rerender in order to remove this component.') : undefined;\n }\n\n return false;\n }\n ReactUpdates.batchedUpdates(unmountComponentFromNode, component, container);\n delete instancesByReactRootID[reactRootID];\n delete containersByReactRootID[reactRootID];\n if (true) {\n delete rootElementsByReactRootID[reactRootID];\n }\n return true;\n },\n\n /**\n * Finds the container DOM element that contains React component to which the\n * supplied DOM `id` belongs.\n *\n * @param {string} id The ID of an element rendered by a React component.\n * @return {?DOMElement} DOM element that contains the `id`.\n */\n findReactContainerForID: function (id) {\n var reactRootID = ReactInstanceHandles.getReactRootIDFromNodeID(id);\n var container = containersByReactRootID[reactRootID];\n\n if (true) {\n var rootElement = rootElementsByReactRootID[reactRootID];\n if (rootElement && rootElement.parentNode !== container) {\n true ? warning(\n // Call internalGetID here because getID calls isValid which calls\n // findReactContainerForID (this function).\n internalGetID(rootElement) === reactRootID, 'ReactMount: Root element ID differed from reactRootID.') : undefined;\n var containerChild = container.firstChild;\n if (containerChild && reactRootID === internalGetID(containerChild)) {\n // If the container has a new child with the same ID as the old\n // root element, then rootElementsByReactRootID[reactRootID] is\n // just stale and needs to be updated. The case that deserves a\n // warning is when the container is empty.\n rootElementsByReactRootID[reactRootID] = containerChild;\n } else {\n true ? warning(false, 'ReactMount: Root element has been removed from its original ' + 'container. New container: %s', rootElement.parentNode) : undefined;\n }\n }\n }\n\n return container;\n },\n\n /**\n * Finds an element rendered by React with the supplied ID.\n *\n * @param {string} id ID of a DOM node in the React component.\n * @return {DOMElement} Root DOM node of the React component.\n */\n findReactNodeByID: function (id) {\n var reactRoot = ReactMount.findReactContainerForID(id);\n return ReactMount.findComponentRoot(reactRoot, id);\n },\n\n /**\n * Traverses up the ancestors of the supplied node to find a node that is a\n * DOM representation of a React component rendered by this copy of React.\n *\n * @param {*} node\n * @return {?DOMEventTarget}\n * @internal\n */\n getFirstReactDOM: function (node) {\n return findFirstReactDOMImpl(node);\n },\n\n /**\n * Finds a node with the supplied `targetID` inside of the supplied\n * `ancestorNode`. Exploits the ID naming scheme to perform the search\n * quickly.\n *\n * @param {DOMEventTarget} ancestorNode Search from this root.\n * @pararm {string} targetID ID of the DOM representation of the component.\n * @return {DOMEventTarget} DOM node with the supplied `targetID`.\n * @internal\n */\n findComponentRoot: function (ancestorNode, targetID) {\n var firstChildren = findComponentRootReusableArray;\n var childIndex = 0;\n\n var deepestAncestor = findDeepestCachedAncestor(targetID) || ancestorNode;\n\n if (true) {\n // This will throw on the next line; give an early warning\n true ? warning(deepestAncestor != null, 'React can\\'t find the root component node for data-reactid value ' + '`%s`. If you\\'re seeing this message, it probably means that ' + 'you\\'ve loaded two copies of React on the page. At this time, only ' + 'a single copy of React can be loaded at a time.', targetID) : undefined;\n }\n\n firstChildren[0] = deepestAncestor.firstChild;\n firstChildren.length = 1;\n\n while (childIndex < firstChildren.length) {\n var child = firstChildren[childIndex++];\n var targetChild;\n\n while (child) {\n var childID = ReactMount.getID(child);\n if (childID) {\n // Even if we find the node we're looking for, we finish looping\n // through its siblings to ensure they're cached so that we don't have\n // to revisit this node again. Otherwise, we make n^2 calls to getID\n // when visiting the many children of a single node in order.\n\n if (targetID === childID) {\n targetChild = child;\n } else if (ReactInstanceHandles.isAncestorIDOf(childID, targetID)) {\n // If we find a child whose ID is an ancestor of the given ID,\n // then we can be sure that we only want to search the subtree\n // rooted at this child, so we can throw out the rest of the\n // search state.\n firstChildren.length = childIndex = 0;\n firstChildren.push(child.firstChild);\n }\n } else {\n // If this child had no ID, then there's a chance that it was\n // injected automatically by the browser, as when a ``\n // element sprouts an extra `` child as a side effect of\n // `.innerHTML` parsing. Optimistically continue down this\n // branch, but not before examining the other siblings.\n firstChildren.push(child.firstChild);\n }\n\n child = child.nextSibling;\n }\n\n if (targetChild) {\n // Emptying firstChildren/findComponentRootReusableArray is\n // not necessary for correctness, but it helps the GC reclaim\n // any nodes that were left at the end of the search.\n firstChildren.length = 0;\n\n return targetChild;\n }\n }\n\n firstChildren.length = 0;\n\n true ? true ? invariant(false, 'findComponentRoot(..., %s): Unable to find element. This probably ' + 'means the DOM was unexpectedly mutated (e.g., by the browser), ' + 'usually due to forgetting a when using tables, nesting tags ' + 'like ,

, or , or using non-SVG elements in an ' + 'parent. ' + 'Try inspecting the child nodes of the element with React ID `%s`.', targetID, ReactMount.getID(ancestorNode)) : invariant(false) : undefined;\n },\n\n _mountImageIntoNode: function (markup, container, shouldReuseMarkup, transaction) {\n !(container && (container.nodeType === ELEMENT_NODE_TYPE || container.nodeType === DOC_NODE_TYPE || container.nodeType === DOCUMENT_FRAGMENT_NODE_TYPE)) ? true ? invariant(false, 'mountComponentIntoNode(...): Target container is not valid.') : invariant(false) : undefined;\n\n if (shouldReuseMarkup) {\n var rootElement = getReactRootElementInContainer(container);\n if (ReactMarkupChecksum.canReuseMarkup(markup, rootElement)) {\n return;\n } else {\n var checksum = rootElement.getAttribute(ReactMarkupChecksum.CHECKSUM_ATTR_NAME);\n rootElement.removeAttribute(ReactMarkupChecksum.CHECKSUM_ATTR_NAME);\n\n var rootMarkup = rootElement.outerHTML;\n rootElement.setAttribute(ReactMarkupChecksum.CHECKSUM_ATTR_NAME, checksum);\n\n var normalizedMarkup = markup;\n if (true) {\n // because rootMarkup is retrieved from the DOM, various normalizations\n // will have occurred which will not be present in `markup`. Here,\n // insert markup into a

or