diff --git a/data/stage1/image/common/dialog-close-hover.png b/data/stage1/image/common/dialog-close-hover.png index 29706b7..5a1c945 100644 Binary files a/data/stage1/image/common/dialog-close-hover.png and b/data/stage1/image/common/dialog-close-hover.png differ diff --git a/data/stage1/image/common/dialog-close.png b/data/stage1/image/common/dialog-close.png index 6e4628e..60987e4 100644 Binary files a/data/stage1/image/common/dialog-close.png and b/data/stage1/image/common/dialog-close.png differ diff --git a/data/stage1/image/common/dialog.png b/data/stage1/image/common/dialog.png index 8a66288..883d61f 100644 Binary files a/data/stage1/image/common/dialog.png and b/data/stage1/image/common/dialog.png differ diff --git a/data/stage1/image/options/background.png b/data/stage1/image/options/background.png deleted file mode 100644 index 96b721d..0000000 Binary files a/data/stage1/image/options/background.png and /dev/null differ diff --git a/data/stage1/image/options/button-hover.png b/data/stage1/image/options/button-hover.png index 297c0d9..e26f49e 100644 Binary files a/data/stage1/image/options/button-hover.png and b/data/stage1/image/options/button-hover.png differ diff --git a/data/stage1/image/options/button.png b/data/stage1/image/options/button.png index ad93c55..b6bbb78 100644 Binary files a/data/stage1/image/options/button.png and b/data/stage1/image/options/button.png differ diff --git a/data/stage1/image/options/buttons-background.png b/data/stage1/image/options/buttons-background.png new file mode 100644 index 0000000..0622916 Binary files /dev/null and b/data/stage1/image/options/buttons-background.png differ diff --git a/data/stage1/image/options/logo.png b/data/stage1/image/options/logo.png new file mode 100644 index 0000000..b894f0f Binary files /dev/null and b/data/stage1/image/options/logo.png differ diff --git a/data/stage1/image/options/option-fullscreen.png b/data/stage1/image/options/option-fullscreen.png index 4d4851d..c068347 100644 Binary files a/data/stage1/image/options/option-fullscreen.png and b/data/stage1/image/options/option-fullscreen.png differ diff --git a/data/stage1/image/options/option-music.png b/data/stage1/image/options/option-music.png index 4b4f98b..09d6a54 100644 Binary files a/data/stage1/image/options/option-music.png and b/data/stage1/image/options/option-music.png differ diff --git a/data/stage1/image/options/option-sound.png b/data/stage1/image/options/option-sound.png index 839112b..4bcd5fb 100644 Binary files a/data/stage1/image/options/option-sound.png and b/data/stage1/image/options/option-sound.png differ diff --git a/data/stage1/image/options/toggle-hover.png b/data/stage1/image/options/toggle-hover.png index 0e485b1..924df67 100644 Binary files a/data/stage1/image/options/toggle-hover.png and b/data/stage1/image/options/toggle-hover.png differ diff --git a/data/stage1/image/options/toggle-on.png b/data/stage1/image/options/toggle-on.png index c82b94e..95528cd 100644 Binary files a/data/stage1/image/options/toggle-on.png and b/data/stage1/image/options/toggle-on.png differ diff --git a/data/stage1/image/options/toggle.png b/data/stage1/image/options/toggle.png index 77e8e44..33052f1 100644 Binary files a/data/stage1/image/options/toggle.png and b/data/stage1/image/options/toggle.png differ diff --git a/graphics/ui/options.svg b/graphics/ui/options.svg index 265fdf3..c137f3c 100644 --- a/graphics/ui/options.svg +++ b/graphics/ui/options.svg @@ -12,7 +12,7 @@ xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape" width="1920" height="1080" - viewBox="0 0 507.99999 285.75001" + viewBox="0 0 1920 1080" version="1.1" id="svg6044" inkscape:version="0.92.1 r15371" @@ -51,17 +51,6 @@ result="composite2" id="feComposite7510" /> - @@ -74,16 +63,6 @@ offset="1" id="stop5284" /> - @@ -140,10 +119,6 @@ in2="SourceGraphic" id="feComposite4669" operator="over" - k1="-0.40000000000000002" - k2="1.3600000000000001" - k3="0.56000000000000005" - k4="-0.23000000000000001" result="result2" /> + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + inkscape:snap-global="true" + inkscape:pagecheckerboard="true" + inkscape:object-paths="false" + showguides="false" /> @@ -370,7 +824,7 @@ image/svg+xml - + @@ -378,55 +832,160 @@ inkscape:label="Background" inkscape:groupmode="layer" id="layer1" - transform="translate(0,-11.249983)"> - + transform="translate(0,-11.249983)" + style="display:inline"> + + + + + + + - + + + + + + + + + + + + + + + + + + SpaceTac + transform="matrix(0.26458334,0,0,0.26458334,60.497452,-82.248833)" + xml:space="preserve" + style="font-style:normal;font-variant:normal;font-weight:normal;font-stretch:normal;font-size:192px;line-height:25.00000191px;font-family:'Arial Black';-inkscape-font-specification:'Arial Black, ';letter-spacing:0px;word-spacing:0px;display:inline;fill:url(#radialGradient7707);fill-opacity:1;stroke:url(#linearGradient7709);stroke-width:4;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1;filter:url(#filter6258)" + x="172.091" + y="302.71133" + id="text4529-3" + inkscape:export-filename="/home/michael/workspace/perso/spacetac/out/assets/images/menu/title.png" + inkscape:export-xdpi="96" + inkscape:export-ydpi="96">SpaceTac + inkscape:label="Toggles" + style="display:inline"> + inkscape:export-ydpi="96" + transform="matrix(3.7787204,0,0,3.7787204,0.20501444,-0.01972314)"> @@ -443,7 +1002,7 @@ transform="translate(-1.1557989)" id="g5608"> @@ -465,7 +1024,7 @@ + transform="matrix(3.7787204,0,0,3.7787204,211.03141,57.967897)"> + style="fill:#759db0;fill-opacity:1;fill-rule:evenodd;stroke:none;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1" /> + style="fill:none;fill-rule:evenodd;stroke:#759db0;stroke-width:2.11666679;stroke-linecap:round;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" /> - - + inkscape:export-ydpi="96"> + + + + style="display:inline;fill:url(#linearGradient4936);fill-opacity:1;fill-rule:evenodd;stroke:#759db0;stroke-width:0.5291667;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1" /> - + + + inkscape:label="Invite mode" + style="display:none"> + transform="matrix(3.7787204,0,0,3.7787204,0.20498444,291.29303)"> Give this invite code to your friend: + x="536.41077" + y="548.43457" + style="fill:#5398e9;fill-opacity:1;stroke-width:0.9997865px">Give this invite code to your friend: XT324 + x="875.71332" + y="631.27374" + style="font-style:normal;font-variant:normal;font-weight:bold;font-stretch:normal;font-family:sans-serif;-inkscape-font-specification:'sans-serif Bold';fill:#d6d6bd;fill-opacity:1;stroke-width:0.9997865px">XT324 Waiting for a connection ... + x="638.24835" + y="706.97217" + style="fill:#b39256;fill-opacity:1;stroke-width:0.9997865px">Waiting for a connection ... + + - + transform="matrix(0.99978646,0,0,0.99978646,-336.84225,89.985806)" + style="display:inline" + id="g14940" + inkscape:export-filename="/home/michael/workspace/spacetac/data/stage1/image/common/dialog-close.png" + inkscape:export-xdpi="96" + inkscape:export-ydpi="96" + clip-path="url(#clipPath8297)"> + X + y="22.792192" + style="font-style:normal;font-variant:normal;font-weight:bold;font-stretch:normal;font-family:sans-serif;-inkscape-font-specification:'sans-serif Bold';fill:#d5c5ae;fill-opacity:1;stroke-width:0.26458335px">X + - + style="display:inline" + id="g14950" + transform="matrix(0.99978646,0,0,0.99978646,-336.84225,89.985806)" + inkscape:export-filename="/home/michael/workspace/spacetac/data/stage1/image/common/dialog-close-hover.png" + inkscape:export-xdpi="96" + inkscape:export-ydpi="96" + clip-path="url(#clipPath8305)"> + X + x="496.83798" + id="tspan14944" + sodipodi:role="line">X + diff --git a/graphics/ui/title.svg b/graphics/ui/title.svg index 203b4f0..eee0b9f 100644 --- a/graphics/ui/title.svg +++ b/graphics/ui/title.svg @@ -16,7 +16,7 @@ version="1.1" id="svg8" sodipodi:docname="title.svg" - inkscape:version="0.92.2 (unknown)" + inkscape:version="0.92.1 r15371" inkscape:export-filename="/home/michael/workspace/spacetac/out/assets/images/menu/title.png" inkscape:export-xdpi="96" inkscape:export-ydpi="96" @@ -167,20 +167,6 @@ offset="1" id="stop5250" /> - - - - - - + style="opacity:0.322;fill:#b6b1b4;fill-opacity:1;fill-rule:evenodd;stroke:none;stroke-width:0.95922339px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1;filter:url(#filter1326)" /> @@ -1369,17 +1342,17 @@ + style="opacity:0.29800002"> + d="m 1179.7577,1022.959 h 308.1642 c 7.2107,-32.332 14.4214,-64.664 21.6322,-96.99599" + style="display:inline;opacity:1;fill:none;fill-opacity:1;fill-rule:evenodd;stroke:#b5b381;stroke-width:4;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-opacity:1;filter:url(#filter1227)" /> + x="0" /> + x="0" /> @@ -1449,7 +1420,7 @@ x="921.33972" style="font-style:normal;font-weight:normal;font-size:40px;line-height:25px;font-family:sans-serif;letter-spacing:0px;word-spacing:0px;display:inline;fill:#314147;fill-opacity:1;stroke:none;stroke-width:1px;stroke-linecap:butt;stroke-linejoin:miter;stroke-opacity:1;filter:url(#filter1414)" xml:space="preserve"> - diff --git a/src/ui/BaseView.ts b/src/ui/BaseView.ts index bf04419..8da6a94 100644 --- a/src/ui/BaseView.ts +++ b/src/ui/BaseView.ts @@ -153,8 +153,8 @@ module TK.SpaceTac.UI { /** * Open options dialog */ - showOptions(): void { - let dialog = new OptionsDialog(this); + showOptions(credits = false): void { + new OptionsDialog(this, credits); } /** diff --git a/src/ui/battle/OutcomeDialog.ts b/src/ui/battle/OutcomeDialog.ts index 41fc694..198224d 100644 --- a/src/ui/battle/OutcomeDialog.ts +++ b/src/ui/battle/OutcomeDialog.ts @@ -25,7 +25,7 @@ module TK.SpaceTac.UI { * Shortcut to add a single action button at the bottom of dialog */ addActionButton(x: number, text: string, tooltip: string, action: Function) { - let button = this.addButton(x, 885, action, "common-dialog-textbutton", 0, 1, tooltip); + let button = this.addButton(x, 885, action, "common-dialog-textbutton", tooltip); button.addChild(this.addText(0, 0, text, "#d9e0e5")); } diff --git a/src/ui/common/UIComponent.ts b/src/ui/common/UIComponent.ts index 43db5c2..5439c6c 100644 --- a/src/ui/common/UIComponent.ts +++ b/src/ui/common/UIComponent.ts @@ -216,7 +216,7 @@ module TK.SpaceTac.UI { * * DEPRECATED - Use UIBuilder directly */ - addButton(x: number, y: number, on_click: Function, background: string, frame_normal = 0, frame_hover = 1, tooltip = ""): Phaser.Button { + addButton(x: number, y: number, on_click: Function, background: string, tooltip = ""): Phaser.Button { let result = this.builder.button(background, x, y, on_click, tooltip); result.anchor.set(0.5); return result; diff --git a/src/ui/common/UIDialog.ts b/src/ui/common/UIDialog.ts index 5db07d3..2922603 100644 --- a/src/ui/common/UIDialog.ts +++ b/src/ui/common/UIDialog.ts @@ -35,8 +35,8 @@ module TK.SpaceTac.UI { /** * Add a close button */ - addCloseButton(key = "common-dialog-close", x = 1325, y = 131, frame = 0, frame_hover = 1): void { - this.addButton(x, y, () => this.close(), key, frame, frame_hover, "Close this dialog"); + addCloseButton(key = "common-dialog-close", x = 1290, y = 90): void { + this.builder.button(key, x, y, () => this.close(), "Close this dialog"); } /** diff --git a/src/ui/menu/MainMenu.ts b/src/ui/menu/MainMenu.ts index bd2f1a9..226acd2 100644 --- a/src/ui/menu/MainMenu.ts +++ b/src/ui/menu/MainMenu.ts @@ -93,7 +93,7 @@ module TK.SpaceTac.UI { text: "Go", center: true }); }) - let button_options = builder.button("menu-button-small", 1780, 106, () => this.showOptions(), "Options", undefined, { + let button_options = builder.button("menu-button-small", 1780, 106, () => this.showOptions(true), "Options", undefined, { center: true, icon: "menu-icon-options", }); diff --git a/src/ui/options/OptionsDialog.ts b/src/ui/options/OptionsDialog.ts index 31af3a3..4a4d655 100644 --- a/src/ui/options/OptionsDialog.ts +++ b/src/ui/options/OptionsDialog.ts @@ -5,17 +5,24 @@ module TK.SpaceTac.UI { * Dialog to display game options */ export class OptionsDialog extends UIDialog { - constructor(parent: BaseView) { - super(parent, 1453, 1080, "options-background"); + constructor(parent: BaseView, credits = false) { + super(parent); - this.pageMenu(); + if (credits) { + this.pageCredits(); + } else { + this.pageMenu(); + } } pageCommon() { let options = this.view.options; this.clearContent(); - this.addCloseButton("common-dialog-close", 1304, 131, 0, 1); + this.addCloseButton(); + + this.builder.image("options-logo", 473, 71); + this.builder.image("options-buttons-background", 244, 357); this.addToggleButton(415, 381, "options-option-sound", "Toggle all sound", toggled => options.setNumberValue("mainvolume", toggled ? 1 : 0), @@ -57,12 +64,41 @@ module TK.SpaceTac.UI { this.pageCommon(); if (this.view.session.primary) { - this.addButton(this.width / 2, 600, () => this.pageInvite(), "options-button"); - this.addText(this.width / 2, 600, "Invite a friend", "#5398e9", 36, true, true); + this.builder.button("options-button", this.width / 2, 600, () => this.pageInvite(), "Invite a friend to join this game as spectator", undefined, { + center: true, + text: "Invite a friend", + text_style: { + color: "#9fc4d6", + size: 36, + } + }); } - this.addButton(this.width / 2, 800, () => this.view.gameui.quitGame(), "options-button"); - this.addText(this.width / 2, 800, "Quit to menu", "#5398e9", 36, true, true); + this.builder.button("options-button", this.width / 2, 800, () => this.view.gameui.quitGame(), "End the current game and go back to main menu", undefined, { + center: true, + text: "Quit to menu", + text_style: { + color: "#9fc4d6", + size: 36, + } + }); + } + + /** + * Show the credits info + */ + pageCredits() { + this.pageCommon(); + + this.builder.text("Credits", this.width / 2, 566, { center: true, size: 48, color: "#dbeff9", shadow: true }); + let credits = "Michaël Lemaire - Code and graphics\n\ +Viktor Hahn - Ship models\n\ +KenneyNL - Sound effects\n\ +Matthieu Desprez - Beta testing and ideas\n\ +Néstor Delgado - Font\n\ +Nicolas Forgo - Ship models\n\ +Kevin MacLeod - Musics"; + this.builder.text(credits, this.width / 2, 754, { center: true, size: 24, color: "#9fc4d6", shadow: true }); } /** @@ -95,12 +131,18 @@ module TK.SpaceTac.UI { private displayMultiplayerToken(token: string) { this.pageCommon(); - this.addText(this.width / 2, 540, "Give this invite code to your friend:", "#5398e9", 36, false, true); - this.addText(this.width / 2, 620, token, "#d6d6bd", 36, true, true); - this.addText(this.width / 2, 700, "Waiting for a connection...", "#b39256", 36, false, true); + this.addText(this.width / 2, 540, "Give this invite code to your friend:", "#dbeff9", 36, false, true); + this.addText(this.width / 2, 620, token, "#9FC4D6", 36, true, true); + this.addText(this.width / 2, 700, "Waiting for a connection...", "#BF9757", 36, false, true); - this.addButton(this.width / 2, 840, () => this.pageMenu(), "options-button"); - this.addText(this.width / 2, 840, "Cancel", "#5398e9", 36, true, true); + this.builder.button("options-button", this.width / 2, 840, () => this.pageMenu(), "Cancel waiting for the other person to connect", undefined, { + center: true, + text: "Cancel", + text_style: { + color: "#9fc4d6", + size: 36, + } + }); } /** @@ -111,8 +153,14 @@ module TK.SpaceTac.UI { this.addText(this.width / 2, 620, "Could not establish connection to server", "#b35b56", 36, true, true); - this.addButton(this.width / 2, 840, () => this.pageMenu(), "options-button"); - this.addText(this.width / 2, 840, "Cancel", "#5398e9", 36, true, true); + this.builder.button("options-button", this.width / 2, 840, () => this.pageMenu(), "Cancel the connection", undefined, { + center: true, + text: "Cancel", + text_style: { + color: "#9fc4d6", + size: 36, + } + }); } } }