hamyack/GTA4RP
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

GUI style changes and key press handling

Browse Source
This commit is contained in:
Vortrex
2022-01-07 19:50:04 -06:00
parent b26b19ccc9
commit 83b7af4fde
10 changed files with 126 additions and 63 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
scripts/client/event.js
View File

@@ -102,6 +102,7 @@ function onProcess(event, deltaTime) {
function onKeyUp(event, keyCode, scanCode, keyModifiers) { function onKeyUp(event, keyCode, scanCode, keyModifiers) {
processSkinSelectKeyPress(keyCode); processSkinSelectKeyPress(keyCode);
//processKeyDuringAnimation(); //processKeyDuringAnimation();
processGUIKeyPress(keyCode);
} }
// =========================================================================== // ===========================================================================

113
scripts/client/gui.js
View File

@@ -28,6 +28,12 @@ let textInputAlpha = 180;
let guiReady = false; let guiReady = false;
let guiSubmitKey = false;
let guiLeftKey = false;
let guiRightKey = false;
let guiUpKey = false;
let guiDownKey = false;
// =========================================================================== // ===========================================================================
let placesOfOrigin = [ let placesOfOrigin = [
@@ -70,10 +76,10 @@ function initGUI() {
initInfoDialogGUI(); initInfoDialogGUI();
initErrorDialogGUI(); initErrorDialogGUI();
initYesNoDialogGUI(); initYesNoDialogGUI();
initResetPasswordGUI();
initChangePasswordGUI();
initTwoFactorAuthenticationGUI(); initTwoFactorAuthenticationGUI();
initListGUI(); initListGUI();
initResetPasswordGUI();
initChangePasswordGUI();
closeAllWindows(); closeAllWindows();
guiReady = true; guiReady = true;
@@ -98,47 +104,64 @@ let closeAllWindows = function() {
resetPassword.window.shown = false; resetPassword.window.shown = false;
passwordChange.window.shown = false; passwordChange.window.shown = false;
mexui.setInput(false); mexui.setInput(false);
mexui.focusedControl = false;
guiSubmitKey = false;
guiLeftKey = false;
guiRightKey = false;
guiUpKey = false;
guiDownKey = false;
} }
// =========================================================================== // ===========================================================================
let isAnyGUIActive = function() { let isAnyGUIActive = function() {
if(!guiReady) { if(!guiReady) {
if(infoDialog.window.shown) { return false;
return true; }
}
if(yesNoDialog.window.shown) { if(infoDialog.window.shown == true) {
return true; return true;
} }
if(errorDialog.window.shown) { if(yesNoDialog.window.shown == true) {
return true; return true;
} }
if(register.window.shown) { if(errorDialog.window.shown == true) {
return true; return true;
} }
if(login.window.shown) { if(register.window.shown == true) {
return true; return true;
} }
if(newCharacter.window.shown) { if(login.window.shown == true) {
return true; return true;
} }
if(characterSelect.window.shown) { if(newCharacter.window.shown == true) {
return true; return true;
} }
if(twoFactorAuth.window.shown) { if(characterSelect.window.shown == true) {
return true; return true;
} }
if(listDialog.window.shown) { if(twoFactorAuth.window.shown == true) {
return true; return true;
} }
if(listDialog.window.shown == true) {
return true;
}
if(resetPassword.window.shown == true) {
return true;
}
if(passwordChange.window.shown == true) {
return true;
} }
return false; return false;
@@ -224,6 +247,13 @@ addNetworkHandler("vrr.newCharacterFailed", function(errorMessage) {
// =========================================================================== // ===========================================================================
addNetworkHandler("vrr.changePassword", function() {
logToConsole(LOG_DEBUG, `[VRR.GUI] Received signal to change password from server`);
showChangePasswordGUI();
});
// ===========================================================================
addNetworkHandler("vrr.guiColour", function(red1, green1, blue1, red2, green2, blue2, red3, green3, blue3) { addNetworkHandler("vrr.guiColour", function(red1, green1, blue1, red2, green2, blue2, red3, green3, blue3) {
logToConsole(LOG_DEBUG, `[VRR.GUI] Received new GUI colours from server: ${red1}, ${green1}, ${blue1} / ${red2}, ${green2}, ${blue2} / ${red3}, ${green3}, ${blue3}`); logToConsole(LOG_DEBUG, `[VRR.GUI] Received new GUI colours from server: ${red1}, ${green1}, ${blue1} / ${red2}, ${green2}, ${blue2} / ${red3}, ${green3}, ${blue3}`);
primaryColour = [red1, green1, blue1]; primaryColour = [red1, green1, blue1];
@@ -247,6 +277,29 @@ addNetworkHandler("vrr.guiInit", function() {
function hideAllGUI() { function hideAllGUI() {
closeAllWindows(); closeAllWindows();
setChatWindowEnabled(true); setChatWindowEnabled(true);
guiSubmitKey = false;
} }
// =========================================================================== // ===========================================================================
function processGUIKeyPress(keyCode) {
if(!isAnyGUIActive()) {
return false;
}
if(keyCode == SDLK_RETURN || keyCode == SDLK_RETURN2) {
if(guiSubmitKey != false) {
guiSubmitKey();
}
} else if(keyCode == SDLK_LEFT) {
if(guiLeftKey != false) {
guiLeftKey();
}
} else if(keyCode == SDLK_RIGHT) {
if(guiRightKey != false) {
guiRightKey();
}
}
}
// ===========================================================================

2
scripts/client/gui/2fa.js
View File

@@ -105,6 +105,8 @@ function showTwoFactorAuthGUI() {
setChatWindowEnabled(false); setChatWindowEnabled(false);
mexui.setInput(true); mexui.setInput(true);
twoFactorAuth.window.shown = true; twoFactorAuth.window.shown = true;
mexui.focusedControl = twoFactorAuth.codeInput;
guiSubmitKey = checkTwoFactorAuth;
} }
// =========================================================================== // ===========================================================================

22
scripts/client/gui/charselect.js
View File

@@ -29,16 +29,16 @@ function initCharacterSelectGUI() {
backgroundColour: toColour(secondaryColour[0], secondaryColour[1], secondaryColour[2], windowAlpha), backgroundColour: toColour(secondaryColour[0], secondaryColour[1], secondaryColour[2], windowAlpha),
}, },
title: { title: {
textSize: 11.0, textSize: 0.0,
textColour: toColour(primaryTextColour[0], primaryTextColour[1], primaryTextColour[2], 255), textColour: toColour(0, 0, 0, 0),
backgroundColour: toColour(primaryColour[0], primaryColour[1], primaryColour[2], windowTitleAlpha),
}, },
icon: { icon: {
textSize: 0.0, textSize: 0.0,
textColour: toColour(0, 0, 0, 0), textColour: toColour(0, 0, 0, 0),
backgroundColour: toColour(0, 0, 0, 0), },
}
}); });
characterSelect.window.titleBarIconSize = toVector2(0,0);
characterSelect.window.titleBarHeight = 0;
characterSelect.nameText = characterSelect.window.text(5, 40, 200, 25, 'Lastname, Firstname', { characterSelect.nameText = characterSelect.window.text(5, 40, 200, 25, 'Lastname, Firstname', {
main: { main: {
@@ -88,7 +88,7 @@ function initCharacterSelectGUI() {
} }
}); });
characterSelect.selectCharacterButton = characterSelect.window.button(85, 130, 260, 25, 'SELECT', { characterSelect.selectCharacterButton = characterSelect.window.button(85, 130, 260, 25, 'PLAY', {
main: { main: {
backgroundColour: toColour(primaryColour[0], primaryColour[1], primaryColour[2], buttonAlpha), backgroundColour: toColour(primaryColour[0], primaryColour[1], primaryColour[2], buttonAlpha),
textColour: toColour(primaryTextColour[0], primaryTextColour[1], primaryTextColour[2], 255), textColour: toColour(primaryTextColour[0], primaryTextColour[1], primaryTextColour[2], 255),
@@ -168,12 +168,7 @@ function showCharacterSelectGUI(firstName, lastName, cash, clan, lastPlayed, ski
function showNewCharacter() { function showNewCharacter() {
closeAllWindows(); closeAllWindows();
logToConsole(LOG_DEBUG, `[VRR.GUI] Showing new character dialog window`); logToConsole(LOG_DEBUG, `[VRR.GUI] Showing new character dialog window`);
setChatWindowEnabled(false); showNewCharacterGUI();
mexui.setInput(true);
setHUDEnabled(false);
newCharacter.window.shown = true;
showSmallGameMessage(`If you don't have a mouse cursor, press ${toUpperCase(getKeyNameFromId(disableGUIKey))} to disable GUI`, COLOUR_WHITE, 7500);
} }
// =========================================================================== // ===========================================================================
@@ -209,6 +204,9 @@ function switchCharacterSelectGUI(firstName, lastName, cash, clan, lastPlayed, s
characterSelect.lastPlayedText.text = `Last Played: ${lastPlayed}`; characterSelect.lastPlayedText.text = `Last Played: ${lastPlayed}`;
characterSelect.skinImage = characterSelect.window.image(310, 32, 100, 90, "files/images/skins/none.png"); characterSelect.skinImage = characterSelect.window.image(310, 32, 100, 90, "files/images/skins/none.png");
characterSelect.window.shown = true; characterSelect.window.shown = true;
guiSubmitKey = selectThisCharacter;
guiLeftKey = selectPreviousCharacter;
guiRightKey = selectNextCharacter;
} }
// =========================================================================== // ===========================================================================

2
scripts/client/gui/error.js
View File

@@ -46,7 +46,7 @@ function initErrorDialogGUI() {
}, },
}); });
errorDialog.okayButton = errorDialog.window.button(20, 95, 360, 30, 'OK', { errorDialog.okayButton = errorDialog.window.button(5, 105, 395, 30, 'OK', {
main: { main: {
backgroundColour: toColour(primaryColour[0], primaryColour[1], primaryColour[2], buttonAlpha), backgroundColour: toColour(primaryColour[0], primaryColour[1], primaryColour[2], buttonAlpha),
textColour: toColour(primaryTextColour[0], primaryTextColour[1], primaryTextColour[2], 255), textColour: toColour(primaryTextColour[0], primaryTextColour[1], primaryTextColour[2], 255),

2
scripts/client/gui/info.js
View File

@@ -45,7 +45,7 @@ function initInfoDialogGUI() {
}, },
}); });
infoDialog.okayButton = infoDialog.window.button(20, 95, 360, 30, 'OK', { infoDialog.okayButton = infoDialog.window.button(5, 105, 395, 30, 'OK', {
main: { main: {
backgroundColour: toColour(primaryColour[0], primaryColour[1], primaryColour[2], buttonAlpha), backgroundColour: toColour(primaryColour[0], primaryColour[1], primaryColour[2], buttonAlpha),
textColour: toColour(primaryTextColour[0], primaryTextColour[1], primaryTextColour[2], 255), textColour: toColour(primaryTextColour[0], primaryTextColour[1], primaryTextColour[2], 255),

19
scripts/client/gui/login.js
View File

@@ -96,8 +96,7 @@ function initLoginGUI() {
}, },
}, checkLogin); }, checkLogin);
/* login.forgotPasswordButton = login.window.button(200, 240, 60, 15, 'RESET PASS', {
login.forgotPasswordButton = login.window.button(200, 240, 60, 15, 'FORGOT PASSWORD', {
main: { main: {
backgroundColour: toColour(primaryColour[0], primaryColour[1], primaryColour[2], buttonAlpha), backgroundColour: toColour(primaryColour[0], primaryColour[1], primaryColour[2], buttonAlpha),
textColour: toColour(0, 0, 0, 255), textColour: toColour(0, 0, 0, 255),
@@ -110,7 +109,7 @@ function initLoginGUI() {
}, },
}, switchToPasswordResetGUI); }, switchToPasswordResetGUI);
login.resetPasswordLabel = login.window.text(20, 140, 60, 15, 'Need to reset your password? Click here >', { login.resetPasswordLabel = login.window.text(20, 140, 60, 15, 'Forgot your password?', {
main: { main: {
textSize: 8.0, textSize: 8.0,
textAlign: 1.0, textAlign: 1.0,
@@ -121,7 +120,6 @@ function initLoginGUI() {
borderColour: toColour(0, 0, 0, 0), borderColour: toColour(0, 0, 0, 0),
}, },
}); });
*/
logToConsole(LOG_DEBUG, `[VRR.GUI] Created login GUI`); logToConsole(LOG_DEBUG, `[VRR.GUI] Created login GUI`);
} }
@@ -134,7 +132,8 @@ function showLoginGUI() {
setChatWindowEnabled(false); setChatWindowEnabled(false);
mexui.setInput(true); mexui.setInput(true);
login.window.shown = true; login.window.shown = true;
mexui.focusedControl = login.passwordInput;
guiSubmitKey = checkLogin;
showSmallGameMessage(`If you don't have a mouse cursor, press ${toUpperCase(getKeyNameFromId(disableGUIKey))} to disable GUI`, COLOUR_WHITE, 7500); showSmallGameMessage(`If you don't have a mouse cursor, press ${toUpperCase(getKeyNameFromId(disableGUIKey))} to disable GUI`, COLOUR_WHITE, 7500);
} }
@@ -158,7 +157,15 @@ function loginFailed(errorMessage) {
function loginSuccess() { function loginSuccess() {
logToConsole(LOG_DEBUG, `[VRR.GUI] Server reports login was successful`); logToConsole(LOG_DEBUG, `[VRR.GUI] Server reports login was successful`);
guiSubmitKey = false;
closeAllWindows(); closeAllWindows();
} }
// =========================================================================== // ===========================================================================
function switchToPasswordResetGUI() {
closeAllWindows();
logToConsole(LOG_DEBUG, `[VRR.GUI] Showing password reset dialog window`);
showResetPasswordGUI();
return false;
}

20
scripts/client/gui/newchar.js
View File

@@ -26,16 +26,14 @@ function initNewCharacterGUI() {
backgroundColour: toColour(secondaryColour[0], secondaryColour[1], secondaryColour[2], windowAlpha), backgroundColour: toColour(secondaryColour[0], secondaryColour[1], secondaryColour[2], windowAlpha),
transitionTime: 500, transitionTime: 500,
}, },
title: { title: {
textSize: 0.0, textSize: 0.0,
textColour: toColour(0, 0, 0, 0), textColour: toColour(0, 0, 0, 0),
backgroundColour: toColour(primaryColour[0], primaryColour[1], primaryColour[2], windowTitleAlpha), },
}, icon: {
icon: { textSize: 0.0,
textSize: 0.0, textColour: toColour(0, 0, 0, 0),
textColour: toColour(0, 0, 0, 0), },
backgroundColour: toColour(primaryColour[0], primaryColour[1], primaryColour[2], windowTitleAlpha),
}
}); });
newCharacter.window.titleBarIconSize = toVector2(0,0); newCharacter.window.titleBarIconSize = toVector2(0,0);
newCharacter.window.titleBarHeight = 0; newCharacter.window.titleBarHeight = 0;
@@ -157,6 +155,8 @@ function showNewCharacterGUI() {
setChatWindowEnabled(false); setChatWindowEnabled(false);
mexui.setInput(true); mexui.setInput(true);
newCharacter.window.shown = true; newCharacter.window.shown = true;
mexui.focusedInput = newCharacter.firstNameInput;
guiSubmitButton = checkNewCharacter;
} }
// =========================================================================== // ===========================================================================

4
scripts/client/gui/register.js
View File

@@ -158,7 +158,8 @@ function showRegistrationGUI() {
setChatWindowEnabled(false); setChatWindowEnabled(false);
mexui.setInput(true); mexui.setInput(true);
register.window.shown = true; register.window.shown = true;
mexui.focusedControl = register.passwordInput;
guiSubmitKey = checkRegistration;
showSmallGameMessage(`If you don't have a mouse cursor, press ${toUpperCase(getKeyNameFromId(disableGUIKey))} to disable GUI`, COLOUR_WHITE, 7500); showSmallGameMessage(`If you don't have a mouse cursor, press ${toUpperCase(getKeyNameFromId(disableGUIKey))} to disable GUI`, COLOUR_WHITE, 7500);
} }
@@ -166,6 +167,7 @@ function showRegistrationGUI() {
function registrationSuccess() { function registrationSuccess() {
logToConsole(LOG_DEBUG, `[VRR.GUI] Server reports registration was successful`); logToConsole(LOG_DEBUG, `[VRR.GUI] Server reports registration was successful`);
guiSubmitKey = false;
closeAllWindows(); closeAllWindows();
} }

4
scripts/client/gui/yesno.js
View File

@@ -48,7 +48,7 @@ function initYesNoDialogGUI() {
}, },
}); });
yesNoDialog.yesButton = yesNoDialog.window.button(20, 95, 175, 30, 'YES', { yesNoDialog.yesButton = yesNoDialog.window.button(5, 105, 197, 30, 'YES', {
main: { main: {
backgroundColour: toColour(primaryColour[0], primaryColour[1], primaryColour[2], buttonAlpha), backgroundColour: toColour(primaryColour[0], primaryColour[1], primaryColour[2], buttonAlpha),
textColour: toColour(primaryTextColour[0], primaryTextColour[1], primaryTextColour[2], 255), textColour: toColour(primaryTextColour[0], primaryTextColour[1], primaryTextColour[2], 255),
@@ -61,7 +61,7 @@ function initYesNoDialogGUI() {
}, },
}, yesNoDialogAnswerYes); }, yesNoDialogAnswerYes);
yesNoDialog.noButton = yesNoDialog.window.button(205, 95, 175, 30, 'NO', { yesNoDialog.noButton = yesNoDialog.window.button(207, 105, 197, 30, 'NO', {
main: { main: {
backgroundColour: toColour(primaryColour[0], primaryColour[1], primaryColour[2], buttonAlpha), backgroundColour: toColour(primaryColour[0], primaryColour[1], primaryColour[2], buttonAlpha),
textColour: toColour(primaryTextColour[0], primaryTextColour[1], primaryTextColour[2], 255), textColour: toColour(primaryTextColour[0], primaryTextColour[1], primaryTextColour[2], 255),