diff --git a/src/components/Features.vue b/src/components/Features.vue index 39ebd954fc5ee428a1fdd5719edbfe59429d13cc..3f7698ea7968c12606c34fc1b38220a3ae646047 100644 --- a/src/components/Features.vue +++ b/src/components/Features.vue @@ -82,7 +82,10 @@ </v-card-title> <v-card-text> <ul style="list-style-type:none;"> - <li v-for="hit in letter.results">{{hit._text}} <v-chip label>{{(hit._attributes)}}</v-chip></li> + <li v-for="hit in letter.results"> + <v-chip outline small color="secondary">{{hit._text}}</v-chip> + <v-chip label small v-if="showlabels">{{(hit._attributes)}}</v-chip> + </li> </ul> </v-card-text> <v-card-actions> @@ -107,6 +110,7 @@ export default { feature_type: '', feature_subtype: '', results: null, + showlabels: true, letters: [ { text: 'All' } ] diff --git a/src/components/Search.vue b/src/components/Search.vue index 28eb1ebdbb578c0e8656045c86be76adc88cb7ba..417bd70b979faa8f380030adc70388387c1c4852 100644 --- a/src/components/Search.vue +++ b/src/components/Search.vue @@ -38,6 +38,10 @@ <v-btn @click="clear" color="blue-grey darken-2" class="white--text">Clear</v-btn> </v-flex> + <!-- Options --> + <v-flex xs9> + </v-flex> + <!-- Invalid Search Warning --> <v-flex xs12> <v-alert outline color="lime darken-2" icon="warning" :value="invalid"> @@ -55,6 +59,8 @@ <v-card color="blue-grey lighten-1" class="white--text"> <v-card-text> Results: {{results.length}} letter(s) + <v-slider v-model="cutoff" min="20" max="255" thumb-label dark></v-slider> + <v-checkbox label="Show Labels" v-model="showlabels" dark></v-checkbox> </v-card-text> </v-card> </v-flex> @@ -67,7 +73,10 @@ </v-card-title> <v-card-text> <ul style="list-style-type:none;"> - <li v-for="hit in letter.results">{{getValue(hit)}} <v-chip label>{{getKey(hit)}}</v-chip></li> + <li v-for="hit in letter.results"> + <v-chip outline small color="secondary">{{getValue(hit)}}</v-chip> + <v-chip label small v-if="showlabels">{{getKey(hit)}}</v-chip> + </li> </ul> </v-card-text> <v-card-actions> @@ -94,7 +103,9 @@ export default { '^([a-z]+):(.+)' ], results: null, - searching: false + searching: false, + cutoff: 40, + showlabels: false } }, methods: { @@ -152,14 +163,14 @@ export default { getValue (obj) { // Get value of unknown key in object var key = Object.keys(obj)[0] - return obj[key].substr(0, 25) + return obj[key].substr(0, this.cutoff) }, getKey (obj) { // Get unknown first key from object var key = Object.keys(obj)[0] key = key.replace('teiHeader.xenoData.', '') - // key = key.replace(/.[0-9]._text/, '') - return key.substr(0, 50) + key = key.replace(/.[0-9]._text/, '') + return key } } }