fix: 修复打砖块游戏碰撞穿透bug,添加渐进提速机制

This commit is contained in:
lenn
2026-04-29 15:43:56 +08:00
parent 26533f6916
commit 326f07ed4f
23 changed files with 786 additions and 376 deletions

View File

@@ -1,7 +1,6 @@
<script lang="ts">
import { createEventDispatcher } from "svelte";
import { DEFAULT_PRESSURE_RANGE_MAX, DEFAULT_PRESSURE_RANGE_MIN } from "$lib/config/pressure-range";
import type { HudColorMapOption, PressureColorMapPreset } from "$lib/types/hud";
export let title = "";
export let hint = "";
@@ -11,15 +10,12 @@
export let rangeLabel = "";
export let rangeMinLabel = "";
export let rangeMaxLabel = "";
export let colorMapLabel = "";
export let resetLabel = "";
export let applyLiveHint = "";
export let matrixRows = 12;
export let matrixCols = 7;
export let rangeMin = DEFAULT_PRESSURE_RANGE_MIN;
export let rangeMax = DEFAULT_PRESSURE_RANGE_MAX;
export let colorMapPreset: PressureColorMapPreset = "emerald";
export let colorMapOptions: HudColorMapOption[] = [];
const dispatch = createEventDispatcher<{
close: void;
@@ -78,24 +74,17 @@
matrixCols = size;
}
function applyColorMapPreset(id: PressureColorMapPreset): void {
colorMapPreset = id;
}
function resetDefaults(): void {
matrixRows = 12;
matrixCols = 7;
rangeMin = DEFAULT_PRESSURE_RANGE_MIN;
rangeMax = DEFAULT_PRESSURE_RANGE_MAX;
colorMapPreset = "emerald";
}
function handleSubmit(): void {
dispatch("close");
}
$: selectedColorMap = colorMapOptions.find((option) => option.id === colorMapPreset) ?? colorMapOptions[0];
$: {
const nextRows = normalizeGridValue(matrixRows);
if (nextRows !== matrixRows) {
@@ -190,31 +179,6 @@
</div>
</div>
<div class="config-section">
<div class="section-head">
<p class="section-title">{colorMapLabel}</p>
<p class="section-note">{selectedColorMap?.label ?? colorMapPreset}</p>
</div>
<div class="palette-row" role="group" aria-label={colorMapLabel}>
{#each colorMapOptions as option}
<button
type="button"
class="palette-btn"
class:is-active={colorMapPreset === option.id}
on:click={() => applyColorMapPreset(option.id)}
>
<span
class="palette-preview"
style={`--palette-stop-0: ${option.previewStops[0]}; --palette-stop-1: ${option.previewStops[1]}; --palette-stop-2: ${option.previewStops[2]};`}
aria-hidden="true"
></span>
<span class="palette-name">{option.label}</span>
</button>
{/each}
</div>
</div>
<footer class="config-foot">
<p class="live-note">{applyLiveHint}</p>
<button type="button" class="reset-btn" on:click={resetDefaults}>{resetLabel}</button>
@@ -327,15 +291,8 @@
gap: 0.42rem;
}
.palette-row {
display: grid;
grid-template-columns: repeat(3, minmax(0, 1fr));
gap: 0.48rem;
}
.preset-btn,
.reset-btn,
.palette-btn {
.reset-btn {
border: 1px solid rgb(var(--hud-border-rgb) / 0.28);
border-radius: 999px;
padding: 0.38rem 0.72rem;
@@ -358,48 +315,6 @@
box-shadow: inset 0 1px 0 rgb(var(--hud-border-strong-rgb) / 0.14), 0 0 16px rgb(var(--hud-glow-alt-rgb) / 0.14);
}
.palette-btn {
display: grid;
gap: 0.34rem;
min-height: 4rem;
padding: 0.52rem 0.56rem 0.58rem;
border-radius: 0.74rem;
text-align: left;
}
.palette-btn.is-active {
border-color: rgb(var(--hud-lime-rgb) / 0.48);
background: linear-gradient(180deg, rgb(var(--hud-surface-alt-rgb) / 0.96), rgb(var(--hud-surface-rgb) / 0.92));
color: rgb(var(--hud-text-main-rgb) / 0.98);
box-shadow: inset 0 1px 0 rgb(var(--hud-border-strong-rgb) / 0.14), 0 0 16px rgb(var(--hud-glow-alt-rgb) / 0.14);
}
.palette-preview {
display: block;
inline-size: 100%;
block-size: 0.74rem;
border-radius: 999px;
border: 1px solid rgb(255 255 255 / 0.08);
background:
linear-gradient(
90deg,
var(--palette-stop-0) 0%,
var(--palette-stop-1) 52%,
var(--palette-stop-2) 100%
),
linear-gradient(180deg, rgb(255 255 255 / 0.08), transparent 55%);
box-shadow:
inset 0 1px 0 rgb(255 255 255 / 0.1),
0 0 12px rgb(0 0 0 / 0.14);
}
.palette-name {
color: inherit;
font-size: 0.74rem;
line-height: 1.1;
letter-spacing: 0.04em;
}
.field-grid {
display: grid;
grid-template-columns: repeat(2, minmax(0, 1fr));
@@ -457,9 +372,5 @@
.field-grid {
grid-template-columns: 1fr;
}
.palette-row {
grid-template-columns: 1fr;
}
}
</style>
</style>