diff --git a/data/core.yaml b/data/core.yaml
index f6c371b9e2..d3d409ace1 100644
--- a/data/core.yaml
+++ b/data/core.yaml
@@ -570,9 +570,6 @@ en:
report_a_bug: Report a bug
help_translate: Help translate
example: "Example:"
- sidebar:
- key: '`'
- tooltip: Toggle the sidebar.
feature_info:
hidden_warning:
one: "{count} hidden feature"
@@ -679,6 +676,8 @@ en:
locating: "Locating, please wait..."
location_unavailable: Your location is unavailable.
inspector:
+ key: '`'
+ tooltip: Toggle the feature inspector.
zoom_to:
key: Z
title: Zoom To Selection
@@ -1585,7 +1584,7 @@ en:
editing:
title: "Editing & Saving"
select_h: "Select"
- select_left_click: "{mouse_left_icon} Left-click or {onefinger_tap_icon} tap a feature to select it. This will highlight it with a pulsing glow and display further details about it in the sidebar."
+ select_left_click: "{mouse_left_icon} Left-click or {onefinger_tap_icon} tap a feature to select it. This will highlight it with a pulsing glow and display further details about it in the feature inspector."
select_right_click: "{mouse_right_icon} Right-click or {onefinger_tap_and_hold_icon} long-press a feature to display the edit menu, which provides operations such as copy, rotate, and delete."
select_space: "The `{space}` key can also be used instead of left-click when selecting and drawing."
multiselect_h: "Multiselect"
@@ -1754,7 +1753,7 @@ en:
tools_h: "Tools"
tools: "The following tools are currently supported: [KeepRight](https://www.keepright.at/) and [Osmose](https://osmose.openstreetmap.fr/)."
issues_h: "Handling Issues"
- issues: "Handling Q/A issues is similar to handling notes. Select a marker to view the issue details in the sidebar. Each tool has its own capabilities, but generally you can comment and/or close an issue."
+ issues: "Handling Q/A issues is similar to handling notes. Select a marker to view the issue details in the feature inspector. Each tool has its own capabilities, but generally you can comment and/or close an issue."
field:
restrictions:
title: Turn Restrictions Help
@@ -2541,7 +2540,7 @@ en:
issues: "Toggle validation issues pane"
preferences: "Toggle user preferences pane"
fullscreen: "Toggle full screen mode"
- sidebar: "Toggle sidebar"
+ inspector: "Toggle feature inspector"
wireframe: "Toggle wireframe mode"
osm_data: "Toggle OpenStreetMap data"
rapid_features_data: "Toggle Rapid Features"
diff --git a/data/l10n/core.en.json b/data/l10n/core.en.json
index d4d7205309..ae9b7abb4b 100644
--- a/data/l10n/core.en.json
+++ b/data/l10n/core.en.json
@@ -755,10 +755,6 @@
"report_a_bug": "Report a bug",
"help_translate": "Help translate",
"example": "Example:",
- "sidebar": {
- "key": "`",
- "tooltip": "Toggle the sidebar."
- },
"feature_info": {
"hidden_warning": {
"one": "{count} hidden feature",
@@ -881,6 +877,8 @@
"location_unavailable": "Your location is unavailable."
},
"inspector": {
+ "key": "`",
+ "tooltip": "Toggle the feature inspector.",
"zoom_to": {
"key": "Z",
"title": "Zoom To Selection",
@@ -2002,7 +2000,7 @@
"editing": {
"title": "Editing & Saving",
"select_h": "Select",
- "select_left_click": "{mouse_left_icon} Left-click or {onefinger_tap_icon} tap a feature to select it. This will highlight it with a pulsing glow and display further details about it in the sidebar.",
+ "select_left_click": "{mouse_left_icon} Left-click or {onefinger_tap_icon} tap a feature to select it. This will highlight it with a pulsing glow and display further details about it in the feature inspector.",
"select_right_click": "{mouse_right_icon} Right-click or {onefinger_tap_and_hold_icon} long-press a feature to display the edit menu, which provides operations such as copy, rotate, and delete.",
"select_space": "The `{space}` key can also be used instead of left-click when selecting and drawing.",
"multiselect_h": "Multiselect",
@@ -2182,7 +2180,7 @@
"tools_h": "Tools",
"tools": "The following tools are currently supported: [KeepRight](https://www.keepright.at/) and [Osmose](https://osmose.openstreetmap.fr/).",
"issues_h": "Handling Issues",
- "issues": "Handling Q/A issues is similar to handling notes. Select a marker to view the issue details in the sidebar. Each tool has its own capabilities, but generally you can comment and/or close an issue."
+ "issues": "Handling Q/A issues is similar to handling notes. Select a marker to view the issue details in the feature inspector. Each tool has its own capabilities, but generally you can comment and/or close an issue."
},
"field": {
"restrictions": {
@@ -3139,7 +3137,7 @@
"issues": "Toggle validation issues pane",
"preferences": "Toggle user preferences pane",
"fullscreen": "Toggle full screen mode",
- "sidebar": "Toggle sidebar",
+ "inspector": "Toggle feature inspector",
"wireframe": "Toggle wireframe mode",
"osm_data": "Toggle OpenStreetMap data",
"rapid_features_data": "Toggle Rapid Features",
diff --git a/data/shortcuts.json b/data/shortcuts.json
index 651320cb9d..2c1558679f 100644
--- a/data/shortcuts.json
+++ b/data/shortcuts.json
@@ -91,8 +91,8 @@
"text": "shortcuts.browsing.display_options.fullscreen"
},
{
- "shortcuts": ["sidebar.key", "`", "²"],
- "text": "shortcuts.browsing.display_options.sidebar"
+ "shortcuts": ["inspector.key", "`", "²"],
+ "text": "shortcuts.browsing.display_options.inspector"
},
{
"shortcuts": ["area_fill.wireframe.key"],
diff --git a/modules/ui/UiSidebar.js b/modules/ui/UiSidebar.js
index 5eb48fc647..3007f3ba4d 100644
--- a/modules/ui/UiSidebar.js
+++ b/modules/ui/UiSidebar.js
@@ -12,6 +12,7 @@ import { uiMapRouletteEditor } from './maproulette_editor.js';
import { uiOsmoseEditor } from './osmose_editor.js';
import { uiNoteEditor } from './note_editor.js';
import { uiRapidFeatureInspector } from './rapid_feature_inspector.js';
+import { uiTooltip } from './tooltip.js';
const NEAR_TOLERANCE = 4;
@@ -51,10 +52,12 @@ export class UiSidebar {
this.KeepRightEditor = uiKeepRightEditor(context);
this.OsmoseEditor = uiOsmoseEditor(context);
this.MapRouletteEditor = uiMapRouletteEditor(context);
+ this.Tooltip = uiTooltip(context);
// D3 selections
this.$parent = null;
this.$sidebar = null;
+ this.$resizer = null;
this.$custom = null;
this.$featureList = null;
this.$inspector = null;
@@ -104,8 +107,8 @@ export class UiSidebar {
const storage = context.systems.storage;
const dir = l10n.textDirection();
- const preferCollapsed = (storage.getItem('sidebar.collapsed') === 'true');
- const storedWidth = +(storage.getItem('sidebar.width') || DEFAULT_WIDTH);
+ const preferCollapsed = (storage.getItem('inspector.collapsed') === 'true');
+ const storedWidth = +(storage.getItem('inspector.width') || DEFAULT_WIDTH);
this._expandWidth = Math.max(MIN_WIDTH, storedWidth);
// add .sidebar
@@ -139,7 +142,12 @@ export class UiSidebar {
.append('div')
.attr('class', 'resizer-handle');
- $resizer = $resizer.merge($$resizer);
+ this.$resizer = $resizer = $resizer.merge($$resizer)
+ .call(this.Tooltip
+ .placement(dir === 'rtl' ? 'right' : 'left') // place on the sidebar side (i.e. don't cover the map)
+ .title(l10n.t('inspector.tooltip'))
+ .shortcut(l10n.t('inspector.key'))
+ );
// add sidebar contents: feature list pane and inspector
@@ -155,7 +163,7 @@ export class UiSidebar {
this.$inspector = $sidebar.select('.inspector-wrap');
// figure out a better way to rebind this if locale changes
- const keys = [l10n.t('sidebar.key'), '`', '²', '@']; // iD#5663, iD#6864 - common QWERTY, AZERTY
+ const keys = [l10n.t('inspector.key'), '`', '²', '@']; // iD#5663, iD#6864 - common QWERTY, AZERTY
context.keybinding().off(keys);
context.keybinding().on(keys, this.toggle);
}
@@ -445,7 +453,7 @@ export class UiSidebar {
$sidebar
.transition()
- .tween('sidebar.toggler', () => {
+ .tween('inspector.toggler', () => {
return t => {
const setWidth = lerp(t);
@@ -489,8 +497,8 @@ export class UiSidebar {
if ('button' in e && e.button !== 0) return;
- const $sidebar = this.$sidebar;
const $container = this.context.container();
+ const $sidebar = this.$sidebar;
const expandWidth = this._expandWidth || DEFAULT_WIDTH;
const startCollapsed = $sidebar.classed('collapsed');
@@ -502,6 +510,7 @@ export class UiSidebar {
this._lastCoord = [e.clientX, e.clientY];
this._lastWidth = startWidth;
+ this.Tooltip.hide();
$container.classed('resizing', true);
$sidebar
@@ -618,7 +627,7 @@ export class UiSidebar {
const preferWidth = this._expandWidth;
const storage = this.context.systems.storage;
- storage.setItem('sidebar.collapsed', preferCollapsed);
- storage.setItem('sidebar.width', preferWidth);
+ storage.setItem('inspector.collapsed', preferCollapsed);
+ storage.setItem('inspector.width', preferWidth);
}
}
diff --git a/modules/ui/tools/index.js b/modules/ui/tools/index.js
index 6e774a57ca..77bce3ff0f 100644
--- a/modules/ui/tools/index.js
+++ b/modules/ui/tools/index.js
@@ -3,5 +3,4 @@ export * from './modes.js';
export * from './notes.js';
export * from './rapid_features.js';
export * from './save.js';
-export * from './sidebar_toggle.js';
export * from './undo_redo.js';
diff --git a/modules/ui/tools/sidebar_toggle.js b/modules/ui/tools/sidebar_toggle.js
deleted file mode 100644
index 369b9082a3..0000000000
--- a/modules/ui/tools/sidebar_toggle.js
+++ /dev/null
@@ -1,29 +0,0 @@
-import { uiIcon } from '../icon.js';
-import { uiTooltip } from '../tooltip.js';
-
-
-export function uiToolSidebarToggle(context) {
- const l10n = context.systems.l10n;
- const ui = context.systems.ui;
-
- let tool = {
- id: 'sidebar_toggle',
- label: l10n.t('toolbar.inspect')
- };
-
- tool.install = function(selection) {
- selection
- .append('button')
- .attr('class', 'bar-button')
- .on('click', () => ui.sidebar.toggle())
- .call(uiTooltip(context)
- .placement('bottom')
- .title(l10n.t('sidebar.tooltip'))
- .shortcut(l10n.t('sidebar.key'))
- .scrollContainer(context.container().select('.top-toolbar'))
- )
- .call(uiIcon('#rapid-icon-sidebar-' + (l10n.isRTL() ? 'right' : 'left')));
- };
-
- return tool;
-}
diff --git a/modules/ui/top_toolbar.js b/modules/ui/top_toolbar.js
index 9f016fcb32..06d12721e3 100644
--- a/modules/ui/top_toolbar.js
+++ b/modules/ui/top_toolbar.js
@@ -1,13 +1,12 @@
import { select as d3_select } from 'd3-selection';
import {
- uiToolRapidFeatures, uiToolDrawModes, uiToolNotes, uiToolSave,
- uiToolSidebarToggle, uiToolUndoRedo, uiToolDownloadOsc
+ uiToolRapidFeatures, uiToolDrawModes, uiToolNotes,
+ uiToolSave, uiToolUndoRedo, uiToolDownloadOsc
} from './tools/index.js';
export function uiTopToolbar(context) {
- const sidebarToggle = uiToolSidebarToggle(context);
const rapidFeatures = uiToolRapidFeatures(context);
const modes = uiToolDrawModes(context);
const notes = uiToolNotes(context);
@@ -22,7 +21,7 @@ export function uiTopToolbar(context) {
function update(selection) {
- let tools = [sidebarToggle, 'spacer', modes, rapidFeatures];
+ const tools = ['spacer', modes, rapidFeatures];
if (notesEnabled()) {
tools.push('spacer', notes);
diff --git a/svg/rapid-sprite/icons/icon-sidebar-left.svg b/svg/rapid-sprite/icons/icon-sidebar-left.svg
deleted file mode 100644
index 3ca4a282d4..0000000000
--- a/svg/rapid-sprite/icons/icon-sidebar-left.svg
+++ /dev/null
@@ -1,7 +0,0 @@
-
-
diff --git a/svg/rapid-sprite/icons/icon-sidebar-right.svg b/svg/rapid-sprite/icons/icon-sidebar-right.svg
deleted file mode 100644
index 9261cafdbc..0000000000
--- a/svg/rapid-sprite/icons/icon-sidebar-right.svg
+++ /dev/null
@@ -1,7 +0,0 @@
-
-