1
0
Fork 0

Added fullscreen toggle

This commit is contained in:
Michaël Lemaire 2017-05-16 01:15:07 +02:00
parent dd4593ec3a
commit 64befbfeeb
7 changed files with 106 additions and 10 deletions

View file

@ -252,11 +252,11 @@
borderopacity="1.0"
inkscape:pageopacity="0"
inkscape:pageshadow="2"
inkscape:zoom="89.6"
inkscape:cx="287.94937"
inkscape:cy="957.67084"
inkscape:zoom="0.7"
inkscape:cx="1651.1031"
inkscape:cy="985.51155"
inkscape:document-units="px"
inkscape:current-layer="layer4"
inkscape:current-layer="layer5"
showgrid="false"
showguides="true"
inkscape:lockguides="false"
@ -276,7 +276,7 @@
<dc:format>image/svg+xml</dc:format>
<dc:type
rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
<dc:title></dc:title>
<dc:title />
</cc:Work>
</rdf:RDF>
</metadata>
@ -711,4 +711,38 @@
inkscape:export-xdpi="96"
inkscape:export-ydpi="96" />
</g>
<g
inkscape:groupmode="layer"
id="layer5"
inkscape:label="Fullscreen button"
style="display:inline">
<rect
style="display:inline;fill:#1e3959;fill-opacity:1;fill-rule:evenodd;stroke:#8fbcbd;stroke-width:0.5291667;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:0.96470588"
id="rect6016"
width="23.386084"
height="23.386084"
x="480.28333"
y="3.9142845"
inkscape:export-filename="/home/michael/workspace/perso/spacetac/out/assets/images/menu/button-fullscreen.png"
inkscape:export-xdpi="96"
inkscape:export-ydpi="96" />
<path
style="display:inline;fill:#8fbdbe;fill-opacity:0.96470588;fill-rule:evenodd;stroke:#b6cfd0;stroke-width:0.17029287px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:0.53617021"
d="m 481.54179,5.0555342 h 5.20002 l -5.20002,5.2000148 z"
id="rect6020"
inkscape:connector-curvature="0"
sodipodi:nodetypes="cccc"
inkscape:export-filename="/home/michael/workspace/perso/spacetac/out/assets/images/menu/button-fullscreen.png"
inkscape:export-xdpi="96"
inkscape:export-ydpi="96" />
<path
sodipodi:nodetypes="cccc"
inkscape:connector-curvature="0"
id="path6023"
d="m 502.61094,26.158088 h -5.20002 l 5.20002,-5.20002 z"
style="display:inline;fill:#8fbdbe;fill-opacity:0.96470588;fill-rule:evenodd;stroke:#b6cfd0;stroke-width:0.17029287px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:0.53617021"
inkscape:export-filename="/home/michael/workspace/perso/spacetac/out/assets/images/menu/button-fullscreen.png"
inkscape:export-xdpi="96"
inkscape:export-ydpi="96" />
</g>
</svg>

Before

Width:  |  Height:  |  Size: 28 KiB

After

Width:  |  Height:  |  Size: 29 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 749 B

View file

@ -120,5 +120,50 @@ module TS.SpaceTac.UI {
.catch(console.error)
//.catch(() => this.messages.addMessage("Error saving game to cloud"));
}
/**
* Toggle fullscreen mode.
*
* Returns true if the result is fullscreen
*/
toggleFullscreen(active: boolean | null = null): boolean {
if (active === false || (active !== true && this.game.scale.isFullScreen)) {
this.scale.stopFullScreen();
this.setStorage("fullscreen", "false");
return false;
} else {
this.scale.startFullScreen(true);
this.setStorage("fullscreen", "true");
return true;
}
}
/**
* Set a value in localStorage, if available
*/
setStorage(key: string, value: string): void {
if (typeof localStorage != "undefined") {
localStorage.setItem("spacetac-" + key, value);
}
}
/**
* Get a value from localStorage
*/
getStorage(key: string): string | null {
if (typeof localStorage != "undefined") {
return localStorage.getItem("spacetac-" + key);
} else {
return null;
}
}
/**
* Check if the mouse is inside a given area
*/
isMouseInside(area: IBounded): boolean {
let pos = this.input.mousePointer.position;
return pos.x >= area.x && pos.x < area.x + area.width && pos.y >= area.y && pos.y < area.y + area.height;
}
}
}

View file

@ -14,6 +14,7 @@ module TS.SpaceTac.UI {
this.loadImage("menu/title.png");
this.loadImage("menu/button.png");
this.loadImage("menu/button-hover.png");
this.loadImage("menu/button-fullscreen.png");
this.loadImage("menu/star.png");
this.loadImage("menu/load-bg.png");
this.loadImage("common/transparent.png");

View file

@ -37,6 +37,9 @@ module TS.SpaceTac.UI {
this.bind("m", "Toggle sound", () => {
this.game.audio.toggleMute();
});
this.bind("f", "Toggle fullscreen", () => {
view.toggleFullscreen();
});
this.bind("+", "", () => {
if (this.cheats_allowed) {
this.cheat = !this.cheat;

View file

@ -9,7 +9,7 @@ module TS.SpaceTac.UI.Specs {
let view = <MainMenu>testgame.ui.state.getCurrentState();
expect(view.layer_stars.children.length).toBe(300);
expect(view.layer_title.children.length).toBe(4);
expect(view.layer_title.children.length).toBe(5);
expect(view.layer_title.children[0] instanceof Phaser.Button).toBe(true);
expect(view.layer_title.children[1] instanceof Phaser.Button).toBe(true);
expect(view.layer_title.children[2] instanceof Phaser.Button).toBe(true);

View file

@ -31,9 +31,14 @@ module TS.SpaceTac.UI {
}
// Menu buttons
this.button_new_game = this.addButton(322, 674, "New Game", "Start a new campaign in a generated universe", this.onNewGame);
this.button_load_game = this.addButton(960, 674, "Load / Join", "Load a saved game or join a friend", this.onLoadGame);
this.button_quick_battle = this.addButton(1606, 674, "Quick Battle", "Play a single generated battle", this.onQuickBattle);
this.button_new_game = this.addButton(322, 674, "New Game", "Start a new campaign in a generated universe", () => this.onNewGame());
this.button_load_game = this.addButton(960, 674, "Load / Join", "Load a saved game or join a friend", () => this.onLoadGame());
this.button_quick_battle = this.addButton(1606, 674, "Quick Battle", "Play a single generated battle", () => this.onQuickBattle());
// Fullscreen button
let button = new Phaser.Button(this.game, 1815, 15, "menu-button-fullscreen", () => this.toggleFullscreen());
this.tooltip.bindStaticText(button, "Toggle full-screen");
this.layer_title.add(button);
// Title
let title = this.add.image(960, 225, "menu-title", 0, this.layer_title);
@ -48,7 +53,13 @@ module TS.SpaceTac.UI {
}
addButton(x: number, y: number, caption: string, tooltip: string, callback: Function): Phaser.Button {
var button = this.add.button(x - 20, y + 20, "menu-button", callback, this, null, null, null, null, this.layer_title);
var button = this.add.button(x - 20, y + 20, "menu-button", () => {
let fullscreen = this.getStorage("fullscreen");
if (fullscreen == "true") {
this.toggleFullscreen(true);
}
callback();
});
button.anchor.set(0.5, 0);
button.input.useHandCursor = true;
@ -68,6 +79,8 @@ module TS.SpaceTac.UI {
this.tooltip.bindStaticText(button, tooltip);
this.layer_title.add(button);
return button;
}