From 2a2f38e3cd506af48a1e460556fc3eea04decc44 Mon Sep 17 00:00:00 2001 From: Yohan Boniface Date: Wed, 13 Mar 2024 11:42:51 +0100 Subject: [PATCH] chore: change edit button order --- umap/static/umap/base.css | 7 ++- umap/static/umap/img/24-white.svg | 4 +- umap/static/umap/img/source/24-white.svg | 6 +-- umap/static/umap/js/umap.controls.js | 44 +++++++++++++------ umap/static/umap/js/umap.js | 13 +++--- umap/static/umap/map.css | 24 +++++----- .../integration/test_anonymous_owned_map.py | 4 +- umap/tests/integration/test_owned_map.py | 10 ++--- umap/tests/integration/test_picto.py | 6 +-- 9 files changed, 72 insertions(+), 46 deletions(-) diff --git a/umap/static/umap/base.css b/umap/static/umap/base.css index 5c64232d..8283cb54 100644 --- a/umap/static/umap/base.css +++ b/umap/static/umap/base.css @@ -274,11 +274,13 @@ input[type="file"] + .error { margin-top: 0; } .fieldset { - border: 1px solid #222; margin-bottom: 5px; border-top-left-radius: 4px; border-top-right-radius: 4px; } +.dark .fieldset { + border: 1px solid #222; +} .fieldset .fields { visibility: hidden; opacity: 0; @@ -296,7 +298,7 @@ input[type="file"] + .error { text-align: left; display: block; cursor: pointer; - background-color: #eee; + background-color: var(--color-lightGray); height: 30px; line-height: 30px; margin: 0; @@ -976,6 +978,7 @@ input:invalid { bottom: initial; width: 390px; border-radius: 5px; + border: 1px solid var(--color-lightGray); } } @media all and (orientation:portrait) { diff --git a/umap/static/umap/img/24-white.svg b/umap/static/umap/img/24-white.svg index ac571991..b1792024 100644 --- a/umap/static/umap/img/24-white.svg +++ b/umap/static/umap/img/24-white.svg @@ -57,8 +57,8 @@ - - + + diff --git a/umap/static/umap/img/source/24-white.svg b/umap/static/umap/img/source/24-white.svg index 149eb62e..80d9b3e6 100644 --- a/umap/static/umap/img/source/24-white.svg +++ b/umap/static/umap/img/source/24-white.svg @@ -2,7 +2,7 @@ - + @@ -78,8 +78,8 @@ - - + + diff --git a/umap/static/umap/js/umap.controls.js b/umap/static/umap/js/umap.controls.js index c2d5d905..5eafc43c 100644 --- a/umap/static/umap/js/umap.controls.js +++ b/umap/static/umap/js/umap.controls.js @@ -29,11 +29,23 @@ U.ImportAction = U.BaseAction.extend({ }, }) +U.EditCaptionAction = U.BaseAction.extend({ + options: { + helpMenu: true, + className: 'umap-control-caption dark', + tooltip: L._('Edit map name and caption'), + }, + + addHooks: function () { + this.map.editCaption() + }, +}) + U.EditPropertiesAction = U.BaseAction.extend({ options: { helpMenu: true, className: 'update-map-settings dark', - tooltip: L._('Edit map properties'), + tooltip: L._('Map advanced properties'), }, addHooks: function () { @@ -268,12 +280,8 @@ U.ContinueLineAction = U.BaseVertexAction.extend({ }) // Leaflet.Toolbar doesn't allow twice same toolbar class… -U.SettingsToolbar = L.Toolbar.Control.extend({ - addTo: function (map) { - if (map.options.editMode !== 'advanced') return - L.Toolbar.Control.prototype.addTo.call(this, map) - }, -}) +U.ImportToolbar = L.Toolbar.Control.extend({}) +U.SettingsToolbar = L.Toolbar.Control.extend({}) U.DrawToolbar = L.Toolbar.Control.extend({ initialize: function (options) { L.Toolbar.Control.prototype.initialize.call(this, options) @@ -512,13 +520,12 @@ U.DataLayersControl = L.Control.Button.extend({ U.CaptionControl = L.Control.Button.extend({ options: { position: 'topright', - className: 'umap-control-caption', + className: 'umap-control-caption hide-on-edit', title: L._('About'), }, onClick: function () { - if (this.map.editEnabled) this.map.editCaption() - else this.map.displayCaption() + this.map.displayCaption() }, }) @@ -532,14 +539,25 @@ U.DataLayer.include({ renderToolbox: function (container) { L.DomUtil.element( 'i', - { className: 'umap-icon-16 drag-handle show-on-edit', title: L._('Drag to reorder') }, + { + className: 'umap-icon-16 drag-handle show-on-edit', + title: L._('Drag to reorder'), + }, container ) const toggle = L.DomUtil.create('i', 'umap-icon-16 layer-toggle', container), zoomTo = L.DomUtil.create('i', 'umap-icon-16 layer-zoom_to', container), edit = L.DomUtil.create('i', 'umap-icon-16 layer-edit show-on-edit', container), - table = L.DomUtil.create('i', 'umap-icon-16 layer-table-edit show-on-edit', container), - remove = L.DomUtil.create('i', 'umap-icon-16 layer-delete show-on-edit', container) + table = L.DomUtil.create( + 'i', + 'umap-icon-16 layer-table-edit show-on-edit', + container + ), + remove = L.DomUtil.create( + 'i', + 'umap-icon-16 layer-delete show-on-edit', + container + ) zoomTo.title = L._('Zoom to layer extent') toggle.title = L._('Show/hide layer') edit.title = L._('Edit') diff --git a/umap/static/umap/js/umap.js b/umap/static/umap/js/umap.js index 16691541..b1738135 100644 --- a/umap/static/umap/js/umap.js +++ b/umap/static/umap/js/umap.js @@ -329,16 +329,19 @@ U.Map = L.Map.extend({ if (this.hasEditMode() && !this.options.noControl) { new U.EditControl(this).addTo(this) - new U.DrawToolbar({ map: this }).addTo(this) - const editActions = [ - U.ImportAction, + U.EditCaptionAction, U.EditPropertiesAction, U.ChangeTileLayerAction, U.UpdateExtentAction, U.UpdatePermsAction, ] - new U.SettingsToolbar({ actions: editActions }).addTo(this) + if (this.options.editMode === 'advanced') { + new U.SettingsToolbar({ actions: editActions }).addTo(this) + new U.ImportToolbar({ actions: [U.ImportAction] }).addTo(this) + } + + new U.DrawToolbar({ map: this }).addTo(this) } this._controls.zoom = new L.Control.Zoom({ zoomInTitle: L._('Zoom in'), @@ -1537,7 +1540,7 @@ U.Map = L.Map.extend({ if (this.options.editMode !== 'advanced') return const container = L.DomUtil.create('div', 'umap-edit-container') const title = L.DomUtil.create('h3', '', container) - title.textContent = L._('Edit map properties') + title.textContent = L._('Map advanced properties') this._editControls(container) this._editShapeProperties(container) this._editDefaultProperties(container) diff --git a/umap/static/umap/map.css b/umap/static/umap/map.css index 648b684c..672392ce 100644 --- a/umap/static/umap/map.css +++ b/umap/static/umap/map.css @@ -287,8 +287,8 @@ ul.photon-autocomplete { .leaflet-control-toolbar > li > .leaflet-toolbar-icon, .umap-toolbar a, .umap-toolbar a:hover { - height: 40px; - width: 40px; + height: 36px; + width: 36px; display: none; margin-top: 0; vertical-align: top; @@ -922,21 +922,20 @@ ul.photon-autocomplete { .umap-edit-enabled .show-on-edit.block { display: block!important; } +.umap-edit-enabled .hide-on-edit { + display: none!important; +} /* ********************************* */ /* Browser panel */ /* ********************************* */ -.umap-control-caption [type="button"], .umap-control-browse [type="button"] { - background-image: url('./img/24.svg'); - width: 40px; - height: 40px; - background-position: -34px -70px; - background-size: 180px; + background-position: -36px -72px; } +a.umap-control-caption, .umap-control-caption [type="button"] { - background-position: -70px -70px; + background-position: -72px -72px; } .umap-edit-enabled .umap-control-caption [type="button"], .umap-edit-enabled .umap-control-browse [type="button"] { @@ -981,7 +980,7 @@ i.drag-handle { border: 1px solid #d3d3d3; } .umap-browser.dark .datalayer ul { - border: 1px solid #2c3233; + border: 1px solid #232729; } .umap-browser h5, .umap-facet-search h5 { margin-bottom: 0; @@ -993,7 +992,7 @@ i.drag-handle { color: #666; } .umap-browser.dark h5 { - background-color: #2c3233; + background-color: #232729; color: white; } .umap-browser h5 span { @@ -1025,6 +1024,9 @@ i.drag-handle { text-align: center; margin-left: 5px; } +.umap-browser.dark .datalayer i.feature-color { + box-shadow: 0 0 2px 0 #999 inset; +} .umap-browser .datalayer .feature-color img { width: 24px; } diff --git a/umap/tests/integration/test_anonymous_owned_map.py b/umap/tests/integration/test_anonymous_owned_map.py index 119547eb..70b90972 100644 --- a/umap/tests/integration/test_anonymous_owned_map.py +++ b/umap/tests/integration/test_anonymous_owned_map.py @@ -34,7 +34,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 properties") + edit_settings = owner_session.get_by_title("Map advanced properties") expect(edit_settings).to_be_visible() edit_permissions = owner_session.get_by_title("Update permissions and editors") expect(edit_permissions).to_be_visible() @@ -65,7 +65,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 properties") + edit_settings = page.get_by_title("Map advanced 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 31ea9087..e30b3ba6 100644 --- a/umap/tests/integration/test_owned_map.py +++ b/umap/tests/integration/test_owned_map.py @@ -22,7 +22,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 properties") + edit_settings = page.get_by_title("Map advanced properties") expect(edit_settings).to_be_visible() edit_permissions = page.get_by_title("Update permissions and editors") expect(edit_permissions).to_be_visible() @@ -49,7 +49,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 properties") + edit_settings = page.get_by_title("Map advanced properties") expect(edit_settings).to_be_hidden() edit_permissions = page.get_by_title("Update permissions and editors") expect(edit_permissions).to_be_hidden() @@ -97,7 +97,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 properties") + edit_settings = page.get_by_title("Map advanced properties") expect(edit_settings).to_be_visible() edit_permissions = page.get_by_title("Update permissions and editors") expect(edit_permissions).to_be_visible() @@ -126,7 +126,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 properties") + settings = page.get_by_title("Map advanced properties") expect(settings).to_be_visible() settings.click() advanced = page.get_by_text("Advanced actions") @@ -154,7 +154,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 properties") + settings = page.get_by_title("Map advanced 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 192f28e4..808a9d04 100644 --- a/umap/tests/integration/test_picto.py +++ b/umap/tests/integration/test_picto.py @@ -44,7 +44,7 @@ def test_can_change_picto_at_map_level(openmap, live_server, page, pictos): expect(marker).to_have_count(1) # Should have default img expect(marker).to_have_attribute("src", "/static/umap/img/marker.svg") - edit_settings = page.get_by_title("Edit map properties") + edit_settings = page.get_by_title("Map advanced properties") expect(edit_settings).to_be_visible() edit_settings.click() shape_settings = page.get_by_text("Default shape properties") @@ -152,7 +152,7 @@ def test_can_use_remote_url_as_picto(openmap, live_server, page, pictos): expect(marker).to_have_count(1) # Should have default img expect(marker).to_have_attribute("src", "/static/umap/img/marker.svg") - edit_settings = page.get_by_title("Edit map properties") + edit_settings = page.get_by_title("Map advanced properties") expect(edit_settings).to_be_visible() edit_settings.click() shape_settings = page.get_by_text("Default shape properties") @@ -191,7 +191,7 @@ def test_can_use_char_as_picto(openmap, 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 properties") + edit_settings = page.get_by_title("Map advanced properties") expect(edit_settings).to_be_visible() edit_settings.click() shape_settings = page.get_by_text("Default shape properties")