1/*
2 * Copyright 2024 Google LLC
3 *
4 * Licensed under the Apache License, Version 2.0 (the "License");
5 * you may not use this file except in compliance with the License.
6 * You may obtain a copy of the License at
7 *
8 *      http://www.apache.org/licenses/LICENSE-2.0
9 *
10 * Unless required by applicable law or agreed to in writing, software
11 * distributed under the License is distributed on an "AS IS" BASIS,
12 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
13 * See the License for the specific language governing permissions and
14 * limitations under the License.
15 */
16
17import {
18  Component,
19  ElementRef,
20  Input,
21  OnChanges,
22  SimpleChanges,
23  ViewChild,
24} from '@angular/core';
25import { checkNotNull } from '../../../utils/preconditions';
26import { VisualTimeline } from '../../visual-timeline';
27import { Feature } from '../../feature';
28
29@Component({
30  selector: 'app-graph',
31  standalone: true,
32  templateUrl: './graph.component.html',
33  styleUrls: ['./graph.component.scss'],
34})
35export class GraphComponent implements OnChanges {
36  constructor() {}
37
38  @ViewChild('canvas', { read: ElementRef })
39  canvas!: ElementRef<HTMLCanvasElement>;
40
41  @Input()
42  feature!: Feature;
43
44  @Input()
45  timeline!: VisualTimeline;
46
47  ngOnChanges(changes: SimpleChanges): void {
48    if (!this.canvas) return;
49    this._renderGraph();
50  }
51
52  updateCanvasSize(width: number) {
53    if (!this.canvas) return;
54
55    const canvasElement = this.canvas.nativeElement;
56
57    if (canvasElement.width == width) {
58      return;
59    }
60
61    canvasElement.width = width;
62    canvasElement.height = this.feature.visualization.height;
63    this._renderGraph();
64  }
65
66  get labelLeft() {
67    return 0;
68    // const ranges = this.feature?.property?.series?.activeRanges;
69    // return ranges && ranges.length && this.timeline
70    //   ? `${this.timeline.frameToPx(ranges[0].start)}px`
71    //   : 0;
72  }
73
74  private _renderGraph() {
75    this.feature.visualization.render(
76      this.timeline,
77      this.feature.dataPoints,
78      this.canvas.nativeElement,
79    );
80  }
81}
82