chore: make explicit that the "show get started dialog" is a special case

This commit is contained in:
Yohan Boniface 2024-07-05 09:52:39 +02:00
parent 759dd34ef3
commit 6aa74060ad
2 changed files with 25 additions and 21 deletions

View file

@ -190,26 +190,29 @@ export default class Help {
show(entries) { show(entries) {
const container = DomUtil.add('div') const container = DomUtil.add('div')
DomUtil.createTitle(container, translate('Help')) DomUtil.createTitle(container, translate('Help'))
// Special dynamic case. Do we still think this dialog is usefull ? for (const name of entries) {
if (entries[0] === 'edit') {
DomUtil.element({ DomUtil.element({
tagName: 'div', tagName: 'div',
className: 'umap-help-entry', className: 'umap-help-entry',
parent: container, parent: container,
}).appendChild(this._buildEditEntry()) innerHTML: ENTRIES[name],
} else { })
for (const name of entries) {
DomUtil.element({
tagName: 'div',
className: 'umap-help-entry',
parent: container,
innerHTML: ENTRIES[name],
})
}
} }
this.map.dialog.open({ content: container, className: 'dark' }) this.map.dialog.open({ content: container, className: 'dark' })
} }
// Special dynamic case. Do we still think this dialog is usefull ?
showGetStarted() {
const container = DomUtil.add('div')
DomUtil.createTitle(container, translate('Where do we go from here?'))
DomUtil.element({
tagName: 'div',
className: 'umap-help-entry',
parent: container,
}).appendChild(this._buildEditEntry())
this.map.dialog.open({ content: container, className: 'dark' })
}
button(container, entries, classname) { button(container, entries, classname) {
const button = DomUtil.createButton( const button = DomUtil.createButton(
classname || 'umap-help-button', classname || 'umap-help-button',
@ -217,15 +220,18 @@ export default class Help {
translate('Help') translate('Help')
) )
entries = typeof entries === 'string' ? [entries] : entries entries = typeof entries === 'string' ? [entries] : entries
DomEvent.on(button, 'click', DomEvent.stop).on(button, 'click', () => DomEvent.on(button, 'click', DomEvent.stop).on(button, 'click', () => {
this.show(entries) this.show(entries)
) })
return button return button
} }
link(container, entries) { getStartedLink(container) {
const button = this.button(container, entries, 'umap-help-link') const button = DomUtil.createButton('umap-help-link', container, translate('Help'))
button.textContent = translate('Help') button.textContent = translate('Help')
DomEvent.on(button, 'click', DomEvent.stop).on(button, 'click', () => {
this.showGetStarted()
})
return button return button
} }
@ -237,16 +243,14 @@ export default class Help {
_buildEditEntry() { _buildEditEntry() {
const container = DomUtil.create('div', '') const container = DomUtil.create('div', '')
const title = DomUtil.create('h4', '', container)
const actionsContainer = DomUtil.create('ul', 'umap-edit-actions', container) const actionsContainer = DomUtil.create('ul', 'umap-edit-actions', container)
const addAction = (action) => { const addAction = (action) => {
const actionContainer = DomUtil.add('li', '', actionsContainer) const actionContainer = DomUtil.add('li', '', actionsContainer)
DomUtil.add('i', action.options.className, actionContainer), DomUtil.add('i', action.options.className, actionContainer)
DomUtil.add('span', '', actionContainer, action.options.tooltip) DomUtil.add('span', '', actionContainer, action.options.tooltip)
DomEvent.on(actionContainer, 'click', action.addHooks, action) DomEvent.on(actionContainer, 'click', action.addHooks, action)
DomEvent.on(actionContainer, 'click', this.map.dialog.close, this.map.dialog) DomEvent.on(actionContainer, 'click', this.map.dialog.close, this.map.dialog)
} }
title.textContent = translate('Where do we go from here?')
for (const id in this.map.helpMenuActions) { for (const id in this.map.helpMenuActions) {
addAction(this.map.helpMenuActions[id]) addAction(this.map.helpMenuActions[id])
} }

View file

@ -751,7 +751,7 @@ const ControlsMixin = {
this.options.user.url this.options.user.url
) )
} }
this.help.link(rightContainer, 'edit') this.help.getStartedLink(rightContainer)
const controlEditCancel = L.DomUtil.createButton( const controlEditCancel = L.DomUtil.createButton(
'leaflet-control-edit-cancel', 'leaflet-control-edit-cancel',
rightContainer, rightContainer,