diff --git a/frontend/src/metabase/components/OnClickOutsideWrapper.jsx b/frontend/src/metabase/components/OnClickOutsideWrapper.jsx index d8c8d7bf01eecf4e6756e6683100776b657584d0..700ff3fa880ba49a609b6a4ebfc237eef8ffbfc3 100644 --- a/frontend/src/metabase/components/OnClickOutsideWrapper.jsx +++ b/frontend/src/metabase/components/OnClickOutsideWrapper.jsx @@ -30,14 +30,14 @@ export default class OnClickOutsideWrapper extends Component { document.addEventListener("keydown", this._handleKeyPress, false); } if (this.props.dismissOnClickOutside) { - window.addEventListener("click", this._handleClick, true); + window.addEventListener("mousedown", this._handleClick, true); } }, 0); } componentWillUnmount() { document.removeEventListener("keydown", this._handleKeyPress, false); - window.removeEventListener("click", this._handleClick, true); + window.removeEventListener("mousedown", this._handleClick, true); clearTimeout(this._timeout); // remove from the stack after a delay, if it is removed through some other diff --git a/frontend/src/metabase/visualizations/lib/LineAreaBarRenderer.js b/frontend/src/metabase/visualizations/lib/LineAreaBarRenderer.js index af7a705ac3df132e8b95056f86904438a00e14b5..caf7ab01f25fa2a3dac4d9872f4dcb3dd8d90917 100644 --- a/frontend/src/metabase/visualizations/lib/LineAreaBarRenderer.js +++ b/frontend/src/metabase/visualizations/lib/LineAreaBarRenderer.js @@ -385,72 +385,80 @@ function applyChartTooltips(chart, series, isStacked, isScalarSeries, onHoverCha } if (onVisualizationClick) { - chart.selectAll(".bar, .dot, .area, .bubble") - .style({ "cursor": "pointer" }) - .on("click", function(d) { - const seriesIndex = determineSeriesIndexFromElement(this, isStacked); - const card = series[seriesIndex].card; - const isSingleSeriesBar = this.classList.contains("bar") && series.length === 1; - - let clicked: ?ClickObject; - if (Array.isArray(d.key)) { // scatter - clicked = { - value: d.key[2], - column: cols[2], - dimensions: [ - { value: d.key[0], column: cols[0] }, - { value: d.key[1], column: cols[1] } - ], - origin: d.key._origin - } - } else if (isScalarSeries) { - // special case for multi-series scalar series, which should be treated as scalars - clicked = { - value: d.data.value, - column: series[seriesIndex].data.cols[1] - }; - } else if (d.data) { // line, area, bar - if (!isSingleSeriesBar) { - cols = series[seriesIndex].data.cols; - } - clicked = { - value: d.data.value, - column: cols[1], - dimensions: [ - { value: d.data.key, column: cols[0] } - ] - } - } else { - clicked = { - dimensions: [] - }; + const onClick = function(d) { + const seriesIndex = determineSeriesIndexFromElement(this, isStacked); + const card = series[seriesIndex].card; + const isSingleSeriesBar = this.classList.contains("bar") && series.length === 1; + + let clicked: ?ClickObject; + if (Array.isArray(d.key)) { // scatter + clicked = { + value: d.key[2], + column: cols[2], + dimensions: [ + { value: d.key[0], column: cols[0] }, + { value: d.key[1], column: cols[1] } + ].filter(({ column }) => + // don't include aggregations since we can't filter on them + column.source !== "aggregation" + ), + origin: d.key._origin } - - // handle multiseries - if (clicked && series.length > 1) { - if (card._breakoutColumn) { - // $FlowFixMe - clicked.dimensions.push({ - value: card._breakoutValue, - column: card._breakoutColumn - }); - } + } else if (isScalarSeries) { + // special case for multi-series scalar series, which should be treated as scalars + clicked = { + value: d.data.value, + column: series[seriesIndex].data.cols[1] + }; + } else if (d.data) { // line, area, bar + if (!isSingleSeriesBar) { + cols = series[seriesIndex].data.cols; } - - if (card._seriesIndex != null) { - // $FlowFixMe - clicked.seriesIndex = card._seriesIndex; + clicked = { + value: d.data.value, + column: cols[1], + dimensions: [ + { value: d.data.key, column: cols[0] } + ] } + } else { + clicked = { + dimensions: [] + }; + } - if (clicked) { - const isLine = this.classList.contains("dot"); - onVisualizationClick({ - ...clicked, - element: isLine ? this : null, - event: isLine ? null : d3.event, + // handle multiseries + if (clicked && series.length > 1) { + if (card._breakoutColumn) { + // $FlowFixMe + clicked.dimensions.push({ + value: card._breakoutValue, + column: card._breakoutColumn }); } - }); + } + + if (card._seriesIndex != null) { + // $FlowFixMe + clicked.seriesIndex = card._seriesIndex; + } + + if (clicked) { + const isLine = this.classList.contains("dot"); + onVisualizationClick({ + ...clicked, + element: isLine ? this : null, + event: isLine ? null : d3.event, + }); + } + } + + chart.selectAll(".dot, .area, .bubble") + .style({ "cursor": "pointer" }) + .on("click", onClick); + chart.selectAll(".bar") + .style({ "cursor": "pointer" }) + .on("mousedown", onClick); } }); } diff --git a/frontend/src/metabase/visualizations/lib/graph/brush.js b/frontend/src/metabase/visualizations/lib/graph/brush.js index 02b222fd4e20cc4d80572b395238b688caaba9db..68133fc1b3fc2c5859645b6208c1ed72775d7ad0 100644 --- a/frontend/src/metabase/visualizations/lib/graph/brush.js +++ b/frontend/src/metabase/visualizations/lib/graph/brush.js @@ -68,8 +68,8 @@ export function initBrush(parent, child, onBrushChange, onBrushEnd) { if (e.keyCode === KEYCODE_ESCAPE) { // set the "cancelled" flag cancelled = true; - // hide the brush - parent.select(".brush").style("opacity", 0); + // dispatch a mouseup to end brushing early + window.dispatchEvent(new MouseEvent("mouseup")); } };