From 3d330d359e36af4dde4871ba0955e6cb4a9ab285 Mon Sep 17 00:00:00 2001 From: Vortrex <3858226+VortrexFTW@users.noreply.github.com> Date: Mon, 25 Oct 2021 12:57:49 -0500 Subject: [PATCH] Use new server-specific GUI colours --- scripts/client/gui/charselect.js | 12 ++--- scripts/client/gui/error.js | 6 +-- scripts/client/gui/info.js | 6 +-- scripts/client/gui/list.js | 76 ++++++++++++++++++++++++++++++++ scripts/client/gui/login.js | 33 +++++++++++++- scripts/client/gui/newchar.js | 5 ++- scripts/client/gui/register.js | 2 +- scripts/client/gui/yesno.js | 8 ++-- 8 files changed, 127 insertions(+), 21 deletions(-) create mode 100644 scripts/client/gui/list.js diff --git a/scripts/client/gui/charselect.js b/scripts/client/gui/charselect.js index fbf3c63d..dd436ba8 100644 --- a/scripts/client/gui/charselect.js +++ b/scripts/client/gui/charselect.js @@ -26,11 +26,11 @@ function initCharacterSelectGUI() { logToConsole(LOG_DEBUG, `[VRR.GUI] Creating character select GUI ...`); characterSelect.window = mexui.window(game.width/2-215, game.height/2-83, 430, 190, 'Select Character', { main: { - backgroundColour: toColour(windowColour[0], windowColour[1], windowColour[2], windowColour[3]), + backgroundColour: toColour(secondaryColour[0], secondaryColour[1], secondaryColour[2], windowAlpha), }, title: { textSize: 11.0, - textColour: toColour(0, 0, 0, 255), + textColour: toColour(primaryTextColour[0], primaryTextColour[1], primaryTextColour[2], 255), backgroundColour: toColour(primaryColour[0], primaryColour[1], primaryColour[2], windowTitleAlpha), }, icon: { @@ -91,7 +91,7 @@ function initCharacterSelectGUI() { characterSelect.selectCharacterButton = characterSelect.window.button(85, 130, 260, 25, 'SELECT', { main: { backgroundColour: toColour(primaryColour[0], primaryColour[1], primaryColour[2], buttonAlpha), - textColour: toColour(0, 0, 0, 255), + textColour: toColour(primaryTextColour[0], primaryTextColour[1], primaryTextColour[2], 255), textSize: 12.0, textFont: robotoFont, textAlign: 0.5, @@ -104,7 +104,7 @@ function initCharacterSelectGUI() { characterSelect.newCharacterButton = characterSelect.window.button(5, 160, 420, 25, 'NEW CHARACTER', { main: { backgroundColour: toColour(primaryColour[0], primaryColour[1], primaryColour[2], buttonAlpha), - textColour: toColour(0, 0, 0, 255), + textColour: toColour(primaryTextColour[0], primaryTextColour[1], primaryTextColour[2], 255), textSize: 12.0, textFont: robotoFont, textAlign: 0.5, @@ -117,7 +117,7 @@ function initCharacterSelectGUI() { characterSelect.previousCharacterButton = characterSelect.window.button(5, 130, 75, 25, '< PREV', { main: { backgroundColour: toColour(primaryColour[0], primaryColour[1], primaryColour[2], buttonAlpha), - textColour: toColour(0, 0, 0, 255), + textColour: toColour(primaryTextColour[0], primaryTextColour[1], primaryTextColour[2], 255), textSize: 10.0, textFont: robotoFont, textAlign: 0.5, @@ -130,7 +130,7 @@ function initCharacterSelectGUI() { characterSelect.nextCharacterButton = characterSelect.window.button(350, 130, 75, 25, 'NEXT >', { main: { backgroundColour: toColour(primaryColour[0], primaryColour[1], primaryColour[2], buttonAlpha), - textColour: toColour(0, 0, 0, 255), + textColour: toColour(primaryTextColour[0], primaryTextColour[1], primaryTextColour[2], 255), textSize: 10.0, textFont: robotoFont, textAlign: 0.5, diff --git a/scripts/client/gui/error.js b/scripts/client/gui/error.js index ad76c13c..d26f90d0 100644 --- a/scripts/client/gui/error.js +++ b/scripts/client/gui/error.js @@ -19,12 +19,12 @@ function initErrorDialogGUI() { logToConsole(LOG_DEBUG, `[VRR.GUI] Creating error GUI ...`); errorDialog.window = mexui.window(game.width/2-200, game.height/2-70, 500, 140, 'ERROR', { main: { - backgroundColour: toColour(windowColour[0], windowColour[1], windowColour[2], windowColour[3]), + backgroundColour: toColour(secondaryColour[0], secondaryColour[1], secondaryColour[2], windowAlpha), transitionTime: 500, }, title: { textSize: 11.0, - textColour: toColour(0, 0, 0, 255), + textColour: toColour(primaryTextColour[0], primaryTextColour[1], primaryTextColour[2], 255), backgroundColour: toColour(primaryColour[0], primaryColour[1], primaryColour[2], windowTitleAlpha), }, icon: { @@ -49,7 +49,7 @@ function initErrorDialogGUI() { errorDialog.okayButton = errorDialog.window.button(20, 95, 360, 30, 'OK', { main: { backgroundColour: toColour(primaryColour[0], primaryColour[1], primaryColour[2], buttonAlpha), - textColour: toColour(0, 0, 0, 255), + textColour: toColour(primaryTextColour[0], primaryTextColour[1], primaryTextColour[2], 255), textSize: 10.0, textFont: robotoFont, textAlign: 0.5, diff --git a/scripts/client/gui/info.js b/scripts/client/gui/info.js index 70b2f7d2..1a958849 100644 --- a/scripts/client/gui/info.js +++ b/scripts/client/gui/info.js @@ -19,11 +19,11 @@ function initInfoDialogGUI() { logToConsole(LOG_DEBUG, `[VRR.GUI] Creating info dialog GUI ...`); infoDialog.window = mexui.window(game.width/2-200, game.height/2-70, 400, 140, 'Information', { main: { - backgroundColour: toColour(windowColour[0], windowColour[1], windowColour[2], windowColour[3]), + backgroundColour: toColour(secondaryColour[0], secondaryColour[1], secondaryColour[2], windowAlpha), }, title: { textSize: 11.0, - textColour: toColour(0, 0, 0, 255), + textColour: toColour(primaryTextColour[0], primaryTextColour[1], primaryTextColour[2], 255), backgroundColour: toColour(primaryColour[0], primaryColour[1], primaryColour[2], windowTitleAlpha), }, icon: { @@ -48,7 +48,7 @@ function initInfoDialogGUI() { infoDialog.okayButton = infoDialog.window.button(20, 95, 360, 30, 'OK', { main: { backgroundColour: toColour(primaryColour[0], primaryColour[1], primaryColour[2], buttonAlpha), - textColour: toColour(0, 0, 0, 255), + textColour: toColour(primaryTextColour[0], primaryTextColour[1], primaryTextColour[2], 255), textSize: 10.0, textFont: robotoFont, textAlign: 0.5, diff --git a/scripts/client/gui/list.js b/scripts/client/gui/list.js new file mode 100644 index 00000000..e45fd39c --- /dev/null +++ b/scripts/client/gui/list.js @@ -0,0 +1,76 @@ +// =========================================================================== +// Vortrex's Roleplay Resource +// https://github.com/VortrexFTW/gtac_roleplay +// =========================================================================== +// FILE: list.js +// DESC: Provides simple list GUI +// TYPE: Client (JavaScript) +// =========================================================================== + +let listDialog = { + window: null, + messageLabel: null, + listGrid: null, +}; + +// =========================================================================== + +function initListGUI() { + logToConsole(LOG_DEBUG, `[VRR.GUI] Creating list dialog GUI ...`); + listDialog.window = mexui.window(game.width/2-200, game.height/2-70, 400, 500, 'List', { + main: { + backgroundColour: toColour(secondaryColour[0], secondaryColour[1], secondaryColour[2], windowAlpha), + }, + title: { + textSize: 11.0, + textColour: toColour(primaryTextColour[0], primaryTextColour[1], primaryTextColour[2], 255), + backgroundColour: toColour(primaryColour[0], primaryColour[1], primaryColour[2], windowTitleAlpha), + }, + icon: { + textSize: 11.0, + textColour: toColour(255, 255, 255, 255), + backgroundColour: toColour(primaryColour[0], primaryColour[1], primaryColour[2], windowTitleAlpha), + hover: { + backgroundColour: toColour(205, 60, 60, windowTitleAlpha), + }, + }, + }); + + listDialog.messageLabel = infoDialog.window.text(5, 5, 390, 20, 'Select one', { + main: { + textSize: 10.0, + textAlign: 0.5, + textColour: toColour(255, 255, 255, 220), + textFont: robotoFont, + }, + focused: { + borderColour: toColour(0, 0, 0, 0), + }, + }); + + listDialog.listGrid = listDialog.window.grid(5, 25, 390, 450, { + main: { + backgroundColour: toColour(secondaryColour[0], secondaryColour[1], secondaryColour[2], windowAlpha), + }, + column: { + lineColour: toColour(primaryColour[0], primaryColour[1], primaryColour[2], windowTitleAlpha), + }, + header: { + backgroundColour: toColour(primaryColour[0], primaryColour[1], primaryColour[2], windowTitleAlpha-50), + textColour: toColour(primaryTextColour[0], primaryTextColour[1], primaryTextColour[2], windowTitleAlpha), + }, + cell: { + backgroundColour: toColour(secondaryColour[0], secondaryColour[1], secondaryColour[2], windowAlpha), + textColour: toColour(primaryTextColour[0], primaryTextColour[1], primaryTextColour[2], windowTitleAlpha), + }, + row: { + lineColour: toColour(primaryColour[0], primaryColour[1], primaryColour[2], windowTitleAlpha), + hover: { + backgroundColour: toColour(primaryColour[0], primaryColour[1], primaryColour[2], 120), + } + } + }); + logToConsole(LOG_DEBUG, `[VRR.GUI] Created list dialog GUI`); +} + +// =========================================================================== \ No newline at end of file diff --git a/scripts/client/gui/login.js b/scripts/client/gui/login.js index c3618b0b..7f18c8fb 100644 --- a/scripts/client/gui/login.js +++ b/scripts/client/gui/login.js @@ -14,6 +14,8 @@ let login = { passwordLabel: null, passwordInput: null, loginButton: null, + forgotPasswordButton: null, + resetPasswordLabel: null, }; // =========================================================================== @@ -22,7 +24,7 @@ function initLoginGUI() { logToConsole(LOG_DEBUG, `[VRR.GUI] Creating login GUI ...`); login.window = mexui.window(game.width/2-150, game.height/2-129, 300, 258, 'LOGIN', { main: { - backgroundColour: toColour(windowColour[0], windowColour[1], windowColour[2], windowColour[3]), + backgroundColour: toColour(secondaryColour[0], secondaryColour[1], secondaryColour[2], windowAlpha), transitionTime: 500, }, title: { @@ -85,7 +87,7 @@ function initLoginGUI() { main: { backgroundColour: toColour(primaryColour[0], primaryColour[1], primaryColour[2], buttonAlpha), textColour: toColour(0, 0, 0, 255), - textSize: 10.0, + textSize: 12.0, textFont: robotoFont, textAlign: 0.5, }, @@ -94,6 +96,33 @@ function initLoginGUI() { }, }, checkLogin); + /* + login.forgotPasswordButton = login.window.button(200, 240, 60, 15, 'FORGOT PASSWORD', { + main: { + backgroundColour: toColour(primaryColour[0], primaryColour[1], primaryColour[2], buttonAlpha), + textColour: toColour(0, 0, 0, 255), + textSize: 8.0, + textFont: robotoFont, + textAlign: 0.5, + }, + focused: { + borderColour: toColour(primaryColour[0], primaryColour[1], primaryColour[2], buttonAlpha), + }, + }, switchToPasswordResetGUI); + + login.resetPasswordLabel = login.window.text(20, 140, 60, 15, 'Need to reset your password? Click here >', { + main: { + textSize: 8.0, + textAlign: 1.0, + textColour: toColour(200, 200, 200, 255), + textFont: robotoFont, + }, + focused: { + borderColour: toColour(0, 0, 0, 0), + }, + }); + */ + logToConsole(LOG_DEBUG, `[VRR.GUI] Created login GUI`); } diff --git a/scripts/client/gui/newchar.js b/scripts/client/gui/newchar.js index cce00778..07f0c7c9 100644 --- a/scripts/client/gui/newchar.js +++ b/scripts/client/gui/newchar.js @@ -14,6 +14,7 @@ let newCharacter = { skinDropDown: null, spawnAreaDropDown: null, createButton: null, + mainLogoImage: null, }; // =========================================================================== @@ -22,7 +23,7 @@ function initNewCharacterGUI() { logToConsole(LOG_DEBUG, `[VRR.GUI] Creating new character GUI ...`); newCharacter.window = mexui.window(game.width/2-130, game.height/2-100, 300, 200, 'Character Name', { main: { - backgroundColour: toColour(windowColour[0], windowColour[1], windowColour[2], windowColour[3]), + backgroundColour: toColour(secondaryColour[0], secondaryColour[1], secondaryColour[2], windowAlpha), transitionTime: 500, }, title: { @@ -39,7 +40,7 @@ function initNewCharacterGUI() { newCharacter.window.titleBarIconSize = toVector2(0,0); newCharacter.window.titleBarHeight = 0; - newCharacter.window.image(115, 10, 65, 65, mainLogoPath, { + newCharacter.mainLogoImage = newCharacter.window.image(115, 10, 65, 65, mainLogoPath, { focused: { borderColour: toColour(0, 0, 0, 0), }, diff --git a/scripts/client/gui/register.js b/scripts/client/gui/register.js index e83fb856..0bff9021 100644 --- a/scripts/client/gui/register.js +++ b/scripts/client/gui/register.js @@ -23,7 +23,7 @@ function initRegisterGUI() { logToConsole(LOG_DEBUG, `[VRR.GUI] Creating register GUI ...`); register.window = mexui.window(game.width/2-130, game.height/2-125, 300, 250, 'Register', { main: { - backgroundColour: toColour(windowColour[0], windowColour[1], windowColour[2], windowColour[3]), + backgroundColour: toColour(secondaryColour[0], secondaryColour[1], secondaryColour[2], windowAlpha), transitionTime: 500, }, title: { diff --git a/scripts/client/gui/yesno.js b/scripts/client/gui/yesno.js index b482299b..4d7b2c10 100644 --- a/scripts/client/gui/yesno.js +++ b/scripts/client/gui/yesno.js @@ -21,12 +21,12 @@ function initYesNoDialogGUI() { logToConsole(LOG_DEBUG, `[VRR.GUI] Created prompt GUI ...`); yesNoDialog.window = mexui.window(game.width/2-200, game.height/2-70, 400, 140, 'Question', { main: { - backgroundColour: toColour(windowColour[0], windowColour[1], windowColour[2], windowColour[3]), + backgroundColour: toColour(secondaryColour[0], secondaryColour[1], secondaryColour[2], windowAlpha), transitionTime: 500, }, title: { textSize: 11.0, - textColour: toColour(0, 0, 0, 255), + textColour: toColour(primaryTextColour[0], primaryTextColour[1], primaryTextColour[2], 255), backgroundColour: toColour(primaryColour[0], primaryColour[1], primaryColour[2], windowTitleAlpha), }, icon: { @@ -51,7 +51,7 @@ function initYesNoDialogGUI() { yesNoDialog.yesButton = yesNoDialog.window.button(20, 95, 175, 30, 'YES', { main: { backgroundColour: toColour(primaryColour[0], primaryColour[1], primaryColour[2], buttonAlpha), - textColour: toColour(0, 0, 0, 255), + textColour: toColour(primaryTextColour[0], primaryTextColour[1], primaryTextColour[2], 255), textSize: 10.0, textFont: robotoFont, textAlign: 0.5, @@ -64,7 +64,7 @@ function initYesNoDialogGUI() { yesNoDialog.noButton = yesNoDialog.window.button(205, 95, 175, 30, 'NO', { main: { backgroundColour: toColour(primaryColour[0], primaryColour[1], primaryColour[2], buttonAlpha), - textColour: toColour(0, 0, 0, 255), + textColour: toColour(primaryTextColour[0], primaryTextColour[1], primaryTextColour[2], 255), textSize: 10.0, textFont: robotoFont, textAlign: 0.5,