You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@ambari.apache.org by to...@apache.org on 2018/08/14 08:38:44 UTC
[ambari] branch branch-2.7 updated: [AMBARI-24425] [Log Search UI]
Create visible time histogram selection area (#2030)
This is an automated email from the ASF dual-hosted git repository.
tobiasistvan pushed a commit to branch branch-2.7
in repository https://gitbox.apache.org/repos/asf/ambari.git
The following commit(s) were added to refs/heads/branch-2.7 by this push:
new a494c1d [AMBARI-24425] [Log Search UI] Create visible time histogram selection area (#2030)
a494c1d is described below
commit a494c1d6814fe6d047520ebf6883039c02ded81a
Author: Istvan Tobias <to...@gmail.com>
AuthorDate: Tue Aug 14 10:38:41 2018 +0200
[AMBARI-24425] [Log Search UI] Create visible time histogram selection area (#2030)
(cherry picked from commit 0083d26b1c49e246904dd1201bffa57dd9198fc3)
---
.../src/app/classes/components/graph/time-graph.component.less | 4 ++--
.../src/app/classes/components/graph/time-graph.component.ts | 3 +++
.../ambari-logsearch-web/src/app/modules/shared/variables.less | 1 +
3 files changed, 6 insertions(+), 2 deletions(-)
diff --git a/ambari-logsearch/ambari-logsearch-web/src/app/classes/components/graph/time-graph.component.less b/ambari-logsearch/ambari-logsearch-web/src/app/classes/components/graph/time-graph.component.less
index af72943..73f1870 100644
--- a/ambari-logsearch/ambari-logsearch-web/src/app/classes/components/graph/time-graph.component.less
+++ b/ambari-logsearch/ambari-logsearch-web/src/app/classes/components/graph/time-graph.component.less
@@ -42,7 +42,7 @@
}
/deep/ rect.unselected-drag-area {
- fill: darken(@main-background-color, 10%);
- opacity: .6;
+ fill: @graph-invert-selection-background;
+ opacity: .4;
}
}
diff --git a/ambari-logsearch/ambari-logsearch-web/src/app/classes/components/graph/time-graph.component.ts b/ambari-logsearch/ambari-logsearch-web/src/app/classes/components/graph/time-graph.component.ts
index a20ac36..ad00a68 100644
--- a/ambari-logsearch/ambari-logsearch-web/src/app/classes/components/graph/time-graph.component.ts
+++ b/ambari-logsearch/ambari-logsearch-web/src/app/classes/components/graph/time-graph.component.ts
@@ -230,6 +230,7 @@ export class TimeGraphComponent extends GraphComponent implements OnInit {
this.dragStartX = Math.max(0, this.getDragX(containers[0]) - this.margin.left);
this.dragArea = this.svg.insert('rect', ':first-child').attr('x', this.dragStartX).attr('y', 0).attr('width', 0)
.attr('height', this.height).attr('class', 'drag-area');
+ this.createInvertDragArea(this.dragStartX, this.dragStartX);
})
.on('drag', (datum: undefined, index: number, containers: d3.ContainerElement[]): void => {
const mousePos = this.getDragX(containers[0]);
@@ -239,6 +240,7 @@ export class TimeGraphComponent extends GraphComponent implements OnInit {
this.dragArea.attr('x', startX).attr('width', currentWidth);
const timeRange = this.getTimeRangeByXRanges(startX, startX + currentWidth);
this.setChartTimeGap(new Date(timeRange[0]), new Date(timeRange[1]));
+ this.setInvertDragArea(startX, startX + currentWidth);
})
.on('end', (): void => {
const dragAreaDetails = this.dragArea.node().getBBox();
@@ -248,6 +250,7 @@ export class TimeGraphComponent extends GraphComponent implements OnInit {
const dateRange: [number, number] = this.getTimeRangeByXRanges(startX, endX);
this.selectArea.emit(dateRange);
this.dragArea.remove();
+ this.clearInvertDragArea();
this.setChartTimeGap(new Date(dateRange[0]), new Date(dateRange[1]));
}
})
diff --git a/ambari-logsearch/ambari-logsearch-web/src/app/modules/shared/variables.less b/ambari-logsearch/ambari-logsearch-web/src/app/modules/shared/variables.less
index 4b2677f..fb76842 100644
--- a/ambari-logsearch/ambari-logsearch-web/src/app/modules/shared/variables.less
+++ b/ambari-logsearch/ambari-logsearch-web/src/app/modules/shared/variables.less
@@ -77,6 +77,7 @@
// Graph
@graph-padding: .5rem;
+@graph-invert-selection-background: @grey-color;
// Log list
@log-list-row-data-padding: 8px;