Inizio refactoring del layout delle cartelle del progetto in vista della conclusione.
Layout delle cartelle quasi definitivo
@@ -17,10 +17,10 @@
|
|||||||
### 🚩 Milestone Generali (Nucleo del Progetto)
|
### 🚩 Milestone Generali (Nucleo del Progetto)
|
||||||
- [⚠️] **Design UI & Mockup:** Finalizzazione degli asset grafici (basati sullo schema Draw.io).
|
- [⚠️] **Design UI & Mockup:** Finalizzazione degli asset grafici (basati sullo schema Draw.io).
|
||||||
- [❌] **Configurazione Database:** Creazione delle tabelle `classifica` e `records` su MySQL.
|
- [❌] **Configurazione Database:** Creazione delle tabelle `classifica` e `records` su MySQL.
|
||||||
- [❌] **Logica Entrypoint:** Sviluppo di `index.php` con video di sfondo e overlay dei comandi.
|
- [⚠️] **Logica Entrypoint:** Sviluppo di `index.php` con video di sfondo e overlay dei comandi.
|
||||||
- [⚠️] **Sistema di Trasferimento:** Implementazione logica per il passaggio dei dati dalla Fase 1 alla Fase 2.
|
- [⚠️] **Sistema di Trasferimento:** Implementazione logica per il passaggio dei dati dalla Fase 1 alla Fase 2.
|
||||||
- [❌] **Gestione Impostazioni:** Pannello per regolare il volume e inserire il nome della squadra (servira' nella classifica).
|
- [❌] **Gestione Impostazioni:** Pannello per regolare il volume e inserire il nome della squadra (servira' nella classifica).
|
||||||
- [❌] **Pagina Dinamica:** Creazione della classifica in PHP con recupero dati in tempo reale.
|
- [⚠️] **Pagina Dinamica:** Creazione della classifica in PHP con recupero dati in tempo reale.
|
||||||
|
|
||||||
### 🏝️ Fase 1: La Raccolta (Timer: 1m)
|
### 🏝️ Fase 1: La Raccolta (Timer: 1m)
|
||||||
- [✅] **Ambiente di gioco:** Modellazione dell'isola 3D con Three.js e gestione dei confini della mappa.
|
- [✅] **Ambiente di gioco:** Modellazione dell'isola 3D con Three.js e gestione dei confini della mappa.
|
||||||
@@ -35,11 +35,12 @@
|
|||||||
- [❌] **Personaggio:** Cilindro che rappresenta il personaggio (fatto per collisioni piu' precise)
|
- [❌] **Personaggio:** Cilindro che rappresenta il personaggio (fatto per collisioni piu' precise)
|
||||||
|
|
||||||
### ♻️ Fase 2: Lo Smistamento (Timer: 5s * Punteggio)
|
### ♻️ Fase 2: Lo Smistamento (Timer: 5s * Punteggio)
|
||||||
- [❌] **Timer Dinamico:** Calcolo del tempo a disposizione basato sul successo della Fase 1.
|
- [⚠️] **Timer Dinamico:** Calcolo del tempo a disposizione basato sul successo della Fase 1.
|
||||||
- [❌] **Motore di Smistamento:** Logica di convalida (Rifiuto ↔️ Bidone corretto).
|
- [✅] **Motore di Smistamento:** Logica di convalida (Rifiuto ↔️ Bidone corretto).
|
||||||
- [❌] **Interfaccia Utente:** Layout con i 6 bidoni (Plastica, Umido, Indifferenziata, Vetro, Carta, Alluminio).
|
- [✅] **Interfaccia Utente:** Layout con i 6 bidoni (Plastica, Umido, Indifferenziata, Vetro, Carta, Alluminio).
|
||||||
- [❌] **Gestione Input:** Meccanica di interazione tramite Drag & Drop o selezione rapida.
|
- [✅] **Gestione Input:** Meccanica di interazione tramite Drag & Drop o selezione rapida.
|
||||||
- [❌] **Feedback Visivo:** Effetti sonori e visivi per risposte corrette o errate.
|
- [✅] **Feedback Visivo:** Effetti sonori e visivi per risposte corrette o errate.
|
||||||
|
- [❌] **Rifinitura (Polish):** Abbellimento grafico.
|
||||||
|
|
||||||
### 🏆 Fase Finale: Classifica & Record
|
### 🏆 Fase Finale: Classifica & Record
|
||||||
- [❌] **Calcolo Punteggio:** Elaborazione dei risultati finali e calcolo dei bonus velocità.
|
- [❌] **Calcolo Punteggio:** Elaborazione dei risultati finali e calcolo dei bonus velocità.
|
||||||
@@ -53,7 +54,7 @@
|
|||||||
## 📂 Struttura delle Cartelle
|
## 📂 Struttura delle Cartelle
|
||||||
* `/assets` - Modelli 3D, video loop, texture dei rifiuti e icone dei bidoni.
|
* `/assets` - Modelli 3D, video loop, texture dei rifiuti e icone dei bidoni.
|
||||||
* `/css` - Fogli di stile per i menu e l'interfaccia di gioco (HUD).
|
* `/css` - Fogli di stile per i menu e l'interfaccia di gioco (HUD).
|
||||||
* `/js` - Logica core e rendering (Three.js, stage1.js, stage2.js).
|
* `/js` - Logica delle due fasi del gioco (fase1.js, fase2.js).
|
||||||
* `/php` - Script per il backend (`db_connect.php`, `save_score.php`).
|
* `/php` - Script per il backend (`db_connect.php`, `save_score.php`).
|
||||||
* `/games` - Pagine HTML dedicate alle sessioni di gioco (`fase1.html`, `fase2.html`).
|
* `/pages` - Pagine HTML dedicate alle varie pagine del gioco (`fase1.html`, `fase2.html`).
|
||||||
* `index.php` - Homepage e controller principale del progetto.
|
* `index.php` - Homepage e controller principale del progetto.
|
||||||
|
Before Width: | Height: | Size: 16 MiB After Width: | Height: | Size: 16 MiB |
|
Before Width: | Height: | Size: 16 MiB After Width: | Height: | Size: 16 MiB |
|
Before Width: | Height: | Size: 4.7 MiB After Width: | Height: | Size: 4.7 MiB |
|
Before Width: | Height: | Size: 14 MiB After Width: | Height: | Size: 14 MiB |
|
Before Width: | Height: | Size: 13 MiB After Width: | Height: | Size: 13 MiB |
@@ -0,0 +1,16 @@
|
|||||||
|
<?php
|
||||||
|
$route = [
|
||||||
|
'start' => 'fase1.html',
|
||||||
|
'mid' => 'istruzioniFase2.html',
|
||||||
|
'sep' => 'fase2.html',
|
||||||
|
'end' => 'risultatiFinali.html',
|
||||||
|
'leaderboard' => 'classifica.php',
|
||||||
|
'error' => 'error.html'
|
||||||
|
];
|
||||||
|
$p = $_GET['pagina'] ?? 'start';
|
||||||
|
if (!array_key_exists($p, $route)) {
|
||||||
|
http_response_code(404);
|
||||||
|
$p = 'error';
|
||||||
|
}
|
||||||
|
include $__DIR__ . '/pages/' . $route[$p];
|
||||||
|
?>
|
||||||
@@ -44,7 +44,7 @@ const trashArray = [];
|
|||||||
let score = 0;
|
let score = 0;
|
||||||
const loader = new GLTFLoader();
|
const loader = new GLTFLoader();
|
||||||
|
|
||||||
loader.load('models/rifiuto.glb', (gltf) => {
|
loader.load('assets/models/rifiuto.glb', (gltf) => {
|
||||||
const mesh = gltf.scene.getObjectByName("Trash_Pile_03_GEO");
|
const mesh = gltf.scene.getObjectByName("Trash_Pile_03_GEO");
|
||||||
mesh.geometry.center(); // Centra l'oggetto per collisioni precise
|
mesh.geometry.center(); // Centra l'oggetto per collisioni precise
|
||||||
for (let i = 0; i < 20; i++) {
|
for (let i = 0; i < 20; i++) {
|
||||||
@@ -0,0 +1,98 @@
|
|||||||
|
Struttura della cartella del progetto: (temporanea e mmodificabile)
|
||||||
|
```text
|
||||||
|
.
|
||||||
|
├── assets/
|
||||||
|
│ ├── media/
|
||||||
|
│ │ ├── img/
|
||||||
|
│ │ │ ├── titolo.png
|
||||||
|
│ │ │ └── fase2/
|
||||||
|
│ │ │ ├── contenitori/
|
||||||
|
│ │ │ │ ├── alluminio.jpeg
|
||||||
|
│ │ │ │ ├── carta.jpeg
|
||||||
|
│ │ │ │ ├── indifferenziata.jpeg
|
||||||
|
│ │ │ │ ├── plastica.jpeg
|
||||||
|
│ │ │ │ ├── umido.jpeg
|
||||||
|
│ │ │ │ └── vetro.jpeg
|
||||||
|
│ │ │ └── rifiuti/
|
||||||
|
│ │ │ ├── bicchiereEbottiglia.webp
|
||||||
|
│ │ │ ├── bottiglie.webp
|
||||||
|
│ │ │ ├── bucciaBanana.png
|
||||||
|
│ │ │ ├── giornale.png
|
||||||
|
│ │ │ ├── lattina.png
|
||||||
|
│ │ │ ├── marmellata.png
|
||||||
|
│ │ │ ├── mozziconiSigaretta.png
|
||||||
|
│ │ │ ├── pannolino.png
|
||||||
|
│ │ │ ├── sacchettoPlastica.png
|
||||||
|
│ │ │ ├── scatolaCartone.png
|
||||||
|
│ │ │ ├── scatolaTonno.webp
|
||||||
|
│ │ │ └── torsoloMela.webp
|
||||||
|
│ │ └── video/
|
||||||
|
│ │ └── background.mp4
|
||||||
|
│ ├── models/
|
||||||
|
│ │ ├── rifiuto.glb
|
||||||
|
│ │ └── tree.glb
|
||||||
|
│ └── texture/
|
||||||
|
│ └── rifiuto/
|
||||||
|
│ ├── Trash_AlbedoTransparency.png
|
||||||
|
│ ├── Trash_Ambient_Occlusion.png
|
||||||
|
│ ├── Trash_MetallicSmoothness.png
|
||||||
|
│ ├── Trash_Normal.png
|
||||||
|
│ └── Trash_Roughness.png
|
||||||
|
├── css/
|
||||||
|
│ ├── classifica.css
|
||||||
|
│ ├── fase1.css
|
||||||
|
│ ├── fase2.css
|
||||||
|
│ ├── istruzioniFase2.css
|
||||||
|
│ └── risultatiFinali.css
|
||||||
|
├── js/
|
||||||
|
│ ├── fase1.js
|
||||||
|
│ └── fase2.js
|
||||||
|
├── materiale/
|
||||||
|
│ ├── idea gioco.drawio
|
||||||
|
│ ├── idea gioco.png
|
||||||
|
│ ├── ideaRisultato.jpeg
|
||||||
|
│ ├── progetto.txt
|
||||||
|
│ ├── schermata iniziale.png
|
||||||
|
│ ├── STRUTTURA.md
|
||||||
|
│ └── TODO.txt
|
||||||
|
├── pages/
|
||||||
|
│ ├── classifica.php
|
||||||
|
│ ├── fase1.html
|
||||||
|
│ ├── fase2.html
|
||||||
|
│ ├── istruzioniFase2.html
|
||||||
|
│ └── risultatiFinali.html
|
||||||
|
├── php/
|
||||||
|
│ ├── db.php
|
||||||
|
│ ├── save_score.php
|
||||||
|
│ └── leaderboard_utils.php
|
||||||
|
├── .gitignore
|
||||||
|
├── db_iniziale.sql
|
||||||
|
├── index.php
|
||||||
|
└── README.md
|
||||||
|
```
|
||||||
|
|
||||||
|
Workflow del gioco:
|
||||||
|
```
|
||||||
|
Inizio -> 60s per raccogliere i rifiuti -> Salvataggio del punteggio in localStorage -> Schermata intermedia -> <punteggio>*5s per separare i rifiuti -> Invio dati della partita al database (nome squadra, rifiuti raccolti nella fase 1, rifiuti separati correttamente nella fase 2, punteggio finale, data della partita) -> caricamento schermata finale con classifica ridotta (posizione, squadra, punteggio) e pulsanti per giocare ancora, impostazioni e la classifica completa (classifica.php) con tutti i dati e tutte le partite giocate (classifica ridotta: solo le prime 5/10 partite)
|
||||||
|
```
|
||||||
|
|
||||||
|
Indirizzamento pagine in index.php
|
||||||
|
```
|
||||||
|
index.php?p=xxx
|
||||||
|
index.php?p=start -> include 'fase1.html' (schermata iniziale + prima fase)
|
||||||
|
index.php?p=mid -> include 'istruzioniFase2.html' (istruzioni per la seconda fase con pulsante per iniziare)
|
||||||
|
index.php?p=sep -> include 'fase2.html' (separazione dei rifiuti + reindirizzamento a schermata finale)
|
||||||
|
index.php?p=end -> include 'risultatiFinali.html' (schermata finale + record assoluto (nome squadra, punteggio finale, data) + classifica ridotta + pulsante 'gioca ancora' (-> index.php?p=start) + pulsante per classifica completa (-> _blank::index.php?p=leaderboard))
|
||||||
|
index.php?p=leaderboard -> classifica globale dei risultati con visualizzazione completa dei dati
|
||||||
|
```
|
||||||
|
|
||||||
|
Array associativo con indirizzamenti da parametri get
|
||||||
|
```php
|
||||||
|
$route = [
|
||||||
|
'start' => 'fase1.html',
|
||||||
|
'mid' => 'istruzioniFase2.html',
|
||||||
|
'sep' => 'fase2.html',
|
||||||
|
'end' => 'risultatiFinali.html',
|
||||||
|
'leaderboard' => 'classifica.php'
|
||||||
|
]
|
||||||
|
```
|
||||||
|
Before Width: | Height: | Size: 59 KiB After Width: | Height: | Size: 59 KiB |
|
Before Width: | Height: | Size: 23 KiB After Width: | Height: | Size: 23 KiB |
|
Before Width: | Height: | Size: 9.8 KiB After Width: | Height: | Size: 9.8 KiB |
@@ -0,0 +1,12 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="it">
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8">
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||||
|
<title>Errore</title>
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<h1>Errore</h1>
|
||||||
|
<p>La pagina richiesta non è stata trovata.</p>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
@@ -3,7 +3,7 @@
|
|||||||
<head>
|
<head>
|
||||||
<meta charset="UTF-8">
|
<meta charset="UTF-8">
|
||||||
<title>Semplice Island FPS</title>
|
<title>Semplice Island FPS</title>
|
||||||
<link rel="stylesheet" href="style.css">
|
<link rel="stylesheet" href="css/fase1.css">
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body>
|
||||||
<div id="start">
|
<div id="start">
|
||||||
@@ -41,6 +41,6 @@
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
<script type="module" src="script.js"></script>
|
<script type="module" src="js/fase1.js"></script>
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||