Skip to content

Commit 5fb1926

Browse files
colinkiamacolinkiama
authored
Merge pull request #81 from colinkiama/60-add-toggle-menu-item-to-main-menu-and-menu-system
Add toggle menu item to main menu and menu system
2 parents 4a33259 + 03f43b3 commit 5fb1926

File tree

10 files changed

+214
-111
lines changed

10 files changed

+214
-111
lines changed

‎src/constants/events.js‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -8,6 +8,7 @@ export const CrossSceneEvent = {
88
HUD_DESTROYED: 'hud-destroyed',
99
RESET_GAME: 'reset-game',
1010
SCORE_RESET: 'score-reset',
11+
PAUSE_REQUESTED: 'pause-requested',
1112
};
1213

1314
export const GameLogicEvent = {

‎src/scenes/Battle.js‎

Lines changed: 16 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -241,6 +241,12 @@ export class Battle extends Scene {
241241
this,
242242
);
243243

244+
crossSceneEventEmitter.on(
245+
CrossSceneEvent.PAUSE_REQUESTED,
246+
this.onPauseRequested,
247+
this,
248+
);
249+
244250
crossSceneEventEmitter.on(
245251
CrossSceneEvent.SHAKE_SCREEN,
246252
this.onScreenShakeRequested,
@@ -285,7 +291,7 @@ export class Battle extends Scene {
285291
}
286292

287293
onPauseRequested() {
288-
this.scene.launch(SceneKey.PAUSE_MENU);
294+
this.scene.launch(SceneKey.PAUSE_MENU, { isReturning: false });
289295
}
290296

291297
unsubscribeFromEvents() {
@@ -342,6 +348,12 @@ export class Battle extends Scene {
342348
this,
343349
);
344350

351+
crossSceneEventEmitter.off(
352+
CrossSceneEvent.PAUSE_REQUESTED,
353+
this.onPauseRequested,
354+
this,
355+
);
356+
345357
crossSceneEventEmitter.off(
346358
CrossSceneEvent.SHAKE_SCREEN,
347359
this.onScreenShakeRequested,
@@ -503,7 +515,7 @@ export class Battle extends Scene {
503515
this._sessionStopWatch.pause();
504516
const gameStats = {
505517
score: this._scoreSystem.getScore(),
506-
oldHighScore: this.game.registry.get(RegistryKey.HIGH_SCORE),
518+
oldHighScore: this.registry.get(RegistryKey.HIGH_SCORE),
507519
time: this._sessionStopWatch.formattedElapsedTime,
508520
};
509521

@@ -518,11 +530,11 @@ export class Battle extends Scene {
518530
}
519531

520532
updateHighScore() {
521-
const storedHighScore = this.game.registry.get(RegistryKey.HIGH_SCORE);
533+
const storedHighScore = this.registry.get(RegistryKey.HIGH_SCORE);
522534
const score = this._scoreSystem.getScore();
523535

524536
if (score > storedHighScore) {
525-
this.game.registry.set(RegistryKey.HIGH_SCORE, score);
537+
this.registry.set(RegistryKey.HIGH_SCORE, score);
526538
localStorage.setItem(LocalStorageKey.HIGH_SCORE, score);
527539
}
528540
}

‎src/scenes/Controls.js‎

Lines changed: 53 additions & 49 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,6 @@
11
import { Scene } from 'phaser';
22
import {
33
COLORS,
4-
WEBSITE_URL,
54
MENU_ITEM_CONFIG,
65
HOVER_TWEEN_CONFIG,
76
CONTROLS_LIST_ITEMS,
@@ -14,6 +13,7 @@ import { SoundFXKey } from '../constants/audio.js';
1413
export class Controls extends Scene {
1514
injector;
1615
_audioSystem;
16+
_backButton;
1717

1818
constructor() {
1919
super(SceneKey.CONTROLS);
@@ -24,6 +24,7 @@ export class Controls extends Scene {
2424
}
2525

2626
create(data) {
27+
this.data.merge(data);
2728
this.cameras.main.setBackgroundColor(0x00000000);
2829

2930
const title = this.add
@@ -42,54 +43,42 @@ export class Controls extends Scene {
4243
let lastSectionItem = title;
4344

4445
for (let i = 0; i < CONTROLS_LIST_ITEMS.length; i++) {
45-
const section = CONTROLS_LIST_ITEMS[i];
46-
lastSectionItem = this.add
46+
const section = CONTROLS_LIST_ITEMS[i];
47+
lastSectionItem = this.add
4748
.text(
48-
320,
49-
lastSectionItem.y + lastSectionItem.height + (i === 0 ? 20 : 16),
50-
section.title,
51-
{
52-
fontFamily: 'usuzi',
53-
fontSize: 18,
54-
},
49+
320,
50+
lastSectionItem.y + lastSectionItem.height + (i === 0 ? 20 : 16),
51+
section.title,
52+
{
53+
fontFamily: 'usuzi',
54+
fontSize: 18,
55+
},
5556
)
5657
.setOrigin(0.5, 0);
5758

58-
let previousListItem = lastSectionItem;
59-
const controls = section.controls;
60-
for (let j = 0; j < controls.length; j++) {
61-
const listItem = controls[j];
62-
previousListItem = this.add
63-
.text(
64-
320,
65-
previousListItem.y + previousListItem.height + (j === 0 ? 8 : 4),
66-
`${listItem.input} - ${listItem.action}`,
67-
{
68-
fontFamily: 'usuzi',
69-
fontSize: 14,
70-
},
71-
)
72-
.setOrigin(0.5, 0);
73-
74-
const href = listItem.href;
75-
if (href) {
76-
previousListItem.setInteractive(MENU_ITEM_CONFIG);
77-
previousListItem.on('pointerover', onButtonHover);
78-
previousListItem.on('pointerover', onButtonHoverForInstance, this);
79-
previousListItem.on('pointerout', onButtonOut);
80-
previousListItem.on('pointerup', () => {
81-
this._audioSystem.playSFX(SoundFXKey.ITEM_SELECTION);
82-
window.open(href, '_blank');
83-
});
84-
}
85-
86-
if (j === controls.length - 1) {
87-
lastSectionItem = previousListItem;
88-
}
59+
let previousListItem = lastSectionItem;
60+
const controls = section.controls;
61+
for (let j = 0; j < controls.length; j++) {
62+
const listItem = controls[j];
63+
previousListItem = this.add
64+
.text(
65+
320,
66+
previousListItem.y + previousListItem.height + (j === 0 ? 8 : 4),
67+
`${listItem.input} - ${listItem.action}`,
68+
{
69+
fontFamily: 'usuzi',
70+
fontSize: 14,
71+
},
72+
)
73+
.setOrigin(0.5, 0);
74+
75+
if (j === controls.length - 1) {
76+
lastSectionItem = previousListItem;
8977
}
78+
}
9079
}
9180

92-
const backButton = this.add
81+
this._backButton = this.add
9382
.text(320, 340, 'Go back', {
9483
fontFamily: 'usuzi',
9584
fontSize: 16,
@@ -98,16 +87,31 @@ export class Controls extends Scene {
9887
.setOrigin(0.5, 1)
9988
.setInteractive(MENU_ITEM_CONFIG);
10089

101-
backButton.on('pointerover', onButtonHover);
102-
backButton.on('pointerover', onButtonHoverForInstance, this);
103-
backButton.on('pointerout', onButtonOut);
104-
backButton.on('pointerup', () => {
105-
this._audioSystem.playSFX(SoundFXKey.ITEM_SELECTION);
106-
this.scene.start(data.returnScene);
107-
});
90+
this._backButton.on('pointerover', onButtonHover);
91+
this._backButton.on('pointerover', onButtonHoverForInstance, this);
92+
this._backButton.on('pointerout', onButtonOut);
93+
this._backButton.on('pointerup', onBackButtonPressForInstance, this);
94+
95+
this.events.once(
96+
'shutdown',
97+
() => {
98+
this._backButton.off('pointerover', onButtonHover);
99+
this._backButton.off('pointerover', onButtonHoverForInstance, this);
100+
this._backButton.off('pointerout', onButtonOut);
101+
this._backButton.off('pointerup', onBackButtonPressForInstance, this);
102+
},
103+
this,
104+
);
108105
}
109106
}
110107

108+
function onBackButtonPressForInstance() {
109+
this._audioSystem.playSFX(SoundFXKey.ITEM_SELECTION);
110+
this.scene.start(this.data.get('returnScene'), {
111+
isReturning: true,
112+
});
113+
}
114+
111115
function onButtonHoverForInstance() {
112116
this._audioSystem.playSFX(SoundFXKey.ITEM_HOVER);
113117
}

‎src/scenes/Credits.js‎

Lines changed: 47 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,6 @@
11
import { Scene } from 'phaser';
22
import {
33
COLORS,
4-
WEBSITE_URL,
54
MENU_ITEM_CONFIG,
65
HOVER_TWEEN_CONFIG,
76
CREDITS_LIST_ITEMS,
@@ -14,16 +13,21 @@ import { SoundFXKey } from '../constants/audio.js';
1413
export class Credits extends Scene {
1514
injector;
1615
_audioSystem;
16+
_interactiveItems;
17+
_backButton;
1718

1819
constructor() {
1920
super(SceneKey.CREDITS);
21+
this._interactiveItems = [];
2022
}
2123

2224
setupDependencies() {
2325
this._audioSystem = this.injector.get(DependencyKey.AUDIO_SYSTEM);
2426
}
2527

2628
create() {
29+
this._interactiveItems = [];
30+
2731
const title = this.add
2832
.text(320, 60, 'Credits', {
2933
fontFamily: 'usuzi',
@@ -74,10 +78,10 @@ export class Credits extends Scene {
7478
previousListItem.on('pointerover', onButtonHover);
7579
previousListItem.on('pointerover', onButtonHoverForInstance, this);
7680
previousListItem.on('pointerout', onButtonOut);
77-
previousListItem.on('pointerup', () => {
78-
this._audioSystem.playSFX(SoundFXKey.ITEM_SELECTION);
79-
window.open(href, '_blank');
80-
});
81+
previousListItem.on('pointerup', onButtonPress);
82+
previousListItem.on('pointerup', onButtonPressForInstance, this);
83+
previousListItem.setData('href', href);
84+
this._interactiveItems.push(previousListItem);
8185
}
8286

8387
if (j === people.length - 1) {
@@ -86,7 +90,7 @@ export class Credits extends Scene {
8690
}
8791
}
8892

89-
const backButton = this.add
93+
this._backButton = this.add
9094
.text(320, 340, 'Back to Main Menu', {
9195
fontFamily: 'usuzi',
9296
fontSize: 16,
@@ -95,16 +99,46 @@ export class Credits extends Scene {
9599
.setOrigin(0.5, 1)
96100
.setInteractive(MENU_ITEM_CONFIG);
97101

98-
backButton.on('pointerover', onButtonHover);
99-
backButton.on('pointerover', onButtonHoverForInstance, this);
100-
backButton.on('pointerout', onButtonOut);
101-
backButton.on('pointerup', () => {
102-
this._audioSystem.playSFX(SoundFXKey.ITEM_SELECTION);
103-
this.scene.start(SceneKey.MAIN_MENU, { playMusic: false });
104-
});
102+
this._backButton.on('pointerover', onButtonHover);
103+
this._backButton.on('pointerover', onButtonHoverForInstance, this);
104+
this._backButton.on('pointerout', onButtonOut);
105+
this._backButton.on('pointerup', onBackButtonPressForInstance, this);
106+
107+
this.events.once(
108+
'shutdown',
109+
() => {
110+
for (let i = this._interactiveItems.length - 1; i > -1; i--) {
111+
const item = this._interactiveItems[i];
112+
item.off('pointerover', onButtonHover);
113+
item.off('pointerover', onButtonHoverForInstance, this);
114+
item.off('pointerout', onButtonOut);
115+
item.off('pointerup', onButtonPress);
116+
item.off('pointerup', onButtonPressForInstance, this);
117+
}
118+
119+
this._backButton.off('pointerover', onButtonHover);
120+
this._backButton.off('pointerover', onButtonHoverForInstance, this);
121+
this._backButton.off('pointerout', onButtonOut);
122+
this._backButton.off('pointerup', onBackButtonPressForInstance, this);
123+
},
124+
this,
125+
);
105126
}
106127
}
107128

129+
function onBackButtonPressForInstance() {
130+
this._audioSystem.playSFX(SoundFXKey.ITEM_SELECTION);
131+
this.scene.start(SceneKey.MAIN_MENU);
132+
}
133+
134+
function onButtonPress() {
135+
window.open(this.getData('href'), '_blank');
136+
}
137+
138+
function onButtonPressForInstance() {
139+
this._audioSystem.playSFX(SoundFXKey.ITEM_SELECTION);
140+
}
141+
108142
function onButtonHoverForInstance() {
109143
this._audioSystem.playSFX(SoundFXKey.ITEM_HOVER);
110144
}

‎src/scenes/GameOver.js‎

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -16,7 +16,6 @@ export class GameOver extends Scene {
1616
/** @type {MenuSystem} */
1717
_menuSystem;
1818
_renderedStatsObjects;
19-
_tweenTimeline;
2019
_explosionPool;
2120
_vfxSystem;
2221
_statsContainer;

‎src/scenes/HUD.js‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -154,7 +154,7 @@ export class HUD extends Scene {
154154
return;
155155
}
156156

157-
const storedHighScore = this.game.registry.get(RegistryKey.HIGH_SCORE);
157+
const storedHighScore = this.registry.get(RegistryKey.HIGH_SCORE);
158158
if (nextPointsValue > storedHighScore) {
159159
this._highScoreLabelText.setVisible(true);
160160
}
@@ -165,7 +165,7 @@ export class HUD extends Scene {
165165
}
166166

167167
onPause() {
168-
this.scene.launch(SceneKey.PAUSE_MENU);
168+
crossSceneEventEmitter.emit(CrossSceneEvent.PAUSE_REQUESTED);
169169
}
170170

171171
unsubscribeFromEvents() {

0 commit comments

Comments
 (0)