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 this 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--> 15<template> 16 <div @click="onClick($event)"> 17 <flat-card v-if="hasDataView(file)"> 18 <md-card-header> 19 <md-card-header-text> 20 <div class="md-title"> 21 <button class="toggle-view-button" @click="toggleView"> 22 <i aria-hidden="true" class="md-icon md-theme-default material-icons"> 23 {{ isShowFileType(file.type) ? "expand_more" : "chevron_right" }} 24 </i> 25 </button> 26 <md-icon>{{ TRACE_ICONS[file.type] }}</md-icon> 27 {{ file.type }} 28 </div> 29 </md-card-header-text> 30 <md-button 31 :href="file.blobUrl" 32 :download="file.type" 33 class="md-icon-button" 34 > 35 <md-icon>save_alt</md-icon> 36 </md-button> 37 </md-card-header> 38 <AccessibilityTraceView 39 v-if="showInAccessibilityTraceView(file) && isShowFileType(file.type)" 40 :store="store" 41 :file="file" 42 ref="view" 43 /> 44 <WindowManagerTraceView 45 v-if="showInWindowManagerTraceView(file) && isShowFileType(file.type)" 46 :store="store" 47 :file="file" 48 :presentTags="presentTags" 49 :presentErrors="presentErrors" 50 ref="view" 51 /> 52 <SurfaceFlingerTraceView 53 v-else-if="showInSurfaceFlingerTraceView(file) && isShowFileType(file.type)" 54 :store="store" 55 :file="file" 56 :presentTags="presentTags" 57 :presentErrors="presentErrors" 58 ref="view" 59 /> 60 <transactionsview 61 v-else-if="isTransactions(file) && isShowFileType(file.type)" 62 :trace="file" 63 ref="view" 64 /> 65 <logview 66 v-else-if="isLog(file) && isShowFileType(file.type)" 67 :file="file" 68 ref="view" 69 /> 70 <traceview 71 v-else-if="showInTraceView(file) && isShowFileType(file.type)" 72 :store="store" 73 :file="file" 74 :presentTags="[]" 75 :presentErrors="[]" 76 ref="view" 77 /> 78 <div v-else> 79 <h1 v-if="isShowFileType(file.type)" class="bad">Unrecognized DataType</h1> 80 </div> 81 82 </flat-card> 83 </div> 84</template> 85<script> 86import TraceView from '@/TraceView.vue'; 87import AccessibilityTraceView from '@/AccessibilityTraceView.vue'; 88import WindowManagerTraceView from '@/WindowManagerTraceView.vue'; 89import SurfaceFlingerTraceView from '@/SurfaceFlingerTraceView.vue'; 90import TransactionsView from '@/TransactionsView.vue'; 91import LogView from '@/LogView.vue'; 92import FileType from '@/mixins/FileType.js'; 93import FlatCard from '@/components/FlatCard.vue'; 94 95import {TRACE_ICONS} from '@/decode.js'; 96 97export default { 98 name: 'dataview', 99 data() { 100 return { 101 TRACE_ICONS, 102 }; 103 }, 104 methods: { 105 // Recursively search for an arrowUp method in the children 106 // This is necessary because the VueComponent hierarchy has 107 // different depths depending on the source 108 depthFirstSearchArrowUp(component) { 109 if (component.arrowUp) { 110 component.arrowUp(); 111 return true; 112 } else { 113 for (let i = 0; i < component.$children.length; i++) { 114 var child = component.$children[i]; 115 if (this.depthFirstSearchArrowUp(child)) { 116 return true; 117 } 118 } 119 return false; 120 } 121 }, 122 // Recursively search for an arrowUp method in the children 123 // This is necessary because the VueComponent hierarchy has 124 // different depths depending on the source 125 depthFirstSearchArrowDown(component) { 126 if (component.arrowDown) { 127 component.arrowDown(); 128 return true 129 } else { 130 for (let i = 0; i < component.$children.length; i++) { 131 var child = component.$children[i]; 132 if (this.depthFirstSearchArrowDown(child)) { 133 return true; 134 } 135 } 136 return false; 137 } 138 }, 139 arrowUp() { 140 for (let i = 0; i < this.$children.length; i++) { 141 var child = this.$children[i]; 142 let done = this.depthFirstSearchArrowUp(child); 143 if (done) { 144 return true; 145 } 146 } 147 return false; 148 }, 149 arrowDown() { 150 for (let i = 0; i < this.$children.length; i++) { 151 var child = this.$children[i]; 152 let done = this.depthFirstSearchArrowDown(child); 153 if (done) { 154 return true; 155 } 156 } 157 return false; 158 }, 159 onClick(e) { 160 // Pass click event to parent, so that click event handler can be attached 161 // to component. 162 this.$emit('click', e); 163 this.newEventOccurred(e.toString()); 164 }, 165 /** Filter data view files by current show settings */ 166 updateShowFileTypes() { 167 this.store.showFileTypes = this.dataViewFiles 168 .filter((file) => file.show) 169 .map(file => file.type); 170 }, 171 /** Expand or collapse data view */ 172 toggleView() { 173 this.file.show = !this.file.show; 174 this.updateShowFileTypes(); 175 }, 176 /** Check if data view file should be shown */ 177 isShowFileType(type) { 178 return this.store.showFileTypes.find(fileType => fileType===type); 179 }, 180 }, 181 props: ['store', 'file', 'presentTags', 'presentErrors', 'dataViewFiles'], 182 mixins: [FileType], 183 components: { 184 'traceview': TraceView, 185 'transactionsview': TransactionsView, 186 'logview': LogView, 187 'flat-card': FlatCard, 188 AccessibilityTraceView, 189 WindowManagerTraceView, 190 SurfaceFlingerTraceView, 191 }, 192}; 193</script> 194<style> 195.bad { 196 margin: 1em 1em 1em 1em; 197 font-size: 4em; 198 color: red; 199} 200 201.toggle-view-button { 202 background: none; 203 color: inherit; 204 border: none; 205 font: inherit; 206 cursor: pointer; 207 padding-right: 10px; 208 display: inline-block; 209} 210 211.md-title { 212 display: inline-block; 213} 214</style> 215