Skip to content

Commit

Permalink
chore: cleanup
Browse files Browse the repository at this point in the history
  • Loading branch information
@braebo
braebo committed May 17, 2024
1 parent d4b24e7 commit 9f8ffc3
Show file tree
Hide file tree
Showing 3 changed files with 44 additions and 37 deletions.
27 changes: 17 additions & 10 deletions src/lib/gui/Folder.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -407,7 +407,7 @@ export class Folder {
return folder
}

#handleClick(event: PointerEvent) {
private _handleClick(event: PointerEvent) {
if (event.button !== 0) return

this._log.fn('#handleClick').debug({ event, this: this })
Expand All @@ -417,37 +417,37 @@ export class Folder {

// todo - with the addition of the dataset `dragged` attribute from draggable, this might not be necessary.
// todo - Figure out why `stopPropagation` doesn't work so we don't need this.
if (composedPathContains(event, 'fractils-cancel')) return this.#disableClicks()
if (composedPathContains(event, 'fractils-cancel')) return this._disableClicks()

// We need to watch for the mouseup event within a certain timeframe
// to make sure we don't accidentally trigger a click after dragging.
clearTimeout(this._disabledTimer)
// First we delay the drag check to allow for messy clicks.
this._disabledTimer = setTimeout(() => {
this.elements.header.removeEventListener('pointermove', this.#disableClicks)
this.elements.header.addEventListener('pointermove', this.#disableClicks, {
this.elements.header.removeEventListener('pointermove', this._disableClicks)
this.elements.header.addEventListener('pointermove', this._disableClicks, {
once: true,
})

// Then we set a timer to disable the drag check.
this._disabledTimer = setTimeout(() => {
this.elements.header.removeEventListener('pointermove', this.#disableClicks)
this.elements.header.removeEventListener('pointermove', this._disableClicks)
this.element.removeEventListener('pointerup', this.toggle)
this._clicksDisabled = false
}, this._clickTime)
}, 150)

if (this._clicksDisabled) return
}
#disableClicks = () => {
private _disableClicks = () => {
if (!this._clicksDisabled) {
this._clicksDisabled = true
this._log.fn('disable').debug('Clicks DISABLED')
}
this._clicksDisabled = true
clearTimeout(this._disabledTimer)
}
#resetClicks() {
private _resetClicks() {
this._log.fn('cancel').debug('Clicks ENABLED')
removeEventListener('pointerup', this.toggle)
this._clicksDisabled = false
Expand All @@ -459,7 +459,7 @@ export class Folder {
this._log.fn('toggle').debug()
clearTimeout(this._disabledTimer)
if (this._clicksDisabled) {
this.#resetClicks()
this._resetClicks()
return
}

Expand Down Expand Up @@ -771,7 +771,7 @@ export class Folder {
parent: element,
classes: ['fracgui-header'],
})
header.addEventListener('pointerdown', this.#handleClick.bind(this))
header.addEventListener('pointerdown', this._handleClick.bind(this))

const title = create('div', {
parent: header,
Expand Down Expand Up @@ -860,9 +860,14 @@ export class Folder {
return Object.assign({}, FOLDER_DEFAULTS, opts)
}

disposed = false
dispose() {
if (this.disposed && DEV) {
this._log.fn('dispose').error('Already disposed.', this)
return
}
this.elements.header.removeEventListener('click', this.toggle)
this.elements.header.addEventListener('pointerdown', this.#handleClick)
this.elements.header.addEventListener('pointerdown', this._handleClick)

this.element.remove()

Expand All @@ -879,5 +884,7 @@ export class Folder {
} catch (err) {
this._log.fn('dispose').error('Error removing folder from parent', { err })
}

this.disposed = true
}
}
34 changes: 17 additions & 17 deletions src/lib/gui/PresetManager.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -63,7 +63,7 @@ export class PresetManager {
options: PresetManagerOptions,
) {
this._log = new Logger(`PresetManager ${gui.folder.title}`, { fg: 'slateblue' })
this._log.fn('constructor').info({ options, this: this })
this._log.fn('constructor').debug({ options, this: this })

this.opts = Object.freeze(options)

Expand Down Expand Up @@ -103,12 +103,12 @@ export class PresetManager {
* Set the active preset.
*/
set(value: GuiPreset) {
this._log.fn('set').info({ value, this: this })
this._log.fn('set').debug({ value, this: this })
this.activePreset.set(value)
}

private _renamePreset(title: string) {
this._log.fn('_renamePreset').info({ this: this, title })
this._log.fn('_renamePreset').debug({ this: this, title })

if (!this.isInitialized()) throw new Error('PresetManager not initialized.')

Expand All @@ -131,7 +131,7 @@ export class PresetManager {
}

private _resolveUnusedTitle(title: string) {
this._log.fn('resolveUnusedTitle').info({ this: this, title })
this._log.fn('resolveUnusedTitle').debug({ this: this, title })
if (!this.isInitialized()) throw new Error('PresetManager not initialized.')

const presets = this.presets.value
Expand Down Expand Up @@ -159,7 +159,7 @@ export class PresetManager {
}

async addGui(parentFolder: Folder, defaultPreset?: GuiPreset) {
this._log.fn('add').info({ this: this, parentFolder, defaultPreset })
this._log.fn('add').debug({ this: this, parentFolder, defaultPreset })

if (!this.isInitialized()) throw new Error('PresetManager not initialized.')

Expand Down Expand Up @@ -340,19 +340,19 @@ export class PresetManager {
})

this._presetsInput.on('change', ({ value }) => {
this._log.fn('_presetsInput.on(change)').info({ value, this: this })
this._log.fn('_presetsInput.on(change)').debug({ value, this: this })
this.gui.load(value)
this.activePreset.set(value)
this._refreshInputs()
})

this._presetsInput.on('open', () => {
this._log.fn('_presetsInput.on(open)').info()
this._log.fn('_presetsInput.on(open)').debug()
this._presetSnapshot = this.gui.toJSON('__snapshot__')
})

this._presetsInput.on('cancel', () => {
this._log.fn('_presetsInput.on(cancel)').info()
this._log.fn('_presetsInput.on(cancel)').debug()
if (this._presetSnapshot) {
this.gui.load(this._presetSnapshot)
this._refreshInputs()
Expand All @@ -362,7 +362,7 @@ export class PresetManager {
//? New Preset Button
const newPresetButton = new SaveSVG()
this._presetsInput.listen(newPresetButton.element, 'click', () => {
this._log.fn('newPresetButton.on(click)').info()
this._log.fn('newPresetButton.on(click)').debug()
this.add()
})

Expand Down Expand Up @@ -400,7 +400,7 @@ export class PresetManager {
* Delete a preset.
*/
deletePreset(preset: GuiPreset | GuiPreset['id']) {
this._log.fn('deletePreset').info({ this: this, preset })
this._log.fn('deletePreset').debug({ this: this, preset })

if (!this.isInitialized()) {
throw new Error('PresetManager not initialized.')
Expand Down Expand Up @@ -445,10 +445,10 @@ export class PresetManager {

const existing = this.presets.value.find(p => p.id === preset.id)
if (!existing) {
this._log.info('pushing preset:', { preset, existing })
this._log.debug('pushing preset:', { preset, existing })
this.presets.push(preset)
} else {
this._log.info('preset exists. replacing with:', { preset, existing })
this._log.debug('preset exists. replacing with:', { preset, existing })
this.presets.update(presets => {
const index = presets.findIndex(p => p.id === preset.id)
presets[index] = preset
Expand Down Expand Up @@ -485,7 +485,7 @@ export class PresetManager {
* Disables the dropdown, making the select's text editable.
*/
private _enableRename = () => {
this._log.fn('_enableRename').info({ this: this })
this._log.fn('_enableRename').debug({ this: this })

const el = this._presetsInput.select.elements.selected

Expand Down Expand Up @@ -518,7 +518,7 @@ export class PresetManager {
}

private _handleRename = (e?: Event) => {
this._log.fn('_disableRename').info({ e, this: this })
this._log.fn('_disableRename').debug({ e, this: this })

this._presetsInput.select.disableClicks = false
this._presetsInput.select.elements.selected.removeAttribute('contenteditable')
Expand All @@ -543,7 +543,7 @@ export class PresetManager {
}

private _handleKeydown = (e: KeyboardEvent) => {
this._log.fn('_handleKeydown').info({ key: e.key, e, this: this })
this._log.fn('_handleKeydown').debug({ key: e.key, e, this: this })

if (e.key === 'Enter') {
e.preventDefault()
Expand All @@ -562,14 +562,14 @@ export class PresetManager {

this._manageInput.refresh()

this._log.fn('_refreshInputs').info({ disableRename, this: this })
this._log.fn('_refreshInputs').debug({ disableRename, this: this })
}

/**
* Refresh the presets input.
*/
private _refresh() {
this._log.fn('_refresh').info('Refreshing options and setting input.', { this: this })
this._log.fn('_refresh').debug('Refreshing options and setting input.', { this: this })

this._presetsInput.options = this.presets.value.map(o => ({ label: o.title, value: o }))
const activePreset = this.activePreset.value
Expand Down
20 changes: 10 additions & 10 deletions src/lib/gui/controllers/Select.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -203,7 +203,7 @@ export class Select<T> {

this.disabled = this._opts.disabled

this._log.fn('constructor').info({ opts: this._opts, this: this })
this._log.fn('constructor').debug({ opts: this._opts, this: this })
}

/**
Expand All @@ -213,7 +213,7 @@ export class Select<T> {
return this._selected
}
set selected(v: Option<T> | State<Option<T>>) {
this._log.fn('set selected').info(v)
this._log.fn('set selected').debug(v)

const newValue = isState(v) ? toLabeledOption(v.value) : toLabeledOption(v)

Expand Down Expand Up @@ -260,7 +260,7 @@ export class Select<T> {

this.elements.options.push(el)

this._log.fn('add').info({ option, added: this.optionMap.get(id), id, this: this })
this._log.fn('add').debug({ option, added: this.optionMap.get(id), id, this: this })

return this
}
Expand Down Expand Up @@ -288,7 +288,7 @@ export class Select<T> {

const btn = found

this._log.fn('remove').info({ btn, id, this: this })
this._log.fn('remove').debug({ btn, id, this: this })

// If the selected option is being removed, select the next option in the list.
if (
Expand All @@ -301,7 +301,7 @@ export class Select<T> {
// this.select(next)
this._log
.fn('remove')
.info('Auto-selecting fallback btn', { fallback, btn, id, this: this })
.debug('Auto-selecting fallback btn', { fallback, btn, id, this: this })

this.select(fallback, false)
}
Expand All @@ -317,7 +317,7 @@ export class Select<T> {
* Removes all options and their elements.
*/
clear() {
this._log.fn('clear').info({ this: this })
this._log.fn('clear').debug({ this: this })
for (const id of this.optionMap.keys()) {
this.remove(id, false)
}
Expand All @@ -338,7 +338,7 @@ export class Select<T> {
return this
}

this._log.fn('select').info('v', v, { this: this })
this._log.fn('select').debug('v', v, { this: this })

if (v instanceof Event) {
const target = v.target as HTMLDivElement
Expand Down Expand Up @@ -381,7 +381,7 @@ export class Select<T> {
* Updates the UI to reflect the current state of the source.
*/
refresh = () => {
this._log.fn('refresh').info({ this: this })
this._log.fn('refresh').debug({ this: this })
// Make sure the selected value text is in the selected div.
this.elements.selected.innerHTML = this.selected.label

Expand All @@ -392,7 +392,7 @@ export class Select<T> {
* Toggles the dropdown's visibility.
*/
toggle = () => {
this._log.fn('toggle').info({ this: this })
this._log.fn('toggle').debug({ this: this })
if (this.expanded) {
this._evm.emit('cancel')
this.close()
Expand Down Expand Up @@ -430,7 +430,7 @@ export class Select<T> {
const select = () => {
this._log
.fn('on(mouseenter)')
.info('currentSelection', { option, element, this: this })
.debug('currentSelection', { option, element, this: this })
this.select(option)
}
this._evm.listen(element, 'mouseenter', select, {}, 'dropdown')
Expand Down

0 comments on commit 9f8ffc3

Please sign in to comment.