sandvich
/
FXclient-mirror
mirror of https://github.com/fxclient/FXclient
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Split the client-side code into modules 

(Update v0.6.5.6)
pull/6/head
peshomir 2024-10-03 17:27:39 +03:00
parent 495a979eb0
commit b881298231
19 changed files with 2204 additions and 663 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

35
build.js
View File

@ -2,12 +2,38 @@ import beautifier from 'js-beautify';
const { js: beautify } = beautifier;
import UglifyJS from 'uglify-js';
import fs from 'fs';
import webpack from 'webpack';
import path from 'path';
import applyPatches from './patches.js';
if (!fs.existsSync("./build")) fs.mkdirSync("./build");
fs.cpSync("./static/", "./build/", { recursive: true });
fs.cpSync("./assets/", "./build/assets/", { recursive: true });
fs.cpSync("./src/fx_core.js", "./build/fx_core.js");
fs.writeFileSync("./build/index.html", fs.readFileSync("./build/index.html").toString().replace(/buildTimestamp/g, Date.now()));
const buildClientCode = () => new Promise((resolve, reject) => {
webpack({
mode: 'production',
entry: { fxClient: "./src/main.js" },
output: {
path: path.resolve(import.meta.dirname, 'build'),
filename: 'fx.bundle.js',
},
}, (err, stats) => {
if (err) {
if (err.details) console.error(err.details);
return reject(err);
}
const info = stats.toJson();
if (stats.hasWarnings()) console.warn(info.warnings);
if (stats.hasErrors()) {
console.error(info.errors);
reject("Webpack compilation error");
}
else resolve();
});
});
let script = fs.readFileSync('./game/latest.js', { encoding: 'utf8' }).replace("\n", "").trim();
const exposeVarsToGlobalScope = true;
@ -127,11 +153,12 @@ rawCodeSegments.forEach(code => {
matchDictionaryExpression(expression);
});
fs.writeFileSync("./build/fx_core.js", `const dictionary = ${JSON.stringify(dictionary)};\n` + fs.readFileSync("./build/fx_core.js").toString());
import applyPatches from './patches.js';
applyPatches({ replace, replaceOne, replaceRawCode, dictionary, matchOne, matchRawCode, escapeRegExp });
await buildClientCode();
// the dictionary should maybe get embedded into one of the files in the bundle
fs.writeFileSync("./build/fx.bundle.js", `const dictionary = ${JSON.stringify(dictionary)};\n` + fs.readFileSync("./build/fx.bundle.js").toString());
console.log("Formatting code...");
script = beautify(script, {

1463
package-lock.json generated
View File

File diff suppressed because it is too large Load Diff

3
package.json
View File

@ -21,5 +21,8 @@
"dependencies": {
"js-beautify": "^1.14.11",
"uglify-js": "^3.19.2"
},
"devDependencies": {
"webpack": "^5.95.0"
}
}

96
patches.js
View File

@ -15,7 +15,7 @@ export default ({ replace, replaceOne, replaceRawCode, dictionary, matchOne, mat
// Add FX Client version info to the game version window
replaceRawCode(`ar.oa(4,1,new s8(__L(),gameVersion+"<br><a href='"+ah.aC5+"' target='_blank'>"+ah.aC5+"</a>",`,
`ar.oa(4,1,new s8(__L(),gameVersion+"<br><a href='"+ah.aC5+"' target='_blank'>"+ah.aC5+"</a>"
+ "<br><br><b>" + "FX Client v" + fx_version + " " + fx_update + "<br><a href='https://discord.gg/dyxcwdNKwK' target='_blank'>FX Client Discord server</a>"
+ "<br><br><b>" + "FX Client v" + __fx.version + "<br><a href='https://discord.gg/dyxcwdNKwK' target='_blank'>FX Client Discord server</a>"
+ "<br><a href='https://github.com/fxclient/FXclient' target='_blank'>Github repository</a></b>",`);
// Add update information
@ -35,8 +35,8 @@ export default ({ replace, replaceOne, replaceRawCode, dictionary, matchOne, mat
replaceOne(new RegExp(/(:(?<valueIndex>\w+)<7\?\w+\.\w+\.\w+\(valuesArray\[\2\]\)):(\w+\.\w+\(valuesArray\[7\]\))}/
.source.replace(/valuesArray/g, valuesArray), "g"),
'$1 : $<valueIndex> === 7 ? $3 '
+ `: $<valueIndex> === 8 ? utils.getMaxTroops(${dict.playerData}.${dict.playerTerritories}, ${playerId}) `
+ `: utils.getDensity(${playerId}) }`);
+ `: $<valueIndex> === 8 ? __fx.utils.getMaxTroops(${dict.playerData}.${dict.playerTerritories}, ${playerId}) `
+ `: __fx.utils.getDensity(${playerId}) }`);
// increase the size of the side panel by 25% to make the text easier to read
replaceOne(/(this\.\w+=Math\.floor\(\(\w+\.\w+\.\w+\(\)\?\.1646:\.126\))\*(\w+\.\w+\),)/g, "$1 * 1.25 * $2");
}
@ -45,8 +45,8 @@ export default ({ replace, replaceOne, replaceRawCode, dictionary, matchOne, mat
replaceRawCode(`=function(sE){o.ha(sE,2),b.h9<100?xD(0,__L([a8.jx[sE]]),3,sE,ad.gN,ad.kl,-1,!0):xD(0,__L([a8.jx[sE]]),3,sE,ad.gN,ad.kl,-1,!0)`,
`=function(sE){
if (${playerId} === sE && !${gIsSingleplayer})
wins_counter++, window.localStorage.setItem("fx_winCount", wins_counter),
xD(0,"Your Win Count is now " + wins_counter,3,sE,ad.gN,ad.kl,-1,!0);
__fx.wins.count++, window.localStorage.setItem("fx_winCount", __fx.wins.count),
xD(0,"Your Win Count is now " + __fx.wins.count,3,sE,ad.gN,ad.kl,-1,!0);
o.ha(sE,2),b.h9<100?xD(0,__L([a8.jx[sE]]),3,sE,ad.gN,ad.kl,-1,!0):xD(0,__L([a8.jx[sE]]),3,sE,ad.gN,ad.kl,-1,!0)`);
@ -54,18 +54,18 @@ export default ({ replace, replaceOne, replaceRawCode, dictionary, matchOne, mat
// add settings button
replaceRawCode(`,new nQ("☰<br>"+__L(),function(){aD6(3)},aa.ks),new nQ("",function(){at.d5(12)},aa.kg,!1)]`,
`,new nQ("☰<br>"+__L(),function(){aD6(3)},aa.ks),new nQ("",function(){at.d5(12)},aa.kg,!1),
new nQ("FX Client settings", function() { WindowManager.openWindow("settings"); }, "rgba(0, 0, 20, 0.5")]`)
new nQ("FX Client settings", function() { __fx.WindowManager.openWindow("settings"); }, "rgba(0, 0, 20, 0.5")]`)
// set settings button position
replaceRawCode(`aZ.g5.vO(aD3[3].button,x+a0S+gap,a3X+h+gap,a0S,h);`,
`aZ.g5.vO(aD3[3].button,x+a0S+gap,a3X+h+gap,a0S,h); aZ.g5.vO(aD3[5].button, x, a3X + h * 2 + gap * 2, a0S * 2 + gap, h / 3);`);
// render win count
replaceRawCode(`if(_y.a4l(),_r.gI(),_m.gI(),aw.gI(),a0.g8()){ctx.imageSmoothingEnabled=!1;var iQ=a0.a4o("territorial.io"),kL=.84*aD4.gA/iQ.width;`,
`if(_y.a4l(),_r.gI(),_m.gI(),aw.gI(),a0.g8()){
if (settings.displayWinCounter) {
if (__fx.settings.displayWinCounter) {
const size = Math.floor(aD4.gA * 0.03);
ctx.font = ${dict.fontGeneratorFunction}(1, size);
ctx.fillStyle = "#ffffff";
const text = "Win count: " + wins_counter;
const text = "Win count: " + __fx.wins.count;
const textLength = ctx.measureText(text).width;
ctx.textAlign = "left";
ctx.textBaseline = "middle";
@ -99,11 +99,11 @@ canvas.font=aY.g0.g1(1,fontSize),canvas.fillStyle="rgba("+gR+","+tD+","+hj+",0.6
// and also register the keybind handler functions
replaceOne(/}(function \w+\((\w+)\){return!\(1<\2&&1===(?<attackPercentage>\w+)\|\|\(1<\2&&\2\*\3-\3<1\/1024\?\2=\(\3\+1\/1024\)\/\3:\2<1)/g,
"} this.setAbsolutePercentage = function(newPercentage) { $<attackPercentage> = newPercentage; }; "
+ "keybindFunctions.setAbsolute = this.setAbsolutePercentage; "
+ `keybindFunctions.setRelative = (arg1) => ${attackBarObject}.${setRelative}(arg1); $1`);
+ "__fx.keybindFunctions.setAbsolute = this.setAbsolutePercentage; "
+ `__fx.keybindFunctions.setRelative = (arg1) => ${attackBarObject}.${setRelative}(arg1); $1`);
// insert keybind handling code into the keyDown handler function
replaceOne(new RegExp(/(function \w+\((?<event>\w+)\){)([^}]+matched)/g.source.replace(/matched/g, escapeRegExp(match)), "g"),
"$1 if (keybindHandler($<event>.key)) return; $3");
"$1 if (__fx.keybindHandler($<event>.key)) return; $3");
}
// Set the default font to Trebuchet MS
@ -111,53 +111,53 @@ canvas.font=aY.g0.g1(1,fontSize),canvas.fillStyle="rgba("+gR+","+tD+","+hj+",0.6
// Realistic bot names setting
// matches c4[i] = c4[i].replace(a6U[dx], a6V[dx])
replaceOne(/(((\w+)\[\w+\])=\2\.replace\(\w+(\[\w+\]),\w+\4\))/g, "$1; if (settings.realisticNames) $3 = realisticNames;")
replaceOne(/(((\w+)\[\w+\])=\2\.replace\(\w+(\[\w+\]),\w+\4\))/g, "$1; if (__fx.settings.realisticNames) $3 = realisticNames;")
// Hide all links in main menu depending on settings
//replaceOne(/(this\.\w+=function\(\){)((\w+\.\w+)\[2\]=\3\[3\]=\3\[4\]=(?<linksHidden>!this\.\w+\.\w+),)/g,
//"$1 if (settings.hideAllLinks) $3[0] = $3[1] = $<linksHidden>; else $3[0] = $3[1] = true; $2")
// Make the main canvas context have an alpha channel if a custom background is being used
replaceOne(/(document\.getElementById\("canvasA"\),\(\w+=\w+\.getContext\("2d",){alpha:!1}/g, "$1 {alpha: makeMainMenuTransparent}")
replaceOne(/(document\.getElementById\("canvasA"\),\(\w+=\w+\.getContext\("2d",){alpha:!1}/g, "$1 {alpha: __fx.makeMainMenuTransparent}")
// Clear canvas background if a custom background is being used
replaceRawCode(`,this.qk=function(){var a4n,a4m;aq.pd?(a4m=aL.gA/aq.eE,a4n=aL.gF/aq.eF,canvas.setTransform(a4m=a4n<a4m?a4m:a4n,0,0,a4m,`,
`,this.qk=function(){var a4n,a4m;
if (makeMainMenuTransparent) canvas.clearRect(0,0,aL.gA,aL.gF);
if (__fx.makeMainMenuTransparent) canvas.clearRect(0,0,aL.gA,aL.gF);
else aq.pd?(a4m=aL.gA/aq.eE,a4n=aL.gF/aq.eF,canvas.setTransform(a4m=a4n<a4m?a4m:a4n,0,0,a4m,`);
// Track donations
replaceOne(/(this\.\w+=function\((\w+),(\w+)\)\{)(\2===\w+\.\w+&&\(\w+\.\w+\((\w+\.\w+)\[0\],\5\[1\],\3\),this\.(\w+)\[12\]\+=\5\[1\],this\.\6\[16\]\+=\5\[0\]\),\3===\w+\.\w+&&\()/g,
"$1 donationsTracker.logDonation($2, $3, $5[0]); $4")
"$1 __fx.donationsTracker.logDonation($2, $3, $5[0]); $4")
// Display donations for a player when clicking on them in the leaderboard
// and skip handling clicks when clicking on an empty space (see the isEmptySpace
// variable in the modified leaderboard click handler from the leaderboard filter)
// match , 0 !== dG[x]) && fq.hB(x, 800, false, 0),
replaceOne(/,(0!==\w+\.\w+\[(\w+)\])(\)&&\w+\.\w+\(\2,800,!1,0\),)/g,
`, ${dict.game}.${dict.gIsTeamGame} && donationsTracker.displayHistory($2, ${rawPlayerNames}, ${gIsSingleplayer}), $1 && !isEmptySpace $3`);
`, ${dict.game}.${dict.gIsTeamGame} && __fx.donationsTracker.displayHistory($2, ${rawPlayerNames}, ${gIsSingleplayer}), $1 && !isEmptySpace $3`);
// Reset donation history and leaderboard filter when a new game is started
replaceOne(new RegExp(`,this\\.${dictionary.playerBalances}.fill\\(0\\),`, "g"), "$& donationsTracker.reset(), leaderboardFilter.reset(), ");
replaceOne(new RegExp(`,this\\.${dictionary.playerBalances}.fill\\(0\\),`, "g"), "$& __fx.donationsTracker.reset(), __fx.leaderboardFilter.reset(), ");
{ // Player list and leaderboard filter tabs
// Draw player list button
const uiOffset = dictionary.uiSizes + "." + dictionary.gap;
const { groups: { drawFunction, topBarHeight } } = replaceOne(/(=1;function (?<drawFunction>\w+)\(\){[^}]+?(?<canvas>\w+)\.fillRect\(0,(?<topBarHeight>\w+),\w+,1\),(?:\3\.fillRect\([^()]+\),)+\3\.font=\w+,(\w+\.\w+)\.textBaseline\(\3,1\),\5\.textAlign\(\3,1\),\3\.fillText\(\w+\(\d+\),Math\.floor\()(\w+)\/2\),(Math\.floor\(\w+\+\w+\/2\)\));/g,
"$1($6 + $<topBarHeight> - 22) / 2), $7; playerList.drawButton($<canvas>, 12, 12, $<topBarHeight> - 22);");
const buttonBoundsCheck = `utils.isPointInRectangle($<x>, $<y>, ${uiOffset} + 12, ${uiOffset} + 12, ${topBarHeight} - 22, ${topBarHeight} - 22)`
"$1($6 + $<topBarHeight> - 22) / 2), $7; __fx.playerList.drawButton($<canvas>, 12, 12, $<topBarHeight> - 22);");
const buttonBoundsCheck = `__fx.utils.isPointInRectangle($<x>, $<y>, ${uiOffset} + 12, ${uiOffset} + 12, ${topBarHeight} - 22, ${topBarHeight} - 22)`
// Handle player list button and leaderboard tabs mouseDown
// and create a function for scrolling the leaderboard to the top
replaceOne(/(this\.\w+=function\((?<x>\w+),(?<y>\w+)\){return!!\w+\(\2,\3\))&&(\(\w+=\w+\.\w+,[^}]+),!0\)/g,
`leaderboardFilter.scrollToTop = function(){position = 0;}, $1 && ((${buttonBoundsCheck} && playerList.display(${rawPlayerNames}), true)
&& !($<y> - ${uiOffset} > leaderboardFilter.verticalClickThreshold && leaderboardFilter.handleMouseDown($<x> - ${uiOffset})) && $4),!0)`);
`__fx.leaderboardFilter.scrollToTop = function(){position = 0;}, $1 && ((${buttonBoundsCheck} && __fx.playerList.display(${rawPlayerNames}), true)
&& !($<y> - ${uiOffset} > __fx.leaderboardFilter.verticalClickThreshold && __fx.leaderboardFilter.handleMouseDown($<x> - ${uiOffset})) && $4),!0)`);
// Handle player list button and leaderboard tabs hover
// and create a function for repainting the leaderboard
replaceOne(/(this\.\w+=function\((?<x>\w+),(?<y>\w+)\){)(var \w+,\w+=\w+\(\3\);return \w+\?\(\w+=(\w+),\(\5=\w+\(0,\5\+=(?:[^}]+,(?<setRepaintNeeded>\w+\.\w+=!0)){2})/g,
`leaderboardFilter.repaintLeaderboard = function() { ${drawFunction}(), $<setRepaintNeeded>; },
$1 if (${buttonBoundsCheck}) { playerList.hoveringOverButton === false && (playerList.hoveringOverButton = true, ${drawFunction}(), $<setRepaintNeeded>); }
else { playerList.hoveringOverButton === true && (playerList.hoveringOverButton = false, ${drawFunction}(), $<setRepaintNeeded>); }
if (leaderboardFilter.setHovering(
utils.isPointInRectangle($<x>, $<y>, ${uiOffset}, ${uiOffset} + leaderboardFilter.verticalClickThreshold, leaderboardFilter.windowWidth, leaderboardFilter.tabBarOffset), $<x> - ${uiOffset}
`__fx.leaderboardFilter.repaintLeaderboard = function() { ${drawFunction}(), $<setRepaintNeeded>; },
$1 if (${buttonBoundsCheck}) { __fx.playerList.hoveringOverButton === false && (__fx.playerList.hoveringOverButton = true, ${drawFunction}(), $<setRepaintNeeded>); }
else { __fx.playerList.hoveringOverButton === true && (__fx.playerList.hoveringOverButton = false, ${drawFunction}(), $<setRepaintNeeded>); }
if (__fx.leaderboardFilter.setHovering(
__fx.utils.isPointInRectangle($<x>, $<y>, ${uiOffset}, ${uiOffset} + __fx.leaderboardFilter.verticalClickThreshold, __fx.leaderboardFilter.windowWidth, __fx.leaderboardFilter.tabBarOffset), $<x> - ${uiOffset}
)) return; $4`);
}
@ -170,10 +170,10 @@ canvas.font=aY.g0.g1(1,fontSize),canvas.fillStyle="rgba("+gR+","+tD+","+hj+",0.6
`function a9V(ctx,i,fontSize,x,y,a9S){
var ___id = i;
i=ac.jv.formatNumber(playerData.playerBalances[i]);a9S>>1&1?(ctx.lineWidth=.05*fontSize,ctx.strokeStyle=a9U(fontSize,a9S%2),ctx.strokeText(i,x,y)):(1<a9S&&(ctx.lineWidth=.12*fontSize,ctx.strokeStyle=a9U(fontSize,a9S),ctx.strokeText(i,x,y)),ctx.fillText(i,x,y));
${settingsSwitchNameAndBalance} || settings.showPlayerDensity && (settings.coloredDensity && (ctx.fillStyle = utils.textStyleBasedOnDensity(___id)), ctx.fillText(utils.getDensity(___id), x, y + fontSize))}`)
${settingsSwitchNameAndBalance} || __fx.settings.showPlayerDensity && (__fx.settings.coloredDensity && (ctx.fillStyle = __fx.utils.textStyleBasedOnDensity(___id)), ctx.fillText(__fx.utils.getDensity(___id), x, y + fontSize))}`)
// Applies when the "Reverse Name/Balance" setting is on (default)
replaceOne(/(function \w+\((\w+),(?<fontSize>\w+),(?<x>\w+),(?<y>\w+),(?<canvas>\w+)\){)(\6\.fillText\((?<playerData>\w+)\.(?<playerNames>\w+)\[\2\],\4,\5\)),(\2<(?<game>\w+)\.(?<gHumans>\w+)&&2!==\8\.(?<playerStates>\w+)\[[^}]+)}/g,
`$1 var ___id = $2; $7, $10; ${settingsSwitchNameAndBalance} && settings.showPlayerDensity && (settings.coloredDensity && ($<canvas>.fillStyle = utils.textStyleBasedOnDensity(___id)), $<canvas>.fillText(utils.getDensity(___id), $<x>, $<y> + $<fontSize>)); }`);
`$1 var ___id = $2; $7, $10; ${settingsSwitchNameAndBalance} && __fx.settings.showPlayerDensity && (__fx.settings.coloredDensity && ($<canvas>.fillStyle = __fx.utils.textStyleBasedOnDensity(___id)), $<canvas>.fillText(__fx.utils.getDensity(___id), $<x>, $<y> + $<fontSize>)); }`);
}
{ // Leaderboard filter
@ -182,13 +182,13 @@ canvas.font=aY.g0.g1(1,fontSize),canvas.fillStyle="rgba("+gR+","+tD+","+hj+",0.6
`var leaderboardHasChanged = true;
this.playerPos = game.playerId;
leaderboardFilter.setUpdateFlag = () => leaderboardHasChanged = true;
__fx.leaderboardFilter.setUpdateFlag = () => leaderboardHasChanged = true;
function updateFilteredLb() {
if (!leaderboardHasChanged) return;
leaderboardFilter.filteredLeaderboard = leaderboardFilter.playersToInclude
__fx.leaderboardFilter.filteredLeaderboard = __fx.leaderboardFilter.playersToInclude
.map(id => leaderboardPositionsById[id]).sort((a, b) => a - b);
leaderboardHasChanged = false;
this.playerPos = leaderboardFilter.filteredLeaderboard.indexOf(leaderboardPositionsById[game.playerId]);
this.playerPos = __fx.leaderboardFilter.filteredLeaderboard.indexOf(leaderboardPositionsById[game.playerId]);
}
function drawFunction() {
a0A.clearRect(0, 0, a04, y9),
@ -196,24 +196,24 @@ canvas.font=aY.g0.g1(1,fontSize),canvas.fillStyle="rgba("+gR+","+tD+","+hj+",0.6
a0A.fillRect(0, 0, a04, a0F),
a0A.fillStyle = aZ.kZ,
a0A.fillRect(0, a0F, a04, y9 - a0F);
if (leaderboardFilter.enabled) updateFilteredLb();
var playerPos = (leaderboardFilter.enabled
if (__fx.leaderboardFilter.enabled) updateFilteredLb();
var playerPos = (__fx.leaderboardFilter.enabled
? this.playerPos
: leaderboardPositionsById[game.playerId]
);
if (leaderboardFilter.hoveringOverTabs) a0P = -1;
if (leaderboardFilter.enabled && a0P >= leaderboardFilter.filteredLeaderboard.length) a0P = -1;
if (__fx.leaderboardFilter.hoveringOverTabs) a0P = -1;
if (__fx.leaderboardFilter.enabled && a0P >= __fx.leaderboardFilter.filteredLeaderboard.length) a0P = -1;
playerPos >= position && a0Z(playerPos - position, aZ.kw),
0 !== leaderboardPositionsById[game.playerId] && 0 === position && a0Z(0, aZ.lJ),
-1 !== a0P && a0Z(a0P, aZ.kd),
a0A.fillStyle = aZ.kZ,
//console.log("drawing", a0P),
a0A.clearRect(0, y9 - leaderboardFilter.tabBarOffset, a04, leaderboardFilter.tabBarOffset);
a0A.fillRect(0, y9 - leaderboardFilter.tabBarOffset, a04, leaderboardFilter.tabBarOffset);
a0A.clearRect(0, y9 - __fx.leaderboardFilter.tabBarOffset, a04, __fx.leaderboardFilter.tabBarOffset);
a0A.fillRect(0, y9 - __fx.leaderboardFilter.tabBarOffset, a04, __fx.leaderboardFilter.tabBarOffset);
a0A.fillStyle = aZ.gF,
a0A.fillRect(0, a0F, a04, 1),
a0A.fillRect(0, y9 - leaderboardFilter.tabBarOffset, a04, 1),
leaderboardFilter.drawTabs(a0A, a04, y9 - leaderboardFilter.tabBarOffset, aZ.kw),
a0A.fillRect(0, y9 - __fx.leaderboardFilter.tabBarOffset, a04, 1),
__fx.leaderboardFilter.drawTabs(a0A, a04, y9 - __fx.leaderboardFilter.tabBarOffset, aZ.kw),
a0A.fillRect(0, 0, a04, b0.ur),
a0A.fillRect(0, 0, b0.ur, y9),
a0A.fillRect(a04 - b0.ur, 0, b0.ur, y9),
@ -221,8 +221,8 @@ canvas.font=aY.g0.g1(1,fontSize),canvas.fillStyle="rgba("+gR+","+tD+","+hj+",0.6
replaceRawCode("var hZ,eh=leaderboardPositionsById[game.playerId]<position+windowHeight-1?1:2;for(a0A.font=a07,aY.g0.textAlign(a0A,0),hZ=windowHeight-eh;0<=hZ;hZ--)a0a(leaderboardArray[hZ+position]),a0b(hZ,hZ+position,leaderboardArray[hZ+position]);for(aY.g0.textAlign(a0A,2),hZ=windowHeight-eh;0<=hZ;hZ--)a0a(leaderboardArray[hZ+position]),a0c(hZ,leaderboardArray[hZ+position]);",
`var hZ, eh = playerPos < position + windowHeight - 1 ? 1 : 2;
if (leaderboardFilter.enabled) {
let result = leaderboardFilter.filteredLeaderboard;
if (__fx.leaderboardFilter.enabled) {
let result = __fx.leaderboardFilter.filteredLeaderboard;
if (position !== 0 && position >= result.length - windowHeight)
position = (result.length > windowHeight ? result.length : windowHeight) - windowHeight;
//if (position >= result.length) position = result.length - 1;
@ -245,7 +245,7 @@ canvas.font=aY.g0.g1(1,fontSize),canvas.fillStyle="rgba("+gR+","+tD+","+hj+",0.6
// in the leaderboard resize handler: make space for the tab buttons at the bottom of the leaderboard
replaceRawCode(",a09.height=y9,a09_ctx=a09.getContext(\"2d\",{alpha:!0}),a0D=.025*a04,a06=.16*a04,a0E=0*a04,a0F=Math.floor(.45*a0D+a06),a0G=(y9-a06-2*a0D-a0E)/a08,a05=aY.g0.g1(1,Math.floor(.55*a06)),",
`,a09.height=y9,a09_ctx=a09.getContext("2d",{alpha:!0}),a0D=.025*a04,a06=.16*a04,a0E=0*a04,a0F=Math.floor(.45*a0D+a06),a0G=(y9-a06-2*a0D-a0E)/a08,
a09.height = y9 += a0G, leaderboardFilter.tabBarOffset = Math.floor(a0G * 1.3), leaderboardFilter.verticalClickThreshold = y9 - leaderboardFilter.tabBarOffset, leaderboardFilter.windowWidth = a04,
a09.height = y9 += a0G, __fx.leaderboardFilter.tabBarOffset = Math.floor(a0G * 1.3), __fx.leaderboardFilter.verticalClickThreshold = y9 - __fx.leaderboardFilter.tabBarOffset, __fx.leaderboardFilter.windowWidth = a04,
a05=aY.g0.g1(1,Math.floor(.55*a06)),`)
// Set the leaderboardHasChanged flag on leaderboard updates
replaceRawCode("for(var eM=a0q-1;0<=eM;eM--)a14[eM]=jR[eM],a15[eM]=a8.f8[jR[eM]];a14[a0q]=a0l[b.ed],a15[a0q]=a8.f8[b.ed]",
@ -254,16 +254,16 @@ canvas.font=aY.g0.g1(1,fontSize),canvas.fillStyle="rgba("+gR+","+tD+","+hj+",0.6
replaceRawCode("var a0p=a0q(fJ);return ag.tQ()&&-1!==a0P&&(a0P=-1,a0Y(),b3.d1=!0),b3.dY-a0Q<350&&a0T===a0p&&-1!==(a0p=(a0p=yr(-1,a0p,windowHeight))!==windowHeight&&vU(x,y)?a0p:-1)&&(x=leaderboardArray[a0p+position],a0p===windowHeight-1&&leaderboardPositionsById[game.playerId]>=position+windowHeight-1&&(x=game.playerId),",
`var a0p = a0q(fJ);
var isEmptySpace = false;
return ag.tQ() && -1 !== a0P && (a0P = -1, a0Y(), b3.d1 = !0), b3.dY - a0Q < 350 && a0T === a0p && -1 !== (a0p = (a0p = yr(-1, a0p, windowHeight)) !== windowHeight && vU(x, y) ? a0p : -1) && (x = (leaderboardFilter.enabled ? (updateFilteredLb(), leaderboardArray[leaderboardFilter.filteredLeaderboard[a0p + position] ?? (isEmptySpace = true, leaderboardPositionsById[game.playerId])]) : leaderboardArray[a0p + position]), a0p === windowHeight - 1 && (leaderboardFilter.enabled ? this.playerPos : leaderboardPositionsById[game.playerId]) >=
return ag.tQ() && -1 !== a0P && (a0P = -1, a0Y(), b3.d1 = !0), b3.dY - a0Q < 350 && a0T === a0p && -1 !== (a0p = (a0p = yr(-1, a0p, windowHeight)) !== windowHeight && vU(x, y) ? a0p : -1) && (x = (__fx.leaderboardFilter.enabled ? (updateFilteredLb(), leaderboardArray[__fx.leaderboardFilter.filteredLeaderboard[a0p + position] ?? (isEmptySpace = true, leaderboardPositionsById[game.playerId])]) : leaderboardArray[a0p + position]), a0p === windowHeight - 1 && (__fx.leaderboardFilter.enabled ? this.playerPos : leaderboardPositionsById[game.playerId]) >=
position + windowHeight - 1 && (x = game.playerId), !isEmptySpace && `);
// Get clan parsing function
replaceRawCode(`this.uI=function(username){var uK,uJ=username.indexOf("[");return!(uJ<0)&&1<(uK=username.indexOf("]"))-uJ&&uK-uJ<=8?username.substring(uJ+1,uK).toUpperCase().trim():null},`,
`this.uI=function(username){var uK,uJ=username.indexOf("[");return!(uJ<0)&&1<(uK=username.indexOf("]"))-uJ&&uK-uJ<=8?username.substring(uJ+1,uK).toUpperCase().trim():null}, leaderboardFilter.parseClanFromPlayerName = this.uI;`);
`this.uI=function(username){var uK,uJ=username.indexOf("[");return!(uJ<0)&&1<(uK=username.indexOf("]"))-uJ&&uK-uJ<=8?username.substring(uJ+1,uK).toUpperCase().trim():null}, __fx.leaderboardFilter.parseClanFromPlayerName = this.uI;`);
}
{ // Hovering tooltip
replaceRawCode("this.click=function(gG,gH,uH){var fd=an.fe(gG),ff=an.fg(gH),fh=an.fi(fd,ff),fj=an.fk(fh);if(!an.fl(fd,ff))return!1;var fd=(bB.d3.isUIZoomEnabled()?.025:.0144)*aO.g4,ff=performance.now();if(Math.abs(gG-wK)>fd||Math.abs(gH-wL)>fd||dg+500<ff)return!1;if(dg=ff,uH&&!function(gG,gH,fj){a3.ek(fj)||-1===(gG=ao.fr.wq(gG,gH))?l.wp(fj):l.wr(gG)}(gG,gH,fj),",
`hoveringTooltip.display = function(mouseX, mouseY) {
`__fx.hoveringTooltip.display = function(mouseX, mouseY) {
var coordX = an.fe(mouseX), coordY = an.fg(mouseY),
coord = an.fi(coordX, coordY), point = an.fk(coord);
if (coordX < 0 || coordY < 0) return;
@ -273,13 +273,13 @@ canvas.font=aY.g0.g1(1,fontSize),canvas.fillStyle="rgba("+gR+","+tD+","+hj+",0.6
}
this.click=function(gG,gH,uH){var fd=an.fe(gG),ff=an.fg(gH),fh=an.fi(fd,ff),fj=an.fk(fh);if(!an.fl(fd,ff))return!1;fd=(bB.d3.isUIZoomEnabled()?.025:.0144)*aO.g4,ff=performance.now();if(Math.abs(gG-wK)>fd||Math.abs(gH-wL)>fd||dg+500<ff)return!1;if(dg=ff,uH&&!function(gG,gH,fj){a3.ek(fj)||-1===(gG=ao.fr.wq(gG,gH))?l.wp(fj):l.wr(gG)}(gG,gH,fj),`)
replaceRawCode("aK.nH=(window.devicePixelRatio||1)*aEr,",
`aK.nH = (window.devicePixelRatio || 1) * aEr, hoveringTooltip.canvasPixelScale = aK.nH,`)
`aK.nH = (window.devicePixelRatio || 1) * aEr, __fx.hoveringTooltip.canvasPixelScale = aK.nH,`)
}
{ // Highlight clan spawnpoints
// when rendered on game start
replaceRawCode("var x;0!==playerData.eg[i]&&0!==playerData.playerTerritories[i]&&(x=playerData.nu[i]+playerData.nw[i]+1-gv-2>>1,gv=playerData.nv[i]+playerData.nx[i]+1-gv-2>>1,ctx.drawImage(km[game.gIsTeamGame?lV.i6[i]:i<game.gHumans?1:0],x,gv))",
`var x, y, highlight = settings.highlightClanSpawns && clanFilter.inOwnClan[i];
`var x, y, highlight = __fx.settings.highlightClanSpawns && __fx.clanFilter.inOwnClan[i];
if (highlight) gv *= 2;
0!==playerData.eg[i]&&0!==playerData.playerTerritories[i]&&(x=playerData.nu[i]+playerData.nw[i]+1-gv-2>>1,y=playerData.nv[i]+playerData.nx[i]+1-gv-2>>1,
highlight ? ctx.drawImage(km[game.gIsTeamGame?lV.i6[i]:i<game.gHumans?1:0],x,y, gv, gv)
@ -287,7 +287,7 @@ canvas.font=aY.g0.g1(1,fontSize),canvas.fillStyle="rgba("+gR+","+tD+","+hj+",0.6
// when rendered during spawn selection
replaceRawCode("function(a6,es,bK,hP,hQ,hR,ov){0===dV.eg[a6]||0===dV.ev[a6]||(hQ=ay.ak*((dV.nu[a6]+dV.nw[a6]+1)/2-bK)/(hQ-bK)-.5*es,bK=ay.al*((dV.nv[a6]+dV.nx[a6]+1)/2-hP)/(hR-hP)-.5*es,hQ>ay.ak)||bK>ay.al||hQ<-es||bK<-es||(bI.setTransform(cz,0,0,cz,hQ,bK),",
`function(a6,es,bK,hP,hQ,hR,ov){
var highlight = settings.highlightClanSpawns && clanFilter.inOwnClan[a6];
var highlight = __fx.settings.highlightClanSpawns && __fx.clanFilter.inOwnClan[a6];
if (highlight) es *= 2;
0===dV.eg[a6]||0===dV.ev[a6]||(hQ=ay.ak*((dV.nu[a6]+dV.nw[a6]+1)/2-bK)/(hQ-bK)-.5*es,bK=ay.al*((dV.nv[a6]+dV.nx[a6]+1)/2-hP)/(hR-hP)-.5*es,hQ>ay.ak)||bK>ay.al||hQ<-es||bK<-es||(bI.setTransform(highlight?cz*2:cz,0,0,highlight?cz*2:cz,hQ,bK),`
)

102
src/clanFilters.js 100644
View File

@ -0,0 +1,102 @@
import { getVar } from "./gameInterface.js";
export const leaderboardFilter = new (function() {
//this.playersToInclude = [0,1,8,20,24,30,32,42,50,69,200,400,500,510,511]; // for testing
this.playersToInclude = [];
this.tabLabels = ["ALL", "CLAN"];
// these get populated by the modified game code
this.filteredLeaderboard = [];
this.tabBarOffset = 0;
this.windowWidth = 0;
this.verticalClickThreshold = 1000;
this.hoveringOverTabs = false;
this.scrollToTop = () => {};
this.repaintLeaderboard = () => {};
this.setUpdateFlag = () => {};
this.parseClanFromPlayerName = () => { console.warn("parse function not set"); };
this.selectedTab = 0;
this.tabHovering = -1;
this.enabled = false;
//this.enabled = true;
this.drawTabs = function(canvas, totalWidth, verticalOffset, colorForSelectedTab) {
canvas.textBaseline = "middle";
canvas.textAlign = "center";
const tabWidth = totalWidth / this.tabLabels.length;
const textOffsetY = verticalOffset + this.tabBarOffset / 2;
//console.log(verticalOffset, this.tabBarOffset, textOffsetY);
this.tabLabels.forEach((label, index) => {
if (index !== 0) canvas.fillRect(tabWidth * index, verticalOffset, 1, this.tabBarOffset);
if (this.selectedTab === index) {
canvas.fillStyle = colorForSelectedTab;
canvas.fillRect(tabWidth * index, verticalOffset, tabWidth, this.tabBarOffset);
canvas.fillStyle = "rgb(255,255,255)";
}
if (this.tabHovering === index) {
canvas.fillStyle = "rgba(255,255,255,0.3)";
canvas.fillRect(tabWidth * index, verticalOffset, tabWidth, this.tabBarOffset);
canvas.fillStyle = "rgb(255,255,255)";
}
canvas.fillText(label, tabWidth * index + tabWidth / 2, textOffsetY);
});
}
this.setHovering = (isHovering, xRelative) => {
let repaintNeeded = false;
if (isHovering) {
const tab = Math.floor(xRelative / (this.windowWidth / this.tabLabels.length));
if (this.tabHovering !== tab) {
this.tabHovering = tab;
repaintNeeded = true;
}
}
if (isHovering !== this.hoveringOverTabs) {
this.hoveringOverTabs = isHovering;
if (isHovering === false) this.tabHovering = -1;
if (!isHovering) repaintNeeded = true;
}
if (repaintNeeded) this.repaintLeaderboard();
return isHovering;
}
this.handleMouseDown = (xRelative) => {
const tab = Math.floor(xRelative / (this.windowWidth / this.tabLabels.length));
if (this.selectedTab !== tab) {
this.selectedTab = tab;
if (this.selectedTab === 0) this.clearFilter();
else if (this.selectedTab === 1) {
this.filterByOwnClan();
this.setUpdateFlag();
}
this.repaintLeaderboard();
}
return true;
};
this.filterByOwnClan = () => {
this.playersToInclude = [];
const playerId = getVar("playerId");
const ownClan = this.parseClanFromPlayerName(getVar("rawPlayerNames")[playerId]);
getVar("rawPlayerNames").forEach((name, id) => {
if (id === playerId || this.parseClanFromPlayerName(name) === ownClan) this.playersToInclude.push(id);
});
this.enabled = true;
this.scrollToTop();
};
this.clearFilter = () => { this.enabled = false; }
this.reset = () => {
this.enabled = false;
this.selectedTab = 0;
clanFilter.refresh();
}
});
export const clanFilter = new (function() {
this.inOwnClan = new Array(512);
this.inOwnClan.fill(false);
this.refresh = () => {
const gHumans = getVar("gHumans");
const ownClan = leaderboardFilter.parseClanFromPlayerName(getVar("rawPlayerNames")[getVar("playerId")]);
if (ownClan === null) this.inOwnClan.fill(false);
else getVar("rawPlayerNames").forEach((name, id) => {
this.inOwnClan[id] = id < gHumans && leaderboardFilter.parseClanFromPlayerName(name) === ownClan;
});
}
});

58
src/donationsTracker.js 100644
View File

@ -0,0 +1,58 @@
import WindowManager from "./windowManager.js";
import { getVar } from "./gameInterface.js";
import { escapeHtml } from "./utils.js";
WindowManager.add({
name: "donationHistory",
element: document.querySelector("#donationhistory"),
beforeOpen: function(isSingleplayer) {
document.getElementById("donationhistory_note").style.display = (/*(settings.showBotDonations || isSingleplayer)*/ true ? "none" : "block");
},
onClose: function() { donationsTracker.openedWindowPlayerID = null; }
});
const donationsTracker = new (function(){
this.openedWindowPlayerID = null;
this.contentElement = document.querySelector("#donationhistory_content");
this.donationHistory = Array(512);
// fill the array with empty arrays with length of 3
//for (var i = 0; i < 512; i++) this.donationHistory.push([]); // not needed as .reset is called on game start
this.getHistoryOf = function(playerID) {
return this.donationHistory[playerID].toReversed();
}
this.reset = function() { for (var i = 0; i < 512; i++) this.donationHistory[i] = []; };
this.logDonation = function(senderID, receiverID, amount) {
const donationInfo = [senderID, receiverID, amount];
this.donationHistory[receiverID].push(donationInfo);
this.donationHistory[senderID].push(donationInfo);
if (this.openedWindowPlayerID === senderID || this.openedWindowPlayerID === receiverID) {
const indexOfNewItem = this.donationHistory[this.openedWindowPlayerID === senderID ? senderID : receiverID].length;
this.contentElement.prepend(generateTableRowItem(donationInfo, indexOfNewItem, this.openedWindowPlayerID, true));
}
};
function generateTableRowItem(historyItem, index, playerID, isNew) {
const rawPlayerNames = getVar("rawPlayerNames");
const row = document.createElement("tr");
if (isNew) row.setAttribute("class", "new");
let content = `<td><span class="color-light-gray">${index}.</span> `;
if (playerID === historyItem[1])
content += `Received <span class="color-green">${historyItem[2]}</span> resources from ${escapeHtml(rawPlayerNames[historyItem[0]])}`;
else content += `Sent <span class="color-red">${historyItem[2]}</span> resources to ${escapeHtml(rawPlayerNames[historyItem[1]])}`;
content += "</td>";
row.innerHTML = content;
return row;
}
this.displayHistory = function displayDonationsHistory(playerID, playerNames = getVar("rawPlayerNames"), isSingleplayer = getVar("gIsSingleplayer")) {
var history = donationsTracker.getHistoryOf(playerID);
console.log("History for " + playerNames[playerID] + ":");
console.log(history);
document.querySelector("#donationhistory h1").innerHTML = "Donation history for " + escapeHtml(playerNames[playerID]);
this.contentElement.innerHTML = "";
if (history.length > 0) history.forEach((historyItem, index) => {
this.contentElement.appendChild(generateTableRowItem(historyItem, history.length - index, playerID));
});
else this.contentElement.innerText = "Nothing to display";
this.openedWindowPlayerID = playerID;
WindowManager.openWindow("donationHistory", isSingleplayer);
}
});
export default donationsTracker;

606
src/fx_core.js
View File

@ -1,606 +0,0 @@
const fx_version = '0.6.5.5'; // FX Client Version
const fx_update = 'Aug 26'; // FX Client Last Updated
if (localStorage.getItem("fx_winCount") == undefined || localStorage.getItem("fx_winCount") == null) {
var wins_counter = 0;
console.log('Couldn\'t find a saved win data. creating one...');
} else if (localStorage.getItem("fx_winCount") != undefined || localStorage.getItem("fx_winCount") != null) {
var wins_counter = localStorage.getItem("fx_winCount");
}
const playerDataProperties = ["playerTerritories", "playerBalances", "rawPlayerNames"];
const gameObjectProperties = ["playerId", "gIsTeamGame", "gHumans", "gLobbyMaxJoin", "gameState", "gIsSingleplayer"];
const getVar = varName => {
if (playerDataProperties.includes(varName)) return window[dictionary.playerData][dictionary[varName]];
if (gameObjectProperties.includes(varName)) return window[dictionary.game][dictionary[varName]];
return window[dictionary[varName]]
};
// https://stackoverflow.com/a/6234804
function escapeHtml(unsafe) {
return unsafe.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;").replace(/"/g, "&quot;").replace(/'/g, "&#039;");
}
function KeybindsInput(containerElement) {
const header = document.createElement("p");
header.innerText = "Attack Percentage Keybinds";
const keybindContainer = document.createElement("div");
keybindContainer.className = "arrayinput";
const keybindAddButton = document.createElement("button");
keybindAddButton.innerText = "Add";
containerElement.append(header, keybindContainer, keybindAddButton);
this.container = keybindContainer;
this.keys = [ "key", "type", "value" ];
this.objectArray = [];
this.addObject = function () {
this.objectArray.push({ key: "", type: "absolute", value: 0.8 });
this.displayObjects();
keybindAddButton.scrollIntoView(false);
};
this.update = function () {
this.objectArray = settings.attackPercentageKeybinds;
this.displayObjects();
}
keybindAddButton.addEventListener("click", this.addObject.bind(this));
this.displayObjects = function () {
// Clear the content of the container
this.container.innerHTML = "";
if (this.objectArray.length === 0) return this.container.innerText = "No custom attack percentage keybinds added";
// Loop through the array and display input fields for each object
for (var i = 0; i < this.objectArray.length; i++) {
var objectDiv = document.createElement("div");
// Create input fields for each key
this.keys.forEach(function (key) {
let inputField = document.createElement(key === "type" ? "select" : "input");
if (key === "type") {
inputField.innerHTML = '<option value="absolute">Absolute</option><option value="relative">Relative</option>';
inputField.addEventListener("change", this.updateObject.bind(this, i, key));
} else if (key === "key") {
inputField.type = "text";
inputField.setAttribute("readonly", "");
inputField.setAttribute("placeholder", "No key set");
inputField.addEventListener("click", this.startKeyInput.bind(this, i, key));
} else { // key === "value"
const isAbsolute = this.objectArray[i].type === "absolute";
inputField.type = isAbsolute ? "text" : "number";
if (isAbsolute) inputField.addEventListener("click", this.convertIntoNumberInput.bind(this, i, key), { once: true });
else inputField.setAttribute("step", "0.1");
inputField.addEventListener("input", this.updateObject.bind(this, i, key));
}
if (key === "value" && this.objectArray[i].type === "absolute")
inputField.value = this.objectArray[i][key] * 100 + "%";
else inputField.value = this.objectArray[i][key];
// Append input field to the object div
objectDiv.appendChild(inputField);
}, this);
// Button to delete the object
var deleteButton = document.createElement("button");
deleteButton.textContent = "Delete";
deleteButton.addEventListener("click", this.deleteObject.bind(this, i));
// Append delete button to the object div
objectDiv.appendChild(deleteButton);
// Append the object div to the container
this.container.appendChild(objectDiv);
}
};
/** @param {PointerEvent} event */
this.startKeyInput = function (index, property, event) {
event.target.value = "Press any key";
const handler = this.updateObject.bind(this, index, property);
event.target.addEventListener('keydown', handler, { once: true });
event.target.addEventListener("blur", () => {
event.target.removeEventListener('keydown', handler, { once: true });
event.target.value = this.objectArray[index][property];
//this.displayObjects();
}, { once: true });
};
/** @param {PointerEvent} event */
this.convertIntoNumberInput = function (index, property, event) {
event.target.value = event.target.value.slice(0, -1);
event.target.type = "number";
event.target.addEventListener("blur", () => {
//event.target.value = this.objectArray[index][property];
this.displayObjects();
}, { once: true });
};
this.updateObject = function (index, property, event) {
if (index >= this.objectArray.length) return;
// Update the corresponding property of the object in the array
const value = property === "value" ? (
this.objectArray[index].type === "absolute" ? parseFloat(event.target.value) / 100 : parseFloat(event.target.value)
) : property === "key" ? event.key : event.target.value;
this.objectArray[index][property] = value;
if (property === "key") this.displayObjects();
};
this.deleteObject = function (index) {
// Remove the object from the array
this.objectArray.splice(index, 1);
// Display the updated input fields for objects
this.displayObjects();
};
return this;
}
var settings = {
//"fontName": "Trebuchet MS",
//"showBotDonations": false,
"displayWinCounter": true,
"useFullscreenMode": false,
"hoveringTooltip": true,
//"hideAllLinks": false,
"realisticNames": false,
"showPlayerDensity": true,
"coloredDensity": true,
"densityDisplayStyle": "percentage",
"highlightClanSpawns": false,
//"customMapFileBtn": true
"customBackgroundUrl": "",
"attackPercentageKeybinds": [],
};
const discontinuedSettings = [ "hideAllLinks", "fontName" ];
let makeMainMenuTransparent = false;
var settingsManager = new (function() {
const settingsStructure = [
{ for: "displayWinCounter", type: "checkbox", label: "Display win counter",
note: "The win counter tracks multiplayer solo wins (not in team games)" },
{ type: "button", text: "Reset win counter", action: removeWins },
{ for: "useFullscreenMode", type: "checkbox", label: "Use fullscreen mode",
note: "Note: fullscreen mode will trigger after you click anywhere on the page due to browser policy restrictions." },
{ for: "hoveringTooltip", type: "checkbox", label: "Hovering tooltip",
note: "Display map territory info constantly (on mouse hover) instead of only when right clicking on the map" },
//{ for: "hideAllLinks", type: "checkbox", label: "Hide Links option also hides app store links" },
{ for: "realisticNames", type: "checkbox", label: "Realistic Bot Names" },
{ for: "showPlayerDensity", type: "checkbox", label: "Show player density" },
{ for: "coloredDensity", type: "checkbox", label: "Colored density", note: "Display the density with a color between red and green depending on the density value" },
{ for: "densityDisplayStyle", type: "selectMenu", label: "Density value display style:", tooltip: "Controls how the territorial density value should be rendered", options: [
{ value: "percentage", label: "Percentage" },
{ value: "absoluteQuotient", label: "Value from 0 to 150 (BetterTT style)" }
]},
{ for: "highlightClanSpawns", type: "checkbox", label: "Highlight clan spawnpoints",
note: "Increases the spawnpoint glow size for members of your clan" },
{ for: "customBackgroundUrl", type: "textInput", label: "Custom main menu background:", placeholder: "Enter an image URL here", tooltip: "A custom image to be shown as the main menu background instead of the currently selected map." },
KeybindsInput
];
const settingsContainer = document.querySelector(".settings .scrollable");
var inputFields = {}; // (includes select menus)
var checkboxFields = {};
var customElements = [];
settingsStructure.forEach(item => {
if (typeof item === "function") {
const container = document.createElement("div");
customElements.push(new item(container));
return settingsContainer.append(container);
}
const label = document.createElement("label");
if (item.tooltip) label.title = item.tooltip;
const isValueInput = item.type.endsWith("Input");
const element = document.createElement(isValueInput || item.type === "checkbox" ? "input" : item.type === "selectMenu" ? "select" : "button");
if (item.type === "textInput") element.type = "text";
if (item.placeholder) element.placeholder = item.placeholder;
if (isValueInput || item.type === "selectMenu") inputFields[item.for] = element;
if (item.text) element.innerText = item.text;
if (item.action) element.addEventListener("click", item.action);
if (item.label) label.append(item.label + " ");
if (item.note) {
const note = document.createElement("small");
note.innerText = item.note;
label.append(document.createElement("br"), note)
}
if (item.options) item.options.forEach(option => {
const optionElement = document.createElement("option");
optionElement.setAttribute("value", option.value);
optionElement.innerText = option.label;
element.append(optionElement);
});
label.append(element);
if (item.type === "checkbox") {
element.type = "checkbox";
const checkmark = document.createElement("span");
checkmark.className = "checkmark";
label.className = "checkbox";
label.append(checkmark);
checkboxFields[item.for] = element;
} else label.append(document.createElement("br"));
settingsContainer.append(label, document.createElement("br"));
});
this.save = function() {
Object.keys(inputFields).forEach(function(key) { settings[key] = inputFields[key].value.trim(); });
Object.keys(checkboxFields).forEach(function(key) { settings[key] = checkboxFields[key].checked; });
this.applySettings();
WindowManager.closeWindow("settings");
discontinuedSettings.forEach(settingName => delete settings[settingName]);
localStorage.setItem("fx_settings", JSON.stringify(settings));
// should probably firgure out a way to do this without reloading - // You can't do it, localstorages REQUIRE you to reload
window.location.reload();
};
const fileInput = document.createElement("input");
fileInput.type = "file";
function handleFileSelect(event) {
const input = event.target;
/** @type {File} */
const selectedFile = input.files[0];
if (!selectedFile) return;
input.removeEventListener("change", handleFileSelect);
input.value = "";
if (!selectedFile.name.endsWith(".json")) return alert("Invalid file format");
const fileReader = new FileReader();
fileReader.onload = function() {
let result;
try {
result = JSON.parse(fileReader.result);
if (confirm("Warning: This will override all current settings, click \"OK\" to confirm")) settings = result;
localStorage.setItem("fx_settings", JSON.stringify(settings));
window.location.reload();
} catch (error) {
alert("Error\n" + error)
}
}
fileReader.readAsText(selectedFile);
}
this.importFromFile = function() {
fileInput.click();
fileInput.addEventListener('change', handleFileSelect);
};
// https://stackoverflow.com/a/34156339
function saveFile(content, fileName, contentType) {
var a = document.createElement("a");
var file = new Blob([content], {type: contentType});
a.href = URL.createObjectURL(file);
a.download = fileName;
a.click();
URL.revokeObjectURL(a.href);
}
this.exportToFile = function() {
saveFile(JSON.stringify(settings), 'FX_client_settings.json', 'application/json');
};
this.syncFields = function() {
Object.keys(inputFields).forEach(function(key) { inputFields[key].value = settings[key]; });
Object.keys(checkboxFields).forEach(function(key) { checkboxFields[key].checked = settings[key]; });
customElements.forEach(element => element.update());
};
this.resetAll = function() {
if (!confirm("Are you Really SURE you want to RESET ALL SETTINGS back to the default?")) return;
localStorage.removeItem("fx_settings");
window.location.reload();
};
this.applySettings = function() {
//setVarByName("bu", "px " + settings.fontName);
if (settings.useFullscreenMode && document.fullscreenEnabled) {
function tryEnterFullscreen() {
if (document.fullscreenElement !== null) return;
document.documentElement.requestFullscreen({ navigationUI: "hide" })
.then(() => { console.log('Fullscreen mode activated'); })
.catch((error) => { console.warn('Could not enter fullscreen mode:', error); });
}
document.addEventListener('mousedown', tryEnterFullscreen, { once: true });
document.addEventListener('click', tryEnterFullscreen, { once: true });
}
if (settings.customBackgroundUrl !== "") {
document.body.style.backgroundImage = "url(" + settings.customBackgroundUrl + ")";
document.body.style.backgroundSize = "cover";
document.body.style.backgroundPosition = "center";
}
makeMainMenuTransparent = settings.customBackgroundUrl !== "";
};
});
function removeWins() {
var confirm1 = confirm('Do you really want to reset your Wins?');
if (confirm1) {
wins_counter = 0;
localStorage.removeItem('fx_winCount');
alert("Successfully reset wins");
}
}
const openCustomBackgroundFilePicker = () => {
const fileInput = document.getElementById("customBackgroundFileInput");
fileInput.click();
fileInput.addEventListener('change', handleFileSelect);
}
function handleFileSelect(event) {
const fileInput = event.target;
const selectedFile = fileInput.files[0];
console.log(fileInput.files);
console.log(fileInput.files[0]);
if (selectedFile) {
const fileUrl = URL.createObjectURL(selectedFile);
console.log("File URL:", fileUrl);
fileInput.value = "";
fileInput.removeEventListener("change", handleFileSelect);
}
}
var WindowManager = new (function() {
var windows = {};
this.add = function(newWindow) {
windows[newWindow.name] = newWindow;
windows[newWindow.name].isOpen = false;
};
this.openWindow = function(windowName, ...args) {
if (windows[windowName].isOpen === true) return;
if (windows[windowName].beforeOpen !== undefined) windows[windowName].beforeOpen(...args);
windows[windowName].isOpen = true;
windows[windowName].element.style.display = null;
};
this.closeWindow = function(windowName) {
if (windows[windowName].isOpen === false) return;
windows[windowName].isOpen = false;
windows[windowName].element.style.display = "none";
if (windows[windowName].onClose !== undefined) windows[windowName].onClose();
};
this.closeAll = function() {
Object.values(windows).forEach(function(windowObj) {
WindowManager.closeWindow(windowObj.name);
});
};
});
WindowManager.add({
name: "settings",
element: document.querySelector(".settings"),
beforeOpen: function() { settingsManager.syncFields(); }
});
WindowManager.add({
name: "donationHistory",
element: document.querySelector("#donationhistory"),
beforeOpen: function(isSingleplayer) {
document.getElementById("donationhistory_note").style.display = ((true || settings.showBotDonations || /*getVarByName("dt")*/ isSingleplayer) ? "none" : "block");
},
onClose: function() { donationsTracker.openedWindowPlayerID = null; }
});
WindowManager.add({
name: "playerList",
element: document.getElementById("playerlist"),
beforeOpen: function() {}
});
document.getElementById("canvasA").addEventListener("mousedown", WindowManager.closeAll);
document.getElementById("canvasA").addEventListener("touchstart", WindowManager.closeAll, { passive: true });
document.addEventListener("keydown", event => { if (event.key === "Escape") WindowManager.closeAll(); });
var settingsGearIcon = document.createElement('img');
settingsGearIcon.setAttribute('src', 'assets/geari_white.png');
const playerList = new (function () {
const playersIcon = document.createElement('img');
playersIcon.setAttribute('src', 'assets/players_icon.png');
document.getElementById("playerlist_content").addEventListener("click", event => {
const playerId = event.target.closest("tr[data-player-id]")?.getAttribute("data-player-id");
if (!playerId) return;
if (getVar("gIsTeamGame")) WindowManager.closeWindow("playerList"), donationsTracker.displayHistory(playerId);
});
this.display = function displayPlayerList(playerNames) {
const gHumans = getVar("gHumans");
const gLobbyMaxJoin = getVar("gLobbyMaxJoin");
let listContent = `<h3>Players (${gHumans})</h3>`;
for (let i = 0; i < gLobbyMaxJoin; i++) {
if (i === gHumans) listContent += `<h3>Bots (${gLobbyMaxJoin - gHumans})</h3>`;
listContent += `<tr data-player-id="${i}"><td><span class="color-light-gray">${i + 1}.</span> ${escapeHtml(playerNames[i])}</td></tr>`
}
document.getElementById("playerlist_content").innerHTML = listContent;
document.getElementById("playerlist_content").setAttribute("class", getVar("gIsTeamGame") ? "clickable" : "");
WindowManager.openWindow("playerList");
}
this.hoveringOverButton = false;
this.drawButton = (canvas, x, y, size) => {
canvas.fillRect(x, y, size, size);
canvas.fillStyle = this.hoveringOverButton ? "#aaaaaaaa" : "#000000aa";
canvas.clearRect(x + 1, y + 1, size - 2, size - 2);
canvas.fillRect(x + 1, y + 1, size - 2, size - 2);
canvas.fillStyle = "#ffffff";
canvas.imageSmoothingEnabled = true;
canvas.drawImage(playersIcon, x + 2, y + 2, size - 4, size - 4);
canvas.imageSmoothingEnabled = false;
}
});
const leaderboardFilter = new (function() {
//this.playersToInclude = [0,1,8,20,24,30,32,42,50,69,200,400,500,510,511]; // for testing
this.playersToInclude = [];
this.tabLabels = ["ALL", "CLAN"];
// these get populated by the modified game code
this.filteredLeaderboard = [];
this.tabBarOffset = 0;
this.windowWidth = 0;
this.verticalClickThreshold = 1000;
this.hoveringOverTabs = false;
this.scrollToTop = () => {};
this.repaintLeaderboard = () => {};
this.setUpdateFlag = () => {};
this.parseClanFromPlayerName = () => { console.warn("parse function not set"); };
this.selectedTab = 0;
this.tabHovering = -1;
this.enabled = false;
//this.enabled = true;
this.drawTabs = function(canvas, totalWidth, verticalOffset, colorForSelectedTab) {
canvas.textBaseline = "middle";
canvas.textAlign = "center";
const tabWidth = totalWidth / this.tabLabels.length;
const textOffsetY = verticalOffset + this.tabBarOffset / 2;
//console.log(verticalOffset, this.tabBarOffset, textOffsetY);
this.tabLabels.forEach((label, index) => {
if (index !== 0) canvas.fillRect(tabWidth * index, verticalOffset, 1, this.tabBarOffset);
if (this.selectedTab === index) {
canvas.fillStyle = colorForSelectedTab;
canvas.fillRect(tabWidth * index, verticalOffset, tabWidth, this.tabBarOffset);
canvas.fillStyle = "rgb(255,255,255)";
}
if (this.tabHovering === index) {
canvas.fillStyle = "rgba(255,255,255,0.3)";
canvas.fillRect(tabWidth * index, verticalOffset, tabWidth, this.tabBarOffset);
canvas.fillStyle = "rgb(255,255,255)";
}
canvas.fillText(label, tabWidth * index + tabWidth / 2, textOffsetY);
});
}
this.setHovering = (isHovering, xRelative) => {
let repaintNeeded = false;
if (isHovering) {
const tab = Math.floor(xRelative / (this.windowWidth / this.tabLabels.length));
if (this.tabHovering !== tab) {
this.tabHovering = tab;
repaintNeeded = true;
}
}
if (isHovering !== this.hoveringOverTabs) {
this.hoveringOverTabs = isHovering;
if (isHovering === false) this.tabHovering = -1;
if (!isHovering) repaintNeeded = true;
}
if (repaintNeeded) this.repaintLeaderboard();
return isHovering;
}
this.handleMouseDown = (xRelative) => {
const tab = Math.floor(xRelative / (this.windowWidth / this.tabLabels.length));
if (this.selectedTab !== tab) {
this.selectedTab = tab;
if (this.selectedTab === 0) this.clearFilter();
else if (this.selectedTab === 1) {
this.filterByOwnClan();
this.setUpdateFlag();
}
this.repaintLeaderboard();
}
return true;
};
this.filterByOwnClan = () => {
this.playersToInclude = [];
const playerId = getVar("playerId");
const ownClan = this.parseClanFromPlayerName(getVar("rawPlayerNames")[playerId]);
getVar("rawPlayerNames").forEach((name, id) => {
if (id === playerId || this.parseClanFromPlayerName(name) === ownClan) this.playersToInclude.push(id);
});
this.enabled = true;
this.scrollToTop();
};
this.clearFilter = () => { this.enabled = false; }
this.reset = () => {
this.enabled = false;
this.selectedTab = 0;
clanFilter.refresh();
}
});
const clanFilter = new (function() {
this.inOwnClan = new Array(512);
this.inOwnClan.fill(false);
this.refresh = () => {
const gHumans = getVar("gHumans");
const ownClan = leaderboardFilter.parseClanFromPlayerName(getVar("rawPlayerNames")[getVar("playerId")]);
if (ownClan === null) this.inOwnClan.fill(false);
else getVar("rawPlayerNames").forEach((name, id) => {
this.inOwnClan[id] = id < gHumans && leaderboardFilter.parseClanFromPlayerName(name) === ownClan;
});
}
});
const hoveringTooltip = new (function() {
let recentlyShown = false;
this.display = () => {}; // this gets populated by the modified game script
this.canvasPixelScale = 1;
function handler(e) {
if (!settings.hoveringTooltip || !getVar("gameState") || recentlyShown) return;
let x, y;
// https://stackoverflow.com/a/61732450
if (e.type.includes(`touch`)) {
const { touches, changedTouches } = e.originalEvent ?? e;
const touch = touches[0] ?? changedTouches[0];
x = touch.pageX;
y = touch.pageY;
} else if (e.type.includes(`mouse`)) {
x = e.clientX;
y = e.clientY;
}
recentlyShown = true;
try {
this.display(this.canvasPixelScale * x, this.canvasPixelScale * y);
} catch (e) { console.error(e) }
// for better performance, reduce the tooltip display frequency to no more than once every 100 ms
setTimeout(() => recentlyShown = false, 100);
}
document.getElementById("canvasA").addEventListener("mousemove", handler.bind(this));
document.getElementById("canvasA").addEventListener("touchstart", handler.bind(this));
});
var donationsTracker = new (function(){
this.openedWindowPlayerID = null;
this.contentElement = document.querySelector("#donationhistory_content");
this.donationHistory = Array(512);
// fill the array with empty arrays with length of 3
//for (var i = 0; i < 512; i++) this.donationHistory.push([]); // not needed as .reset is called on game start
this.getHistoryOf = function(playerID) {
return this.donationHistory[playerID].toReversed();
}
this.reset = function() { for (var i = 0; i < 512; i++) this.donationHistory[i] = []; };
this.logDonation = function(senderID, receiverID, amount) {
const donationInfo = [senderID, receiverID, amount];
this.donationHistory[receiverID].push(donationInfo);
this.donationHistory[senderID].push(donationInfo);
if (this.openedWindowPlayerID === senderID || this.openedWindowPlayerID === receiverID) {
const indexOfNewItem = this.donationHistory[this.openedWindowPlayerID === senderID ? senderID : receiverID].length;
this.contentElement.prepend(generateTableRowItem(donationInfo, indexOfNewItem, this.openedWindowPlayerID, true));
}
};
function generateTableRowItem(historyItem, index, playerID, isNew) {
const rawPlayerNames = getVar("rawPlayerNames");
const row = document.createElement("tr");
if (isNew) row.setAttribute("class", "new");
let content = `<td><span class="color-light-gray">${index}.</span> `;
if (playerID === historyItem[1])
content += `Received <span class="color-green">${historyItem[2]}</span> resources from ${escapeHtml(rawPlayerNames[historyItem[0]])}`;
else content += `Sent <span class="color-red">${historyItem[2]}</span> resources to ${escapeHtml(rawPlayerNames[historyItem[1]])}`;
content += "</td>";
row.innerHTML = content;
return row;
}
this.displayHistory = function displayDonationsHistory(playerID, playerNames = getVar("rawPlayerNames"), isSingleplayer = getVar("gIsSingleplayer")) {
var history = donationsTracker.getHistoryOf(playerID);
console.log("History for " + playerNames[playerID] + ":");
console.log(history);
document.querySelector("#donationhistory h1").innerHTML = "Donation history for " + escapeHtml(playerNames[playerID]);
this.contentElement.innerHTML = "";
if (history.length > 0) history.forEach((historyItem, index) => {
this.contentElement.appendChild(generateTableRowItem(historyItem, history.length - index, playerID));
});
else this.contentElement.innerText = "Nothing to display";
this.openedWindowPlayerID = playerID;
WindowManager.openWindow("donationHistory", isSingleplayer);
}
});
var utils = new (function() {
this.getMaxTroops = function(playerTerritories, playerID) { return (playerTerritories[playerID]*150).toString(); };
this.getDensity = function(playerID, playerBalances = getVar("playerBalances"), playerTerritories = getVar("playerTerritories")) {
if (settings.densityDisplayStyle === "percentage") return (((playerBalances[playerID] / ((playerTerritories[playerID] === 0 ? 1 : playerTerritories[playerID]) * 150)) * 100).toFixed(1) + "%");
else return (playerBalances[playerID] / (playerTerritories[playerID] === 0 ? 1 : playerTerritories[playerID])).toFixed(1);
};
this.isPointInRectangle = function(x, y, rectangleStartX, rectangleStartY, width, height) {
return x >= rectangleStartX && x <= rectangleStartX + width && y >= rectangleStartY && y <= rectangleStartY + height;
};
/** @param {CanvasRenderingContext2D} canvas @param {string} text */
this.fillTextMultiline = function(canvas, text, x, y, maxWidth) {
const lineHeight = parseInt(canvas.font.split(" ").find(part => part.endsWith("px")).slice(0, -2));
text.split("\n").forEach((line, index) => canvas.fillText(line, x, y + index * lineHeight, maxWidth));
}
this.textStyleBasedOnDensity = function(playerID) {
const playerBalances = getVar("playerBalances"), playerTerritories = getVar("playerTerritories");
return `hsl(${playerBalances[playerID] / (playerTerritories[playerID] * 1.5)}, 100%, 50%, 1)`;
}
});
const keybindFunctions = { setAbsolute: () => {}, setRelative: () => {} };
const keybindHandler = key => {
const keybindData = settings.attackPercentageKeybinds.find(keybind => keybind.key === key);
if (keybindData === undefined) return false;
if (keybindData.type === "absolute") keybindFunctions.setAbsolute(keybindData.value);
else keybindFunctions.setRelative(keybindData.value);
return true;
};
if (localStorage.getItem("fx_settings") !== null) {
settings = {...settings, ...JSON.parse(localStorage.getItem("fx_settings"))};
}
settingsManager.applySettings();
console.log('Successfully loaded FX Client');

7
src/gameInterface.js 100644
View File

@ -0,0 +1,7 @@
const playerDataProperties = ["playerTerritories", "playerBalances", "rawPlayerNames"];
const gameObjectProperties = ["playerId", "gIsTeamGame", "gHumans", "gLobbyMaxJoin", "gameState", "gIsSingleplayer"];
export const getVar = varName => {
if (playerDataProperties.includes(varName)) return window[dictionary.playerData][dictionary[varName]];
if (gameObjectProperties.includes(varName)) return window[dictionary.game][dictionary[varName]];
return window[dictionary[varName]]
};

23
src/gameScriptUtils.js 100644
View File

@ -0,0 +1,23 @@
import { getSettings } from "./settings.js";
import { getVar } from "./gameInterface.js";
const utils = new (function() {
this.getMaxTroops = function(playerTerritories, playerID) { return (playerTerritories[playerID]*150).toString(); };
this.getDensity = function(playerID, playerBalances = getVar("playerBalances"), playerTerritories = getVar("playerTerritories")) {
if (getSettings().densityDisplayStyle === "percentage") return (((playerBalances[playerID] / ((playerTerritories[playerID] === 0 ? 1 : playerTerritories[playerID]) * 150)) * 100).toFixed(1) + "%");
else return (playerBalances[playerID] / (playerTerritories[playerID] === 0 ? 1 : playerTerritories[playerID])).toFixed(1);
};
this.isPointInRectangle = function(x, y, rectangleStartX, rectangleStartY, width, height) {
return x >= rectangleStartX && x <= rectangleStartX + width && y >= rectangleStartY && y <= rectangleStartY + height;
};
/** @param {CanvasRenderingContext2D} canvas @param {string} text */
this.fillTextMultiline = function(canvas, text, x, y, maxWidth) {
const lineHeight = parseInt(canvas.font.split(" ").find(part => part.endsWith("px")).slice(0, -2));
text.split("\n").forEach((line, index) => canvas.fillText(line, x, y + index * lineHeight, maxWidth));
}
this.textStyleBasedOnDensity = function(playerID) {
const playerBalances = getVar("playerBalances"), playerTerritories = getVar("playerTerritories");
return `hsl(${playerBalances[playerID] / (playerTerritories[playerID] * 1.5)}, 100%, 50%, 1)`;
}
});
export default utils

32
src/hoveringTooltip.js 100644
View File

@ -0,0 +1,32 @@
import { getSettings } from "./settings.js";
import { getVar } from "./gameInterface.js";
const hoveringTooltip = new (function() {
let recentlyShown = false;
this.display = () => {}; // this gets populated by the modified game script
this.canvasPixelScale = 1;
function handler(e) {
if (!getSettings().hoveringTooltip || !getVar("gameState") || recentlyShown) return;
let x, y;
// https://stackoverflow.com/a/61732450
if (e.type.includes(`touch`)) {
const { touches, changedTouches } = e.originalEvent ?? e;
const touch = touches[0] ?? changedTouches[0];
x = touch.pageX;
y = touch.pageY;
} else if (e.type.includes(`mouse`)) {
x = e.clientX;
y = e.clientY;
}
recentlyShown = true;
try {
this.display(this.canvasPixelScale * x, this.canvasPixelScale * y);
} catch (e) { console.error(e) }
// for better performance, reduce the tooltip display frequency to no more than once every 100 ms
setTimeout(() => recentlyShown = false, 100);
}
document.getElementById("canvasA").addEventListener("mousemove", handler.bind(this));
document.getElementById("canvasA").addEventListener("touchstart", handler.bind(this));
});
export default hoveringTooltip

10
src/keybinds.js 100644
View File

@ -0,0 +1,10 @@
import { getSettings } from "./settings.js";
export const keybindFunctions = { setAbsolute: () => {}, setRelative: () => {} };
export const keybindHandler = key => {
const keybindData = getSettings().attackPercentageKeybinds.find(keybind => keybind.key === key);
if (keybindData === undefined) return false;
if (keybindData.type === "absolute") keybindFunctions.setAbsolute(keybindData.value);
else keybindFunctions.setRelative(keybindData.value);
return true;
};

97
src/keybindsInput.js 100644
View File

@ -0,0 +1,97 @@
export function KeybindsInput(containerElement) {
const header = document.createElement("p");
header.innerText = "Attack Percentage Keybinds";
const keybindContainer = document.createElement("div");
keybindContainer.className = "arrayinput";
const keybindAddButton = document.createElement("button");
keybindAddButton.innerText = "Add";
containerElement.append(header, keybindContainer, keybindAddButton);
this.container = keybindContainer;
this.keys = [ "key", "type", "value" ];
this.objectArray = [];
this.addObject = function () {
this.objectArray.push({ key: "", type: "absolute", value: 0.8 });
this.displayObjects();
keybindAddButton.scrollIntoView(false);
};
this.update = function (settings) {
this.objectArray = settings.attackPercentageKeybinds;
this.displayObjects();
}
keybindAddButton.addEventListener("click", this.addObject.bind(this));
this.displayObjects = function () {
// Clear the content of the container
this.container.innerHTML = "";
if (this.objectArray.length === 0) return this.container.innerText = "No custom attack percentage keybinds added";
// Loop through the array and display input fields for each object
for (var i = 0; i < this.objectArray.length; i++) {
var objectDiv = document.createElement("div");
// Create input fields for each key
this.keys.forEach(function (key) {
let inputField = document.createElement(key === "type" ? "select" : "input");
if (key === "type") {
inputField.innerHTML = '<option value="absolute">Absolute</option><option value="relative">Relative</option>';
inputField.addEventListener("change", this.updateObject.bind(this, i, key));
} else if (key === "key") {
inputField.type = "text";
inputField.setAttribute("readonly", "");
inputField.setAttribute("placeholder", "No key set");
inputField.addEventListener("click", this.startKeyInput.bind(this, i, key));
} else { // key === "value"
const isAbsolute = this.objectArray[i].type === "absolute";
inputField.type = isAbsolute ? "text" : "number";
if (isAbsolute) inputField.addEventListener("click", this.convertIntoNumberInput.bind(this, i, key), { once: true });
else inputField.setAttribute("step", "0.1");
inputField.addEventListener("input", this.updateObject.bind(this, i, key));
}
if (key === "value" && this.objectArray[i].type === "absolute")
inputField.value = this.objectArray[i][key] * 100 + "%";
else inputField.value = this.objectArray[i][key];
// Append input field to the object div
objectDiv.appendChild(inputField);
}, this);
// Button to delete the object
var deleteButton = document.createElement("button");
deleteButton.textContent = "Delete";
deleteButton.addEventListener("click", this.deleteObject.bind(this, i));
// Append delete button to the object div
objectDiv.appendChild(deleteButton);
// Append the object div to the container
this.container.appendChild(objectDiv);
}
};
this.startKeyInput = function (index, property, event) {
event.target.value = "Press any key";
const handler = this.updateObject.bind(this, index, property);
event.target.addEventListener('keydown', handler, { once: true });
event.target.addEventListener("blur", () => {
event.target.removeEventListener('keydown', handler);
event.target.value = this.objectArray[index][property];
//this.displayObjects();
}, { once: true });
};
this.convertIntoNumberInput = function (index, property, event) {
event.target.value = event.target.value.slice(0, -1);
event.target.type = "number";
event.target.addEventListener("blur", () => {
//event.target.value = this.objectArray[index][property];
this.displayObjects();
}, { once: true });
};
this.updateObject = function (index, property, event) {
if (index >= this.objectArray.length) return;
// Update the corresponding property of the object in the array
const value = property === "value" ? (
this.objectArray[index].type === "absolute" ? parseFloat(event.target.value) / 100 : parseFloat(event.target.value)
) : property === "key" ? event.key : event.target.value;
this.objectArray[index][property] = value;
if (property === "key") this.displayObjects();
};
this.deleteObject = function (index) {
// Remove the object from the array
this.objectArray.splice(index, 1);
// Display the updated input fields for objects
this.displayObjects();
};
return this;
}

30
src/main.js 100644
View File

@ -0,0 +1,30 @@
const fx_version = '0.6.5.6'; // FX Client Version
const fx_update = 'Oct 3'; // FX Client Last Updated
import settingsManager from './settings.js';
import { clanFilter, leaderboardFilter } from "./clanFilters.js";
import WindowManager from "./windowManager.js";
import donationsTracker from "./donationsTracker.js";
import winCounter from "./winCounter.js";
import playerList from "./playerList.js";
import gameScriptUtils from "./gameScriptUtils.js";
import hoveringTooltip from "./hoveringTooltip.js";
import { keybindFunctions, keybindHandler } from "./keybinds.js";
window.__fx = window.__fx || {};
const __fx = window.__fx;
__fx.version = fx_version + " " + fx_update;
__fx.settingsManager = settingsManager;
__fx.leaderboardFilter = leaderboardFilter;
__fx.utils = gameScriptUtils;
__fx.WindowManager = WindowManager;
__fx.keybindFunctions = keybindFunctions;
__fx.keybindHandler = keybindHandler;
__fx.donationsTracker = donationsTracker;
__fx.playerList = playerList;
__fx.hoveringTooltip = hoveringTooltip;
__fx.clanFilter = clanFilter;
__fx.wins = winCounter;
console.log('Successfully loaded FX Client');

43
src/playerList.js 100644
View File

@ -0,0 +1,43 @@
import { getVar } from "./gameInterface.js";
import { escapeHtml } from "./utils.js";
import donationsTracker from "./donationsTracker.js";
import WindowManager from "./windowManager.js";
const playerList = new (function () {
const playersIcon = document.createElement('img');
playersIcon.setAttribute('src', 'assets/players_icon.png');
document.getElementById("playerlist_content").addEventListener("click", event => {
const playerId = event.target.closest("tr[data-player-id]")?.getAttribute("data-player-id");
if (!playerId) return;
if (getVar("gIsTeamGame")) WindowManager.closeWindow("playerList"), donationsTracker.displayHistory(playerId);
});
this.display = function displayPlayerList(playerNames) {
const gHumans = getVar("gHumans");
const gLobbyMaxJoin = getVar("gLobbyMaxJoin");
let listContent = `<h3>Players (${gHumans})</h3>`;
for (let i = 0; i < gLobbyMaxJoin; i++) {
if (i === gHumans) listContent += `<h3>Bots (${gLobbyMaxJoin - gHumans})</h3>`;
listContent += `<tr data-player-id="${i}"><td><span class="color-light-gray">${i + 1}.</span> ${escapeHtml(playerNames[i])}</td></tr>`
}
document.getElementById("playerlist_content").innerHTML = listContent;
document.getElementById("playerlist_content").setAttribute("class", getVar("gIsTeamGame") ? "clickable" : "");
WindowManager.openWindow("playerList");
}
this.hoveringOverButton = false;
this.drawButton = (canvas, x, y, size) => {
canvas.fillRect(x, y, size, size);
canvas.fillStyle = this.hoveringOverButton ? "#aaaaaaaa" : "#000000aa";
canvas.clearRect(x + 1, y + 1, size - 2, size - 2);
canvas.fillRect(x + 1, y + 1, size - 2, size - 2);
canvas.fillStyle = "#ffffff";
canvas.imageSmoothingEnabled = true;
canvas.drawImage(playersIcon, x + 2, y + 2, size - 4, size - 4);
canvas.imageSmoothingEnabled = false;
}
});
WindowManager.add({
name: "playerList",
element: document.getElementById("playerlist")
});
export default playerList

209
src/settings.js 100644
View File

@ -0,0 +1,209 @@
import { KeybindsInput } from "./keybindsInput.js";
import winCounter from "./winCounter.js";
import WindowManager from "./windowManager.js";
window.__fx = window.__fx || {};
const __fx = window.__fx;
var settings = {
//"fontName": "Trebuchet MS",
//"showBotDonations": false,
"displayWinCounter": true,
"useFullscreenMode": false,
"hoveringTooltip": true,
//"hideAllLinks": false,
"realisticNames": false,
"showPlayerDensity": true,
"coloredDensity": true,
"densityDisplayStyle": "percentage",
"highlightClanSpawns": false,
//"customMapFileBtn": true
"customBackgroundUrl": "",
"attackPercentageKeybinds": [],
};
__fx.settings = settings;
const discontinuedSettings = [ "hideAllLinks", "fontName" ];
__fx.makeMainMenuTransparent = false;
/*var settingsGearIcon = document.createElement('img');
settingsGearIcon.setAttribute('src', 'assets/geari_white.png');*/
const settingsManager = new (function() {
const settingsStructure = [
{ for: "displayWinCounter", type: "checkbox", label: "Display win counter",
note: "The win counter tracks multiplayer solo wins (not in team games)" },
{ type: "button", text: "Reset win counter", action: winCounter.removeWins },
{ for: "useFullscreenMode", type: "checkbox", label: "Use fullscreen mode",
note: "Note: fullscreen mode will trigger after you click anywhere on the page due to browser policy restrictions." },
{ for: "hoveringTooltip", type: "checkbox", label: "Hovering tooltip",
note: "Display map territory info constantly (on mouse hover) instead of only when right clicking on the map" },
//{ for: "hideAllLinks", type: "checkbox", label: "Hide Links option also hides app store links" },
{ for: "realisticNames", type: "checkbox", label: "Realistic Bot Names" },
{ for: "showPlayerDensity", type: "checkbox", label: "Show player density" },
{ for: "coloredDensity", type: "checkbox", label: "Colored density", note: "Display the density with a color between red and green depending on the density value" },
{ for: "densityDisplayStyle", type: "selectMenu", label: "Density value display style:", tooltip: "Controls how the territorial density value should be rendered", options: [
{ value: "percentage", label: "Percentage" },
{ value: "absoluteQuotient", label: "Value from 0 to 150 (BetterTT style)" }
]},
{ for: "highlightClanSpawns", type: "checkbox", label: "Highlight clan spawnpoints",
note: "Increases the spawnpoint glow size for members of your clan" },
{ for: "customBackgroundUrl", type: "textInput", label: "Custom main menu background:", placeholder: "Enter an image URL here", tooltip: "A custom image to be shown as the main menu background instead of the currently selected map." },
KeybindsInput
];
const settingsContainer = document.querySelector(".settings .scrollable");
var inputFields = {}; // (includes select menus)
var checkboxFields = {};
var customElements = [];
settingsStructure.forEach(item => {
if (typeof item === "function") {
const container = document.createElement("div");
customElements.push(new item(container));
return settingsContainer.append(container);
}
const label = document.createElement("label");
if (item.tooltip) label.title = item.tooltip;
const isValueInput = item.type.endsWith("Input");
const element = document.createElement(isValueInput || item.type === "checkbox" ? "input" : item.type === "selectMenu" ? "select" : "button");
if (item.type === "textInput") element.type = "text";
if (item.placeholder) element.placeholder = item.placeholder;
if (isValueInput || item.type === "selectMenu") inputFields[item.for] = element;
if (item.text) element.innerText = item.text;
if (item.action) element.addEventListener("click", item.action);
if (item.label) label.append(item.label + " ");
if (item.note) {
const note = document.createElement("small");
note.innerText = item.note;
label.append(document.createElement("br"), note)
}
if (item.options) item.options.forEach(option => {
const optionElement = document.createElement("option");
optionElement.setAttribute("value", option.value);
optionElement.innerText = option.label;
element.append(optionElement);
});
label.append(element);
if (item.type === "checkbox") {
element.type = "checkbox";
const checkmark = document.createElement("span");
checkmark.className = "checkmark";
label.className = "checkbox";
label.append(checkmark);
checkboxFields[item.for] = element;
} else label.append(document.createElement("br"));
settingsContainer.append(label, document.createElement("br"));
});
this.save = function() {
Object.keys(inputFields).forEach(function(key) { settings[key] = inputFields[key].value.trim(); });
Object.keys(checkboxFields).forEach(function(key) { settings[key] = checkboxFields[key].checked; });
this.applySettings();
WindowManager.closeWindow("settings");
discontinuedSettings.forEach(settingName => delete settings[settingName]);
localStorage.setItem("fx_settings", JSON.stringify(settings));
// should probably firgure out a way to do this without reloading - // You can't do it, localstorages REQUIRE you to reload
window.location.reload();
};
const fileInput = document.createElement("input");
fileInput.type = "file";
function handleFileSelect(event) {
const input = event.target;
/** @type {File} */
const selectedFile = input.files[0];
if (!selectedFile) return;
input.removeEventListener("change", handleFileSelect);
input.value = "";
if (!selectedFile.name.endsWith(".json")) return alert("Invalid file format");
const fileReader = new FileReader();
fileReader.onload = function() {
let result;
try {
result = JSON.parse(fileReader.result);
if (confirm("Warning: This will override all current settings, click \"OK\" to confirm")) __fx.settings = settings = result;
localStorage.setItem("fx_settings", JSON.stringify(settings));
window.location.reload();
} catch (error) {
alert("Error\n" + error)
}
}
fileReader.readAsText(selectedFile);
}
this.importFromFile = function() {
fileInput.click();
fileInput.addEventListener('change', handleFileSelect);
};
// https://stackoverflow.com/a/34156339
function saveFile(content, fileName, contentType) {
var a = document.createElement("a");
var file = new Blob([content], {type: contentType});
a.href = URL.createObjectURL(file);
a.download = fileName;
a.click();
URL.revokeObjectURL(a.href);
}
this.exportToFile = function() {
saveFile(JSON.stringify(settings), 'FX_client_settings.json', 'application/json');
};
this.syncFields = function() {
Object.keys(inputFields).forEach(function(key) { inputFields[key].value = settings[key]; });
Object.keys(checkboxFields).forEach(function(key) { checkboxFields[key].checked = settings[key]; });
customElements.forEach(element => element.update(settings));
};
this.resetAll = function() {
if (!confirm("Are you Really SURE you want to RESET ALL SETTINGS back to the default?")) return;
localStorage.removeItem("fx_settings");
window.location.reload();
};
this.applySettings = function() {
//setVarByName("bu", "px " + settings.fontName);
if (settings.useFullscreenMode && document.fullscreenEnabled) {
function tryEnterFullscreen() {
if (document.fullscreenElement !== null) return;
document.documentElement.requestFullscreen({ navigationUI: "hide" })
.then(() => { console.log('Fullscreen mode activated'); })
.catch((error) => { console.warn('Could not enter fullscreen mode:', error); });
}
document.addEventListener('mousedown', tryEnterFullscreen, { once: true });
document.addEventListener('click', tryEnterFullscreen, { once: true });
}
if (settings.customBackgroundUrl !== "") {
document.body.style.backgroundImage = "url(" + settings.customBackgroundUrl + ")";
document.body.style.backgroundSize = "cover";
document.body.style.backgroundPosition = "center";
}
__fx.makeMainMenuTransparent = settings.customBackgroundUrl !== "";
};
});
const openCustomBackgroundFilePicker = () => {
const fileInput = document.getElementById("customBackgroundFileInput");
fileInput.click();
fileInput.addEventListener('change', handleFileSelect);
}
function handleFileSelect(event) {
const fileInput = event.target;
const selectedFile = fileInput.files[0];
console.log(fileInput.files);
console.log(fileInput.files[0]);
if (selectedFile) {
const fileUrl = URL.createObjectURL(selectedFile);
console.log("File URL:", fileUrl);
fileInput.value = "";
fileInput.removeEventListener("change", handleFileSelect);
}
}
WindowManager.add({
name: "settings",
element: document.querySelector(".settings"),
beforeOpen: function() { settingsManager.syncFields(); }
});
if (localStorage.getItem("fx_settings") !== null) {
__fx.settings = settings = {...settings, ...JSON.parse(localStorage.getItem("fx_settings"))};
}
settingsManager.applySettings();
export default settingsManager;
export function getSettings() { return settings; };

4
src/utils.js 100644
View File

@ -0,0 +1,4 @@
// https://stackoverflow.com/a/6234804
export function escapeHtml(unsafe) {
return unsafe.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;").replace(/"/g, "&quot;").replace(/'/g, "&#039;");
}

12
src/winCounter.js 100644
View File

@ -0,0 +1,12 @@
const winCounter = { count: 0, removeWins };
if (localStorage.getItem("fx_winCount") !== null) winCounter.count = localStorage.getItem("fx_winCount");
function removeWins() {
if (confirm('Do you really want to reset your wins?')) {
winCounter.count = 0;
localStorage.removeItem('fx_winCount');
alert("Successfully reset wins");
}
}
export default winCounter

27
src/windowManager.js 100644
View File

@ -0,0 +1,27 @@
var windows = {};
function add(newWindow) {
windows[newWindow.name] = newWindow;
windows[newWindow.name].isOpen = false;
};
function openWindow(windowName, ...args) {
if (windows[windowName].isOpen === true) return;
if (windows[windowName].beforeOpen !== undefined) windows[windowName].beforeOpen(...args);
windows[windowName].isOpen = true;
windows[windowName].element.style.display = null;
};
function closeWindow(windowName) {
if (windows[windowName].isOpen === false) return;
windows[windowName].isOpen = false;
windows[windowName].element.style.display = "none";
if (windows[windowName].onClose !== undefined) windows[windowName].onClose();
};
function closeAll() {
Object.values(windows).forEach(function (windowObj) {
closeWindow(windowObj.name);
});
};
document.getElementById("canvasA").addEventListener("mousedown", closeAll);
document.getElementById("canvasA").addEventListener("touchstart", closeAll, { passive: true });
document.addEventListener("keydown", event => { if (event.key === "Escape") closeAll(); });
export default { add, openWindow, closeWindow, closeAll }

10
static/index.html
View File

@ -64,10 +64,10 @@
<div class="scrollable"></div>
<hr>
<footer>
<button onclick="settingsManager.resetAll()">Reset Settings</button>
<button onclick="settingsManager.save()">Save Settings</button>
<button onclick="settingsManager.importFromFile()">Import</button>
<button onclick="settingsManager.exportToFile()">Export</button>
<button onclick="__fx.settingsManager.resetAll()">Reset Settings</button>
<button onclick="__fx.settingsManager.save()">Save Settings</button>
<button onclick="__fx.settingsManager.importFromFile()">Import</button>
<button onclick="__fx.settingsManager.exportToFile()">Export</button>
</footer>
</div>
<div class="window scrollable selectable" id="playerlist" style="display: none;">
@ -80,7 +80,7 @@
<table><tbody id="donationhistory_content"></tbody></table>
</div></span>
<script src="variables.js?buildTimestamp"></script>
<script src="fx_core.js?buildTimestamp"></script>
<script src="fx.bundle.js?buildTimestamp"></script>
<script src="game.js?buildTimestamp"></script>
</body>
</html>