1/*
2 * Copyright (C) 2023 The Android Open Source Project
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 {ChangeDetectionStrategy, Component, Input} from '@angular/core';
18import {PersistentStore} from 'common/persistent_store';
19import {TraceType} from 'trace/trace_type';
20import {CollapsibleSections} from 'viewers/common/collapsible_sections';
21import {CollapsibleSectionType} from 'viewers/common/collapsible_section_type';
22import {ShadingMode} from 'viewers/components/rects/types3d';
23import {viewerCardStyle} from 'viewers/components/styles/viewer_card.styles';
24import {UiData} from './ui_data';
25
26/**
27 * TODO: Upgrade the View Capture's Properties View after getting UX's opinion.
28 */
29@Component({
30  selector: 'viewer-view-capture',
31  changeDetection: ChangeDetectionStrategy.OnPush,
32  template: `
33    <div class="card-grid">
34      <collapsed-sections
35        [class.empty]="sections.areAllSectionsExpanded()"
36        [sections]="sections"
37        (sectionChange)="sections.onCollapseStateChange($event, false)">
38      </collapsed-sections>
39      <rects-view
40        class="rects-view"
41        [class.collapsed]="sections.isSectionCollapsed(CollapsibleSectionType.RECTS)"
42        [title]="rectsTitle"
43        [store]="store"
44        [rects]="inputData?.rectsToDraw ?? []"
45        [zoomFactor]="4"
46        [miniRects]="inputData?.sfRects ?? []"
47        [highlightedItem]="inputData?.highlightedItem ?? ''"
48        [displays]="inputData?.displays ?? []"
49        groupLabel="Windows"
50        [shadingModes]="shadingModes"
51        [dependencies]="inputData?.dependencies ?? []"
52        [userOptions]="inputData?.rectsUserOptions ?? {}"
53        (collapseButtonClicked)="sections.onCollapseStateChange(CollapsibleSectionType.RECTS, true)"></rects-view>
54      <hierarchy-view
55        class="hierarchy-view"
56        [class.collapsed]="sections.isSectionCollapsed(CollapsibleSectionType.HIERARCHY)"
57        [subtrees]="inputData?.hierarchyTrees"
58        [dependencies]="inputData?.dependencies ?? []"
59        [highlightedItem]="inputData?.highlightedItem ?? ''"
60        [pinnedItems]="inputData?.pinnedItems ?? []"
61        [store]="store"
62        [userOptions]="inputData?.hierarchyUserOptions ?? {}"
63        [rectIdToShowState]="inputData?.rectIdToShowState"
64        (collapseButtonClicked)="sections.onCollapseStateChange(CollapsibleSectionType.HIERARCHY, true)"></hierarchy-view>
65      <properties-view
66        class="properties-view"
67        [class.collapsed]="sections.isSectionCollapsed(CollapsibleSectionType.PROPERTIES)"
68        [userOptions]="inputData?.propertiesUserOptions ?? {}"
69        [propertiesTree]="inputData?.propertiesTree"
70        [curatedProperties]="inputData?.curatedProperties"
71        [traceType]="${TraceType.VIEW_CAPTURE}"
72        [store]="store"
73        [isProtoDump]="false"
74        (collapseButtonClicked)="sections.onCollapseStateChange(CollapsibleSectionType.PROPERTIES, true)"></properties-view>
75    </div>
76  `,
77  styles: [viewerCardStyle],
78})
79export class ViewerViewCaptureComponent {
80  @Input() inputData: UiData | undefined;
81  @Input() store: PersistentStore | undefined;
82  CollapsibleSectionType = CollapsibleSectionType;
83
84  rectsTitle = 'SKETCH';
85  sections = new CollapsibleSections([
86    {
87      type: CollapsibleSectionType.RECTS,
88      label: this.rectsTitle,
89      isCollapsed: false,
90    },
91    {
92      type: CollapsibleSectionType.HIERARCHY,
93      label: CollapsibleSectionType.HIERARCHY,
94      isCollapsed: false,
95    },
96    {
97      type: CollapsibleSectionType.PROPERTIES,
98      label: CollapsibleSectionType.PROPERTIES,
99      isCollapsed: false,
100    },
101  ]);
102  shadingModes = [
103    ShadingMode.GRADIENT,
104    ShadingMode.OPACITY,
105    ShadingMode.WIRE_FRAME,
106  ];
107}
108