1/*
2 * Copyright (C) 2022 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 {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@Component({
27  selector: 'viewer-surface-flinger',
28  template: `
29    <div class="card-grid">
30      <collapsed-sections
31        [class.empty]="sections.areAllSectionsExpanded()"
32        [sections]="sections"
33        (sectionChange)="sections.onCollapseStateChange($event, false)">
34      </collapsed-sections>
35
36      <rects-view
37        class="rects-view"
38        [class.collapsed]="sections.isSectionCollapsed(CollapsibleSectionType.RECTS)"
39        [title]="rectsTitle"
40        [store]="store"
41        [isStackBased]="true"
42        [rects]="inputData?.rectsToDraw ?? []"
43        [highlightedItem]="inputData?.highlightedItem ?? ''"
44        [displays]="inputData?.displays ?? []"
45        [shadingModes]="shadingModes"
46        [dependencies]="inputData?.dependencies ?? []"
47        [userOptions]="inputData?.rectsUserOptions ?? {}"
48        (collapseButtonClicked)="sections.onCollapseStateChange(CollapsibleSectionType.RECTS, true)"></rects-view>
49
50      <hierarchy-view
51        class="hierarchy-view"
52        [class.collapsed]="sections.isSectionCollapsed(CollapsibleSectionType.HIERARCHY)"
53        [tree]="inputData?.hierarchyTrees[0]"
54        [dependencies]="inputData?.dependencies ?? []"
55        [highlightedItem]="inputData?.highlightedItem ?? ''"
56        [pinnedItems]="inputData?.pinnedItems ?? []"
57        [store]="store"
58        [userOptions]="inputData?.hierarchyUserOptions ?? {}"
59        [rectIdToShowState]="inputData?.rectIdToShowState"
60        (collapseButtonClicked)="sections.onCollapseStateChange(CollapsibleSectionType.HIERARCHY, true)"></hierarchy-view>
61
62      <div class="properties" *ngIf="!arePropertiesCollapsed()">
63        <surface-flinger-property-groups
64          class="property-groups"
65          [class.empty]="!inputData?.curatedProperties && !sections.isSectionCollapsed(CollapsibleSectionType.PROPERTIES)"
66          [class.collapsed]="sections.isSectionCollapsed(CollapsibleSectionType.CURATED_PROPERTIES)"
67          [properties]="inputData?.curatedProperties"
68          (collapseButtonClicked)="sections.onCollapseStateChange(CollapsibleSectionType.CURATED_PROPERTIES, true)"></surface-flinger-property-groups>
69
70        <properties-view
71          class="properties-view"
72          [class.collapsed]="sections.isSectionCollapsed(CollapsibleSectionType.PROPERTIES)"
73          [title]="propertiesTitle"
74          [userOptions]="inputData?.propertiesUserOptions ?? {}"
75          [propertiesTree]="inputData?.propertiesTree"
76          [highlightedProperty]="inputData?.highlightedProperty ?? ''"
77          [traceType]="${TraceType.SURFACE_FLINGER}"
78          [store]="store"
79          [displayPropertyGroups]="inputData?.displayPropertyGroups"
80          [isProtoDump]="true"
81          placeholderText="No selected entry or layer."
82          (collapseButtonClicked)="sections.onCollapseStateChange(CollapsibleSectionType.PROPERTIES, true)"></properties-view>
83      </div>
84    </div>
85  `,
86  styles: [
87    `
88      .properties {
89        flex: 1;
90        display: flex;
91        flex-direction: column;
92        overflow: auto;
93      }
94    `,
95    viewerCardStyle,
96  ],
97})
98export class ViewerSurfaceFlingerComponent {
99  @Input() inputData: UiData | undefined;
100  @Input() store: PersistentStore | undefined;
101  @Input() active = false;
102  TraceType = TraceType;
103  CollapsibleSectionType = CollapsibleSectionType;
104
105  rectsTitle = 'LAYERS';
106  propertiesTitle = 'PROTO DUMP';
107  sections = new CollapsibleSections([
108    {
109      type: CollapsibleSectionType.RECTS,
110      label: this.rectsTitle,
111      isCollapsed: false,
112    },
113    {
114      type: CollapsibleSectionType.HIERARCHY,
115      label: CollapsibleSectionType.HIERARCHY,
116      isCollapsed: false,
117    },
118    {
119      type: CollapsibleSectionType.CURATED_PROPERTIES,
120      label: 'PROPERTIES',
121      isCollapsed: false,
122    },
123    {
124      type: CollapsibleSectionType.PROPERTIES,
125      label: this.propertiesTitle,
126      isCollapsed: false,
127    },
128  ]);
129  shadingModes = [
130    ShadingMode.GRADIENT,
131    ShadingMode.OPACITY,
132    ShadingMode.WIRE_FRAME,
133  ];
134
135  arePropertiesCollapsed(): boolean {
136    return (
137      this.sections.isSectionCollapsed(CollapsibleSectionType.PROPERTIES) &&
138      this.sections.isSectionCollapsed(
139        CollapsibleSectionType.CURATED_PROPERTIES,
140      )
141    );
142  }
143}
144