Viimeaikaisen kehityksen putkapostiin 47 johdosta innostuin nyt koittamaan ratkaista sitä, vaikka 15 vuotta sitten lupailin että en yritä. No, itse tehtävään en saanut hyvää ratkaisua, mutta ajattelin että jaan tämän avustajan, jonka tein itselleni.
Eli tämä on yksinkertainen Vue.js SFC komponetti. Ideana että tekstikenttään voi kirjoittaa kirjaimia muodossa (esim. kirjain X ja Y ja # on kommentti seuraavaan):
X:blaabaa
#Käytetään X:ää
Y:heiXhoi
Jolloin se näyttää "lopputuloksen"
X (7)
blaabaa
Y Käytetään X:ää (13)
heiblaabaahoi
Tämä on nyt silleen todella simppeli että kirjain"muuttujat" on aina 1 merkin pituisia. Tuossa tehtävässä mitä tein on vain pieniä kirjaimia, niin käytin isoja kirjaimia muuttujina. Ei ehkä toimi yhtä hyvin sellaisiin regex-tehtäviin, missä "vapaat" eli merkit, joita tehtävässä ei tarvita, ei ole yhtä selkeästi nähtävillä.
<script>
export default {
data() {
return {
src: '#2-9\nK:kaksi|kolme|neljä|viisi|kuusi|seitsemän|kahdeksan|yhdeksän\nY:yksi|K\n#20-99\nX:(K)kymmentä(Y)?\n#2-99\nZ:kymmenen|yksitoista|(K)(toista)?|X\n'
}
},
computed: {
compiled() {
let res = [];
let comment = '';
this.src.split('\n').forEach(r=> {
if (r.length < 3) return;
if (r[0]=='#') { comment = r.slice(1); return; }
if (r[1]!=':') return;
let n = { K: r[0], V: r.slice(2), C: comment };
comment = '';
res.forEach(x=> {
n.V = n.V.replaceAll(x.K, x.V)
});
res.push(n);
});
return res;
}
}
}
</script>
<template>
<textarea cols="80" rows="20" v-model="src"></textarea>
<div v-for="c in compiled"><B>{{c.K}} {{c.C}}</B> ({{c.V.length}})<br />{{c.V}}</div>
</template>Koodia voi testata helposti copy-pasteamalla edellä olevan koodin Vue SFC playgroundiin
https://play.vuejs.org/