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 <transactionsviewlegacy 61 v-else-if="isTransactionsLegacy(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 TransactionsViewLegacy from '@/TransactionsViewLegacy.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 }, 164 /** Filter data view files by current show settings */ 165 updateShowFileTypes() { 166 this.store.showFileTypes = this.dataViewFiles 167 .filter((file) => file.show) 168 .map(file => file.type); 169 }, 170 /** Expand or collapse data view */ 171 toggleView() { 172 this.file.show = !this.file.show; 173 this.updateShowFileTypes(); 174 }, 175 /** Check if data view file should be shown */ 176 isShowFileType(type) { 177 return this.store.showFileTypes.find(fileType => fileType===type); 178 }, 179 }, 180 props: ['store', 'file', 'presentTags', 'presentErrors', 'dataViewFiles'], 181 mixins: [FileType], 182 components: { 183 'traceview': TraceView, 184 'transactionsviewlegacy': TransactionsViewLegacy, 185 'logview': LogView, 186 'flat-card': FlatCard, 187 AccessibilityTraceView, 188 WindowManagerTraceView, 189 SurfaceFlingerTraceView, 190 }, 191}; 192</script> 193<style> 194.bad { 195 margin: 1em 1em 1em 1em; 196 font-size: 4em; 197 color: red; 198} 199 200.toggle-view-button { 201 background: none; 202 color: inherit; 203 border: none; 204 font: inherit; 205 cursor: pointer; 206 padding-right: 10px; 207 display: inline-block; 208} 209 210.md-title { 211 display: inline-block; 212} 213</style> 214