overall fixes

- updated dependencies
- updated stories
- fixed nodes randomly becoming not clickable
- added animations to entities in map

package.json

@@ -42,23 +42,23 @@
     "node": "^14.18.0 || >=16.0.0"
   },
   "devDependencies": {
-    "@iconify-icons/ic": "^1.2.10",
-    "@iconify/vue": "^4.0.0",
+    "@iconify-icons/ic": "^1.2.13",
+    "@iconify/vue": "^4.0.2",
     "@types/animejs": "^3.1.6",
-    "@types/jquery": "^3.5.14",
+    "@types/jquery": "^3.5.16",
     "@types/lodash.clonedeep": "^4.5.7",
     "@types/webfontloader": "^1.6.35",
-    "@vitejs/plugin-vue": "^3.1.2",
+    "@vitejs/plugin-vue": "^4.0.0",
     "autoprefixer": "^10.4.13",
-    "electron": "^21.2.2",
-    "postcss": "^8.4.18",
-    "tailwindcss": "^3.2.2",
-    "typescript": "^4.9.3",
-    "vite": "^3.1.4",
-    "vite-electron-plugin": "^0.5.0",
-    "vite-plugin-electron-renderer": "^0.10.1",
+    "electron": "^22.0.1",
+    "postcss": "^8.4.21",
+    "tailwindcss": "^3.2.4",
+    "typescript": "^4.9.4",
+    "vite": "^4.0.4",
+    "vite-electron-plugin": "^0.7.3",
+    "vite-plugin-electron-renderer": "^0.11.4",
     "vue": "^3.2.45",
-    "vue-tsc": "^1.0.9"
+    "vue-tsc": "^1.0.24"
   },
   "debug": {
     "env": {
@@ -74,11 +74,11 @@
   ],
   "dependencies": {
     "grid-engine": "^2.24.0",
-    "jquery": "^3.6.1",
+    "jquery": "^3.6.3",
     "lodash.clonedeep": "^4.5.0",
     "phaser": "^3.55.2",
-    "pinia": "^2.0.23",
-    "rxjs": "^7.5.7",
+    "pinia": "^2.0.28",
+    "rxjs": "^7.8.0",
     "webfontloader": "^1.6.28"
   }
 }

src/assets/stories.json

@@ -10,7 +10,10 @@
         "position": "top-right"
       }
     ],
-    "text": "Cinque studenti universitari impegnati con lo sviluppo del loro videogioco, notano che uno dei loro pc si comporta in modo strano quando viene avviata la demo del videogame durante uno degli Scrum Meeting settimanali. A causa di circostanze ignote, i cinque aspiranti programmatori si ritrovano catapultati all’interno del mondo virtuale da loro programmato, e iniziano la ricerca di un modo per tornare al mondo reale.<br/>Il primo incontro del gruppo presso il villaggio di Didascalèion è la Magnifica Maga Rombòs, una giovane chiaroveggente che vuole sapere di più sui cinque forestieri. Il gruppo racconta di provenire dal villaggio di Òntos a sud, e poiché non possono rivelare di essere coloro che hanno letteralmente creato sia la Maga che l’intero Regno di Empaizo, gli eroi raccontano a Rombòs di essere degli avventurieri senza meta alla ricerca di “qualcosa che non provenga da questo mondo”, sperando che la Maga possa aiutarli in qualche modo. Sorpresa del loro obbiettivo, la chiaroveggente si offre di addestrare i cinque avventurieri per la loro impresa, proponendo loro di insegnargli le basi del combattimento per diventare dei Màtetai, degli eroi valorosi in grado di sconfiggere i mostri usando le arti magiche. Ma proprio quando stanno per accettare la proposta della Maga, ecco che vengono attaccati da un gruppo di nemici: meglio sperimentare con la pratica che con la teoria!<br/><br/>Questa prima parte della storia è disponibile in un <a href='https://youtu.be/nFIEBcLFbao' target='_blank'>Concept Video</a> realizzato per mostrare il sistema di dialogo!"
+    "text": [
+      "Cinque studenti universitari impegnati con lo sviluppo del loro videogioco, notano che uno dei loro pc si comporta in modo strano quando viene avviata la demo del videogame durante uno degli Scrum Meeting settimanali. A causa di circostanze ignote, i cinque aspiranti programmatori si ritrovano catapultati all’interno del mondo virtuale da loro programmato, e iniziano la ricerca di un modo per tornare al mondo reale.",
+      "Il primo incontro del gruppo presso il villaggio di Didascalèion è la Magnifica Maga Rombòs, una giovane chiaroveggente che vuole sapere di più sui cinque forestieri. Il gruppo racconta di provenire dal villaggio di Òntos a sud, e poiché non possono rivelare di essere coloro che hanno letteralmente creato sia la Maga che l’intero Regno di Empaizo, gli eroi raccontano a Rombòs di essere degli avventurieri senza meta alla ricerca di \"qualcosa che non provenga da questo mondo\", sperando che la Maga possa aiutarli in qualche modo. Sorpresa del loro obbiettivo, la chiaroveggente si offre di addestrare i cinque avventurieri per la loro impresa, proponendo loro di insegnargli le basi del combattimento per diventare dei Màtetai, degli eroi valorosi in grado di sconfiggere i mostri usando le arti magiche. Ma proprio quando stanno per accettare la proposta della Maga, ecco che vengono attaccati da un gruppo di nemici: meglio sperimentare con la pratica che con la teoria!<br/><br/>Questa prima parte della storia è disponibile in un <a href='https://youtu.be/nFIEBcLFbao' target='_blank'>Concept Video</a> realizzato per mostrare il sistema di dialogo!"
+    ]
   },
   {
     "images": [],
@@ -31,7 +34,10 @@
         "position": "bottom-right"
       }
     ],
-    "text": "Sconfitta la minaccia inaspettata, la Maga Rombòs riconosce il valore dei cinque eroi, e rivela loro che si tramanda da tempi antichi una Leggenda sui “Confini del Mondo”, una zona da cui è bene tenersi lontani. Molti viaggiatori si sono avventurati nelle terre a Nord-Ovest del Regno, ma senza mai fare ritorno: per questo gli abitanti di Didascalèion hanno ribattezzato quella zona come “Terra Ricolma di Effigi Nefaste e Tombe Antiche”, a causa dei numerosi viaggi senza ritorno degli avventurieri presso questa presunta “Fine del Mondo”. Gli eroi, nonostante gli avvertimenti della Maga, decidono così di mettersi in viaggio insieme a quest’ultima per Nord-Ovest al fine di trovare qualcosa che li possa aiutare nel loro scopo: uscire dal videogioco."
+    "text": [
+      "Sconfitta la minaccia inaspettata, la Maga Rombòs riconosce il valore dei cinque eroi, e rivela loro che si tramanda da tempi antichi una Leggenda sui \"Confini del Mondo\", una zona da cui è bene tenersi lontani. Molti viaggiatori si sono avventurati nelle terre a Nord-Ovest del Regno, ma senza mai fare ritorno: per questo gli abitanti di Didascalèion hanno ribattezzato quella zona come \"Terra Ricolma di Effigi Nefaste e Tombe Antiche\", a causa dei numerosi viaggi senza ritorno degli avventurieri presso questa presunta \"Fine del Mondo\".",
+      "Gli eroi, nonostante gli avvertimenti della Maga, decidono così di mettersi in viaggio insieme a quest’ultima per Nord-Ovest al fine di trovare qualcosa che li possa aiutare nel loro scopo: uscire dal videogioco."
+    ]
   },
   {
     "images": [],
@@ -44,7 +50,9 @@
         "position": "bottom-right"
       }
     ],
-    "text": "Arrivati in una radura vicino al bosco Àlsos, la Maga Rombòs racconta ai cinque avventurieri di una antica favola tramandata dalla sua famiglia, per tenere lontani i bambini dal bosco. La favola narra di Regitare, il Re Coraggioso, un antico sovrano che durante una delle sue esplorazioni si avventurò presso il bosco Àlsos alla ricerca della “Lira Oscura Dell’Edera”. Si diceva che questa Lira godesse di poteri magici curativi benefici per chi la possedesse, ma proprio a causa della sua potenza sia stata nascosta nelle profondità più recondite del bosco. Regitare però, durante la ricerca della Lira Oscura si perse nel bosco e rimase a vagare per giorni e giorni. Alcuni raccontano che ancora oggi, la notte, scorgano il fantasma del Re mentre cerca la Lira nascosta, vagando tra gli alberi. Che sia solo una favola, o ci sia un fondo di verità in questa storiella raccontata ai bambini per non farli andare nel bosco?"
+    "text": [
+      "Arrivati in una radura vicino al bosco Àlsos, la Maga Rombòs racconta ai cinque avventurieri di una antica favola tramandata dalla sua famiglia, per tenere lontani i bambini dal bosco. La favola narra di Regitare, il Re Coraggioso, un antico sovrano che durante una delle sue esplorazioni si avventurò presso il bosco Àlsos alla ricerca della \"Lira Oscura Dell’Edera\". Si diceva che questa Lira godesse di poteri magici curativi benefici per chi la possedesse, ma proprio a causa della sua potenza sia stata nascosta nelle profondità più recondite del bosco. Regitare però, durante la ricerca della Lira Oscura si perse nel bosco e rimase a vagare per giorni e giorni. Alcuni raccontano che ancora oggi, la notte, scorgano il fantasma del Re mentre cerca la Lira nascosta, vagando tra gli alberi. Che sia solo una favola, o ci sia un fondo di verità in questa storiella raccontata ai bambini per non farli andare nel bosco?"
+    ]
   },
   {
     "images": [],
@@ -57,7 +65,9 @@
         "position": "top-left"
       }
     ],
-    "text": "Allora le voci sul bosco erano vere! Sconfitto il fantasma di Regitare, gli eroi trovano una radura all’interno del bosco, e non riescono a credere ai loro occhi: la “Lira Oscura Dell’Edera” era proprio davanti a loro. Ancora increduli, raccolgono l’oggetto magico e ne comprendono subito l’utilizzo, come se qualcosa o qualcuno avesse spiegato loro il suo funzionamento. Forse lo spirito di Regitare, il Re Coraggioso? O forse è il bosco Àlsos stesso ad avergli comunicato come utilizzarla?<br/><br/>- La Lira Oscura Dell’Edera è stata aggiunta all’inventario!<br/>Utilizza la Lira dall’inventario per portare in vita gli alleati esausti una volta per battaglia"
+    "text": [
+      "Allora le voci sul bosco erano vere! Sconfitto il fantasma di Regitare, gli eroi trovano una radura all’interno del bosco, e non riescono a credere ai loro occhi: la \"Lira Oscura Dell’Edera\" era proprio davanti a loro. Ancora increduli, raccolgono l’oggetto magico e ne comprendono subito l’utilizzo, come se qualcosa o qualcuno avesse spiegato loro il suo funzionamento. Forse lo spirito di Regitare, il Re Coraggioso? O forse è il bosco Àlsos stesso ad avergli comunicato come utilizzarla?<br/><br/>- La Lira Oscura Dell’Edera è stata aggiunta all’inventario!<br/>Utilizza la Lira dall’inventario per portare in vita gli alleati sconfitti in battaglia!"
+    ]
   },
   {
     "images": [
@@ -66,7 +76,9 @@
         "position": "bottom-left"
       }
     ],
-    "text": "Giunti presso la “Terra Ricolma di Effigi Nefaste e Tombe Antiche”, ai Confini del Mondo, gli eroi trovano un’entità che si autodefinisce “The Administrator” e che sostiene di avere il controllo sul Regno di Empaizo. Gli studenti sono sicuri che oltre loro cinque, nessun altro dovrebbe aver accesso al gioco come Amministratore, e sono increduli nello scoprire che qualcuno si stia impersonando tale. Deducono che un Hacker sia riuscito ad accedere ai dati privati relativi al gioco, e che questo abbia impostato il suo Account come Amministratore sfruttando dei Bug. Dopo un improvviso attacco da parte di “The Administrator” che poteva essere fatale se non fosse stato per la prontezza della Magnifica Maga, uno degli avventurieri nota che tutta la potenza del nemico deriva da una “Console dei Comandi” in suo possesso, dalla quale egli scaglia attacchi a tutta potenza, aiutato dai Glitch da lui generati. Appurato che con la sconfitta di “The Administrator” gli eroi avrebbero avuto accesso ad un Terminale, e quindi ad un punto di comunicazione con il mondo reale, decidono di attuare una strategia che gli permetta di sconfiggere il nemico. Inizia così l’ultima battaglia degli avventurieri nel Regno di Empaizo!"
+    "text": [
+      "Giunti presso la \"Terra Ricolma di Effigi Nefaste e Tombe Antiche\", ai Confini del Mondo, gli eroi trovano un’entità che si autodefinisce \"The Administrator\" e che sostiene di avere il controllo sul Regno di Empaizo. Gli studenti sono sicuri che oltre loro cinque, nessun altro dovrebbe aver accesso al gioco come Amministratore, e sono increduli nello scoprire che qualcuno si stia impersonando tale. Deducono che un Hacker sia riuscito ad accedere ai dati privati relativi al gioco, e che questo abbia impostato il suo Account come Amministratore sfruttando dei Bug. Dopo un improvviso attacco da parte di \"The Administrator\" che poteva essere fatale se non fosse stato per la prontezza della Magnifica Maga, uno degli avventurieri nota che tutta la potenza del nemico deriva da una \"Console dei Comandi\" in suo possesso, dalla quale egli scaglia attacchi a tutta potenza, aiutato dai Glitch da lui generati. Appurato che con la sconfitta di \"The Administrator\" gli eroi avrebbero avuto accesso ad un Terminale, e quindi ad un punto di comunicazione con il mondo reale, decidono di attuare una strategia che gli permetta di sconfiggere il nemico. Inizia così l’ultima battaglia degli avventurieri nel Regno di Empaizo!"
+    ]
   },
   {
     "images": [],
@@ -87,6 +99,9 @@
         "position": "top-right"
       }
     ],
-    "text": "Gli eroi hanno trionfato sul falso Amministratore e sono usciti vittoriosi dalla battaglia. Dopo aver confessato la verità sulla loro identità alla Maga Rombòs, gli avventurieri si avvicinano alla carcassa di “The Administrator” alla ricerca del Terminale. Avendo accesso alla Console dei Comandi, sono in grado di poter tornare al mondo reale, e si rivolgono a Rombòs per un ultimo saluto. Se non fosse stato per il suo aiuto, starebbero ancora vagando per Didascalèion in cerca di chissà cosa. Grazie a lei hanno imparato il lavoro di squadra, che spesso non può mettere d’accordo tutti ma è essenziale per un fine comune. Hanno imparato a sfruttare le proprie potenzialità in modo da collaborare e ottenere il risultato migliore tutti insieme. Lei li ha aiutati nel momento del bisogno e supportati nella loro avventura. Dopo un saluto commovente con dei tratti più di un addio che di un arrivederci, gli eroi salutano la Maga sapendo che qualora avessero voluto tornare in quelle terre, lei sarebbe stata lì ad aspettarli. I cinque programmatori fanno quindi partire il comando sul Terminale per uscire dal gioco e si dissolvono nel cielo lasciando, solo per il momento, il Regno di Empaizo. L’avventura di loro cinque, la Penta Quest, è conclusa."
+    "text": [
+      "Gli eroi hanno trionfato sul falso Amministratore e sono usciti vittoriosi dalla battaglia. Dopo aver confessato la verità sulla loro identità alla Maga Rombòs, gli avventurieri si avvicinano alla carcassa di \"The Administrator\" alla ricerca del Terminale. Avendo accesso alla Console dei Comandi, sono in grado di poter tornare al mondo reale, e si rivolgono a Rombòs per un ultimo saluto. Se non fosse stato per il suo aiuto, starebbero ancora vagando per Didascalèion in cerca di chissà cosa. Grazie a lei hanno imparato il lavoro di squadra, che spesso non può mettere d’accordo tutti ma è essenziale per un fine comune. Hanno imparato a sfruttare le proprie potenzialità in modo da collaborare e ottenere il risultato migliore tutti insieme. Lei li ha aiutati nel momento del bisogno e supportati nella loro avventura.",
+      "Dopo un saluto commovente con dei tratti più di un addio che di un arrivederci, gli eroi salutano la Maga sapendo che qualora avessero voluto tornare in quelle terre, lei sarebbe stata lì ad aspettarli. I cinque programmatori fanno quindi partire il comando sul Terminale per uscire dal gioco e si dissolvono nel cielo lasciando, solo per il momento, il Regno di Empaizo. L’avventura di loro cinque, la Penta Quest, è conclusa."
+    ]
   }
 ]

src/classes/Entity.ts

@@ -7,12 +7,12 @@ export class Entity {
     public animations: Phaser.Animations.Animation[] = []
 
     constructor(private scene: Phaser.Scene, public spriteName: string, private tilePos = new Vector2(0, 0)) {
-        this.animations = scene.anims.createFromAseprite(spriteName)
-        this.sprite = scene.add.sprite(0, 0, spriteName).setInteractive().setScale(2)
+        this.sprite = scene.add.sprite(0, 0, spriteName).setInteractive().setScale(1.6)
+        this.animations = this.sprite.anims.createFromAseprite(this.scene.game, spriteName)
         this.movRange = 1
     }
 
-    public getCharacterConfig(collision: string[] = []): any{
+    public getCharacterConfig(collision: string[] = []): any {
         return {
             id: this.spriteName,
             sprite: this.sprite,
@@ -22,21 +22,25 @@ export class Entity {
             collides: {
                 collisionGroups: collision
             }
-        };
+        }
     }
 
-    public movePlayerTo(position: Vector2): void{
+    public movePlayerTo(position: Vector2): void {
         this.scene.gridEngine.moveTo(this.spriteName, { x: position.x, y: position.y })
     }
 
     private movePlayer(direction: Direction): void {
-        this.scene.gridEngine.move(this.spriteName,direction);
+        this.scene.gridEngine.move(this.spriteName, direction)
     }
 
     public setEvent(event: string, fn: Function): void {
         this.sprite.on(event, fn)
     }
 
+    public getInitPosition(): Vector2 {
+        return new Vector2(this.tilePos.x, this.tilePos.y)
+    }
+
     public getPosition(): Position {
         return this.scene.gridEngine.getPosition(this.spriteName)
     }

src/components/CombatInterface.vue

@@ -148,15 +148,18 @@ fetch(`http://localhost:8080/api/v1/${stage.selectedNode}/enemies`).then(res =>
 const currentTurn = ref(0)
 const orderTurn = reactive<(Player | Enemy)[]>([...main.party, ...combat.enemies])
 orderTurn.sort((p1, p2) => (p1.agility < p2.agility) ? 1 : (p1.agility > p2.agility) ? -1 : 0)
+combat.currentTurn = currentTurn.value
+combat.orderTurn = orderTurn
 combat.currentEntity = orderTurn[currentTurn.value]
+combat.combatLog += `Ora è il turno di ${combat.currentEntity.name}!\n`
 
 watch([orderTurn, currentTurn], async () => {
     if (currentTurn.value == orderTurn.length) currentTurn.value = 0
     combat.currentEntity = orderTurn[currentTurn.value]
     combat.combatLog += `Ora è il turno di ${combat.currentEntity.name}!\n`
     if (combat.enemies.length == 0 || main.party.length == 0) {
         const totalExp = combat.enemies.map(v => v.expReward).reduce((c, p) => c + p)
-        main.party.forEach(v => v.currentExp += totalExp / 5)
+        main.party.forEach(v => v.addExp(totalExp / 5))
         fetch(`http://localhost:8080/api/v1/party`, {
             method: 'POST',
             headers: {
@@ -169,8 +172,12 @@ watch([orderTurn, currentTurn], async () => {
             })
         }).then(() => main.changeScene('StageScene'))
     }
+    combat.currentTurn = currentTurn.value
+    combat.orderTurn = orderTurn
 })
 
+combat.$subscribe((store, vars) => currentTurn.value = vars.currentTurn)
+
 onMounted(() => {
     new ResizeObserver(() => logElement.value!.scrollTop = logElement.value!.scrollHeight).observe(textElement.value!)
 })
@@ -201,6 +208,7 @@ const moveRight = () => combat.moveDirection = "right"
 const confirmMove = () => {
     combat.isConfirmed = true
     combat.combatLog += `${combat.currentEntity?.name} si è spostato!\n`
+    showMove.value = false
 }
 
 const actionSkip = () => {