diff options
-rw-r--r-- | mitmproxy/web/static/app.js | 30 | ||||
-rw-r--r-- | web/src/js/components/eventlog.js | 27 |
2 files changed, 35 insertions, 22 deletions
diff --git a/mitmproxy/web/static/app.js b/mitmproxy/web/static/app.js index 2a5cc44e..e1e4b22b 100644 --- a/mitmproxy/web/static/app.js +++ b/mitmproxy/web/static/app.js @@ -1240,20 +1240,21 @@ function _possibleConstructorReturn(self, call) { if (!self) { throw new Referen function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; } function LogIcon(_ref) { - var entry = _ref.entry; + var event = _ref.event; - var icon = { web: "html5", debug: "bug" }[entry.level] || "info"; + var icon = { web: "html5", debug: "bug" }[event.level] || "info"; return _react2.default.createElement("i", { className: "fa fa-fw fa-" + icon }); } function LogEntry(_ref2) { - var entry = _ref2.entry; + var event = _ref2.event; + var registerHeight = _ref2.registerHeight; return _react2.default.createElement( "div", - null, - _react2.default.createElement(LogIcon, { entry: entry }), - entry.message + { ref: registerHeight }, + _react2.default.createElement(LogIcon, { event: event }), + event.message ); } @@ -1311,9 +1312,10 @@ var EventLogContents = function (_React$Component) { } }, { key: "setHeight", - value: function setHeight(id, ref) { - if (ref && !this.heights[id]) { - var height = _reactDom2.default.findDOMNode(ref).offsetHeight; + value: function setHeight(id, node) { + console.log("setHeight", id, node); + if (node && !this.heights[id]) { + var height = node.offsetHeight; if (this.heights[id] !== height) { this.heights[id] = height; this.onViewportUpdate(); @@ -1326,8 +1328,14 @@ var EventLogContents = function (_React$Component) { var _this3 = this; var vScroll = this.state.vScroll; - var events = this.props.events.slice(vScroll.start, vScroll.end).map(function (entry) { - return _react2.default.createElement(LogEntry, { entry: entry, key: entry.id, ref: _this3.setHeight.bind(_this3, entry.id) }); + var events = this.props.events.slice(vScroll.start, vScroll.end).map(function (event) { + return _react2.default.createElement(LogEntry, { + event: event, + key: event.id, + registerHeight: function registerHeight(node) { + return _this3.setHeight(event.id, node); + } + }); }); return _react2.default.createElement( diff --git a/web/src/js/components/eventlog.js b/web/src/js/components/eventlog.js index 0857056c..95889a66 100644 --- a/web/src/js/components/eventlog.js +++ b/web/src/js/components/eventlog.js @@ -7,15 +7,15 @@ import AutoScroll from "./helpers/AutoScroll"; import {calcVScroll} from "./helpers/VirtualScroll" import {ToggleButton} from "./common"; -function LogIcon({entry}) { - let icon = {web: "html5", debug: "bug"}[entry.level] || "info"; +function LogIcon({event}) { + let icon = {web: "html5", debug: "bug"}[event.level] || "info"; return <i className={`fa fa-fw fa-${icon}`}></i> } -function LogEntry({entry}) { - return <div> - <LogIcon entry={entry}/> - {entry.message} +function LogEntry({event, registerHeight}) { + return <div ref={registerHeight}> + <LogIcon event={event}/> + {event.message} </div>; } @@ -63,9 +63,10 @@ class EventLogContents extends React.Component { } } - setHeight(id, ref) { - if (ref && !this.heights[id]) { - const height = ReactDOM.findDOMNode(ref).offsetHeight; + setHeight(id, node) { + console.log("setHeight", id, node); + if (node && !this.heights[id]) { + const height = node.offsetHeight; if (this.heights[id] !== height) { this.heights[id] = height; this.onViewportUpdate(); @@ -77,8 +78,12 @@ class EventLogContents extends React.Component { const vScroll = this.state.vScroll; const events = this.props.events .slice(vScroll.start, vScroll.end) - .map(entry => - <LogEntry entry={entry} key={entry.id} ref={this.setHeight.bind(this, entry.id)}/> + .map(event => + <LogEntry + event={event} + key={event.id} + registerHeight={(node) => this.setHeight(event.id, node)} + /> ); return ( |