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