Erweiterung der Kollisionslogik im Taxi-Spiel

Änderungen:
- Implementierung einer erweiterten Kollisionsprüfung für Passagiere und Ziele, um den Kollisionsbereich um 30px in alle Richtungen zu vergrößern.
- Anpassung der Methoden zur Abholung und Ablieferung von Passagieren, um die neue Kollisionslogik zu nutzen.
- Verbesserung der Kommentare zur Klarheit der Änderungen und des Codes.

Diese Anpassungen verbessern die Genauigkeit der Kollisionserkennung und optimieren das Spielerlebnis durch eine erweiterte Interaktion mit Passagieren und Zielen.
This commit is contained in:
Torsten Schulz (local)
2025-10-20 20:51:55 +02:00
parent e2191b5ec3
commit c81e61433c

View File

@@ -2689,10 +2689,10 @@ export default {
}, },
pickupPassenger() { pickupPassenger() {
// Finde nächsten Passagier in der Nähe // Finde nächsten Passagier in der Nähe mit erweitertem Bereich
for (let i = 0; i < this.passengers.length; i++) { for (let i = 0; i < this.passengers.length; i++) {
const passenger = this.passengers[i]; const passenger = this.passengers[i];
if (!passenger.pickedUp && this.checkCollision(this.taxi, passenger)) { if (!passenger.pickedUp && this.checkExtendedCollision(this.taxi, passenger)) {
passenger.pickedUp = true; passenger.pickedUp = true;
this.score += 10; this.score += 10;
break; break;
@@ -2701,10 +2701,10 @@ export default {
}, },
dropoffPassenger() { dropoffPassenger() {
// Finde nächstes Ziel in der Nähe // Finde nächstes Ziel in der Nähe mit erweitertem Bereich
for (let i = 0; i < this.destinations.length; i++) { for (let i = 0; i < this.destinations.length; i++) {
const destination = this.destinations[i]; const destination = this.destinations[i];
if (!destination.completed && this.checkCollision(this.taxi, destination)) { if (!destination.completed && this.checkExtendedCollision(this.taxi, destination)) {
destination.completed = true; destination.completed = true;
this.passengersDelivered++; this.passengersDelivered++;
this.score += 50; this.score += 50;
@@ -2716,6 +2716,19 @@ export default {
} }
}, },
// Erweiterte Kollisionsprüfung für Passagiere und Ziele (größerer Bereich)
checkExtendedCollision(taxi, target) {
// Erweitere den Kollisionsbereich um 30px in alle Richtungen
const extendedTaxi = {
x: taxi.x - 30,
y: taxi.y - 30,
width: taxi.width + 60,
height: taxi.height + 60
};
return this.checkCollision(extendedTaxi, target);
},
refuel() { refuel() {
// Prüfe ob Tankstellen verfügbar sind // Prüfe ob Tankstellen verfügbar sind
if (!this.gasStations || this.gasStations.length === 0) { if (!this.gasStations || this.gasStations.length === 0) {
@@ -3042,10 +3055,10 @@ export default {
this.motorSound.stop(); this.motorSound.stop();
} }
// Taxi mittig im aktuellen Tile platzieren // Taxi stoppen, aber Position beibehalten
this.taxi.speed = 0; this.taxi.speed = 0;
this.taxi.angle = 0; this.taxi.angle = 0;
this.centerTaxiInCurrentTile(); // NICHT centerTaxiInCurrentTile() - Taxi bleibt wo es ist
// Dialog über globale MessageDialog öffnen // Dialog über globale MessageDialog öffnen
this.$nextTick(() => { this.$nextTick(() => {
@@ -3054,10 +3067,6 @@ export default {
const crashTitle = 'Unfall!'; const crashTitle = 'Unfall!';
this.$root?.$refs?.messageDialog?.open?.(crashMessage, crashTitle, {}, this.handleCrashDialogClose); this.$root?.$refs?.messageDialog?.open?.(crashMessage, crashTitle, {}, this.handleCrashDialogClose);
// Test: Direkter Aufruf nach 3 Sekunden (falls Dialog-Callback nicht funktioniert)
this.crashDialogTimeout = setTimeout(() => {
this.handleCrashDialogClose();
}, 3000);
console.log('Crash-Dialog wird angezeigt:', { console.log('Crash-Dialog wird angezeigt:', {
crashes: this.crashes, crashes: this.crashes,
isPaused: this.isPaused, isPaused: this.isPaused,
@@ -3069,7 +3078,6 @@ export default {
}, },
handleCrashDialogClose() { handleCrashDialogClose() {
// (Log entfernt)
this.isPaused = false; this.isPaused = false;
this.showPauseOverlay = false; this.showPauseOverlay = false;
@@ -3087,7 +3095,7 @@ export default {
if (this.rafId) { cancelAnimationFrame(this.rafId); this.rafId = null; } if (this.rafId) { cancelAnimationFrame(this.rafId); this.rafId = null; }
this.rafId = requestAnimationFrame(this.update); this.rafId = requestAnimationFrame(this.update);
// Taxi bleibt auf dem aktuellen Tile, mittig platzieren // Taxi mittig im aktuellen Tile platzieren
this.taxi.speed = 0; this.taxi.speed = 0;
this.taxi.angle = 0; this.taxi.angle = 0;
this.centerTaxiInCurrentTile(); this.centerTaxiInCurrentTile();
@@ -3131,33 +3139,31 @@ export default {
async saveHighscore() { async saveHighscore() {
try { try {
const playTime = this.getPlayTime(); const playTime = this.getPlayTime();
console.log('Store user:', this.$store?.state?.user);
console.log('User ID:', this.$store?.state?.user?.id);
console.log('User nickname:', this.$store?.state?.user?.nickname);
console.log('User name:', this.$store?.state?.user?.name);
console.log('User username:', this.$store?.state?.user?.username);
const highscoreData = { const highscoreData = {
userId: this.$store?.state?.user?.id || localStorage.getItem('userid') || 'guest',
nickname: this.$store?.state?.user?.nickname || this.$store?.state?.user?.name || this.$store?.state?.user?.username || 'Gast',
passengersDelivered: this.passengersDelivered, passengersDelivered: this.passengersDelivered,
playtime: playTime, playtime: playTime,
points: this.score, points: this.score,
mapId: this.currentMap ? this.currentMap.id : null mapId: this.currentMap ? this.currentMap.id : null,
mapName: this.currentMap ? this.currentMap.name : 'Unbekannt'
}; };
console.log('Highscore-Daten:', highscoreData); const response = await apiClient.post('/api/taxi/highscores', highscoreData);
console.log('Current Map:', this.currentMap);
console.log('Passengers Delivered:', this.passengersDelivered);
console.log('Playtime:', playTime);
console.log('Points:', this.score);
const response = await apiClient.post('/api/taxi/highscore', highscoreData);
if (response.data.success) { if (response.data.success) {
console.log('Highscore erfolgreich gespeichert:', response.data.data);
return response.data.data; return response.data.data;
} else { } else {
console.error('Fehler beim Speichern des Highscores:', response.data.message);
return null; return null;
} }
} catch (error) { } catch (error) {
console.error('Fehler beim Speichern des Highscores:', error);
if (error.response) { if (error.response) {
console.error('Backend-Fehler:', error.response.data);
console.error('Status:', error.response.status);
} }
return null; return null;
} }
@@ -4133,12 +4139,14 @@ export default {
async handleKeyDown(event) { async handleKeyDown(event) {
// Browser-Shortcuts (F-Tasten, Strg/Meta+R) passieren lassen // Browser-Shortcuts (F-Tasten, Strg/Meta+R) passieren lassen
const key = event.key; const key = event.key;
event.preventDefault();
const isFunctionKey = /^F\d{1,2}$/.test(key); const isFunctionKey = /^F\d{1,2}$/.test(key);
const isReloadShortcut = (event.ctrlKey || event.metaKey) && (key === 'r' || key === 'R'); const isReloadShortcut = (event.ctrlKey || event.metaKey) && (key === 'r' || key === 'R');
if (isFunctionKey || isReloadShortcut) { if (isFunctionKey || isReloadShortcut) {
return; // nicht abfangen, Browser soll handeln return; // nicht abfangen, Browser soll handeln
} }
// Nur für Spiel-Tasten preventDefault aufrufen
event.preventDefault();
// Keydown-Repeat und Mehrfach-Setzen unterdrücken // Keydown-Repeat und Mehrfach-Setzen unterdrücken
if (event.repeat) return; if (event.repeat) return;
if (this.keys[key]) return; if (this.keys[key]) return;
@@ -4217,20 +4225,39 @@ export default {
}, },
restartLevel() { restartLevel() {
console.log('🔄 Level wird neu gestartet...');
// Spiel stoppen
this.isPaused = true;
this.gameRunning = false;
if (this.rafId) {
cancelAnimationFrame(this.rafId);
this.rafId = null;
}
// Alle Autos entfernen
this.cars = [];
// Spiel-Status zurücksetzen
this.score = 0; this.score = 0;
this.money = 0; this.money = 0;
this.passengersDelivered = 0; this.passengersDelivered = 0;
this.crashes = 0;
this.redLightViolations = 0;
this.redLightSincePenalty = 0;
this.waitingPassengersList = []; this.waitingPassengersList = [];
this.loadedPassengersList = []; this.loadedPassengersList = [];
this.occupiedHouses.clear(); this.occupiedHouses.clear();
this.fuel = 100; this.fuel = 100;
this.taxi.x = 250;
this.taxi.y = 250; // Taxi zurücksetzen
this.taxi.x = 250 - this.taxi.width/2;
this.taxi.y = 250 - this.taxi.height/2;
this.taxi.angle = 0; this.taxi.angle = 0;
this.taxi.speed = 0; this.taxi.speed = 0;
// Reset Spielzeit // Reset Spielzeit
this.gameStartTime = null; this.gameStartTime = Date.now();
// Cleanup bestehender Timeouts // Cleanup bestehender Timeouts
if (this.passengerGenerationTimeout) { if (this.passengerGenerationTimeout) {
@@ -4242,8 +4269,16 @@ export default {
this.crashDialogTimeout = null; this.crashDialogTimeout = null;
} }
// Level neu generieren
this.generateLevel(); this.generateLevel();
this.initializePassengerGeneration(); this.initializePassengerGeneration();
// Spiel neu starten
this.isPaused = false;
this.gameRunning = true;
this.startGame();
console.log('✅ Level neu gestartet!');
}, },