Home | History | Annotate | Download | only in src
      1 <!-- Copyright (C) 2017 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 class="tree-view">
     17     <div @click="clicked" :class="computedClass">
     18       <span class="kind">{{item.kind}}</span><span v-if="item.kind && item.name"> - </span><span>{{item.name}}</span>
     19       <div v-for="c in item.chips" :title="c.long" :class="chipClassForChip(c)">
     20         {{c.short}}
     21       </div>
     22     </div>
     23     <div class="children" v-if="children">
     24       <tree-view v-for="(c,i) in children" :item="c" @item-selected="childItemSelected" :selected="selected" :v-key="i" :chip-class='chipClass' :filter="childFilter(c)" :flattened="flattened"
     25           :force-flattened="applyingFlattened" v-show="filterMatches(c)" ref='children' />
     26     </div>
     27   </div>
     28 </template>
     29 
     30 <script>
     31 
     32 import jsonProtoDefs from 'frameworks/base/core/proto/android/server/windowmanagertrace.proto'
     33 import protobuf from 'protobufjs'
     34 
     35 var protoDefs = protobuf.Root.fromJSON(jsonProtoDefs);
     36 var TraceMessage = protoDefs.lookupType(
     37   "com.android.server.wm.WindowManagerTraceFileProto");
     38 var ServiceMessage = protoDefs.lookupType(
     39   "com.android.server.wm.WindowManagerServiceDumpProto");
     40 
     41 export default {
     42   name: 'tree-view',
     43   props: ['item', 'selected', 'chipClass', 'filter', 'flattened', 'force-flattened'],
     44   data () {
     45     return {
     46     };
     47   },
     48   methods: {
     49     selectNext(found, parent) {
     50       if (found && this.filterMatches(this.item)) {
     51         this.clicked();
     52         return false;
     53       }
     54       if (this.selected === this.item) {
     55         found = true;
     56       }
     57       if (this.$refs.children) {
     58         for (var c of this.$refs.children) {
     59           found = c.selectNext(found);
     60         }
     61       }
     62       return found;
     63     },
     64     selectPrev(found) {
     65       if (this.$refs.children) {
     66         for (var c of [...this.$refs.children].reverse()) {
     67           found = c.selectPrev(found);
     68         }
     69       }
     70       if (found && this.filterMatches(this.item)) {
     71         this.clicked();
     72         return false;
     73       }
     74       if (this.selected === this.item) {
     75         found = true;
     76       }
     77       return found;
     78     },
     79     childItemSelected(item) {
     80       this.$emit('item-selected', item);
     81     },
     82     clicked() {
     83       this.$emit('item-selected', this.item);
     84     },
     85     chipClassForChip(c) {
     86       return ['tree-view-internal-chip', this.chipClassOrDefault,
     87           this.chipClassOrDefault + '-' + (c.class || 'default')];
     88     },
     89     filterMatches(c) {
     90       if (this.filter) {
     91         return this.filter(c, this.applyingFlattened);
     92       }
     93       return true;
     94     },
     95     childFilter(c) {
     96       if (this.filter && this.filter.includeChildren) {
     97         if (this.filterMatches(c)) {
     98           // Filter matched c, don't apply further filtering on c's children.
     99           return undefined;
    100         }
    101       }
    102       return this.filter;
    103     },
    104   },
    105   computed: {
    106     computedClass() {
    107       return (this.item == this.selected) ? 'selected' : ''
    108     },
    109     chipClassOrDefault() {
    110       return this.chipClass || 'tree-view-chip';
    111     },
    112     applyingFlattened() {
    113       return this.flattened && this.item.flattened || this.forceFlattened;
    114     },
    115     children() {
    116       return this.applyingFlattened ? this.item.flattened : this.item.children;
    117     },
    118   }
    119 }
    120 </script>
    121 
    122 <style>
    123 .children {
    124   margin-left: 24px;
    125 }
    126 .kind {
    127   color: #333;
    128 }
    129 .selected {
    130   background-color: #3f51b5;
    131   color: white;
    132 }
    133 .selected .kind{
    134   color: #ccc;
    135 }
    136 .tree-view-internal-chip {
    137   display: inline-block;
    138 }
    139 
    140 .tree-view-chip {
    141   padding: 0 10px;
    142   border-radius: 10px;
    143   background-color: #aaa;
    144   color: black;
    145 }
    146 
    147 .tree-view-chip.tree-view-chip-warn {
    148   background-color: #ffaa6b;
    149   color: black;
    150 }
    151 
    152 .tree-view-chip.tree-view-chip-error {
    153   background-color: #ff6b6b;
    154   color: black;
    155 }
    156 
    157 </style>
    158