Merge branch 'main' of ssh://gitlab.fdmci.hva.nl/propedeuse-hbo-ict/onderwijs/2023-2024/out-a-se-ti/blok-2/cuujooceevii61

This commit is contained in:
Mees Roelofsz
2024-01-24 11:43:31 +01:00
25 changed files with 1266 additions and 641 deletions

View File

@@ -17,8 +17,9 @@ nav:
- 📚 Documentatie:
- Presentatie: documentatie/presentatie
- Database: documentatie/database
- SQL : documentatie/sql
- PHP : documentatie/php
- P5.md : documentatie/p5
- Feedback : documentatie/Feedback
- User Interface : "documentatie/User Interface"
- Documentatie game : "documentatie/Documentatie game"
- Documentatie game : "documentatie/Documentatie game"
- UML : "documentatie/uml"

View File

@@ -40,4 +40,49 @@ function canvas2(){
fill(255, 0, 0)
circle (300, 200, 50);
}
```
```
Wat ik later heb gevonden is een betere manier waarbij je een variabel een int maakt en dan een switch statement gebruikt. Dit is een stuk beter dan wat ik heb gedaan. Hieronder staat de code:
```js
let canvasSwitch = 0;
function setup(){
createCanvas(400, 400);
}
function draw(){
//draw a background every frame
background(220)
//switch canvas when spacebar is pressed
if (canvasSwitch == 0){
canvas1();
}
if (canvasSwitch == 1){
canvas2();
}
}
function keyPressed(){
if (keyCode == 32){ // 32 is the keyCode for the space bar
canvasSwitch = 1
}
if (keyCode == 16){ // 16 is the keyCode for the Shift key
canvasSwitch = 0
}
}
//draw a yellow circle on canvas 1
function canvas1(){
fill(255, 255, 0)
circle (200, 200, 50);
}
//draw a red circle on canvas 2
function canvas2(){
fill(255, 0, 0)
circle (300, 200, 50);
}
```

View File

@@ -81,16 +81,36 @@ De game moet duidelijker zijn wanneer je het begint met spelen en wat makkelijke
# Feedback doormiddel van game Sprint 3
#### Persoon 1:
Duidelijker maken wat je moet doen als je spel in gaat (persoon was heel confused wat je moest doen)
Is wel pittig
Is wel grappig
* Duidelijker maken wat je moet doen als je spel in gaat (persoon was heel confused wat je moest doen)
* Is wel pittig
* Is wel grappig
#### Persoon 2
Hoe kan ik hem op pauze zetten
Maak het score text groter
Way too hard
Als je door boss dood gaat kan je niet respawnen
Linksboven in game score hoger maken
* Hoe kan ik hem op pauze zetten
* Maak het score text groter
* Way too hard
* Als je door boss dood gaat kan je niet respawnen
* Linksboven in game score hoger maken
#### Persoon 3
Waar ben ik (speler wat duidelijker maken waar hij is)
* Waar ben ik (speler wat duidelijker maken waar hij is)
#### Persoon 4
* Beetje lastig
* Score resetten na zelf scoren invullen (bug)
* Bij score dat je score kan aanpassen ipv heen en weer gaan
#### Persoon 5
* Game is lastig
* Game is verslavend
* Cool spel
* Je moet iemand inhuren om te stoppen met spelen
#### Persoon 6
* Ik ben er heel slecht in
* Duidelijk wat je moet doen
* Is niet te doen
### Conclusie
De game is lastig wat ook de bedoeling was. Mensen vinden het ook leuk en een iemand vond het zelfs verlavend. Verder was het spel ook duidelijk wat je moest doen. We hebben tussen de feedback ook duidelijker gemaakt waar de speler was, waar een iemand moeite bij had. We hebben vergeleken met vorig feedback steeds minder suggesties gekregen en meer positieve feedback over het spel.

View File

@@ -3,8 +3,11 @@
We hebben een database gemaakt. De tabel heet scores en heeft de volgende kolommen: Naam, Scores.
![Alt text](../assets/image.png)
### Waarom hebben we voor deze structuur gekozen?
We hebben gekozen om 2 tabellen te maken en een koppel tabel zodat we alle gebruikers met hun code apart kunnen houden en de achievementsoorten apart kunnen houden. We hebben users en scores in dezelfde tabel gezet omdat je per sessie maar 1 score kan hebben en dus niet meerdere scores per gebruiker. Aan die sessie kunnen ook achievements worden gekoppelt en die worden dan in de koppel tabel gezet. We hebben een many to many relatie tussen sessie en achievements omdat een sessie meerdere achievements kan hebben en een achievement meerdere sessies kan hebben.
Om iets in de database te zetten moet je de volgende code gebruiken:

View File

@@ -57,6 +57,41 @@ En je kan meerdere dingen in een echo zetten doormiddel van een punt
```php
echo "Text" . $variabele . "Text";
```
De server laat van zichzelf niet toe dat je data ophaalt vanaf een andere server. Om dit te fixen moet je de volgende code in de php file zetten. Hierdoor laat je alle servers toe om data op te halen van deze server. Wat uiteindelijk niet heel veilig is. Eigenlijk wil je het koppelen aan een domein waardoor je niet vanaf overal data kan versturen.
```php
header('Access-Control-Allow-Origin: *');
header('Access-Control-Allow-Methods: GET, POST');
header("Access-Control-Allow-Headers: *");
```
Op deze manier haal je de laatst gegeneerde id op van de database
```php
$last_id = $conn->insert_id;
```
Om data weer uit de database te halen gebruiken we dit SQL commando
```php
$sql = "SELECT * FROM Scores ORDER BY Score DESC LIMIT 10";
```
Dit selecteerd alle scores uit de tabel scores en sorteerd ze op score en laat de top 10 zien. Daarna moet je ze met json encoden en dan kan je ze weer ophalen in javascript.
```php
$result = $conn->query($sql);
$json = json_encode($result);
```
Later kan je het uitprinten op de website door ```echo $json;``` te doen.
Om de data op te halen in javascript moet je het volgende doen:
```js
return fetch(`https://oege.ie.hva.nl/~hossan/getData.php?name=${naam}`)
.then(response => response.json())
.then(data => {
requesteddata = data;
console.log(data);
});
```
Hier word meteen requesteddata een publiek variabel gezet en de json array uitgeprint in console. Waarna je het overal kan gebruiken en beivoorbeeld de highscores kan uitprinten op de website. Bij dit stukje code heb je nog de optie om een naam op te geven, als je dat niet doet dan krijg je de top 10 terug. Als je wel een naam opgeeft dan krijg je alle scores van die naam terug.
---
### Bronnen:
* https://www.w3schools.com/php/php_mysql_select.asp Voor data opvragen uit database

59
docs/documentatie/uml.md Normal file
View File

@@ -0,0 +1,59 @@
### UML game.js
```mermaid
classDiagram
class bullet {
+x
+y
+shot
+angle
+bulletHit
+direction
+directionX
+direcitonY
+hasMoved
+projectile
+radius
+targetx
+targety
+speed
-hit
-shot
-isOffScreen
-originalPos
-targetx
-targety
+draw()
+update(targetx, targety)
}
class Menu {
+controlsImage
+clearDataOnce
+scorescreenOn
+keyReleasedFlag
+dataIsCalled
+requesteddata
+isDead
+iIndex
+currentIndex
+Height
+Width
+homescreen()
+pauseMenu()
+gameOver()
+scoreMenu()
+dodgeBanner()
}
class Database {
+requesteddata
-data
-response
+sendData()
+getData()
}
class Button {
button()
}
Menu --> Database
Menu --> Button
```

View File

@@ -1,29 +0,0 @@
### UML game.js
```mermaid
classDiagram
class bullet {
+x
+y
+shot
+angle
+bulletHit
+direction
+directionX
+direcitonY
+hasMoved
+projectile
+radius
+targetx
+targety
+speed
-hit
-shot
-isOffScreen
-originalPos
-targetx
-targety
+draw()
+update(targetx, targety)
}
```