Skip to content

Commit 763f6b9

Browse files
committed
Add new mod option type INPUT_FIELD
1 parent 399bd13 commit 763f6b9

4 files changed

Lines changed: 84 additions & 14 deletions

File tree

CHANGELOG.md

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,10 @@
44

55
## [Unreleased]
66

7+
### Added
8+
9+
- Added new mod option type `INPUT_FIELD`
10+
711
### Fixed
812

913
- Improve browser compatibility

src/gui/options/option-elements-inject.ts

Lines changed: 60 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -1,18 +1,18 @@
11
import { GuiOption } from '../../mod-options'
22

3-
const optGet = (row: modmanager.gui.OptionsOptionRow): unknown => {
4-
return modmanager.options[row.guiOption.modId][row.guiOption.baseId]
3+
const optGet = (guiOption: GuiOption): unknown => {
4+
return modmanager.options[guiOption.modId][guiOption.baseId]
55
}
6-
const optSet = (row: modmanager.gui.OptionsOptionRow, value: any) => {
7-
modmanager.options[row.guiOption.modId][row.guiOption.baseId] = value
6+
const optSet = (guiOption: GuiOption, value: any) => {
7+
modmanager.options[guiOption.modId][guiOption.baseId] = value
88
}
99

1010
sc.OPTION_GUIS[sc.OPTION_TYPES.BUTTON_GROUP].inject({
1111
init(optionRow, x, rowGroup) {
1212
this.base = optionRow
1313
if (!(this.base instanceof modmanager.gui.OptionsOptionRow)) return this.parent(optionRow, x, rowGroup)
1414

15-
const index = optGet(this.base) as number
15+
const index = optGet(this.base.guiOption) as number
1616

1717
const backup_ig_lang_get = ig.lang.get
1818
// @ts-expect-error
@@ -34,7 +34,7 @@ sc.OPTION_GUIS[sc.OPTION_TYPES.BUTTON_GROUP].inject({
3434
if (!(this.base instanceof modmanager.gui.OptionsOptionRow)) return this.parent(button)
3535
if (this._prevPressed != button) {
3636
this.resetButtons(button)
37-
optSet(this.base, button.data.id)
37+
optSet(this.base.guiOption, button.data.id)
3838
this._prevPressed = button
3939
}
4040
},
@@ -85,7 +85,7 @@ modmanager.gui.OptionsObjectSlider = ig.GuiElementBase.extend({
8585
this.slider.thumb.addChildGui(this.currentNumber)
8686
rowGroup.addFocusGui(this.slider, 0, this.base.row)
8787

88-
const value = optGet(this.base) as number
88+
const value = optGet(this.base.guiOption) as number
8989
let index = this.entries.findIndex(v => v == value)
9090
if (index == -1) index = 0
9191
this.slider.setValue(index)
@@ -120,7 +120,7 @@ modmanager.gui.OptionsObjectSlider = ig.GuiElementBase.extend({
120120
},
121121
modelChanged(model, message) {
122122
if (model == sc.options && message == sc.OPTIONS_EVENT.OPTION_CHANGED) {
123-
const value = optGet(this.base) as number
123+
const value = optGet(this.base.guiOption) as number
124124
if (value != this.entries[this._lastVal]) {
125125
this._lastVal = this.entries.indexOf(value)
126126
this.slider.setValue(this._lastVal)
@@ -132,7 +132,7 @@ modmanager.gui.OptionsObjectSlider = ig.GuiElementBase.extend({
132132
if (index != this._lastVal) {
133133
this._lastVal = index
134134
this.updateNumberDisplay()
135-
optSet(this.base, this.entries[index])
135+
optSet(this.base.guiOption, this.entries[index])
136136
}
137137
},
138138
onLeftRight(direction) {
@@ -147,7 +147,7 @@ sc.OPTION_GUIS[sc.OPTION_TYPES.ARRAY_SLIDER].inject({
147147
this.parent(optionRow, x, rowGroup)
148148
if (!(this.base instanceof modmanager.gui.OptionsOptionRow)) return
149149

150-
const value = optGet(this.base) as number
150+
const value = optGet(this.base.guiOption) as number
151151
this.slider.setValue(value * this.scale)
152152
this._lastVal = this.slider.getValue()
153153
},
@@ -156,7 +156,7 @@ sc.OPTION_GUIS[sc.OPTION_TYPES.ARRAY_SLIDER].inject({
156156

157157
if (!(this.base instanceof modmanager.gui.OptionsOptionRow)) return
158158

159-
optSet(this.base, this._lastVal / this.scale)
159+
optSet(this.base.guiOption, this._lastVal / this.scale)
160160
},
161161
})
162162

@@ -166,12 +166,12 @@ sc.OPTION_GUIS[sc.OPTION_TYPES.CHECKBOX].inject({
166166

167167
if (!(this.base instanceof modmanager.gui.OptionsOptionRow)) return
168168

169-
this.button.setPressed(optGet(this.base) as boolean)
169+
this.button.setPressed(optGet(this.base.guiOption) as boolean)
170170
},
171171
onPressed(checkbox) {
172172
if (!(this.base instanceof modmanager.gui.OptionsOptionRow)) return this.parent(checkbox)
173173

174-
checkbox == this.button && optSet(this.base, checkbox.pressed)
174+
checkbox == this.button && optSet(this.base.guiOption, checkbox.pressed)
175175
},
176176
})
177177

@@ -263,3 +263,50 @@ sc.OPTION_GUIS[sc.OPTION_TYPES.CONTROLS].inject({
263263
ig.lang.get = backup_ig_lang_get
264264
},
265265
})
266+
267+
declare global {
268+
namespace modmanager.gui {
269+
interface OptionsOptionInputField extends ig.GuiElementBase {
270+
option: GuiOption
271+
inputField: nax.ccuilib.InputField
272+
}
273+
interface OptionsOptionInputFieldConstructor extends ImpactClass<OptionsOptionInputField> {
274+
new (option: GuiOption, y: number, rowGroup: sc.RowButtonGroup, width: number): OptionsOptionInputField
275+
}
276+
var OptionsOptionInputField: OptionsOptionInputFieldConstructor
277+
}
278+
}
279+
280+
modmanager.gui.OptionsOptionInputField = ig.GuiElementBase.extend({
281+
init(option, y, rowGroup, width) {
282+
this.parent()
283+
this.option = option
284+
if (option.type != 'INPUT_FIELD') throw new Error('how')
285+
286+
const height = option.height ?? 20
287+
this.inputField = new nax.ccuilib.InputField(width, height)
288+
289+
const text = optGet(option) as string
290+
this.inputField.setText?.(text)
291+
292+
this.inputField.onCharacterInput = str => {
293+
optSet(option, str)
294+
if (option.changeEvent) option.changeEvent()
295+
}
296+
297+
// this.button.setPos(5, 8)
298+
this.inputField.setAlign(ig.GUI_ALIGN.X_LEFT, ig.GUI_ALIGN.Y_CENTER)
299+
300+
const backup = this.inputField.focusGained.bind(this.inputField)
301+
// this.inputField.data = option.description
302+
this.inputField.focusGained = function (this: nax.ccuilib.InputField) {
303+
backup()
304+
sc.menu.setInfoText(option.description as string)
305+
}
306+
this.setSize(width, this.inputField.hook.size.y)
307+
308+
this.addChildGui(this.inputField)
309+
310+
rowGroup.addFocusGui(this.inputField, 0, y)
311+
},
312+
})

src/gui/options/tabbox.ts

Lines changed: 7 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,11 @@ export {}
55
declare global {
66
namespace modmanager.gui {
77
namespace OptionsTabBox {
8-
type GuiOption = sc.OptionInfoBox | modmanager.gui.OptionsOptionRow | modmanager.gui.OptionsOptionButton
8+
type GuiOption =
9+
| sc.OptionInfoBox
10+
| modmanager.gui.OptionsOptionRow
11+
| modmanager.gui.OptionsOptionButton
12+
| modmanager.gui.OptionsOptionInputField
913
}
1014
interface OptionsTabBox extends ig.GuiElementBase, sc.Model.Observer {
1115
gfx: ig.Image
@@ -266,6 +270,8 @@ modmanager.gui.OptionsTabBox = ig.GuiElementBase.extend({
266270
optionGui = new modmanager.gui.OptionsOptionInfoBox(option, 431)
267271
} else if (option.type == 'BUTTON') {
268272
optionGui = new modmanager.gui.OptionsOptionButton(option, optionI, this.rowButtonGroup, 431)
273+
} else if (option.type == 'INPUT_FIELD') {
274+
optionGui = new modmanager.gui.OptionsOptionInputField(option, optionI, this.rowButtonGroup, 431)
269275
} else {
270276
optionGui = new modmanager.gui.OptionsOptionRow(option, optionI, this.rowButtonGroup, 431)
271277
}

src/mod-options.ts

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -31,6 +31,7 @@ export type Option = {
3131
| INFO
3232
| BUTTON
3333
| JSON_DATA
34+
| INPUT_FIELD
3435
)
3536

3637
type BUTTON_GROUP = OptionChangeable & {
@@ -51,6 +52,14 @@ type BUTTON_GROUP = OptionChangeable & {
5152
}
5253
)
5354

55+
interface INPUT_FIELD extends OptionChangeable {
56+
type: 'INPUT_FIELD'
57+
/** Initial option value */
58+
init: string
59+
/** Input field height */
60+
height?: number
61+
}
62+
5463
interface ARRAY_SLIDER extends OptionChangeable {
5564
type: 'ARRAY_SLIDER'
5665
data: number[]
@@ -341,6 +350,10 @@ function registerAndGetModOptions<T extends Options>(settings: ModOptionsSetting
341350
get = function () {
342351
return JSON.parse(localStorage.getItem(id)!)
343352
}
353+
} else if (option.type == 'INPUT_FIELD') {
354+
get = function () {
355+
return localStorage.getItem(id)!
356+
}
344357
} else {
345358
get = function () {
346359
return Number(localStorage.getItem(id))

0 commit comments

Comments
 (0)