diff --git a/umap/static/umap/base.css b/umap/static/umap/base.css index dc504a30..5a05467e 100644 --- a/umap/static/umap/base.css +++ b/umap/static/umap/base.css @@ -529,7 +529,8 @@ i.info { .umap-layer-properties-container, .umap-browse-data, .umap-facet-search, -.umap-browse-datalayers { +.umap-browse-datalayers, +.umap-tilelayer-switcher-container { padding: 0 10px; } .umap-field-datalist { diff --git a/umap/static/umap/img/16-white.svg b/umap/static/umap/img/16-white.svg index 96e30d4f..7a42f5bf 100644 --- a/umap/static/umap/img/16-white.svg +++ b/umap/static/umap/img/16-white.svg @@ -1,4 +1,4 @@ - + @@ -9,6 +9,9 @@ + + + @@ -164,5 +167,24 @@ + + + + + + + + + + + + + + + + + + + diff --git a/umap/static/umap/img/16.svg b/umap/static/umap/img/16.svg index 0c9fccc1..a7f38acd 100644 --- a/umap/static/umap/img/16.svg +++ b/umap/static/umap/img/16.svg @@ -1,4 +1,9 @@ - + + + + + + @@ -39,6 +44,14 @@ + + + + + + + + @@ -138,5 +151,22 @@ + + + + + + + + + + + + + + + + + diff --git a/umap/static/umap/img/source/16-white.svg b/umap/static/umap/img/source/16-white.svg index 1ee9b790..81bf9d91 100644 --- a/umap/static/umap/img/source/16-white.svg +++ b/umap/static/umap/img/source/16-white.svg @@ -1,189 +1,980 @@ - - - - + + + + - - + + - - + + + + + - - - - - - - - - - - - - + + + + + + + + + + + + + + - + - + image/svg+xml - + - -   - - - - + +   + + + + - - - - - - - - - - -   - - + + + + + + + + + + +   + + - - - - - - + + + + + + - - - - - - - + + + + + + + - - - - - - - - + + + + + + + + - - + + - - - + + + - - - - + + + + - - - + + + - - - - + + + + - - + + - - - - + + + + - - + + - - - - + + + + - - + + - - - - + + + + - - + + - - - - - - - - - - - - - - - - - - - - - - - - + + + + + + + + + + + + + + + + + + + + + + + + - - - + + + - - - + + + - - - - + + + + - - - - - + + + + + - - - + + + + + + + + + + + + + + + + + + + + + + + + - - diff --git a/umap/static/umap/img/source/16.svg b/umap/static/umap/img/source/16.svg index 5009bbcc..f63086c6 100644 --- a/umap/static/umap/img/source/16.svg +++ b/umap/static/umap/img/source/16.svg @@ -1,160 +1,856 @@ - - - - - - - - - - - - - - + + + + + + + + + + + + + + + + + + + - + - + image/svg+xml - + - -   - - - - + +   + + + + - - - - + + + + - - - - - - - - - - - + + + + + + + + + + + - - -   - - + + +   + + - - - - - - - + + + + + + + + - - - + + + + + + - - - - - - - - + + + + + + + + + + + + - - - + + + - - - - - - - + + + + + + + - - - + + + - - - - + + + + - - - + + + - - - - - - + + + + + + - - - + + + - - - - - - - - + + + + + + + + - - - + + + - - - + + + - - - - - + + + + + - - - - - - + + + + + + - - - + + + + + + + + + + + + + + + + + + + + + - diff --git a/umap/static/umap/js/umap.controls.js b/umap/static/umap/js/umap.controls.js index ad6cff9f..4cd095cc 100644 --- a/umap/static/umap/js/umap.controls.js +++ b/umap/static/umap/js/umap.controls.js @@ -27,7 +27,7 @@ L.U.EditPropertiesAction = L.U.BaseAction.extend({ options: { helpMenu: true, className: 'update-map-settings dark', - tooltip: L._('Edit map settings'), + tooltip: L._('Edit map properties'), }, addHooks: function () { @@ -403,7 +403,7 @@ L.Control.Embed = L.Control.extend({ const shareButton = L.DomUtil.createButton( '', container, - L._('Embed and share this map'), + L._('Share, download and embed this map'), map.renderShareBox, map ) @@ -615,6 +615,8 @@ L.U.DataLayersControl = L.Control.extend({ openPanel: function () { if (!this.map.editEnabled) return const container = L.DomUtil.create('ul', 'umap-browse-datalayers') + const title = L.DomUtil.create('h3', '', container) + title.textContent = L._('Manage layers') this.map.eachDataLayerReverse(function (datalayer) { this.addDataLayer(container, datalayer, true) }, this) @@ -1076,6 +1078,9 @@ L.U.Map.include({ renderShareBox: function () { const container = L.DomUtil.create('div', 'umap-share') + const title = L.DomUtil.create('h3', '', container) + title.textContent = L._('Share, download and embed this map') + const embedTitle = L.DomUtil.add('h4', '', container, L._('Embed the map')) const iframe = L.DomUtil.create('textarea', 'umap-share-iframe', container) const urlTitle = L.DomUtil.add('h4', '', container, L._('Direct link')) @@ -1171,7 +1176,6 @@ L.U.Map.include({ ) this.ui.openPanel({ data: { html: container } }) }, - }) L.U.TileLayerControl = L.Control.extend({ @@ -1198,11 +1202,15 @@ L.U.TileLayerControl = L.Control.extend({ }, openSwitcher: function (options) { - this._tilelayers_container = L.DomUtil.create( - 'ul', - 'umap-tilelayer-switcher-container' - ) + const container = L.DomUtil.create('div', 'umap-tilelayer-switcher-container') + const title = L.DomUtil.create('h3', '', container) + title.textContent = L._('Change tilelayers') + this._tilelayers_container = L.DomUtil.create('ul', '', container) this.buildList(options) + this.map.ui.openPanel({ + data: { html: container }, + className: options.className, + }) }, buildList: function (options) { @@ -1214,10 +1222,6 @@ L.U.TileLayerControl = L.Control.extend({ return this.addTileLayerElement(tilelayer, options) }, this) - this.map.ui.openPanel({ - data: { html: this._tilelayers_container }, - className: options.className, - }) }, addTileLayerElement: function (tilelayer, options) { @@ -1369,7 +1373,7 @@ L.U.SearchControl = L.Control.extend({ L.DomUtil.createButton( '', container, - L._('Search a place name'), + L._('Search location'), (e) => { L.DomEvent.stop(e) this.openPanel(map) @@ -1385,7 +1389,7 @@ L.U.SearchControl = L.Control.extend({ noResultLabel: L._('No results'), } if (map.options.photonUrl) options.url = map.options.photonUrl - const container = L.DomUtil.create('div', '') + const container = L.DomUtil.create('div', 'umap-search') const title = L.DomUtil.create('h3', '', container) title.textContent = L._('Search location') diff --git a/umap/static/umap/js/umap.core.js b/umap/static/umap/js/umap.core.js index 7b0fbb10..6631f6ad 100644 --- a/umap/static/umap/js/umap.core.js +++ b/umap/static/umap/js/umap.core.js @@ -325,6 +325,7 @@ L.DomUtil.createFieldset = (container, legend, options) => { L.DomUtil.createButton = (className, container, content, callback, context) => { const el = L.DomUtil.add('button', className, container, content) el.type = 'button' + el.title = content if (callback) { L.DomEvent.on(el, 'click', L.DomEvent.stop).on(el, 'click', callback, context) } diff --git a/umap/static/umap/js/umap.datalayer.permissions.js b/umap/static/umap/js/umap.datalayer.permissions.js index 9e3e6211..f77e086f 100644 --- a/umap/static/umap/js/umap.datalayer.permissions.js +++ b/umap/static/umap/js/umap.datalayer.permissions.js @@ -38,7 +38,9 @@ L.U.DataLayerPermissions = L.Class.extend({ }, ], ], - builder = new L.U.FormBuilder(this, fields, {className: 'umap-form datalayer-permissions'}), + builder = new L.U.FormBuilder(this, fields, { + className: 'umap-form datalayer-permissions', + }), form = builder.build() container.appendChild(form) }, diff --git a/umap/static/umap/js/umap.importer.js b/umap/static/umap/js/umap.importer.js index 9cd96c76..83b37699 100644 --- a/umap/static/umap/js/umap.importer.js +++ b/umap/static/umap/js/umap.importer.js @@ -7,7 +7,7 @@ L.U.Importer = L.Class.extend({ build: function () { this.container = L.DomUtil.create('div', 'umap-upload') - this.title = L.DomUtil.add('h4', '', this.container, L._('Import data')) + this.title = L.DomUtil.add('h3', '', this.container, L._('Import data')) this.presetBox = L.DomUtil.create('div', 'formbox', this.container) this.presetSelect = L.DomUtil.create('select', '', this.presetBox) this.fileBox = L.DomUtil.create('div', 'formbox', this.container) diff --git a/umap/static/umap/js/umap.permissions.js b/umap/static/umap/js/umap.permissions.js index 1687e142..8945e18e 100644 --- a/umap/static/umap/js/umap.permissions.js +++ b/umap/static/umap/js/umap.permissions.js @@ -59,7 +59,7 @@ L.U.MapPermissions = L.Class.extend({ }) const container = L.DomUtil.create('div', 'permissions-panel'), fields = [], - title = L.DomUtil.create('h4', '', container) + title = L.DomUtil.create('h3', '', container) if (this.isAnonymousMap()) { if (this.options.anonymous_edit_url) { const helpText = `${L._('Secret edit link:')}
${ @@ -124,7 +124,7 @@ L.U.MapPermissions = L.Class.extend({ this ) } - L.DomUtil.add('h3', '', container, L._('Datalayers')) + L.DomUtil.add('h4', '', container, L._('Datalayers')) this.map.eachDataLayer((datalayer) => { datalayer.permissions.edit(container) }) diff --git a/umap/static/umap/map.css b/umap/static/umap/map.css index 87f8b8e0..1cdf7412 100644 --- a/umap/static/umap/map.css +++ b/umap/static/umap/map.css @@ -250,9 +250,15 @@ ul.photon-autocomplete { .manage-datalayers { background-position: -36px -72px; } +.permissions-panel h3:before, +.umap-browse-datalayers h3:before, .umap-edit-container h3:before, .umap-feature-properties:before, -.umap-layer-properties-container h3:before { +.umap-layer-properties-container h3:before, +.umap-search h3:before, +.umap-share h3:before, +.umap-tilelayer-switcher-container h3:before, +.umap-upload h3:before { height: 24px; width: 24px; background-repeat: no-repeat; @@ -266,6 +272,28 @@ ul.photon-autocomplete { .umap-edit-container h3:before { background-position: -27px -93px; } +.permissions-panel h3:before { + background-position: -144px -117px; +} +.umap-upload h3:before { + background-position: -144px -93px; +} +.umap-search h3:before { + background-image: url('./img/16.svg'); + background-position: -27px -117px; +} +.umap-share h3:before { + background-image: url('./img/16.svg'); + background-position: -4px -119px; +} +.dark .umap-tilelayer-switcher-container h3:before { + background-image: url('./img/16-white.svg'); + background-position: -98px -141px; +} +.umap-tilelayer-switcher-container h3:before { + background-image: url('./img/16.svg'); + background-position: -98px -141px; +} .umap-feature-properties.marker:before { background-position: -72px -117px; } @@ -1098,9 +1126,6 @@ a.add-datalayer:hover, /* Tilelayer switcher */ /* ********************************* */ -.umap-tilelayer-switcher-container { - margin-top: 10px; -} .umap-tilelayer-switcher-container li { border: 1px solid rgb(116, 116, 116); border-radius: 4px 4px 4px 4px; diff --git a/umap/tests/integration/test_anonymous_owned_map.py b/umap/tests/integration/test_anonymous_owned_map.py index 69869696..19090454 100644 --- a/umap/tests/integration/test_anonymous_owned_map.py +++ b/umap/tests/integration/test_anonymous_owned_map.py @@ -33,7 +33,7 @@ def test_map_load_with_owner(anonymap, live_server, owner_session): expect(save).to_be_visible() add_marker = owner_session.get_by_title("Draw a marker") expect(add_marker).to_be_visible() - edit_settings = owner_session.get_by_title("Edit map settings") + edit_settings = owner_session.get_by_title("Edit map properties") expect(edit_settings).to_be_visible() edit_permissions = owner_session.get_by_title("Update permissions and editors") expect(edit_permissions).to_be_visible() @@ -64,7 +64,7 @@ def test_map_load_with_anonymous_but_editable_layer( expect(save).to_be_visible() add_marker = page.get_by_title("Draw a marker") expect(add_marker).to_be_visible() - edit_settings = page.get_by_title("Edit map settings") + edit_settings = page.get_by_title("Edit map properties") expect(edit_settings).to_be_hidden() edit_permissions = page.get_by_title("Update permissions and editors") expect(edit_permissions).to_be_hidden() diff --git a/umap/tests/integration/test_owned_map.py b/umap/tests/integration/test_owned_map.py index 64b40af6..3f10204b 100644 --- a/umap/tests/integration/test_owned_map.py +++ b/umap/tests/integration/test_owned_map.py @@ -40,7 +40,7 @@ def test_map_update_with_owner(map, live_server, login): expect(save).to_be_visible() add_marker = page.get_by_title("Draw a marker") expect(add_marker).to_be_visible() - edit_settings = page.get_by_title("Edit map settings") + edit_settings = page.get_by_title("Edit map properties") expect(edit_settings).to_be_visible() edit_permissions = page.get_by_title("Update permissions and editors") expect(edit_permissions).to_be_visible() @@ -67,7 +67,7 @@ def test_map_update_with_anonymous_but_editable_datalayer( enable.click() add_marker = page.get_by_title("Draw a marker") expect(add_marker).to_be_visible() - edit_settings = page.get_by_title("Edit map settings") + edit_settings = page.get_by_title("Edit map properties") expect(edit_settings).to_be_hidden() edit_permissions = page.get_by_title("Update permissions and editors") expect(edit_permissions).to_be_hidden() @@ -115,7 +115,7 @@ def test_map_update_with_editor(map, live_server, login, user): expect(save).to_be_visible() add_marker = page.get_by_title("Draw a marker") expect(add_marker).to_be_visible() - edit_settings = page.get_by_title("Edit map settings") + edit_settings = page.get_by_title("Edit map properties") expect(edit_settings).to_be_visible() edit_permissions = page.get_by_title("Update permissions and editors") expect(edit_permissions).to_be_visible() @@ -144,7 +144,7 @@ def test_permissions_form_with_editor(map, datalayer, live_server, login, user): def test_owner_has_delete_map_button(map, live_server, login): page = login(map.owner) page.goto(f"{live_server.url}{map.get_absolute_url()}?edit") - settings = page.get_by_title("Edit map settings") + settings = page.get_by_title("Edit map properties") expect(settings).to_be_visible() settings.click() advanced = page.get_by_text("Advanced actions") @@ -160,7 +160,7 @@ def test_editor_do_not_have_delete_map_button(map, live_server, login, user): map.save() page = login(user) page.goto(f"{live_server.url}{map.get_absolute_url()}?edit") - settings = page.get_by_title("Edit map settings") + settings = page.get_by_title("Edit map properties") expect(settings).to_be_visible() settings.click() advanced = page.get_by_text("Advanced actions") diff --git a/umap/tests/integration/test_picto.py b/umap/tests/integration/test_picto.py index 61c92a65..049e379d 100644 --- a/umap/tests/integration/test_picto.py +++ b/umap/tests/integration/test_picto.py @@ -46,7 +46,7 @@ def test_can_change_picto_at_map_level(map, live_server, page, pictos): expect(marker).to_have_count(1) # Should have default img expect(marker).to_have_attribute("src", "/static/umap/img/marker.png") - edit_settings = page.get_by_title("Edit map settings") + edit_settings = page.get_by_title("Edit map properties") expect(edit_settings).to_be_visible() edit_settings.click() shape_settings = page.get_by_text("Default shape properties") @@ -146,7 +146,7 @@ def test_can_use_remote_url_as_picto(map, live_server, page, pictos): expect(marker).to_have_count(1) # Should have default img expect(marker).to_have_attribute("src", "/static/umap/img/marker.png") - edit_settings = page.get_by_title("Edit map settings") + edit_settings = page.get_by_title("Edit map properties") expect(edit_settings).to_be_visible() edit_settings.click() shape_settings = page.get_by_text("Default shape properties") @@ -165,7 +165,7 @@ def test_can_use_remote_url_as_picto(map, live_server, page, pictos): input_el.blur() expect(marker).to_have_attribute("src", "https://foo.bar/img.jpg") # Now close and reopen the form, it should still be the URL tab - close = page.locator("#umap-ui-container").get_by_title("Close") + close = page.locator("#umap-ui-container .toolbox").get_by_title("Close") expect(close).to_be_visible() close.click() edit_settings.click() @@ -186,7 +186,7 @@ def test_can_use_char_as_picto(map, live_server, page, pictos): marker = page.locator(".umap-div-icon span") # Should have default img, so not a span expect(marker).to_have_count(0) - edit_settings = page.get_by_title("Edit map settings") + edit_settings = page.get_by_title("Edit map properties") expect(edit_settings).to_be_visible() edit_settings.click() shape_settings = page.get_by_text("Default shape properties") @@ -205,7 +205,7 @@ def test_can_use_char_as_picto(map, live_server, page, pictos): expect(marker).to_have_count(1) expect(marker).to_have_text("♩") # Now close and reopen the form, it should still be the URL tab - close = page.locator("#umap-ui-container").get_by_title("Close") + close = page.locator("#umap-ui-container .toolbox").get_by_title("Close") expect(close).to_be_visible() close.click() edit_settings.click()