diff --git a/umap/static/umap/js/modules/caption.js b/umap/static/umap/js/modules/caption.js index 5496688b..d31dec94 100644 --- a/umap/static/umap/js/modules/caption.js +++ b/umap/static/umap/js/modules/caption.js @@ -19,7 +19,12 @@ export default class Caption { open() { const container = DomUtil.create('div', 'umap-caption') const hgroup = DomUtil.element({ tagName: 'hgroup', parent: container }) - DomUtil.createTitle(hgroup, this.map.options.name, 'icon-caption icon-block') + DomUtil.createTitle( + hgroup, + this.map.getDisplayName(), + 'icon-caption icon-block', + 'map-name' + ) this.map.addAuthorLink('h4', hgroup) if (this.map.options.description) { const description = DomUtil.element({ diff --git a/umap/static/umap/js/umap.controls.js b/umap/static/umap/js/umap.controls.js index 0a54e66e..869a7211 100644 --- a/umap/static/umap/js/umap.controls.js +++ b/umap/static/umap/js/umap.controls.js @@ -578,11 +578,15 @@ const ControlsMixin = { ], renderEditToolbar: function () { - const container = L.DomUtil.create( - 'div', - 'umap-main-edit-toolbox with-transition dark', - this._controlContainer - ) + const className = 'umap-main-edit-toolbox' + const container = + document.querySelector(`.${className}`) || + L.DomUtil.create( + 'div', + `${className} with-transition dark`, + this._controlContainer + ) + container.innerHTML = '' const leftContainer = L.DomUtil.create('div', 'umap-left-edit-toolbox', container) const rightContainer = L.DomUtil.create('div', 'umap-right-edit-toolbox', container) const logo = L.DomUtil.create('div', 'logo', leftContainer) @@ -623,23 +627,10 @@ const ControlsMixin = { }, this ) - const update = () => { - const status = this.permissions.getShareStatusDisplay() - nameButton.textContent = this.getDisplayName() - // status is not set until map is saved once - if (status) { - shareStatusButton.textContent = L._('Visibility: {status}', { - status: status, - }) - } - } - update() - this.once('saved', L.bind(update, this)) if (this.options.editMode === 'advanced') { L.DomEvent.on(nameButton, 'click', this.editCaption, this) L.DomEvent.on(shareStatusButton, 'click', this.permissions.edit, this.permissions) } - this.on('postsync', L.bind(update, this)) if (this.options.user?.id) { L.DomUtil.createLink( 'umap-user', diff --git a/umap/static/umap/js/umap.core.js b/umap/static/umap/js/umap.core.js index 9b785f86..48c81524 100644 --- a/umap/static/umap/js/umap.core.js +++ b/umap/static/umap/js/umap.core.js @@ -141,10 +141,10 @@ L.DomUtil.createButtonIcon = (parent, className, title, callback, size = 16) => return el } -L.DomUtil.createTitle = (parent, text, className, tag = 'h3') => { +L.DomUtil.createTitle = (parent, text, iconClassName, className = '', tag = 'h3') => { const title = L.DomUtil.create(tag, '', parent) - if (className) L.DomUtil.createIcon(title, className) - L.DomUtil.add('span', '', title, text) + if (className) L.DomUtil.createIcon(title, iconClassName) + L.DomUtil.add('span', className, title, text) return title } diff --git a/umap/static/umap/js/umap.js b/umap/static/umap/js/umap.js index 516b5489..f196c60c 100644 --- a/umap/static/umap/js/umap.js +++ b/umap/static/umap/js/umap.js @@ -200,6 +200,7 @@ U.Map = L.Map.extend({ this.backup() this.on('click', this.closeInplaceToolbar) this.on('contextmenu', this.onContextMenu) + this.propagate() }, initSyncEngine: async function () { @@ -231,6 +232,7 @@ U.Map = L.Map.extend({ this.renderEditToolbar() this.renderControls() this.browser.redraw() + this.propagate() break case 'data': this.redrawVisibleDataLayers() @@ -1097,6 +1099,7 @@ U.Map = L.Map.extend({ } else { window.location = data.url } + this.propagate() return true }, @@ -1118,6 +1121,22 @@ U.Map = L.Map.extend({ this.fire('saved') }, + propagate: function () { + let els = document.querySelectorAll('.map-name') + for (const el of els) { + el.textContent = this.getDisplayName() + } + const status = this.permissions.getShareStatusDisplay() + els = document.querySelectorAll('.share-status') + for (const el of els) { + if (status) { + el.textContent = L._('Visibility: {status}', { + status: status, + }) + } + } + }, + star: async function () { if (!this.options.umap_id) { return U.Alert.error(L._('Please save the map first'))