diff --git a/src/components/Feature.vue b/src/components/Feature.vue index 57e4b10a36cad0b306cd7c9ee11051eda3d28d94..53a422cbf19c71cad88301077826c603eba33976 100644 --- a/src/components/Feature.vue +++ b/src/components/Feature.vue @@ -1,13 +1,13 @@ <template> <ul style="list-style-type:none; padding:8px;"> <template v-for="(child, name) in root"> - <li><v-chip label outline small color="blue darken-4">{{underscore(capitalize(name))}}</v-chip> + <li><v-chip label outline small color="blue darken-4">{{header(name)}}</v-chip> <span v-if="isText(child)"> {{child._text}}</span> <ul v-if="isFeature(child)" style="list-style-type:none; padding:5px;"> <li v-for="attr in child.feature"> <span v-if="attr._attributes"> <v-tooltip right> - <v-chip label small v-on:click.native="mark(attr.ref)" slot="activator"> + <v-chip label small v-on:click.native="mark(attr.ref)" slot="activator" :color="background"> <span v-if="attr._attributes.category">Category: {{(attr._attributes.category)}}</span> <span v-if="attr._attributes.type">, Type: {{(attr._attributes.type)}}</span> <span v-if="attr._attributes.subtype">, Subtype: {{(attr._attributes.subtype)}}</span> @@ -17,16 +17,16 @@ </span> <span v-else-if="attr.category"> <v-tooltip right> - <v-chip label small v-on:click.native="mark(attr.ref)" slot="activator"> + <v-chip label small v-on:click.native="mark(attr.ref)" slot="activator" :color="background"> <span v-if="attr.category">Category: {{(attr.category)}}</span> <span v-if="attr.type">, Type: {{(attr.type)}}</span> <span v-if="attr.subtype">, Subtype: {{(attr.subtype)}}</span> </v-chip> - <span v-if="attr.ref">Lines: {{attr.ref}}</span> + <span>Lines: {{attr.ref}}</span> </v-tooltip> </span> <span v-else> - <v-chip label small> + <v-chip label small :color="background"> {{cutoff(attr)}} </v-chip> </span> @@ -43,16 +43,15 @@ export default { // Recursive Component for Features in a Letter data () { return { - data: null + data: null, + background: 'white' } }, methods: { - mark (ref) { - // console.log(ref) - }, capitalize (str) { str = String(str) - return str.replace(/\w\S*/g, function (txt) { return txt.charAt(0).toUpperCase() + txt.substr(1).toLowerCase() }) + str = str.replace(/\b\w/g, l => l.toUpperCase()) + return str }, underscore (str) { str = String(str) @@ -62,6 +61,20 @@ export default { str = String(str) return str.substr(0, 100) }, + umlaut (str) { + str = String(str) + str = str.replace(/ue/g, 'ü') + str = str.replace(/ae/g, 'ä') + str = str.replace(/Ae/g, 'Ä') + str = str.replace(/oe/g, 'ö') + return str + }, + header (str) { + str = this.underscore(str) + str = this.capitalize(str) + str = this.umlaut(str) + return str + }, isAttribute (obj) { return Object.keys(obj)[0] === '_attributes' },