From ed96e5c2964d93bd5b43f85577ef4ab7c217fa2d Mon Sep 17 00:00:00 2001 From: Brian Cully Date: Fri, 19 Feb 2021 13:13:39 -0500 Subject: Update amino acid in DOM after selection. --- codon.mjs | 17 +++++++++++++++-- rules.mjs | 29 +++++++++++++++++++++-------- 2 files changed, 36 insertions(+), 10 deletions(-) diff --git a/codon.mjs b/codon.mjs index 6163883..c5f8328 100644 --- a/codon.mjs +++ b/codon.mjs @@ -4,7 +4,6 @@ import Nucleotide from './nucleotide.mjs' class Codon { constructor(n1, n2, n3) { this.bases = [n1, n2, n3] - this.aminoAcid = new AminoAcid(n1, n2, n3) const nucleotideList = document.createElement('ol') this.bases = [n1, n2, n3].map(base => { @@ -14,7 +13,8 @@ class Codon { return n }) this.elt.appendChild(nucleotideList) - this.elt.appendChild(this.aminoAcid.elt) + + this.aminoAcid = new AminoAcid(n1, n2, n3) } get elt() { @@ -29,6 +29,19 @@ class Codon { return this.bases.map(b => b.value).join('') } + get aminoAcid() { + return this._aminoAcid + } + + set aminoAcid(value) { + this._aminoAcid = value + const oldElt = this.elt.querySelector('.amino-acid') + if (oldElt) { + this.elt.removeChild(oldElt) + } + this.elt.appendChild(value.elt) + } + lock() { this.bases.forEach(n => n.lock()) this.aminoAcid.lock() diff --git a/rules.mjs b/rules.mjs index 58b794f..f3b0c8d 100644 --- a/rules.mjs +++ b/rules.mjs @@ -198,11 +198,12 @@ class SelectAminoAcid { } enter() { + window.t = this const selector = this.rules.aminoAcidSelector - this.codon = this.rules.currentGenome.selectedCodon.value - this.expected = AminoAcid.codonMap[this.codon] + this.codon = this.rules.currentGenome.selectedCodon + this.expected = AminoAcid.codonMap[this.codon.value] let x = selector.elt.querySelector('#amino-acid-selector .codon').innerHTML = - this.codon + this.codon.value selector.onItemSelected = this.handleItemSelected.bind(this) selector.attach(this.selectedNucleotide) @@ -215,18 +216,22 @@ class SelectAminoAcid { } validSelection(aminoAcid) { - console.debug('aa:', this.expected) + console.debug('aminoAcid:', aminoAcid, 'expected: ', this.expected) return aminoAcid == this.expected } handleItemSelected(aminoAcid) { - console.debug('selected', aminoAcid) if (!this.validSelection(aminoAcid)) { this.rules.error.innerHTML = - `The codon ${this.codon} does not code for ${aminoAcid}` + `The codon ${this.codon.value} does not code for ${aminoAcid}` this.rules.next(new ShowError(this.rules, this)) return } + + const newAminoAcid = new AminoAcid(...this.codon.value.split('')) + window.aa = newAminoAcid + console.debug('new:', newAminoAcid) + this.codon.aminoAcid = newAminoAcid this.rules.next(new MarkAsLethal(this.rules)) } } @@ -321,7 +326,7 @@ class Rules { if (false) { this._debugStartAtRollForMutation() } else if (false) { - this._debugStartAtPerformMutation(4) + this._debugStartAtPerformMutation(3) } else if (true) { this._debugStartAtSelectAminoAcid() } else if (false) { @@ -345,18 +350,24 @@ class Rules { } _debugStartAtRollForMutation() { + this.genomeList.push(this.currentGenome.clone()) + this.currentState = new RollForMutation(this) const nucleotide = this.currentGenome.nucleotides[2] this.currentGenome.selectedNucleotide = nucleotide } _debugStartAtPerformMutation(n) { + // The semicolon below is necessary to prevent the array + // expansion below it from being understood as an index + // operation. + this.genomeList.push(this.currentGenome.clone()); + [...Array(n)].forEach(i => { const n = randomItem(this.currentGenome.nucleotides) n.value = randomItem(Nucleotide.bases) this.currentGenome.selectedNucleotide = n const g = this.currentGenome.clone() - window.g = g this.genomeList.push(g) }) @@ -367,6 +378,8 @@ class Rules { } _debugStartAtSelectAminoAcid() { + this.genomeList.push(this.currentGenome.clone()) + this.currentState = new SelectAminoAcid(this) this.die.value = 15 const nucleotide = this.currentGenome.nucleotides[15] -- cgit v1.2.3