mirror of
https://github.com/shadoll/dev.shadoll.git
synced 2026-08-28 03:26:56 +00:00
feat: update evolution guide with new interaction rules and enhance styling for clarity
This commit is contained in:
+25
-16
@@ -89,34 +89,43 @@
|
||||
<p class="guide-section__label">interactions</p>
|
||||
<ul class="guide-rules">
|
||||
<li class="guide-rule">
|
||||
<span class="guide-rule__dot" style="--c:#ffb0a8"></span>
|
||||
<span class="guide-entity__icon" data-guide-icon="bug"></span>
|
||||
<span class="guide-rule__op">+</span>
|
||||
<span class="guide-rule__dot" style="--c:#a8ffb8"></span>
|
||||
<span class="guide-rule__desc">bug infects → <span style="color:#ff4d6d">virus</span></span>
|
||||
<span class="guide-entity__icon" data-guide-icon="dna-bold-duotone"></span>
|
||||
<span class="guide-rule__op">→</span>
|
||||
<span class="guide-entity__icon" data-guide-icon="virus-filled"></span>
|
||||
<span class="guide-rule__desc">bug infects</span>
|
||||
</li>
|
||||
<li class="guide-rule">
|
||||
<span class="guide-rule__dot" style="--c:#ffb0a8"></span>
|
||||
<span class="guide-entity__icon" data-guide-icon="bug"></span>
|
||||
<span class="guide-rule__op">+</span>
|
||||
<span class="guide-rule__dot" style="--c:#ff4d6d"></span>
|
||||
<span class="guide-rule__desc">bug cures → <span style="color:#a8ffb8">dna</span></span>
|
||||
<span class="guide-entity__icon" data-guide-icon="virus-filled"></span>
|
||||
<span class="guide-rule__op">→</span>
|
||||
<span class="guide-entity__icon" data-guide-icon="dna-bold-duotone"></span>
|
||||
<span class="guide-rule__desc">bug cures virus</span>
|
||||
</li>
|
||||
<li class="guide-rule">
|
||||
<span class="guide-rule__dot" style="--c:#ff4d6d"></span>
|
||||
<span class="guide-entity__icon" data-guide-icon="virus-filled"></span>
|
||||
<span class="guide-rule__op">+</span>
|
||||
<span class="guide-rule__dot" style="--c:#a8ffb8"></span>
|
||||
<span class="guide-rule__desc">virus kills <span class="guide-rule__pct">90%</span></span>
|
||||
<span class="guide-entity__icon" data-guide-icon="dna-bold-duotone"></span>
|
||||
<span class="guide-rule__op">→</span>
|
||||
<span class="guide-rule__pct">90%</span>
|
||||
<span class="guide-rule__desc">virus kills</span>
|
||||
</li>
|
||||
<li class="guide-rule">
|
||||
<span class="guide-rule__dot" style="--c:#ff4d6d"></span>
|
||||
<span class="guide-entity__icon" data-guide-icon="virus-filled"></span>
|
||||
<span class="guide-rule__op">+</span>
|
||||
<span class="guide-rule__dot" style="--c:#a8ffb8"></span>
|
||||
<span class="guide-rule__desc">mutates → <span style="color:#80ffee">bacteria</span> <span class="guide-rule__pct">10%</span></span>
|
||||
<span class="guide-entity__icon" data-guide-icon="dna-bold-duotone"></span>
|
||||
<span class="guide-rule__op">→</span>
|
||||
<span class="guide-entity__icon" data-guide-icon="bacteria"></span>
|
||||
<span class="guide-rule__pct">10%</span>
|
||||
<span class="guide-rule__desc">mutation</span>
|
||||
</li>
|
||||
<li class="guide-rule">
|
||||
<span class="guide-rule__dot" style="--c:#80ffee"></span>
|
||||
<span class="guide-rule__op"></span>
|
||||
<span class="guide-rule__dot" style="--c:transparent;box-shadow:none;border:1px solid rgba(255,255,255,0.18)"></span>
|
||||
<span class="guide-rule__desc">bacteria immune to virus</span>
|
||||
<span class="guide-entity__icon" data-guide-icon="bacteria"></span>
|
||||
<span class="guide-rule__op">×</span>
|
||||
<span class="guide-entity__icon" data-guide-icon="virus-filled"></span>
|
||||
<span class="guide-rule__desc">bacteria immune</span>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
+15
-5
@@ -385,7 +385,10 @@ export class EvolutionController {
|
||||
}
|
||||
|
||||
// ── Virus kill / mutation ──────────────────────────────
|
||||
// virus-filled hitting a non-immune entity: 90% kills it, 10% triggers mutation.
|
||||
// virus-filled hitting a non-immune entity: the target may die or mutate.
|
||||
// On a failed kill roll the contact will convert the target into bacteria
|
||||
// (10% shown in the guide) if that icon exists. Bacteria are immune to
|
||||
// subsequent virus or bug interactions.
|
||||
const virusImmune = new Set(['bug', 'virus-filled', 'bacteria']);
|
||||
const aIsVirus = a.entityKey === 'virus-filled';
|
||||
const bIsVirus = b.entityKey === 'virus-filled';
|
||||
@@ -403,10 +406,11 @@ export class EvolutionController {
|
||||
|
||||
/**
|
||||
* Handle a collision between a virus-filled entity and a vulnerable target.
|
||||
* Bug is the sole mutation/transformation trigger — virus only kills.
|
||||
*
|
||||
* - virusKillChance: target begins slow-death sequence.
|
||||
* - else: target survives unaffected (virus bounces away normally).
|
||||
* 50%–100% of the time (controlled by virusKillChance) the target is killed.
|
||||
* On the remaining rolls the virus fails to kill and the contact triggers a
|
||||
* rare mutation: the target becomes a "bacteria" entity if that icon is
|
||||
* defined. Bacteria are immune to further virus attacks and bugs.
|
||||
*
|
||||
* @param {import('./entity.js').Entity} _virus the virus-filled entity (unused)
|
||||
* @param {import('./entity.js').Entity} target the entity being contacted
|
||||
@@ -414,8 +418,14 @@ export class EvolutionController {
|
||||
#resolveVirusContact(_virus, target) {
|
||||
if (Math.random() < this.#virusKillChance) {
|
||||
target.die();
|
||||
} else {
|
||||
// mutation path – only if bacteria is registered
|
||||
if (this.#iconsData && this.#iconsData.icons['bacteria']) {
|
||||
const bacMeta = this.#iconsData.icons['bacteria'];
|
||||
const bacColor = this.#iconsData.types[bacMeta.type]?.color || '#80ffee';
|
||||
target.infectWith('bacteria', bacColor, { force: true });
|
||||
}
|
||||
}
|
||||
// else: target survives — virus bounces, no transformation
|
||||
}
|
||||
|
||||
// ── State persistence ────────────────────────────────────────
|
||||
|
||||
+17
-9
@@ -106,10 +106,10 @@
|
||||
|
||||
/* Icon container — SVG injected here by guide.js */
|
||||
.guide-entity__icon {
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
flex-shrink: 0;
|
||||
color: var(--c, rgba(255, 255, 255, 0.6));
|
||||
color: var(--c, rgba(255, 255, 255, 0.75));
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
@@ -154,10 +154,11 @@
|
||||
}
|
||||
|
||||
.guide-rule {
|
||||
display: grid;
|
||||
grid-template-columns: 9px 9px 9px 1fr;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 0.28rem;
|
||||
gap: 0.4rem;
|
||||
flex-wrap: nowrap; /* absolutely no wrapping */
|
||||
white-space: nowrap; /* safeguard for inline elements */
|
||||
}
|
||||
|
||||
/* Coloured circle representing an entity type */
|
||||
@@ -172,9 +173,14 @@
|
||||
|
||||
.guide-rule__op {
|
||||
font-family: var(--font-mono);
|
||||
font-size: 0.55rem;
|
||||
color: rgba(255, 255, 255, 0.22);
|
||||
display: inline-block;
|
||||
/* 1.2rem ≈ 19px on a 16px root, sized to match the 18px icons */
|
||||
font-size: 1.2rem;
|
||||
line-height: 1;
|
||||
font-weight: 500;
|
||||
color: rgba(255, 255, 255, 0.75);
|
||||
text-align: center;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
.guide-rule__desc {
|
||||
@@ -182,11 +188,13 @@
|
||||
font-size: 0.62rem;
|
||||
color: rgba(255, 255, 255, 0.45);
|
||||
line-height: 1.3;
|
||||
margin-left: 0.4rem;
|
||||
}
|
||||
|
||||
.guide-rule__pct {
|
||||
color: rgba(255, 255, 255, 0.22);
|
||||
font-size: 0.58rem;
|
||||
font-size: 0.7rem;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
|
||||
/* ── Guide footer + restart button ───────────────────────── */
|
||||
|
||||
Reference in New Issue
Block a user