Skip to content

Commit d2dd191

Browse files
jcppkkkjcppkkk
committed
Refactor main.js: Enhance configuration options, add auto-buy feature, and improve UI elements
1 parent b2b7a48 commit d2dd191

File tree

1 file changed

+155
-52
lines changed

1 file changed

+155
-52
lines changed

‎main.js‎

Lines changed: 155 additions & 52 deletions
Original file line numberDiff line numberDiff line change
@@ -166,17 +166,33 @@ class PaybackRateMod {
166166
this.tickCount = 0;
167167
this.last_cps = 0;
168168
this.Upgrades = new Map();
169+
/**
170+
* @type {Object}
171+
*/
169172
this.default_config = {
170-
enableSort: 1,
171-
sortGrandmapocalypse: 1,
172-
sortWizardTower: 1,
173+
/** @type {boolean} */
174+
enableSort: true,
175+
/** @type {boolean} */
176+
sortGrandmapocalypse: true,
177+
/** @type {boolean} */
178+
sortWizardTower: true,
179+
/** @type {boolean} */
180+
autoBuy: false,
181+
/** @type {string} */
173182
color0: "#00ffff",
183+
/** @type {string} */
174184
color1: "#00ff00",
185+
/** @type {string} */
175186
color7: "#ffd939",
187+
/** @type {string} */
176188
color15: "#ff4d4d",
189+
/** @type {string} */
177190
colorLast: "#de4dff",
178-
isBanking: 0,
179-
bankingSeconds: 0,
191+
/** @type {boolean} */
192+
isBanking: true,
193+
/** @type {boolean} */
194+
bankingSeconds: true,
195+
/** @type {number} */
180196
updateMS: 1000,
181197
};
182198
}
@@ -717,7 +733,7 @@ class PaybackRateMod {
717733
all.forEach(me => this.updateNotation(me, avg));
718734

719735
// if there is only non-acc upgrade(s), add empty element placeholder to avoid mainLoop trigger
720-
if (!l("upgradeAcc0")) {
736+
if (!l("upgradeAcc0") && l("upgrade0")) {
721737
const spanElement = document.createElement('span');
722738
spanElement.id = 'upgradeAcc0';
723739
l("upgrade0").appendChild(spanElement);
@@ -732,82 +748,169 @@ class PaybackRateMod {
732748
b.BestCpsAcceleration - a.BestCpsAcceleration
733749
);
734750
};
751+
all.sort(sortFunction);
735752
upgrades.sort(sortFunction);
736753
buildings.sort(sortFunction);
737754
}
738755

739756
this.reorderUpgrades(upgrades);
740757
this.reorderBuildings(buildings);
741758

742-
// if (all[0].waitingTime === "") {
743-
// all[0].buy();
744-
// }
759+
if (this.config.autoBuy && all[0].waitingTime === "") {
760+
all[0].buy();
761+
}
745762
}
746763

747764
/**
748765
* Adds an options menu to the game interface for the PaybackRateMod class.
749766
*/
750-
addOptionsMenu() {
751-
const body = `
752-
<div class="listing">
753-
${this.toggleButton("enableSort", "Sort by payback rate")}
754-
${this.toggleButton("sortGrandmapocalypse", 'Grandmapocalypse')}
755-
${this.toggleButton("sortWizardTower", Game.Objects["Wizard tower"].dname)}
756-
</div>
757-
<div class="listing"></div>
758-
<div class="listing"></div>
759-
<div class="listing">
760-
${this.toggleButton("isBanking", "Banking cookies")}
761-
${this.numberInput("bankingSeconds")}<br>
762-
<label>
763-
Items will get locked to keep at least X second of cookies in bank.<br>
764-
Maximum [Lucky!] payout requires 6000 CpS <br>
765-
Maximum [Lucky!] payout with [Get Lucky] upgrade requires 42000 CpS<br>
766-
Maximum [Cookie chain] payout requires 43200 CpS<br>
767-
Maximum [Cookie chain] payout with [Get Lucky] upgrade requires 302400 CpS
768-
</label>
769-
</div>
770-
<div class="listing">
771-
${this.intervalInput("updateMS", "Update Interval(ms)")}<label>(increase it if game lags)</label>
772-
</div>
773-
<div class="listing">
774-
${this.colorPicker("color0")}<label>(best payback rate color)</label>
775-
</div>
776-
<div class="listing">
777-
${this.colorPicker("color1")}<label>(2nd payback rate color)</label>
778-
</div>
779-
<div class="listing">
780-
${this.colorPicker("color7")}<label>(8st payback rate color)</label>
781-
</div>
782-
<div class="listing">
783-
${this.colorPicker("color15")}<label>(16st payback rate color)</label>
784-
</div>
785-
<div class="listing">
786-
${this.colorPicker("colorLast")}<label>(worst payback rate color)</label>
787-
</div>`;
767+
sortingDiv() {
768+
/* Sorting */
769+
const sortingDiv = document.createElement("div");
770+
771+
const toggleButtons = [
772+
{ config: "enableSort", text: "Sort by payback rate" },
773+
{ config: "sortGrandmapocalypse", text: "Grandmapocalypse" },
774+
{ config: "sortWizardTower", text: Game.Objects["Wizard tower"].dname },
775+
{ config: "autoBuy", text: "Auto buy best deal" },
776+
];
777+
778+
toggleButtons.forEach((button) => {
779+
sortingDiv.appendChild(this.toggleButton(button.config, button.text));
780+
});
781+
return sortingDiv;
782+
}
783+
784+
bankingDiv() {
785+
/* Banking */
786+
const bankingSecondsInput = document.createElement("input");
787+
bankingSecondsInput.type = "number";
788+
bankingSecondsInput.min = "0";
789+
bankingSecondsInput.style.width = "6em";
790+
bankingSecondsInput.id = "PaybackRateModBankingSecondsInput";
791+
bankingSecondsInput.value = this.config.bankingSeconds;
792+
bankingSecondsInput.onchange = bankingSecondsInput.onkeypress = bankingSecondsInput.onpaste = bankingSecondsInput.oninput = () => {
793+
bankingSecondsInput.value = bankingSecondsInput.value.replace(/[^0-9]/g, "");
794+
this.config.bankingSeconds = parseInt(bankingSecondsInput.value);
795+
};
788796

797+
const bankingLabel = document.createElement("label");
798+
bankingLabel.innerHTML = "<br>Items will get locked to keep at least X second of cookies in bank.<br>Maximum [Lucky!] payout requires 6000 CpS<br>Maximum [Lucky!] payout with [Get Lucky] upgrade requires 42000 CpS<br>Maximum [Cookie chain] payout requires 43200 CpS<br>Maximum [Cookie chain] payout with [Get Lucky] upgrade requires 302400 CpS";
799+
800+
const bankingDiv = document.createElement("div");
801+
bankingDiv.appendChild(this.toggleButton("isBanking", "Banking cookies"));
802+
bankingDiv.appendChild(bankingSecondsInput);
803+
bankingDiv.appendChild(bankingLabel);
804+
return bankingDiv;
805+
}
806+
intervalBoxDiv() {
807+
/* Update Interval */
808+
const updateTimeLabel = document.createElement("div");
809+
updateTimeLabel.style.float = "left";
810+
updateTimeLabel.innerHTML = "UI Update Interval";
811+
812+
const updateTimeValue = document.createElement("div");
813+
updateTimeValue.style.float = "right";
814+
updateTimeValue.id = "PaybackRateMod_UpdateMSValue";
815+
updateTimeValue.innerHTML = this.config.updateMS + "ms";
816+
817+
const updateTimeSlider = document.createElement("input");
818+
updateTimeSlider.classList.add("slider");
819+
updateTimeSlider.id = "PaybackRateMod_UpdateMSSlider";
820+
updateTimeSlider.style.clear = "both";
821+
updateTimeSlider.type = "range";
822+
updateTimeSlider.min = "500";
823+
updateTimeSlider.max = "10000";
824+
updateTimeSlider.step = "100";
825+
updateTimeSlider.value = this.config.updateMS;
826+
updateTimeSlider.onchange = updateTimeSlider.oninput = () => {
827+
this.config.updateMS = parseInt(updateTimeSlider.value);
828+
l("PaybackRateMod_UpdateMSValue").innerHTML = this.config.updateMS + "ms";
829+
}
830+
updateTimeSlider.onmouseup = () => {
831+
PlaySound('snd/tick.mp3');
832+
};
833+
834+
const intervalBoxDiv = document.createElement("div");
835+
intervalBoxDiv.classList.add("sliderBox");
836+
intervalBoxDiv.appendChild(updateTimeLabel);
837+
intervalBoxDiv.appendChild(updateTimeValue);
838+
intervalBoxDiv.appendChild(updateTimeSlider);
839+
return intervalBoxDiv;
840+
}
841+
colorPickerDiv() {
842+
/* Color Pickers */
843+
const colorPickerDiv = document.createElement("div");
844+
const colorPickers = [
845+
{ config: "color0", label: "(best payback rate color)" },
846+
{ config: "color1", label: "(2nd payback rate color)" },
847+
{ config: "color7", label: "(8th payback rate color)" },
848+
{ config: "color15", label: "(16th payback rate color)" },
849+
{ config: "colorLast", label: "(worst payback rate color)" },
850+
];
851+
852+
colorPickers.forEach((picker) => {
853+
const colorPicker = document.createElement("input");
854+
colorPicker.type = "color";
855+
colorPicker.id = `PaybackRateMod${picker.config}Picker`;
856+
colorPicker.value = this.config[picker.config];
857+
colorPicker.onchange = () => {
858+
this.config[picker.config] = colorPicker.value;
859+
};
860+
861+
const colorPickerLabel = document.createElement("label");
862+
colorPickerLabel.innerHTML = picker.label;
863+
864+
colorPickerDiv.appendChild(colorPicker);
865+
colorPickerDiv.appendChild(colorPickerLabel);
866+
colorPickerDiv.appendChild(document.createElement("br"));
867+
});
868+
return colorPickerDiv;
869+
}
870+
addOptionsMenu() {
871+
const body = document.createElement("div");
872+
body.classList.add("listing");
873+
body.appendChild(this.sortingDiv());
874+
body.appendChild(document.createElement("br"));
875+
body.appendChild(this.bankingDiv());
876+
body.appendChild(document.createElement("br"));
877+
body.appendChild(this.intervalBoxDiv());
878+
body.appendChild(document.createElement("br"));
879+
body.appendChild(document.createElement("br"));
880+
body.appendChild(this.colorPickerDiv());
789881
CCSE.AppendCollapsibleOptionsMenu(this.displayname, body);
790882
}
883+
884+
getButtonID(/** @type {string} */ config) {
885+
return `PaybackRateMod_${config}`;
886+
}
791887
/**
792888
*
793889
* @param {string} config
794890
* @param {string} text
795891
* @returns
796892
*/
797893
toggleButton(config, text) {
798-
const name = `PaybackRateModButton_${config}`;
799-
const callback = `paybackRateMod.toggleButtonCallback('${config}', '${name}', '${text}');`;
894+
const name = this.getButtonID(config);
895+
const callback = `paybackRateMod.toggleButtonCallback('${config}', '${text}');`
800896
const value = this.config[config];
801-
return `<a class="smallFancyButton prefButton ${value ? "option" : "option off"}" id="${name}" ${Game.clickStr}="${callback}">${text} ${value ? "On" : "Off"}</a>`;
897+
const button = document.createElement("a");
898+
button.classList.add("smallFancyButton", "prefButton");
899+
button.classList.toggle("option", value);
900+
button.classList.toggle("off", !value);
901+
button.id = name;
902+
button.setAttribute(Game.clickStr, callback);
903+
button.innerHTML = `${text} ${value ? "On" : "Off"}`;
904+
return button;
802905
}
803906

804907
/**
805908
* @param {string} config
806-
* @param {string} buttonID
807909
* @param {string} text
808910
*/
809-
toggleButtonCallback(config, buttonID, text) {
911+
toggleButtonCallback(config, text) {
810912
const value = !this.config[config];
913+
const buttonID = `PaybackRateMod_${config}`;
811914
this.config[config] = value;
812915
l(buttonID).innerHTML = value ? `${text} On` : `${text} Off`;
813916
l(buttonID).className = `smallFancyButton prefButton ${value ? "option" : "option off"}`;

0 commit comments

Comments
 (0)