Änderung: Verbesserung der Audio-Integration und Anpassung der Geräuschparameter im Taxi-Spiel

Änderungen:
- Implementierung der Autoplay-Policy zur sofortigen Wiederaufnahme des AudioContext bei Benutzerinteraktionen.
- Anpassung der Motorgeräuschparameter basierend auf der Geschwindigkeit des Taxis für eine realistischere Klangdarstellung.
- Sicherstellung, dass der AudioContext aktiv ist, bevor Motorgeräusche gestartet werden.
- Entfernung der Passagier- und Zielgenerierung sowie deren Zeichnung, um den Fokus auf die Audio-Integration zu legen.

Diese Anpassungen verbessern die akustische Benutzererfahrung und optimieren die Audioverwaltung im Taxi-Minispiel.
This commit is contained in:
Torsten Schulz (local)
2025-09-17 11:24:15 +02:00
parent 647e87715f
commit abfa6f4b8d

View File

@@ -318,10 +318,25 @@ export default {
try {
this.audioContext = new (window.AudioContext || window.webkitAudioContext)();
// Autoplay-Policy: Context sofort im User-Gesture fortsetzen
if (this.audioContext.state === 'suspended') {
await this.audioContext.resume();
}
const generator = new NoiseGenerator();
this.motorSound = new MotorSound(this.audioContext, generator);
await this.motorSound.init();
console.log('MotorSound initialisiert');
// Falls bereits Bewegung anliegt, Sound direkt starten
const speedKmh = this.taxi.speed * 5;
if (speedKmh > 0) {
this.motorSound.start();
// Sofort Parameter setzen
const speedFactor = Math.min(speedKmh / 120, 1);
const motorSpeed = 0.3 + (speedFactor * 0.3);
const volume = 0.1 + (speedFactor * 0.4);
this.motorSound.setSpeed(motorSpeed);
this.motorSound.setVolume(volume);
}
} catch (error) {
console.warn('MotorSound konnte nicht initialisiert werden:', error);
}
@@ -333,6 +348,11 @@ export default {
const speedKmh = this.taxi.speed * 5; // Geschwindigkeit in km/h
const isMoving = speedKmh > 0;
// Sicherstellen, dass der AudioContext läuft
if (this.audioContext && this.audioContext.state === 'suspended') {
this.audioContext.resume().catch(() => {});
}
if (isMoving && !this.motorSound.isPlaying) {
this.motorSound.start();
} else if (!isMoving && this.motorSound.isPlaying) {
@@ -342,7 +362,7 @@ export default {
if (isMoving) {
// Geschwindigkeitsabhängige Tonhöhe und Lautstärke
const speedFactor = Math.min(speedKmh / 120, 1); // 0-1 basierend auf 0-120 km/h
const motorSpeed = 0.3 + (speedFactor * 0.25); // 0.3 bis 1.5
const motorSpeed = 0.3 + (speedFactor * 0.3); // 0.3 bis 1.5
const volume = 0.1 + (speedFactor * 0.4); // 0.1 bis 0.5
this.motorSound.setSpeed(motorSpeed);
@@ -369,29 +389,7 @@ export default {
this.destinations = [];
this.obstacles = [];
// Generiere Passagiere (auf Straßen)
for (let i = 0; i < 3; i++) {
const position = this.getRandomRoadPosition();
this.passengers.push({
x: position.x,
y: position.y,
width: 15,
height: 15,
pickedUp: false
});
}
// Generiere Ziele (auf Straßen)
for (let i = 0; i < 3; i++) {
const position = this.getRandomRoadPosition();
this.destinations.push({
x: position.x,
y: position.y,
width: 15,
height: 15,
completed: false
});
}
// Passagiere/Ziele werden aktuell nicht generiert
// Generiere Hindernisse (außerhalb der Straßen)
@@ -890,21 +888,7 @@ export default {
this.ctx.fillRect(obstacle.x, obstacle.y, obstacle.width, obstacle.height);
});
// Zeichne Passagiere
this.passengers.forEach(passenger => {
if (!passenger.pickedUp) {
this.ctx.fillStyle = '#4CAF50';
this.ctx.fillRect(passenger.x, passenger.y, passenger.width, passenger.height);
}
});
// Zeichne Ziele
this.destinations.forEach(destination => {
if (!destination.completed) {
this.ctx.fillStyle = '#F44336';
this.ctx.fillRect(destination.x, destination.y, destination.width, destination.height);
}
});
// Passagiere/Ziele werden aktuell nicht gezeichnet
// Zeichne Taxi
@@ -996,8 +980,22 @@ export default {
return 'horizontal'; // Fallback
},
handleCanvasClick(event) {
// Canvas-Klick-Handling falls benötigt
async handleCanvasClick(event) {
// AudioContext bei erster Benutzerinteraktion initialisieren
await this.initAudioOnUserInteraction();
if (this.audioContext && this.audioContext.state === 'suspended') {
await this.audioContext.resume().catch(() => {});
}
// Motor ggf. direkt starten
if (this.motorSound && !this.motorSound.isPlaying) {
this.motorSound.start();
const speedKmh = this.taxi.speed * 5;
const speedFactor = Math.min(speedKmh / 120, 1);
const motorSpeed = 0.3 + (speedFactor * 0.3);
const volume = 0.1 + (speedFactor * 0.4);
this.motorSound.setSpeed(motorSpeed);
this.motorSound.setVolume(volume);
}
},
async handleKeyDown(event) {
@@ -1005,6 +1003,19 @@ export default {
// AudioContext bei erster Benutzerinteraktion initialisieren
await this.initAudioOnUserInteraction();
if (this.audioContext && this.audioContext.state === 'suspended') {
await this.audioContext.resume().catch(() => {});
}
// Motor ggf. direkt starten
if (this.motorSound && !this.motorSound.isPlaying) {
this.motorSound.start();
const speedKmh = this.taxi.speed * 5;
const speedFactor = Math.min(speedKmh / 120, 1);
const motorSpeed = 0.3 + (speedFactor * 0.3);
const volume = 0.1 + (speedFactor * 0.4);
this.motorSound.setSpeed(motorSpeed);
this.motorSound.setVolume(volume);
}
event.preventDefault();
},