1// Copyright (C) 2019 The Android Open Source Project
2//
3// Licensed under the Apache License, Version 2.0 (the "License");
4// you may not use size file except in compliance with the License.
5// You may obtain a copy of the License at
6//
7//      http://www.apache.org/licenses/LICENSE-2.0
8//
9// Unless required by applicable law or agreed to in writing, software
10// distributed under the License is distributed on an "AS IS" BASIS,
11// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
12// See the License for the specific language governing permissions and
13// limitations under the License.
14
15import * as m from 'mithril';
16import {fromNs} from '../common/time';
17
18import {TRACK_SHELL_WIDTH} from './css_constants';
19import {globals} from './globals';
20import {gridlines} from './gridline_helper';
21import {Panel, PanelSize} from './panel';
22
23// This is used to display the summary of search results.
24export class TickmarkPanel extends Panel {
25  view() {
26    return m('.tickbar');
27  }
28
29  renderCanvas(ctx: CanvasRenderingContext2D, size: PanelSize) {
30    const {timeScale, visibleWindowTime} = globals.frontendLocalState;
31
32    ctx.fillStyle = '#999';
33    ctx.fillRect(TRACK_SHELL_WIDTH - 2, 0, 2, size.height);
34    for (const xAndTime of gridlines(
35             size.width, visibleWindowTime, timeScale)) {
36      ctx.fillRect(xAndTime[0], 0, 1, size.height);
37    }
38
39    const data = globals.searchSummary;
40    for (let i = 0; i < data.tsStarts.length; i++) {
41      const tStart = data.tsStarts[i];
42      const tEnd = data.tsEnds[i];
43      if (tEnd <= visibleWindowTime.start || tStart >= visibleWindowTime.end) {
44        continue;
45      }
46      const rectStart =
47          Math.max(timeScale.timeToPx(tStart), 0) + TRACK_SHELL_WIDTH;
48      const rectEnd = timeScale.timeToPx(tEnd) + TRACK_SHELL_WIDTH;
49      ctx.fillStyle = '#ffe263';
50      ctx.fillRect(
51          Math.floor(rectStart),
52          0,
53          Math.ceil(rectEnd - rectStart),
54          size.height);
55    }
56    const index = globals.frontendLocalState.searchIndex;
57    const startSec = fromNs(globals.currentSearchResults.tsStarts[index]);
58    const triangleStart =
59        Math.max(timeScale.timeToPx(startSec), 0) + TRACK_SHELL_WIDTH;
60    ctx.fillStyle = '#000';
61    ctx.beginPath();
62    ctx.moveTo(triangleStart, size.height);
63    ctx.lineTo(triangleStart - 3, 0);
64    ctx.lineTo(triangleStart + 3, 0);
65    ctx.lineTo(triangleStart, size.height);
66    ctx.fill();
67    ctx.closePath();
68  }
69}
70