From 14032ca8dc7e5b4e317211332a25fe78d96df4e6 Mon Sep 17 00:00:00 2001
From: session <252201310+session567@users.noreply.github.com>
Date: Sat, 16 May 2026 23:31:25 +0200
Subject: [PATCH 1/4] Temporary commit (#45)
---
README.md | 18 +++++---
.../content/common/styles/_icons.css | 42 +++++++++++++++++++
.../content/common/styles/common.css | 1 +
.../content/common/styles/player.css | 10 +++++
src/entrypoints/content/index.ts | 4 +-
.../modules/match-go-to-matches/index.ts | 27 ++++++++++++
.../modules/match-go-to-matches/metadata.ts | 10 +++++
.../modules/player-card-rates/index.css | 32 --------------
.../modules/player-card-rates/index.ts | 20 ++++-----
.../modules/player-ts-drop-rates/index.css | 30 -------------
.../modules/player-ts-drop-rates/index.ts | 20 ++++-----
11 files changed, 126 insertions(+), 88 deletions(-)
create mode 100644 src/entrypoints/content/common/styles/_icons.css
create mode 100644 src/entrypoints/content/common/styles/player.css
create mode 100644 src/entrypoints/content/modules/match-go-to-matches/index.ts
create mode 100644 src/entrypoints/content/modules/match-go-to-matches/metadata.ts
delete mode 100644 src/entrypoints/content/modules/player-card-rates/index.css
delete mode 100644 src/entrypoints/content/modules/player-ts-drop-rates/index.css
diff --git a/README.md b/README.md
index 8ecd640..fdfaa72 100644
--- a/README.md
+++ b/README.md
@@ -8,18 +8,26 @@
**HTE** is a browser extension that enhances your [Hattrick](https://www.hattrick.org) experience with deeper player and
match insights, various visual tweaks throughout the site, and time-saving shortcuts for common tasks.
-Features:
+## Features
-- Extend player skill bars to include loyalty and homegrown bonuses
-- Display HTMS points for players
-- Save and reuse transfer search filters
-- Display the player's yearly salary next to weekly salary on the player detail page
+### General
- Display relevant links to external tools in the sidebar
- Display numeric values next to all team and player abilities
- Display week numbers next to dates throughout Hattrick
+
+### Match
- Display HatStats ratings on match detail and match order pages
+- Add a link to the opponent's matches on the match order page
+
+### Player
+- Extend player skill bars to include loyalty and homegrown bonuses
+- Display HTMS points for players
+- Display the player's yearly salary next to weekly salary on the player detail page
- Show the likelihood of a player receiving a yellow or red card based on their personality
- Show the likelihood of a team spirit drop when buying or selling a player based on their personality
+
+### Transfer
+- Save and reuse transfer search filters
- Highlight players in transfer search results that are close to aging up
## Installation
diff --git a/src/entrypoints/content/common/styles/_icons.css b/src/entrypoints/content/common/styles/_icons.css
new file mode 100644
index 0000000..b297780
--- /dev/null
+++ b/src/entrypoints/content/common/styles/_icons.css
@@ -0,0 +1,42 @@
+/* Icons sourced from Lucide (https://lucide.dev) — ISC License
+Copyright (c) for portions of Lucide is held by Cole Bemis 2013-2022 as part of Feather (MIT).
+All other copyright (c) for Lucide is held by Lucide Contributors.
+See https://github.com/lucide-icons/lucide/blob/main/LICENSE */
+
+[class*="hte-icon-"]::before {
+ content: '';
+ display: inline-block;
+ width: 14px;
+ height: 14px;
+ flex-shrink: 0;
+ background-color: currentcolor;
+}
+
+.hte-icon-ts-buy::before {
+ mask: url("data:image/svg+xml,") no-repeat center / contain;
+}
+
+.hte-icon-ts-sell::before {
+ mask: url("data:image/svg+xml,") no-repeat center / contain;
+}
+
+.hte-icon-football::before {
+ mask: url("data:image/svg+xml,") no-repeat center / contain;
+}
+
+.hte-icon-card-yellow,
+.hte-icon-card-red {
+ &::before {
+ width: 10px;
+ height: 14px;
+ border-radius: 2px;
+ }
+}
+
+.hte-icon-card-yellow::before {
+ background-color: var(--hte-color-yellow-5);
+}
+
+.hte-icon-card-red::before {
+ background-color: var(--hte-color-red-8);
+}
diff --git a/src/entrypoints/content/common/styles/common.css b/src/entrypoints/content/common/styles/common.css
index 47efe1e..59509ec 100644
--- a/src/entrypoints/content/common/styles/common.css
+++ b/src/entrypoints/content/common/styles/common.css
@@ -1 +1,2 @@
@import url('../../../../common/styles/common.css');
+@import url('_icons.css');
diff --git a/src/entrypoints/content/common/styles/player.css b/src/entrypoints/content/common/styles/player.css
new file mode 100644
index 0000000..f2c917c
--- /dev/null
+++ b/src/entrypoints/content/common/styles/player.css
@@ -0,0 +1,10 @@
+.hte-stat {
+ float: right;
+ color: var(--hte-color-black);
+ display: inline-flex;
+ align-items: center;
+ gap: 3px;
+ margin-left: 8px;
+ vertical-align: middle;
+ font-size: .9em;
+}
diff --git a/src/entrypoints/content/index.ts b/src/entrypoints/content/index.ts
index 8e9cd4a..12dce6d 100644
--- a/src/entrypoints/content/index.ts
+++ b/src/entrypoints/content/index.ts
@@ -1,4 +1,4 @@
-import '@/common/styles/common.css'
+import '@/entrypoints/content/common/styles/common.css'
import { defineContentScript } from 'wxt/utils/define-content-script'
@@ -11,6 +11,7 @@ import { isLoggedIn } from '@/entrypoints/content/common/utils/team/utils'
import denomination from '@/entrypoints/content/modules/denomination'
import hteVersion from '@/entrypoints/content/modules/hte-version'
import links from '@/entrypoints/content/modules/links'
+import matchGoToMatches from '@/entrypoints/content/modules/match-go-to-matches'
import matchHatstats from '@/entrypoints/content/modules/match-hatstats'
import playerCardRates from '@/entrypoints/content/modules/player-card-rates'
import playerHtmsPoints from '@/entrypoints/content/modules/player-htms-points'
@@ -32,6 +33,7 @@ const modules: Module[] = [
transferAge,
hteVersion,
matchHatstats,
+ matchGoToMatches,
]
const getHandler = (module: Module): Handler | undefined => {
diff --git a/src/entrypoints/content/modules/match-go-to-matches/index.ts b/src/entrypoints/content/modules/match-go-to-matches/index.ts
new file mode 100644
index 0000000..f2a529b
--- /dev/null
+++ b/src/entrypoints/content/modules/match-go-to-matches/index.ts
@@ -0,0 +1,27 @@
+import { el } from '@/common/utils/dom'
+import type { Module } from '@/entrypoints/content/common/types/module'
+import { querySelectorIn, waitForElement } from '@/entrypoints/content/common/utils/dom'
+import { pages } from '@/entrypoints/content/common/utils/pages'
+import metadata from '@/entrypoints/content/modules/match-go-to-matches/metadata'
+
+const matchGoToMatches: Module = {
+ metadata,
+ pages: [pages.matchOrder],
+ run: async (): Promise => {
+ const headerRight = await waitForElement('ht-matchorder .mo-topbar .header-right')
+ if (!headerRight) return
+
+ const analyzeLink = querySelectorIn(headerRight, 'a[href*="analyzeTeamId"]')
+ if (!analyzeLink) return
+
+ const teamId = new URL(analyzeLink.href).searchParams.get('analyzeTeamId')
+ if (!teamId) return
+
+ const link = el('a', { target: '_blank', href: `/Club/Matches/?TeamID=${teamId}` })
+ link.append(el('i', { className: 'hte-icon-football' }))
+
+ headerRight.insertBefore(link, analyzeLink.nextSibling)
+ },
+}
+
+export default matchGoToMatches
diff --git a/src/entrypoints/content/modules/match-go-to-matches/metadata.ts b/src/entrypoints/content/modules/match-go-to-matches/metadata.ts
new file mode 100644
index 0000000..cb7ab03
--- /dev/null
+++ b/src/entrypoints/content/modules/match-go-to-matches/metadata.ts
@@ -0,0 +1,10 @@
+import type { ModuleMetadata } from '@/entrypoints/content/common/types/module'
+
+const metadata = {
+ id: 'match-go-to-matches',
+ group: 'match',
+ name: 'Go to Matches',
+ description: "Add a link to the opponent's matches on the match order page.",
+} as const satisfies ModuleMetadata
+
+export default metadata
diff --git a/src/entrypoints/content/modules/player-card-rates/index.css b/src/entrypoints/content/modules/player-card-rates/index.css
deleted file mode 100644
index f62c5fc..0000000
--- a/src/entrypoints/content/modules/player-card-rates/index.css
+++ /dev/null
@@ -1,32 +0,0 @@
-.hte-card-icons {
- float: right;
- color: var(--hte-color-black);
-
- .hte-card-icon {
- display: inline-flex;
- align-items: center;
- gap: 3px;
- margin-left: 6px;
- vertical-align: middle;
- font-size: .9em;
-
- &::before {
- content: '';
- display: inline-block;
- width: 10px;
- height: 14px;
- border-radius: 2px;
- flex-shrink: 0;
- }
- }
-
- .hte-card-icon-yellow::before {
- background-color: var(--hte-color-yellow-5);
- }
-
- .hte-card-icon-red::before {
- background-color: var(--hte-color-red-8);
- }
-}
-
-
diff --git a/src/entrypoints/content/modules/player-card-rates/index.ts b/src/entrypoints/content/modules/player-card-rates/index.ts
index c51fddb..55d77fe 100644
--- a/src/entrypoints/content/modules/player-card-rates/index.ts
+++ b/src/entrypoints/content/modules/player-card-rates/index.ts
@@ -1,4 +1,4 @@
-import '@/entrypoints/content/modules/player-card-rates/index.css'
+import '@/entrypoints/content/common/styles/player.css'
import { el } from '@/common/utils/dom'
import type { Module } from '@/entrypoints/content/common/types/module'
@@ -9,12 +9,14 @@ import { getPersonalityLevel } from '@/entrypoints/content/common/utils/player/u
import metadata from '@/entrypoints/content/modules/player-card-rates/metadata'
import { getCardRates } from '@/entrypoints/content/modules/player-card-rates/utils'
-const makeCardIcon = (rate: number, type: 'yellow' | 'red'): HTMLSpanElement =>
- el('span', {
- className: `hte-card-icon hte-card-icon-${type}`,
- textContent: formatPercentage(rate),
- title: i18n.t(`player_card_rates_${type}_title`),
- })
+const makeCardStat = (rate: number, type: 'yellow' | 'red'): HTMLSpanElement => {
+ const wrapper = el('span', { className: 'hte-stat' })
+ wrapper.append(
+ el('i', { className: `hte-icon-card-${type}`, title: i18n.t(`player_card_rates_${type}_title`) }),
+ el('span', { textContent: formatPercentage(rate) }),
+ )
+ return wrapper
+}
const playerCardRates: Module = {
metadata,
@@ -32,9 +34,7 @@ const playerCardRates: Module = {
const { yellow, red } = rates
- const wrapper = el('span', { className: 'hte-card-icons' })
- wrapper.append(makeCardIcon(yellow, 'yellow'), makeCardIcon(red, 'red'))
- byline.append(wrapper)
+ byline.append(makeCardStat(red, 'red'), makeCardStat(yellow, 'yellow'))
},
}
diff --git a/src/entrypoints/content/modules/player-ts-drop-rates/index.css b/src/entrypoints/content/modules/player-ts-drop-rates/index.css
deleted file mode 100644
index 2de99a3..0000000
--- a/src/entrypoints/content/modules/player-ts-drop-rates/index.css
+++ /dev/null
@@ -1,30 +0,0 @@
-.hte-ts-drop-icons {
- float: right;
- color: var(--hte-color-black);
-
- .hte-ts-drop-icon {
- display: inline-flex;
- align-items: center;
- gap: 3px;
- margin-left: 6px;
- vertical-align: middle;
- font-size: .9em;
-
- &::before {
- content: '';
- display: inline-block;
- width: 14px;
- height: 14px;
- flex-shrink: 0;
- background-color: currentcolor;
- }
- }
-
- .hte-ts-drop-icon-buy::before {
- mask: url("data:image/svg+xml,") no-repeat center / contain;
- }
-
- .hte-ts-drop-icon-sell::before {
- mask: url("data:image/svg+xml,") no-repeat center / contain;
- }
-}
diff --git a/src/entrypoints/content/modules/player-ts-drop-rates/index.ts b/src/entrypoints/content/modules/player-ts-drop-rates/index.ts
index 9a7833a..ec6ebcf 100644
--- a/src/entrypoints/content/modules/player-ts-drop-rates/index.ts
+++ b/src/entrypoints/content/modules/player-ts-drop-rates/index.ts
@@ -1,4 +1,4 @@
-import '@/entrypoints/content/modules/player-ts-drop-rates/index.css'
+import '@/entrypoints/content/common/styles/player.css'
import { el } from '@/common/utils/dom'
import type { Module } from '@/entrypoints/content/common/types/module'
@@ -10,12 +10,14 @@ import playerCardRates from '@/entrypoints/content/modules/player-card-rates'
import metadata from '@/entrypoints/content/modules/player-ts-drop-rates/metadata'
import { getTsDropRates } from '@/entrypoints/content/modules/player-ts-drop-rates/utils'
-const makeTsIcon = (rate: number, type: 'buy' | 'sell'): HTMLSpanElement =>
- el('span', {
- className: `hte-ts-drop-icon hte-ts-drop-icon-${type}`,
- textContent: formatPercentage(rate),
- title: i18n.t(`player_ts_drop_rates_${type}_title`),
- })
+const makeTsStat = (rate: number, type: 'buy' | 'sell'): HTMLSpanElement => {
+ const wrapper = el('span', { className: 'hte-stat' })
+ wrapper.append(
+ el('i', { className: `hte-icon-ts-${type}`, title: i18n.t(`player_ts_drop_rates_${type}_title`) }),
+ el('span', { textContent: formatPercentage(rate) }),
+ )
+ return wrapper
+}
const playerTsDropRates: Module = {
metadata,
@@ -33,9 +35,7 @@ const playerTsDropRates: Module = {
const { buy, sell } = rates
- const wrapper = el('span', { className: 'hte-ts-drop-icons' })
- wrapper.append(makeTsIcon(buy, 'buy'), makeTsIcon(sell, 'sell'))
- byline.append(wrapper)
+ byline.append(makeTsStat(sell, 'sell'), makeTsStat(buy, 'buy'))
},
}
From 53e4fb651a70b1779967433fb5c7ba08c0edd4c6 Mon Sep 17 00:00:00 2001
From: session <252201310+session567@users.noreply.github.com>
Date: Sun, 17 May 2026 00:19:50 +0200
Subject: [PATCH 2/4] Add toggle
---
.../content/common/styles/_icons.css | 4 ++
.../content/modules/transfer-age/index.css | 21 ++++++++
.../content/modules/transfer-age/index.ts | 49 ++++++++++++++++---
.../content/modules/transfer-age/utils.ts | 13 +++--
4 files changed, 74 insertions(+), 13 deletions(-)
diff --git a/src/entrypoints/content/common/styles/_icons.css b/src/entrypoints/content/common/styles/_icons.css
index b297780..6ec7a8b 100644
--- a/src/entrypoints/content/common/styles/_icons.css
+++ b/src/entrypoints/content/common/styles/_icons.css
@@ -24,6 +24,10 @@ See https://github.com/lucide-icons/lucide/blob/main/LICENSE */
mask: url("data:image/svg+xml,") no-repeat center / contain;
}
+.hte-icon-highlighter::before {
+ mask: url("data:image/svg+xml,") no-repeat center / contain;
+}
+
.hte-icon-card-yellow,
.hte-icon-card-red {
&::before {
diff --git a/src/entrypoints/content/modules/transfer-age/index.css b/src/entrypoints/content/modules/transfer-age/index.css
index 6281d4c..293f70f 100644
--- a/src/entrypoints/content/modules/transfer-age/index.css
+++ b/src/entrypoints/content/modules/transfer-age/index.css
@@ -4,6 +4,17 @@
float: right;
margin-top: -2px;
+ .hte-transfer-age-toggle {
+ cursor: pointer;
+ color: var(--hte-color-gray-4);
+ display: flex;
+ align-items: center;
+
+ &:hover, &.hte-transfer-age-active {
+ color: var(--hte-color-gray-8);
+ }
+ }
+
.hte-transfer-age-label {
display: flex;
align-items: center;
@@ -26,10 +37,20 @@
}
}
+ .hte-transfer-age-thresholds {
+ display: flex;
+ gap: 12px;
+ }
+
.hte-transfer-age-input {
width: 44px;
text-align: center;
}
+
+ &.hte-transfer-age-disabled .hte-transfer-age-thresholds {
+ opacity: 0.4;
+ pointer-events: none;
+ }
}
.hte-transfer-age {
diff --git a/src/entrypoints/content/modules/transfer-age/index.ts b/src/entrypoints/content/modules/transfer-age/index.ts
index b03293f..25fb5b1 100644
--- a/src/entrypoints/content/modules/transfer-age/index.ts
+++ b/src/entrypoints/content/modules/transfer-age/index.ts
@@ -7,7 +7,7 @@ import { querySelector, querySelectorAll, querySelectorIn } from '@/entrypoints/
import { pages } from '@/entrypoints/content/common/utils/pages'
import { parsePlayerAge } from '@/entrypoints/content/common/utils/player/utils'
import metadata from '@/entrypoints/content/modules/transfer-age/metadata'
-import { thresholdsStorage } from '@/entrypoints/content/modules/transfer-age/utils'
+import { settingsStorage } from '@/entrypoints/content/modules/transfer-age/utils'
const createThresholdControl = (
color: 'orange' | 'red',
@@ -27,27 +27,60 @@ const createThresholdControl = (
return { label, input }
}
-const injectSettingsPanel = (red: number, orange: number): void => {
+const clearHighlights = (): void => {
+ querySelectorAll('.hte-transfer-age', false).forEach((cell) => {
+ cell.classList.remove(
+ 'hte-transfer-age',
+ 'hte-transfer-age-red',
+ 'hte-transfer-age-orange',
+ 'hte-transfer-age-green',
+ )
+ })
+}
+
+const injectSettingsPanel = (enabled: boolean, red: number, orange: number): void => {
querySelector('#hte-transfer-age-settings', false)?.remove()
const { label: orangeLabel, input: orangeInput } = createThresholdControl('orange', orange)
const { label: redLabel, input: redInput } = createThresholdControl('red', red)
+ const enabledButton = el('span', { className: `hte-transfer-age-toggle${enabled ? ' hte-transfer-age-active' : ''}` })
+ enabledButton.append(el('i', { className: 'hte-icon-highlighter' }))
+
+ const thresholds = el('div', { className: 'hte-transfer-age-thresholds' })
+ thresholds.append(orangeLabel, redLabel)
+
const panel = el('div', { id: 'hte-transfer-age-settings' })
- panel.append(orangeLabel, redLabel)
+ if (!enabled) panel.classList.add('hte-transfer-age-disabled')
+ panel.append(enabledButton, thresholds)
const onThresholdChange = () => {
const newOrange = parseInt(orangeInput.value, 10)
const newRed = parseInt(redInput.value, 10)
if (isNaN(newOrange) || isNaN(newRed)) return
- void thresholdsStorage.setValue({ red: newRed, orange: newOrange }).then(() => {
- applyHighlights(newRed, newOrange)
+ const isEnabled = enabledButton.classList.contains('hte-transfer-age-active')
+ void settingsStorage.setValue({ red: newRed, orange: newOrange, enabled: isEnabled }).then(() => {
+ if (isEnabled) applyHighlights(newRed, newOrange)
})
}
+ const onEnabledChange = () => {
+ const newEnabled = enabledButton.classList.toggle('hte-transfer-age-active')
+ const newOrange = parseInt(orangeInput.value, 10)
+ const newRed = parseInt(redInput.value, 10)
+ const areThresholdsValid = !isNaN(newRed) && !isNaN(newOrange)
+
+ panel.classList.toggle('hte-transfer-age-disabled', !newEnabled)
+
+ if (areThresholdsValid) void settingsStorage.setValue({ red: newRed, orange: newOrange, enabled: newEnabled })
+ if (newEnabled && areThresholdsValid) applyHighlights(newRed, newOrange)
+ if (!newEnabled) clearHighlights()
+ }
+
orangeInput.addEventListener('change', onThresholdChange)
redInput.addEventListener('change', onThresholdChange)
+ enabledButton.addEventListener('click', onEnabledChange)
querySelector('#ctl00_ctl00_CPContent_CPMain_ucPager_divWrapper .PagerRight_Default')?.prepend(panel)
}
@@ -75,9 +108,9 @@ const transferAge: Module = {
metadata,
pages: [pages.transferSearchResults],
run: async () => {
- const { red, orange } = await thresholdsStorage.getValue()
- injectSettingsPanel(red, orange)
- applyHighlights(red, orange)
+ const { enabled, red, orange } = await settingsStorage.getValue()
+ injectSettingsPanel(enabled, red, orange)
+ if (enabled) applyHighlights(red, orange)
},
}
diff --git a/src/entrypoints/content/modules/transfer-age/utils.ts b/src/entrypoints/content/modules/transfer-age/utils.ts
index 616a5b9..5779265 100644
--- a/src/entrypoints/content/modules/transfer-age/utils.ts
+++ b/src/entrypoints/content/modules/transfer-age/utils.ts
@@ -1,6 +1,9 @@
-export const DEFAULTS = { orange: 80, red: 90 } as const
+export const DEFAULTS = { orange: 80, red: 90, enabled: false } as const
-export const thresholdsStorage = storage.defineItem<{ red: number; orange: number }>('local:transfer-age-thresholds', {
- fallback: DEFAULTS,
- version: 1,
-})
+export const settingsStorage = storage.defineItem<{ red: number; orange: number; enabled: boolean }>(
+ 'local:transfer-age-settings',
+ {
+ fallback: DEFAULTS,
+ version: 1,
+ },
+)
From 0f4acbe0a17ee6e2fe68f36704e0f782b1da02dc Mon Sep 17 00:00:00 2001
From: session <252201310+session567@users.noreply.github.com>
Date: Sun, 17 May 2026 00:31:02 +0200
Subject: [PATCH 3/4] Add toggle for transfer age controls
---
.../content/modules/transfer-age/index.ts | 53 ++++++++++---------
1 file changed, 29 insertions(+), 24 deletions(-)
diff --git a/src/entrypoints/content/modules/transfer-age/index.ts b/src/entrypoints/content/modules/transfer-age/index.ts
index 25fb5b1..140a0a8 100644
--- a/src/entrypoints/content/modules/transfer-age/index.ts
+++ b/src/entrypoints/content/modules/transfer-age/index.ts
@@ -38,7 +38,7 @@ const clearHighlights = (): void => {
})
}
-const injectSettingsPanel = (enabled: boolean, red: number, orange: number): void => {
+const injectSettingsPanel = (enabled: boolean, orange: number, red: number): void => {
querySelector('#hte-transfer-age-settings', false)?.remove()
const { label: orangeLabel, input: orangeInput } = createThresholdControl('orange', orange)
@@ -47,35 +47,40 @@ const injectSettingsPanel = (enabled: boolean, red: number, orange: number): voi
const enabledButton = el('span', { className: `hte-transfer-age-toggle${enabled ? ' hte-transfer-age-active' : ''}` })
enabledButton.append(el('i', { className: 'hte-icon-highlighter' }))
- const thresholds = el('div', { className: 'hte-transfer-age-thresholds' })
- thresholds.append(orangeLabel, redLabel)
+ const thresholdsContainer = el('div', { className: 'hte-transfer-age-thresholds' })
+ thresholdsContainer.append(orangeLabel, redLabel)
const panel = el('div', { id: 'hte-transfer-age-settings' })
- if (!enabled) panel.classList.add('hte-transfer-age-disabled')
- panel.append(enabledButton, thresholds)
+ panel.classList.toggle('hte-transfer-age-disabled', !enabled)
+ panel.append(enabledButton, thresholdsContainer)
+
+ let isEnabled = enabled
+
+ const readThresholds = (): { red: number; orange: number } | null => {
+ const orange = parseInt(orangeInput.value, 10)
+ const red = parseInt(redInput.value, 10)
+
+ return isNaN(orange) || isNaN(red) ? null : { orange, red }
+ }
const onThresholdChange = () => {
- const newOrange = parseInt(orangeInput.value, 10)
- const newRed = parseInt(redInput.value, 10)
- if (isNaN(newOrange) || isNaN(newRed)) return
-
- const isEnabled = enabledButton.classList.contains('hte-transfer-age-active')
- void settingsStorage.setValue({ red: newRed, orange: newOrange, enabled: isEnabled }).then(() => {
- if (isEnabled) applyHighlights(newRed, newOrange)
- })
+ const thresholds = readThresholds()
+ if (!thresholds) return
+
+ void settingsStorage.setValue({ ...thresholds, enabled: isEnabled })
+ if (isEnabled) applyHighlights(thresholds.orange, thresholds.red)
}
const onEnabledChange = () => {
- const newEnabled = enabledButton.classList.toggle('hte-transfer-age-active')
- const newOrange = parseInt(orangeInput.value, 10)
- const newRed = parseInt(redInput.value, 10)
- const areThresholdsValid = !isNaN(newRed) && !isNaN(newOrange)
+ isEnabled = enabledButton.classList.toggle('hte-transfer-age-active')
+ const thresholds = readThresholds()
+
+ panel.classList.toggle('hte-transfer-age-disabled', !isEnabled)
- panel.classList.toggle('hte-transfer-age-disabled', !newEnabled)
+ if (thresholds) void settingsStorage.setValue({ ...thresholds, enabled: isEnabled })
- if (areThresholdsValid) void settingsStorage.setValue({ red: newRed, orange: newOrange, enabled: newEnabled })
- if (newEnabled && areThresholdsValid) applyHighlights(newRed, newOrange)
- if (!newEnabled) clearHighlights()
+ if (!isEnabled) clearHighlights()
+ else if (thresholds) applyHighlights(thresholds.orange, thresholds.red)
}
orangeInput.addEventListener('change', onThresholdChange)
@@ -85,7 +90,7 @@ const injectSettingsPanel = (enabled: boolean, red: number, orange: number): voi
querySelector('#ctl00_ctl00_CPContent_CPMain_ucPager_divWrapper .PagerRight_Default')?.prepend(panel)
}
-const applyHighlights = (red: number, orange: number): void => {
+const applyHighlights = (orange: number, red: number): void => {
const players = querySelectorAll('.transferPlayerInformation', false)
players.forEach((player) => {
@@ -109,8 +114,8 @@ const transferAge: Module = {
pages: [pages.transferSearchResults],
run: async () => {
const { enabled, red, orange } = await settingsStorage.getValue()
- injectSettingsPanel(enabled, red, orange)
- if (enabled) applyHighlights(red, orange)
+ injectSettingsPanel(enabled, orange, red)
+ if (enabled) applyHighlights(orange, red)
},
}
From 25cc843be339a6d91a73ed1f199f639804d37e43 Mon Sep 17 00:00:00 2001
From: session <252201310+session567@users.noreply.github.com>
Date: Sun, 17 May 2026 00:39:22 +0200
Subject: [PATCH 4/4] Refactor
---
src/entrypoints/content/modules/transfer-age/utils.ts | 4 +---
1 file changed, 1 insertion(+), 3 deletions(-)
diff --git a/src/entrypoints/content/modules/transfer-age/utils.ts b/src/entrypoints/content/modules/transfer-age/utils.ts
index 5779265..7270d35 100644
--- a/src/entrypoints/content/modules/transfer-age/utils.ts
+++ b/src/entrypoints/content/modules/transfer-age/utils.ts
@@ -1,9 +1,7 @@
-export const DEFAULTS = { orange: 80, red: 90, enabled: false } as const
-
export const settingsStorage = storage.defineItem<{ red: number; orange: number; enabled: boolean }>(
'local:transfer-age-settings',
{
- fallback: DEFAULTS,
+ fallback: { orange: 80, red: 90, enabled: false },
version: 1,
},
)