almet/umap
1
0
Fork 0
mirror of https://github.com/umap-project/umap.git synced 2025-04-30 12:12:36 +02:00
Code Issues Projects Releases Packages Wiki Activity Actions 1

wip: allow to reorder rules

Browse source
This commit is contained in:
Yohan Boniface 2024-04-25 17:16:12 +02:00
parent 05eab25da4
commit 4f8e453012
1 changed files with 30 additions and 15 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

45
umap/static/umap/js/modules/rules.js
View file

@ -83,19 +83,11 @@ class Rule {
this.map.editPanel.open({ content: container }) this.map.editPanel.open({ content: container })
} }
renderToolbox(container) { renderToolbox(row) {
const toggle = L.DomUtil.createButtonIcon( const toggle = L.DomUtil.createButtonIcon(row, 'icon-eye', L._('Show/hide layer'))
container, const edit = L.DomUtil.createButtonIcon(row, 'icon-edit show-on-edit', L._('Edit'))
'icon-eye',
L._('Show/hide layer')
)
const edit = L.DomUtil.createButtonIcon(
container,
'icon-edit show-on-edit',
L._('Edit')
)
const remove = L.DomUtil.createButtonIcon( const remove = L.DomUtil.createButtonIcon(
container, row,
'icon-delete show-on-edit', 'icon-delete show-on-edit',
L._('Delete layer') L._('Delete layer')
) )
@ -110,7 +102,9 @@ class Rule {
}, },
this this
) )
DomUtil.add('span', '', container, this.condition || translate('empty rule')) DomUtil.add('span', '', row, this.condition || translate('empty rule'))
L.DomUtil.createIcon(row, 'icon-drag', L._('Drag to reorder'))
row.dataset.id = stamp(this)
//L.DomEvent.on(toggle, 'click', this.toggle, this) //L.DomEvent.on(toggle, 'click', this.toggle, this)
} }
@ -134,17 +128,38 @@ export default class Rules {
} }
} }
onReorder(src, dst, initialIndex, finalIndex) {
const moved = this.rules.find((rule) => stamp(rule) == src.dataset.id)
const reference = this.rules.find((rule) => stamp(rule) == dst.dataset.id)
const movedIdx = this.rules.indexOf(moved)
let referenceIdx = this.rules.indexOf(reference)
const minIndex = Math.min(movedIdx, referenceIdx)
const maxIndex = Math.max(movedIdx, referenceIdx)
moved._delete() // Remove from array
referenceIdx = this.rules.indexOf(reference)
let newIdx
if (finalIndex === 0) newIdx = 0
else if (finalIndex > initialIndex) newIdx = referenceIdx
else newIdx = referenceIdx + 1
this.rules.splice(newIdx, 0, moved)
moved.isDirty = true
this.map.render(['rules'])
}
edit(container) { edit(container) {
const body = L.DomUtil.createFieldset( const body = L.DomUtil.createFieldset(
container, container,
translate('Conditional style rules') translate('Conditional style rules')
) )
if (this.rules.length) { if (this.rules.length) {
const list = DomUtil.create('ul', '', body) const ul = DomUtil.create('ul', '', body)
for (const rule of this.rules) { for (const rule of this.rules) {
rule.renderToolbox(DomUtil.create('li', '', list)) rule.renderToolbox(DomUtil.create('li', 'orderable', ul))
} }
const orderable = new U.Orderable(ul, this.onReorder.bind(this))
} }
L.DomUtil.createButton('umap-add', body, translate('Add rule'), this.addRule, this) L.DomUtil.createButton('umap-add', body, translate('Add rule'), this.addRule, this)
} }