Skip to content

N
nexpie-grafana-theme
Commit 0f57c4b2 by Marcus Efraimsson
Options

create time regions solely based on utc time

parent e8e189d1
Showing with 110 additions and 60 deletions
public/app/plugins/panel/graph/specs/time_region_manager.test.ts
......@@ -28,7 +28,10 @@ describe('TimeRegionManager', () => {
};
ctx.printScenario = () => {
console.log(`Time range: from=${ctx.panelCtrl.range.from.format()}, to=${ctx.panelCtrl.range.to.format()}`);
console.log(
`Time range: from=${ctx.panelCtrl.range.from.format()}, to=${ctx.panelCtrl.range.to.format()}`,
ctx.panelCtrl.range.from._isUTC
);
ctx.options.grid.markings.forEach((m, i) => {
console.log(
`Marking (${i}): from=${moment(m.xaxis.from).format()}, to=${moment(m.xaxis.to).format()}, color=${m.color}`
......@@ -40,11 +43,11 @@ describe('TimeRegionManager', () => {
});
}
describe('When creating plot markings', () => {
describe('When creating plot markings using local time', () => {
plotOptionsScenario('for day of week region', ctx => {
const regions = [{ fromDayOfWeek: 1, toDayOfWeek: 1, fill: true, line: true, colorMode: 'red' }];
const from = moment('2018-01-01 00:00');
const to = moment('2018-01-01 23:59');
const from = moment('2018-01-01T00:00:00+01:00');
const to = moment('2018-01-01T23:59:00+01:00');
ctx.setup(regions, from, to);
it('should add 3 markings', () => {
......@@ -53,30 +56,30 @@ describe('TimeRegionManager', () => {
it('should add fill', () => {
const markings = ctx.options.grid.markings;
expect(moment(markings[0].xaxis.from).format()).toBe(from.format());
expect(moment(markings[0].xaxis.to).format()).toBe(to.format());
expect(moment(markings[0].xaxis.from).format()).toBe(moment('2018-01-01T01:00:00+01:00').format());
expect(moment(markings[0].xaxis.to).format()).toBe(moment('2018-01-02T00:59:59+01:00').format());
expect(markings[0].color).toBe(colorModes.red.color.fill);
});
it('should add line before', () => {
const markings = ctx.options.grid.markings;
expect(moment(markings[1].xaxis.from).format()).toBe(from.format());
expect(moment(markings[1].xaxis.to).format()).toBe(from.format());
expect(moment(markings[1].xaxis.from).format()).toBe(moment('2018-01-01T01:00:00+01:00').format());
expect(moment(markings[1].xaxis.to).format()).toBe(moment('2018-01-01T01:00:00+01:00').format());
expect(markings[1].color).toBe(colorModes.red.color.line);
});
it('should add line after', () => {
const markings = ctx.options.grid.markings;
expect(moment(markings[2].xaxis.from).format()).toBe(to.format());
expect(moment(markings[2].xaxis.to).format()).toBe(to.format());
expect(moment(markings[2].xaxis.from).format()).toBe(moment('2018-01-02T00:59:59+01:00').format());
expect(moment(markings[2].xaxis.to).format()).toBe(moment('2018-01-02T00:59:59+01:00').format());
expect(markings[2].color).toBe(colorModes.red.color.line);
});
});
plotOptionsScenario('for time from region', ctx => {
const regions = [{ from: '05:00', fill: true, colorMode: 'red' }];
const from = moment('2018-01-01 00:00');
const to = moment('2018-01-03 23:59');
const from = moment('2018-01-01T00:00+01:00');
const to = moment('2018-01-03T23:59+01:00');
ctx.setup(regions, from, to);
it('should add 3 markings', () => {
......@@ -86,27 +89,24 @@ describe('TimeRegionManager', () => {
it('should add one fill at 05:00 each day', () => {
const markings = ctx.options.grid.markings;
const firstFill = moment(from.add(5, 'hours'));
expect(moment(markings[0].xaxis.from).format()).toBe(firstFill.format());
expect(moment(markings[0].xaxis.to).format()).toBe(firstFill.format());
expect(moment(markings[0].xaxis.from).format()).toBe(moment('2018-01-01T06:00:00+01:00').format());
expect(moment(markings[0].xaxis.to).format()).toBe(moment('2018-01-01T06:00:00+01:00').format());
expect(markings[0].color).toBe(colorModes.red.color.fill);
const secondFill = moment(firstFill).add(1, 'days');
expect(moment(markings[1].xaxis.from).format()).toBe(secondFill.format());
expect(moment(markings[1].xaxis.to).format()).toBe(secondFill.format());
expect(moment(markings[1].xaxis.from).format()).toBe(moment('2018-01-02T06:00:00+01:00').format());
expect(moment(markings[1].xaxis.to).format()).toBe(moment('2018-01-02T06:00:00+01:00').format());
expect(markings[1].color).toBe(colorModes.red.color.fill);
const thirdFill = moment(secondFill).add(1, 'days');
expect(moment(markings[2].xaxis.from).format()).toBe(thirdFill.format());
expect(moment(markings[2].xaxis.to).format()).toBe(thirdFill.format());
expect(moment(markings[2].xaxis.from).format()).toBe(moment('2018-01-03T06:00:00+01:00').format());
expect(moment(markings[2].xaxis.to).format()).toBe(moment('2018-01-03T06:00:00+01:00').format());
expect(markings[2].color).toBe(colorModes.red.color.fill);
});
});
plotOptionsScenario('for time to region', ctx => {
const regions = [{ to: '05:00', fill: true, colorMode: 'red' }];
const from = moment('2018-02-01 00:00');
const to = moment('2018-02-03 23:59');
const from = moment('2018-02-01T00:00+01:00');
const to = moment('2018-02-03T23:59+01:00');
ctx.setup(regions, from, to);
it('should add 3 markings', () => {
......@@ -116,27 +116,24 @@ describe('TimeRegionManager', () => {
it('should add one fill at 05:00 each day', () => {
const markings = ctx.options.grid.markings;
const firstFill = moment(from.add(5, 'hours'));
expect(moment(markings[0].xaxis.from).format()).toBe(firstFill.format());
expect(moment(markings[0].xaxis.to).format()).toBe(firstFill.format());
expect(moment(markings[0].xaxis.from).format()).toBe(moment('2018-02-01T06:00:00+01:00').format());
expect(moment(markings[0].xaxis.to).format()).toBe(moment('2018-02-01T06:00:00+01:00').format());
expect(markings[0].color).toBe(colorModes.red.color.fill);
const secondFill = moment(firstFill).add(1, 'days');
expect(moment(markings[1].xaxis.from).format()).toBe(secondFill.format());
expect(moment(markings[1].xaxis.to).format()).toBe(secondFill.format());
expect(moment(markings[1].xaxis.from).format()).toBe(moment('2018-02-02T06:00:00+01:00').format());
expect(moment(markings[1].xaxis.to).format()).toBe(moment('2018-02-02T06:00:00+01:00').format());
expect(markings[1].color).toBe(colorModes.red.color.fill);
const thirdFill = moment(secondFill).add(1, 'days');
expect(moment(markings[2].xaxis.from).format()).toBe(thirdFill.format());
expect(moment(markings[2].xaxis.to).format()).toBe(thirdFill.format());
expect(moment(markings[2].xaxis.from).format()).toBe(moment('2018-02-03T06:00:00+01:00').format());
expect(moment(markings[2].xaxis.to).format()).toBe(moment('2018-02-03T06:00:00+01:00').format());
expect(markings[2].color).toBe(colorModes.red.color.fill);
});
});
plotOptionsScenario('for day of week from/to region', ctx => {
const regions = [{ fromDayOfWeek: 7, toDayOfWeek: 7, fill: true, colorMode: 'red' }];
const from = moment('2018-01-01 18:45:05');
const to = moment('2018-01-22 08:27:00');
const from = moment('2018-01-01T18:45:05+01:00');
const to = moment('2018-01-22T08:27:00+01:00');
ctx.setup(regions, from, to);
it('should add 3 markings', () => {
......@@ -146,24 +143,24 @@ describe('TimeRegionManager', () => {
it('should add one fill at each sunday', () => {
const markings = ctx.options.grid.markings;
expect(moment(markings[0].xaxis.from).format()).toBe(moment('2018-01-07 00:00:00').format());
expect(moment(markings[0].xaxis.to).format()).toBe(moment('2018-01-07 23:59:59').format());
expect(moment(markings[0].xaxis.from).format()).toBe(moment('2018-01-07T01:00:00+01:00').format());
expect(moment(markings[0].xaxis.to).format()).toBe(moment('2018-01-08T00:59:59+01:00').format());
expect(markings[0].color).toBe(colorModes.red.color.fill);
expect(moment(markings[1].xaxis.from).format()).toBe(moment('2018-01-14 00:00:00').format());
expect(moment(markings[1].xaxis.to).format()).toBe(moment('2018-01-14 23:59:59').format());
expect(moment(markings[1].xaxis.from).format()).toBe(moment('2018-01-14T01:00:00+01:00').format());
expect(moment(markings[1].xaxis.to).format()).toBe(moment('2018-01-15T00:59:59+01:00').format());
expect(markings[1].color).toBe(colorModes.red.color.fill);
expect(moment(markings[2].xaxis.from).format()).toBe(moment('2018-01-21 00:00:00').format());
expect(moment(markings[2].xaxis.to).format()).toBe(moment('2018-01-21 23:59:59').format());
expect(moment(markings[2].xaxis.from).format()).toBe(moment('2018-01-21T01:00:00+01:00').format());
expect(moment(markings[2].xaxis.to).format()).toBe(moment('2018-01-22T00:59:59+01:00').format());
expect(markings[2].color).toBe(colorModes.red.color.fill);
});
});
plotOptionsScenario('for day of week from region', ctx => {
const regions = [{ fromDayOfWeek: 7, fill: true, colorMode: 'red' }];
const from = moment('2018-01-01 18:45:05');
const to = moment('2018-01-22 08:27:00');
const from = moment('2018-01-01T18:45:05+01:00');
const to = moment('2018-01-22T08:27:00+01:00');
ctx.setup(regions, from, to);
it('should add 3 markings', () => {
......@@ -173,24 +170,24 @@ describe('TimeRegionManager', () => {
it('should add one fill at each sunday', () => {
const markings = ctx.options.grid.markings;
expect(moment(markings[0].xaxis.from).format()).toBe(moment('2018-01-07 00:00:00').format());
expect(moment(markings[0].xaxis.to).format()).toBe(moment('2018-01-07 23:59:59').format());
expect(moment(markings[0].xaxis.from).format()).toBe(moment('2018-01-07T01:00:00+01:00').format());
expect(moment(markings[0].xaxis.to).format()).toBe(moment('2018-01-08T00:59:59+01:00').format());
expect(markings[0].color).toBe(colorModes.red.color.fill);
expect(moment(markings[1].xaxis.from).format()).toBe(moment('2018-01-14 00:00:00').format());
expect(moment(markings[1].xaxis.to).format()).toBe(moment('2018-01-14 23:59:59').format());
expect(moment(markings[1].xaxis.from).format()).toBe(moment('2018-01-14T01:00:00+01:00').format());
expect(moment(markings[1].xaxis.to).format()).toBe(moment('2018-01-15T00:59:59+01:00').format());
expect(markings[1].color).toBe(colorModes.red.color.fill);
expect(moment(markings[2].xaxis.from).format()).toBe(moment('2018-01-21 00:00:00').format());
expect(moment(markings[2].xaxis.to).format()).toBe(moment('2018-01-21 23:59:59').format());
expect(moment(markings[2].xaxis.from).format()).toBe(moment('2018-01-21T01:00:00+01:00').format());
expect(moment(markings[2].xaxis.to).format()).toBe(moment('2018-01-22T00:59:59+01:00').format());
expect(markings[2].color).toBe(colorModes.red.color.fill);
});
});
plotOptionsScenario('for day of week to region', ctx => {
const regions = [{ toDayOfWeek: 7, fill: true, colorMode: 'red' }];
const from = moment('2018-01-01 18:45:05');
const to = moment('2018-01-22 08:27:00');
const from = moment('2018-01-01T18:45:05+01:00');
const to = moment('2018-01-22T08:27:00+01:00');
ctx.setup(regions, from, to);
it('should add 3 markings', () => {
......@@ -200,18 +197,66 @@ describe('TimeRegionManager', () => {
it('should add one fill at each sunday', () => {
const markings = ctx.options.grid.markings;
expect(moment(markings[0].xaxis.from).format()).toBe(moment('2018-01-07 00:00:00').format());
expect(moment(markings[0].xaxis.to).format()).toBe(moment('2018-01-07 23:59:59').format());
expect(moment(markings[0].xaxis.from).format()).toBe(moment('2018-01-07T01:00:00+01:00').format());
expect(moment(markings[0].xaxis.to).format()).toBe(moment('2018-01-08T00:59:59+01:00').format());
expect(markings[0].color).toBe(colorModes.red.color.fill);
expect(moment(markings[1].xaxis.from).format()).toBe(moment('2018-01-14 00:00:00').format());
expect(moment(markings[1].xaxis.to).format()).toBe(moment('2018-01-14 23:59:59').format());
expect(moment(markings[1].xaxis.from).format()).toBe(moment('2018-01-14T01:00:00+01:00').format());
expect(moment(markings[1].xaxis.to).format()).toBe(moment('2018-01-15T00:59:59+01:00').format());
expect(markings[1].color).toBe(colorModes.red.color.fill);
expect(moment(markings[2].xaxis.from).format()).toBe(moment('2018-01-21 00:00:00').format());
expect(moment(markings[2].xaxis.to).format()).toBe(moment('2018-01-21 23:59:59').format());
expect(moment(markings[2].xaxis.from).format()).toBe(moment('2018-01-21T01:00:00+01:00').format());
expect(moment(markings[2].xaxis.to).format()).toBe(moment('2018-01-22T00:59:59+01:00').format());
expect(markings[2].color).toBe(colorModes.red.color.fill);
});
});
plotOptionsScenario('for day of week from/to time region with daylight saving time', ctx => {
const regions = [{ fromDayOfWeek: 7, from: '20:00', toDayOfWeek: 7, to: '23:00', fill: true, colorMode: 'red' }];
const from = moment('2018-03-17T06:00:00+01:00');
const to = moment('2018-04-03T06:00:00+02:00');
ctx.setup(regions, from, to);
it('should add 3 markings', () => {
expect(ctx.options.grid.markings.length).toBe(3);
});
it('should add one fill at each sunday between 20:00 and 23:00', () => {
const markings = ctx.options.grid.markings;
expect(moment(markings[0].xaxis.from).format()).toBe(moment('2018-03-18T21:00:00+01:00').format());
expect(moment(markings[0].xaxis.to).format()).toBe(moment('2018-03-19T00:00:00+01:00').format());
expect(moment(markings[1].xaxis.from).format()).toBe(moment('2018-03-25T22:00:00+02:00').format());
expect(moment(markings[1].xaxis.to).format()).toBe(moment('2018-03-26T01:00:00+02:00').format());
expect(moment(markings[2].xaxis.from).format()).toBe(moment('2018-04-01T22:00:00+02:00').format());
expect(moment(markings[2].xaxis.to).format()).toBe(moment('2018-04-02T01:00:00+02:00').format());
});
});
plotOptionsScenario('for each day of week with winter time', ctx => {
const regions = [{ fromDayOfWeek: 7, toDayOfWeek: 7, fill: true, colorMode: 'red' }];
const from = moment('2018-10-20T14:50:11+02:00');
const to = moment('2018-11-07T12:56:23+01:00');
ctx.setup(regions, from, to);
it('should add 3 markings', () => {
expect(ctx.options.grid.markings.length).toBe(3);
});
it('should add one fill at each sunday', () => {
const markings = ctx.options.grid.markings;
expect(moment(markings[0].xaxis.from).format()).toBe(moment('2018-10-21T02:00:00+02:00').format());
expect(moment(markings[0].xaxis.to).format()).toBe(moment('2018-10-22T01:59:59+02:00').format());
expect(moment(markings[1].xaxis.from).format()).toBe(moment('2018-10-28T02:00:00+02:00').format());
expect(moment(markings[1].xaxis.to).format()).toBe(moment('2018-10-29T00:59:59+01:00').format());
expect(moment(markings[2].xaxis.from).format()).toBe(moment('2018-11-04T01:00:00+01:00').format());
expect(moment(markings[2].xaxis.to).format()).toBe(moment('2018-11-05T00:59:59+01:00').format());
});
});
});
});
public/app/plugins/panel/graph/time_region_manager.ts
......@@ -82,9 +82,7 @@ export class TimeRegionManager {
return;
}
const tRange = this.panelCtrl.dashboard.isTimezoneUtc()
? { from: this.panelCtrl.range.from, to: this.panelCtrl.range.to }
: { from: this.panelCtrl.range.from.local(), to: this.panelCtrl.range.to.local() };
const tRange = { from: moment(this.panelCtrl.range.from).utc(), to: moment(this.panelCtrl.range.to).utc() };
let i, hRange, timeRegion, regions, fromStart, fromEnd, timeRegionColor;
......@@ -188,7 +186,14 @@ export class TimeRegionManager {
fromEnd.add(24, 'hours');
}
regions.push({ from: fromStart.valueOf(), to: fromEnd.valueOf() });
const outsideRange =
(fromStart.unix() < tRange.from.unix() && fromEnd.unix() < tRange.from.unix()) ||
(fromStart.unix() > tRange.to.unix() && fromEnd.unix() > tRange.to.unix());
if (!outsideRange) {
regions.push({ from: fromStart.valueOf(), to: fromEnd.valueOf() });
}
fromStart.add(24, 'hours');
}
}
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment