Use new server-specific GUI colours

This commit is contained in:
Vortrex
2021-10-25 12:57:49 -05:00
parent 2a3d62abe2
commit 3d330d359e
8 changed files with 127 additions and 21 deletions

View File

@@ -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,

View File

@@ -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,

View File

@@ -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,

View File

@@ -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`);
}
// ===========================================================================

View File

@@ -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`);
}

View File

@@ -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),
},

View File

@@ -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: {

View File

@@ -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,