;
}
}
});
var FilterInput = React.createClass({
getInitialState: function () {
// Consider both focus and mouseover for showing/hiding the tooltip,
// because onBlur of the input is triggered before the click on the tooltip
// finalized, hiding the tooltip just as the user clicks on it.
return {
value: this.props.value,
focus: false,
mousefocus: false
};
},
componentWillReceiveProps: function (nextProps) {
this.setState({value: nextProps.value});
},
onChange: function (e) {
var nextValue = e.target.value;
this.setState({
value: nextValue
});
// Only propagate valid filters upwards.
if (this.isValid(nextValue)) {
this.props.onChange(nextValue);
}
},
isValid: function (filt) {
try {
Filt.parse(filt || this.state.value);
return true;
} catch (e) {
return false;
}
},
getDesc: function () {
var desc;
try {
desc = Filt.parse(this.state.value).desc;
} catch (e) {
desc = "" + e;
}
if (desc !== "true") {
return desc;
} else {
return (
);
}
},
onFocus: function () {
this.setState({focus: true});
},
onBlur: function () {
this.setState({focus: false});
},
onMouseEnter: function () {
this.setState({mousefocus: true});
},
onMouseLeave: function () {
this.setState({mousefocus: false});
},
onKeyDown: function (e) {
if (e.keyCode === utils.Key.ESC || e.keyCode === utils.Key.ENTER) {
this.blur();
// If closed using ESC/ENTER, hide the tooltip.
this.setState({mousefocus: false});
}
},
blur: function () {
this.refs.input.getDOMNode().blur();
},
focus: function () {
this.refs.input.getDOMNode().select();
},
render: function () {
var isValid = this.isValid();
var icon = "fa fa-fw fa-" + this.props.type;
var groupClassName = "filter-input input-group" + (isValid ? "" : " has-error");
var popover;
if (this.state.focus || this.state.mousefocus) {
popover = (
{this.getDesc()}
);
}
return (
{popover}
);
}
});
var MainMenu = React.createClass({
mixins: [common.Navigation, common.State],
statics: {
title: "Start",
route: "flows"
},
onFilterChange: function (val) {
var d = {};
d[Query.FILTER] = val;
this.setQuery(d);
},
onHighlightChange: function (val) {
var d = {};
d[Query.HIGHLIGHT] = val;
this.setQuery(d);
},
onInterceptChange: function (val) {
actions.SettingsActions.update({intercept: val});
},
render: function () {
var filter = this.getQuery()[Query.FILTER] || "";
var highlight = this.getQuery()[Query.HIGHLIGHT] || "";
var intercept = this.props.settings.intercept || "";
return (
);
}
});
var ViewMenu = React.createClass({
statics: {
title: "View",
route: "flows"
},
mixins: [common.Navigation, common.State],
toggleEventLog: function () {
var d = {};
if (this.getQuery()[Query.SHOW_EVENTLOG]) {
d[Query.SHOW_EVENTLOG] = undefined;
} else {
d[Query.SHOW_EVENTLOG] = "t"; // any non-false value will do it, keep it short
}
this.setQuery(d);
},
render: function () {
var showEventLog = this.getQuery()[Query.SHOW_EVENTLOG];
return (
);
}
});
var ReportsMenu = React.createClass({
statics: {
title: "Visualization",
route: "reports"
},
render: function () {
return
Reports Menu
;
}
});
var FileMenu = React.createClass({
getInitialState: function () {
return {
showFileMenu: false
};
},
handleFileClick: function (e) {
e.preventDefault();
if (!this.state.showFileMenu) {
var close = function () {
this.setState({showFileMenu: false});
document.removeEventListener("click", close);
}.bind(this);
document.addEventListener("click", close);
this.setState({
showFileMenu: true
});
}
},
handleNewClick: function (e) {
e.preventDefault();
if (confirm("Delete all flows?")) {
actions.FlowActions.clear();
}
},
handleOpenClick: function (e) {
e.preventDefault();
console.error("unimplemented: handleOpenClick");
},
handleSaveClick: function (e) {
e.preventDefault();
console.error("unimplemented: handleSaveClick");
},
handleShutdownClick: function (e) {
e.preventDefault();
console.error("unimplemented: handleShutdownClick");
},
render: function () {
var fileMenuClass = "dropdown pull-left" + (this.state.showFileMenu ? " open" : "");
return (