Ä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:
@@ -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();
|
||||
},
|
||||
|
||||
Reference in New Issue
Block a user