web: fix eventlog height registration

This commit is contained in:
Maximilian Hils 2016-06-02 23:41:32 -07:00
parent 7afac747a8
commit 5321f15def
2 changed files with 35 additions and 22 deletions

View File

@ -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(

View File

@ -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 (