diff --git a/modules/behaviors/KeyOperationBehavior.js b/modules/behaviors/KeyOperationBehavior.js index 58e03bf65..20acf651b 100644 --- a/modules/behaviors/KeyOperationBehavior.js +++ b/modules/behaviors/KeyOperationBehavior.js @@ -64,6 +64,7 @@ export class KeyOperationBehavior extends AbstractBehavior { _keydown(e) { const context = this.context; const operation = this._operation; + const ui = context.systems.ui; if (operation.availableForKeypress && !operation.availableForKeypress()) return; // copy paste detail 😕 @@ -72,14 +73,14 @@ export class KeyOperationBehavior extends AbstractBehavior { const disabled = operation.disabled(); if (disabled) { - context.systems.ui.flash + ui.Flash .duration(4000) .iconName(`#rapid-operation-${operation.id}`) .iconClass('operation disabled') .label(operation.tooltip)(); } else { - context.systems.ui.flash + ui.Flash .duration(2000) .iconName(`#rapid-operation-${operation.id}`) .iconClass('operation') diff --git a/modules/core/UiSystem.js b/modules/core/UiSystem.js index 8bd532b72..162c4cdcb 100644 --- a/modules/core/UiSystem.js +++ b/modules/core/UiSystem.js @@ -4,8 +4,8 @@ import { vecAdd } from '@rapid-sdk/math'; import { AbstractSystem } from './AbstractSystem.js'; import { - UiApiStatus, UiDefs, uiEditMenu, uiFlash, UiFullscreen, uiInfo, uiIntro, - uiLoading, UiMapInMap, UiMapFooter, UiMapToolbar, UiOvermap, UiPhotoViewer, + UiApiStatus, UiDefs, uiEditMenu, uiFlash, UiFullscreen, uiIntro, + uiLoading, UiMapFooter, UiMapToolbar, UiOvermap, UiPhotoViewer, uiSplash, uiRestore, UiShortcuts, UiSidebar, uiWhatsNew } from '../ui/index.js'; @@ -35,20 +35,24 @@ export class UiSystem extends AbstractSystem { this._resizeTimeout = null; // Child components, we will defer creating these until after some other things have initted. - this.apiStatus = null; - this.authModal = null; - this.defs = null; - this.editMenu = null; - this.flash = null; - this.fullscreen = null; - this.info = null; - this.mapFooter = null; - this.mapInMap = null; - this.mapToolbar = null; - this.overmap = null; - this.photoviewer = null; - this.shortcuts = null; - this.sidebar = null; + this.ApiStatus = null; + this.AuthModal = null; + this.Defs = null; + this.EditMenu = null; + this.Flash = null; + this.Fullscreen = null; + this.MapFooter = null; + this.MapToolbar = null; + this.Overmap = null; + this.Shortcuts = null; + this.Sidebar = null; + + // These components live below in the tree, but we will hold a reference + // to them here in the UiSystem, so other code can find them easily. + this.Info = null; + this.Minimap = null; + this.PhotoViewer = null; + this.Spector = null; // Ensure methods used as callbacks always have `this` bound correctly. // (This is also necessary when using `d3-selection.call`) @@ -85,26 +89,30 @@ export class UiSystem extends AbstractSystem { .then(() => { window.addEventListener('resize', this.resize); - this.apiStatus = new UiApiStatus(context); - this.authModal = uiLoading(context).blocking(true).message(l10n.t('loading_auth')); - this.defs = new UiDefs(context); - this.editMenu = uiEditMenu(context); - this.flash = uiFlash(context); - this.fullscreen = new UiFullscreen(context); - this.info = uiInfo(context); - this.mapFooter = new UiMapFooter(context); - this.mapInMap = new UiMapInMap(context); - this.mapToolbar = new UiMapToolbar(context); - this.overmap = new UiOvermap(context); - this.photoviewer = new UiPhotoViewer(context); - this.shortcuts = new UiShortcuts(context); - this.sidebar = new UiSidebar(context); + this.ApiStatus = new UiApiStatus(context); + this.AuthModal = uiLoading(context).blocking(true).message(l10n.t('loading_auth')); + this.Defs = new UiDefs(context); + this.EditMenu = uiEditMenu(context); + this.Flash = uiFlash(context); + this.Fullscreen = new UiFullscreen(context); + this.MapFooter = new UiMapFooter(context); + this.MapToolbar = new UiMapToolbar(context); + this.Overmap = new UiOvermap(context); + this.Shortcuts = new UiShortcuts(context); + this.Sidebar = new UiSidebar(context); + + // These components live below in the tree, but we will hold a reference + // to them here in the UiSystem, so that other code can find them easily. + this.Info = this.Overmap.Info; + this.Minimap = this.Overmap.Minimap; + this.PhotoViewer = this.Overmap.PhotoViewer; + this.Spector = this.Overmap.Spector; const osm = context.services.osm; if (osm) { osm - .on('authLoading', () => context.container()?.call(this.authModal)) - .on('authDone', () => this.authModal.close()); + .on('authLoading', () => context.container()?.call(this.AuthModal)) + .on('authDone', () => this.AuthModal.close()); } }); @@ -193,10 +201,10 @@ export class UiSystem extends AbstractSystem { $container .attr('lang', l10n.localeCode()) .attr('dir', l10n.textDirection()) - .call(this.fullscreen.render) - .call(this.defs.render) - .call(this.sidebar.render) - .call(this.shortcuts.render); + .call(this.Fullscreen.render) + .call(this.Defs.render) + .call(this.Sidebar.render) + .call(this.Shortcuts.render); // .main-content // Contains the map and everything floating above it, such as toolbars, etc. @@ -222,17 +230,15 @@ export class UiSystem extends AbstractSystem { $mainContent = $mainContent.merge($$mainContent); $mainContent - .call(this.mapToolbar.render) - .call(this.overmap.render) - .call(this.apiStatus.render) - .call(this.mapFooter.render); - + .call(this.MapToolbar.render) + .call(this.Overmap.render) + .call(this.ApiStatus.render) + .call(this.MapFooter.render); // Setup map dimensions // This should happen after .main-content and toolbars exist. this.resize(); - // On first render only, enter browse mode and show a startup screen. if (this._firstRender) { context.enter('browse'); @@ -444,7 +450,7 @@ dims = vecAdd(dims, [overscan * 2, overscan * 2]); * @param {string} triggerType - (not used?) 'touch', 'pen', or 'rightclick' that triggered the menu */ showEditMenu(anchorPoint, triggerType) { - this.editMenu.close(); // remove any displayed menu + this.EditMenu.close(); // remove any displayed menu const context = this.context; const gfx = context.systems.gfx; @@ -468,14 +474,14 @@ dims = vecAdd(dims, [overscan * 2, overscan * 2]); } } - this.editMenu + this.EditMenu .anchorLoc(viewport.unproject(anchorPoint)) .triggerType(triggerType) .operations(operations); // render the menu const $overlay = select(gfx.overlay); - $overlay.call(this.editMenu); + $overlay.call(this.EditMenu); } @@ -496,10 +502,10 @@ dims = vecAdd(dims, [overscan * 2, overscan * 2]); const operations = context.mode?.operations ?? []; if (operations.length && context.editable()) { - this.editMenu.operations(operations); - $overlay.call(this.editMenu); // redraw it + this.EditMenu.operations(operations); + $overlay.call(this.EditMenu); // redraw it } else { - this.editMenu.close(); + this.EditMenu.close(); } } @@ -509,7 +515,7 @@ dims = vecAdd(dims, [overscan * 2, overscan * 2]); * Remove any existing menu */ closeEditMenu() { - this.editMenu.close(); + this.EditMenu.close(); } @@ -526,7 +532,9 @@ dims = vecAdd(dims, [overscan * 2, overscan * 2]); right: src.right, bottom: src.bottom, width: src.width, - height: src.height + height: src.height, + x: src.x, + y: src.y }; } diff --git a/modules/modes/BrowseMode.js b/modules/modes/BrowseMode.js index ead7042e1..cfcad5452 100644 --- a/modules/modes/BrowseMode.js +++ b/modules/modes/BrowseMode.js @@ -44,8 +44,8 @@ export class BrowseMode extends AbstractMode { .on('hoverchange', this._hover); // Reset sidebar to show "search features" - const sidebar = context.systems.ui.sidebar; - sidebar.hide(); + const Sidebar = context.systems.ui.Sidebar; + Sidebar.hide(); // Get focus on the body. // I think this was done to remove focus from whatever diff --git a/modules/modes/DragNodeMode.js b/modules/modes/DragNodeMode.js index fb81887d5..909cd40ce 100644 --- a/modules/modes/DragNodeMode.js +++ b/modules/modes/DragNodeMode.js @@ -88,7 +88,7 @@ export class DragNodeMode extends AbstractMode { // Bail out if the node is connected to something hidden. const hasHidden = filters.hasHiddenConnections(entity, graph); if (hasHidden) { - ui.flash + ui.Flash .duration(4000) .iconName('#rapid-icon-no') .label(l10n.t('modes.drag_node.connected_to_hidden'))(); diff --git a/modules/modes/SaveMode.js b/modules/modes/SaveMode.js index 995e8ed2a..9ed6ea972 100644 --- a/modules/modes/SaveMode.js +++ b/modules/modes/SaveMode.js @@ -57,8 +57,8 @@ export class SaveMode extends AbstractMode { enter() { const context = this.context; const osm = context.services.osm; - const sidebar = context.systems.ui.sidebar; const uploader = context.systems.uploader; + const Sidebar = context.systems.ui.Sidebar; if (!osm) return false; // can't enter save mode @@ -67,7 +67,7 @@ export class SaveMode extends AbstractMode { } // Show sidebar - sidebar.expand(); + Sidebar.expand(); this._active = true; this._wasSuccessfulSave = false; @@ -76,13 +76,13 @@ export class SaveMode extends AbstractMode { .on('cancel', this._cancel); if (osm.authenticated()) { - sidebar.show(this._uiCommit); + Sidebar.show(this._uiCommit); } else { osm.authenticate(err => { if (err) { this._cancel(); } else { - sidebar.show(this._uiCommit); + Sidebar.show(this._uiCommit); } }); } @@ -120,8 +120,8 @@ export class SaveMode extends AbstractMode { } const context = this.context; - const sidebar = context.systems.ui.sidebar; const uploader = context.systems.uploader; + const Sidebar = context.systems.ui.Sidebar; this._uiCommit.on('cancel', null); this._uiCommit = null; @@ -145,7 +145,7 @@ export class SaveMode extends AbstractMode { // After a successful save, we want to leave the "thanks" content in the sidebar if (!this._wasSuccessfulSave) { - sidebar.hide(); + Sidebar.hide(); } } @@ -308,15 +308,15 @@ export class SaveMode extends AbstractMode { */ _resultSuccess(changeset) { const context = this.context; - const sidebar = context.systems.ui.sidebar; + const Sidebar = context.systems.ui.Sidebar; const successContent = this._uiSuccess .changeset(changeset) .location(this._location) - .on('cancel', () => sidebar.hide()); + .on('cancel', () => Sidebar.hide()); this._wasSuccessfulSave = true; - sidebar.show(successContent); + Sidebar.show(successContent); // Add delay before resetting to allow for postgres replication iD#1646 iD#2678 window.setTimeout(() => { diff --git a/modules/modes/SelectMode.js b/modules/modes/SelectMode.js index fcad51080..03a0e829d 100644 --- a/modules/modes/SelectMode.js +++ b/modules/modes/SelectMode.js @@ -61,7 +61,7 @@ export class SelectMode extends AbstractMode { const gfx = context.systems.gfx; const photos = context.systems.photos; const scene = gfx.scene; - const sidebar = context.systems.ui.sidebar; + const Sidebar = context.systems.ui.Sidebar; context.enableBehaviors(['hover', 'select', 'drag', 'mapInteraction', 'lasso', 'paste']); @@ -130,7 +130,7 @@ export class SelectMode extends AbstractMode { const osm = context.services.osm; const note = osm?.getNote(datumID); if (!(note instanceof QAItem)) return; // or - go to browse mode - sidebar.show(sidebarContent.note(note)); + Sidebar.show(sidebarContent.note(note)); this._selectedData.set(datumID, note); // update selectedData after a change happens? }); @@ -142,7 +142,7 @@ export class SelectMode extends AbstractMode { const keepright = context.services.keepRight; const error = keepright?.getError(datumID); if (!(error instanceof QAItem)) return; // or - go to browse mode? - sidebar.show(sidebarContent.error(error)); + Sidebar.show(sidebarContent.error(error)); this._selectedData.set(datumID, error); // update selectedData after a change happens? }); @@ -154,7 +154,7 @@ export class SelectMode extends AbstractMode { const osmose = context.services.osmose; const error = osmose?.getError(datumID); if (!(error instanceof QAItem)) return; // or - go to browse mode? - sidebar.show(sidebarContent.error(error)); + Sidebar.show(sidebarContent.error(error)); this._selectedData.set(datumID, error); // update selectedData after a change happens? }); @@ -166,7 +166,7 @@ export class SelectMode extends AbstractMode { const maproulette = context.services.maproulette; const error = maproulette?.getError(datumID); if (!(error instanceof QAItem)) return; // or - go to browse mode? - sidebar.show(sidebarContent.error(error)); + Sidebar.show(sidebarContent.error(error)); this._selectedData.set(datumID, error); // update selectedData after a change happens? }); @@ -194,10 +194,10 @@ export class SelectMode extends AbstractMode { // setup the sidebar if (sidebarContent) { - sidebar.show(sidebarContent); //.newNote(_newFeature)); + Sidebar.show(sidebarContent); //.newNote(_newFeature)); // Attempt to expand the sidebar, avoid obscuring the selected thing if we can.. // For this to work the datum must have an extent already - // sidebar.expand(sidebar.intersects(datum.extent())); + // Sidebar.expand(Sidebar.intersects(datum.extent())); } return true; @@ -214,7 +214,7 @@ export class SelectMode extends AbstractMode { const context = this.context; const photos = context.systems.photos; const scene = context.systems.gfx.scene; - const sidebar = context.systems.ui.sidebar; + const Sidebar = context.systems.ui.Sidebar; this.extent = null; @@ -230,7 +230,7 @@ export class SelectMode extends AbstractMode { this._selectedData.clear(); scene.clearClass('select'); - sidebar.hide(); + Sidebar.hide(); photos.selectDetection(null); } diff --git a/modules/modes/SelectOsmMode.js b/modules/modes/SelectOsmMode.js index 2dc47d710..a9ab90c92 100644 --- a/modules/modes/SelectOsmMode.js +++ b/modules/modes/SelectOsmMode.js @@ -134,7 +134,7 @@ export class SelectOsmMode extends AbstractMode { editor.on('merge', this._merge); hover.on('hoverchange', this._hover); - ui.sidebar.showInspector(entityIDs, this._newFeature); + ui.Sidebar.showInspector(entityIDs, this._newFeature); return true; } @@ -192,7 +192,7 @@ export class SelectOsmMode extends AbstractMode { scene.clearClass('select'); ui.closeEditMenu(); - ui.sidebar.hide(); + ui.Sidebar.hide(); urlhash.setParam('id', null); filters.forceVisible([]); @@ -315,7 +315,7 @@ export class SelectOsmMode extends AbstractMode { if (!operation.available()) return; if (operation.disabled()) { - ui.flash + ui.Flash .duration(4000) .iconName(`#rapid-operation-${operation.id}`) .iconClass('operation disabled') diff --git a/modules/services/KartaviewService.js b/modules/services/KartaviewService.js index d6d328b3c..dd97cfd2d 100644 --- a/modules/services/KartaviewService.js +++ b/modules/services/KartaviewService.js @@ -128,7 +128,7 @@ export class KartaviewService extends AbstractSystem { // Register viewer resize handler - ui.photoviewer.on('resize', dimensions => { + ui.PhotoViewer.on('resize', dimensions => { this._imgZoom = d3_zoom() .extent([[0, 0], dimensions]) .translateExtent([[0, 0], dimensions]) diff --git a/modules/services/MapillaryService.js b/modules/services/MapillaryService.js index ecff53884..23ec39d58 100644 --- a/modules/services/MapillaryService.js +++ b/modules/services/MapillaryService.js @@ -1135,7 +1135,7 @@ export class MapillaryService extends AbstractSystem { } // Register viewer resize handler - ui.photoviewer.on('resize', () => { + ui.PhotoViewer.on('resize', () => { if (this._viewer) this._viewer.resize(); }); } diff --git a/modules/services/StreetsideService.js b/modules/services/StreetsideService.js index 63d3a59d9..5a7a196ea 100644 --- a/modules/services/StreetsideService.js +++ b/modules/services/StreetsideService.js @@ -160,7 +160,7 @@ export class StreetsideService extends AbstractSystem { .call(this._setupCanvas); // Register viewer resize handler - ui.photoviewer.on('resize', () => { + ui.PhotoViewer.on('resize', () => { if (this._viewer) this._viewer.resize(); }); diff --git a/modules/ui/UiMapInMap.js b/modules/ui/UiMinimap.js similarity index 99% rename from modules/ui/UiMapInMap.js rename to modules/ui/UiMinimap.js index 7d98c590f..a050d0dfc 100644 --- a/modules/ui/UiMapInMap.js +++ b/modules/ui/UiMinimap.js @@ -12,9 +12,9 @@ const MAX_K = geoZoomToScale(MAX_Z); /** - * UiMapInMap + * UiMinimap */ -export class UiMapInMap { +export class UiMinimap { /** * @constructor diff --git a/modules/ui/UiOvermap.js b/modules/ui/UiOvermap.js index 96df9758b..15dae11e6 100644 --- a/modules/ui/UiOvermap.js +++ b/modules/ui/UiOvermap.js @@ -1,8 +1,11 @@ import { selection, select } from 'd3-selection'; import { uiAttribution } from './attribution.js'; +import { uiInfo } from './info.js'; import { uiMap3dViewer } from './map3d_viewer.js'; import { UiMapControls } from './UiMapControls.js'; +import { UiMinimap } from './UiMinimap.js'; +import { UiPhotoViewer } from './UiPhotoViewer.js'; import { UiSpector } from './UiSpector.js'; import { uiPaneBackground, uiPaneHelp, uiPaneIssues, uiPaneMapData, uiPanePreferences } from './panes/index.js'; @@ -30,8 +33,11 @@ export class UiOvermap { // Create child components this.Attribution = uiAttribution(context); + this.Info = uiInfo(context); this.Map3dViewer = uiMap3dViewer(context); this.MapControls = new UiMapControls(context); + this.Minimap = new UiMinimap(context); + this.PhotoViewer = new UiPhotoViewer(context); this.Spector = new UiSpector(context); // D3 selections @@ -78,7 +84,7 @@ export class UiOvermap { .text('t'); $$overmap - .call(ui.mapInMap.render) + .call(this.Minimap.render) .call(this.Map3dViewer) .call(this.Spector.render) .call(this.MapControls.render); @@ -118,10 +124,10 @@ export class UiOvermap { // Info Panels $$overmap - .call(ui.info); + .call(this.Info); $$overmap - .call(ui.photoviewer.render); + .call(this.PhotoViewer.render); $$overmap .append('div') diff --git a/modules/ui/UiShortcuts.js b/modules/ui/UiShortcuts.js index d33bc2233..51efbcef2 100644 --- a/modules/ui/UiShortcuts.js +++ b/modules/ui/UiShortcuts.js @@ -317,14 +317,15 @@ export class UiShortcuts { this.hide(); } - this.Modal = uiModal(this.$parent); - assets.loadAssetAsync('shortcuts') .then(data => { this._dataShortcuts = data.shortcuts; + this.Modal = uiModal(this.$parent); this.render(); }) - .catch(e => console.error(e)); // eslint-disable-line + .catch(e => { + console.error(e); // eslint-disable-line + }); } diff --git a/modules/ui/edit_menu.js b/modules/ui/edit_menu.js index f44306b98..427bec946 100644 --- a/modules/ui/edit_menu.js +++ b/modules/ui/edit_menu.js @@ -175,7 +175,7 @@ export function uiEditMenu(context) { if (operation.disabled()) { if (_lastPointerUpType === 'touch' || _lastPointerUpType === 'pen') { // there are no tooltips for touch interactions so flash feedback instead - ui.flash + ui.Flash .duration(4000) .iconName(`#rapid-operation-${operation.id}`) .iconClass('operation disabled') @@ -183,7 +183,7 @@ export function uiEditMenu(context) { } } else { if (_lastPointerUpType === 'touch' || _lastPointerUpType === 'pen') { - ui.flash + ui.Flash .duration(2000) .iconName(`#rapid-operation-${operation.id}`) .iconClass('operation') diff --git a/modules/ui/geolocate.js b/modules/ui/geolocate.js index 7e2a02054..e518980bd 100644 --- a/modules/ui/geolocate.js +++ b/modules/ui/geolocate.js @@ -77,7 +77,7 @@ export function uiGeolocate(context) { function error() { if (_enabled) { // user may have disabled it before the callback fires - ui.flash + ui.Flash .label(l10n.tHtml('geolocate.location_unavailable')) .iconName('#rapid-icon-geolocate')(); } diff --git a/modules/ui/index.js b/modules/ui/index.js index e01de1739..25dd744e6 100644 --- a/modules/ui/index.js +++ b/modules/ui/index.js @@ -39,7 +39,7 @@ export { uiLoading } from './loading.js'; export { uiMap3dViewer } from './map3d_viewer.js'; export { UiMapControls } from './UiMapControls.js'; export { UiMapFooter } from './UiMapFooter.js'; -export { UiMapInMap } from './UiMapInMap.js'; +export { UiMinimap } from './UiMinimap.js'; export { uiMapRouletteDetails } from './maproulette_details.js'; export { uiMapRouletteEditor } from './maproulette_editor.js'; export { UiMapToolbar } from './UiMapToolbar.js'; diff --git a/modules/ui/intro/area.js b/modules/ui/intro/area.js index a4c7932bd..fd6a44f9b 100644 --- a/modules/ui/intro/area.js +++ b/modules/ui/intro/area.js @@ -195,7 +195,7 @@ export function uiIntroArea(context, curtain) { } }; - ui.sidebar.showPresetList(); + ui.Sidebar.showPresetList(); container.select('.inspector-wrap').on('wheel.intro', eventCancel); // prevent scrolling curtain.reveal({ @@ -259,7 +259,7 @@ export function uiIntroArea(context, curtain) { _onModeChange = reject; // disallow mode change; - ui.sidebar.showEntityEditor(); + ui.Sidebar.showEntityEditor(); container.select('.inspector-wrap').on('wheel.intro', eventCancel); // prevent scrolling // scroll "Add field" into view @@ -346,7 +346,7 @@ export function uiIntroArea(context, curtain) { } }, 300); - ui.sidebar.showEntityEditor(); + ui.Sidebar.showEntityEditor(); curtain.reveal({ revealSelector: 'div.combobox', @@ -376,7 +376,7 @@ export function uiIntroArea(context, curtain) { _rejectStep = reject; _onModeChange = () => resolve(playAsync); - ui.sidebar.showEntityEditor(); + ui.Sidebar.showEntityEditor(); curtain.reveal({ revealSelector: '.entity-editor-pane', @@ -398,7 +398,7 @@ export function uiIntroArea(context, curtain) { return new Promise((resolve, reject) => { _rejectStep = reject; _onModeChange = reject; // disallow mode change; - ui.sidebar.showEntityEditor(); + ui.Sidebar.showEntityEditor(); curtain.reveal({ revealSelector: '.entity-editor-pane', diff --git a/modules/ui/intro/building.js b/modules/ui/intro/building.js index 2f4260a8c..abcf824c2 100644 --- a/modules/ui/intro/building.js +++ b/modules/ui/intro/building.js @@ -16,7 +16,7 @@ export function uiIntroBuilding(context, curtain) { const map = context.systems.map; const presets = context.systems.presets; const ui = context.systems.ui; - const editMenu = ui.editMenu; + const EditMenu = ui.EditMenu; const houseExtent = new Extent([-85.62836, 41.95622], [-85.62791, 41.95654]); const tankExtent = new Extent([-85.62766, 41.95324], [-85.62695, 41.95372]); @@ -211,7 +211,7 @@ export function uiIntroBuilding(context, curtain) { _onModeChange = reject; // disallow mode change - ui.sidebar.showPresetList(); + ui.Sidebar.showPresetList(); container.select('.inspector-wrap').on('wheel.intro', eventCancel); // prevent scrolling const button = container.select('.preset-category_building .preset-list-button'); @@ -256,7 +256,7 @@ export function uiIntroBuilding(context, curtain) { } }; - // ui.sidebar.showPresetList(); // calling this again causes issue + // ui.Sidebar.showPresetList(); // calling this again causes issue container.select('.inspector-wrap').on('wheel.intro', eventCancel); // prevent scrolling const button = container.select('.preset-building_house .preset-list-button'); @@ -320,13 +320,13 @@ export function uiIntroBuilding(context, curtain) { tipHtml: helpHtml(context, `intro.buildings.${textID}`) }); - editMenu.on('toggled.intro', open => { + EditMenu.on('toggled.intro', open => { if (open) resolve(clickSquareAsync); }); })) .finally(() => { _onStableChange = null; - editMenu.on('toggled.intro', null); + EditMenu.on('toggled.intro', null); }); } @@ -536,7 +536,7 @@ export function uiIntroBuilding(context, curtain) { container.select('.inspector-wrap').on('wheel.intro', eventCancel); // prevent scrolling - ui.sidebar.showPresetList(); + ui.Sidebar.showPresetList(); curtain.reveal({ revealSelector: '.preset-search-input', @@ -610,13 +610,13 @@ export function uiIntroBuilding(context, curtain) { tipHtml: helpHtml(context, `intro.buildings.${textID}`) }); - editMenu.on('toggled.intro', open => { + EditMenu.on('toggled.intro', open => { if (open) resolve(clickCircleAsync); }); }) .finally(() => { _onStableChange = null; - editMenu.on('toggled.intro', null); + EditMenu.on('toggled.intro', null); }); } diff --git a/modules/ui/intro/intro.js b/modules/ui/intro/intro.js index aa12e1e93..13fbf8ab2 100644 --- a/modules/ui/intro/intro.js +++ b/modules/ui/intro/intro.js @@ -151,7 +151,7 @@ export function uiIntro(context, skipToRapid) { _original.overlayLayers.forEach(d => imagery.toggleOverlayLayer(d)); imagery.brightness = 1; - ui.sidebar.expand(false); // false = no animation + ui.Sidebar.expand(false); // false = no animation _curtain = new UiCurtain(context); selection.call(_curtain.enable); diff --git a/modules/ui/intro/line.js b/modules/ui/intro/line.js index 19183fa25..3bfbb2976 100644 --- a/modules/ui/intro/line.js +++ b/modules/ui/intro/line.js @@ -15,7 +15,7 @@ export function uiIntroLine(context, curtain) { const map = context.systems.map; const presets = context.systems.presets; const ui = context.systems.ui; - const editMenu = ui.editMenu; + const EditMenu = ui.EditMenu; const flowerStreetID = 'w646'; const tulipRoadStartExtent = new Extent([-85.63016, 41.95749], [-85.62937, 41.95843]); @@ -268,7 +268,7 @@ export function uiIntroLine(context, curtain) { _onModeChange = reject; // disallow mode change - // ui.sidebar.showPresetList(); // calling this again causes issue + // ui.Sidebar.showPresetList(); // calling this again causes issue container.select('.inspector-wrap').on('wheel.intro', eventCancel); // prevent scrolling categoryButton = container.select('.preset-category_road_minor .preset-list-button'); @@ -306,7 +306,7 @@ export function uiIntroLine(context, curtain) { if (!_doesLineExist()) { resolve(addLineAsync); return; } if (!_isLineSelected()) context.enter('select-osm', { selection: { osm: [_lineID] }} ); - // ui.sidebar.showPresetList(); // calling this again causes issue + // ui.Sidebar.showPresetList(); // calling this again causes issue container.select('.inspector-wrap').on('wheel.intro', eventCancel); // prevent scrolling const categoryButton = container.select('.preset-category_road_minor .preset-list-button'); @@ -363,7 +363,7 @@ export function uiIntroLine(context, curtain) { if (!_doesLineExist()) { resolve(addLineAsync); return; } if (!_isLineSelected()) context.enter('select-osm', { selection: { osm: [_lineID] }} ); - ui.sidebar.showPresetList(); + ui.Sidebar.showPresetList(); container.select('.inspector-wrap').on('wheel.intro', eventCancel); // prevent scrolling const categoryButton = container.select('.preset-category_road_minor .preset-list-button'); @@ -420,7 +420,7 @@ export function uiIntroLine(context, curtain) { _onModeChange = () => resolve(didNameRoadAsync); - ui.sidebar.showEntityEditor(); + ui.Sidebar.showEntityEditor(); curtain.reveal({ revealSelector: '.entity-editor-pane', @@ -701,13 +701,13 @@ export function uiIntroLine(context, curtain) { tipHtml: rightClickString }); - editMenu.on('toggled.intro', open => { + EditMenu.on('toggled.intro', open => { if (open) resolve(splitIntersectionAsync); }); }) .finally(() => { _onStagingChange = null; - editMenu.on('toggled.intro', null); + EditMenu.on('toggled.intro', null); }); } @@ -895,14 +895,14 @@ export function uiIntroLine(context, curtain) { tipHtml: rightClickString }); - editMenu.on('toggled.intro', open => { + EditMenu.on('toggled.intro', open => { if (open) resolve(multiDeleteAsync); }); }) .finally(() => { _onModeChange = null; _onStagingChange = null; - editMenu.on('toggled.intro', null); + EditMenu.on('toggled.intro', null); }); } diff --git a/modules/ui/intro/navigation.js b/modules/ui/intro/navigation.js index 55485e524..fb81e1188 100644 --- a/modules/ui/intro/navigation.js +++ b/modules/ui/intro/navigation.js @@ -376,7 +376,7 @@ export function uiIntroNavigation(context, curtain) { _rejectStep = reject; _onModeChange = reject; // disallow mode change - ui.sidebar.showEntityEditor(); + ui.Sidebar.showEntityEditor(); container.select('.inspector-wrap').on('wheel.intro', eventCancel); // prevent scrolling curtain.reveal({ @@ -402,7 +402,7 @@ export function uiIntroNavigation(context, curtain) { _rejectStep = reject; _onModeChange = reject; // disallow mode change - ui.sidebar.showEntityEditor(); + ui.Sidebar.showEntityEditor(); container.select('.inspector-wrap').on('wheel.intro', eventCancel); // prevent scrolling // preset match, in case the user happened to change it. @@ -434,7 +434,7 @@ export function uiIntroNavigation(context, curtain) { _rejectStep = reject; _onModeChange = reject; // disallow mode change - ui.sidebar.showEntityEditor(); + ui.Sidebar.showEntityEditor(); container.select('.inspector-wrap').on('wheel.intro', eventCancel); // prevent scrolling curtain.reveal({ @@ -460,7 +460,7 @@ export function uiIntroNavigation(context, curtain) { _rejectStep = reject; _onModeChange = () => resolve(searchStreetAsync); - ui.sidebar.showEntityEditor(); + ui.Sidebar.showEntityEditor(); const iconSelector = '.entity-editor-pane button.close svg use'; const iconName = d3_select(iconSelector).attr('href') || '#rapid-icon-close'; @@ -580,7 +580,7 @@ export function uiIntroNavigation(context, curtain) { _rejectStep = reject; _onModeChange = () => resolve(playAsync); - ui.sidebar.showEntityEditor(); + ui.Sidebar.showEntityEditor(); const iconSelector = '.entity-editor-pane button.close svg use'; const iconName = d3_select(iconSelector).attr('href') || '#rapid-icon-close'; const tipHtml = helpHtml(context, 'intro.navigation.street_different_fields') + '{br}' + diff --git a/modules/ui/intro/point.js b/modules/ui/intro/point.js index 86495553c..4aac77628 100644 --- a/modules/ui/intro/point.js +++ b/modules/ui/intro/point.js @@ -16,7 +16,7 @@ export function uiIntroPoint(context, curtain) { const map = context.systems.map; const presets = context.systems.presets; const ui = context.systems.ui; - const editMenu = ui.editMenu; + const EditMenu = ui.EditMenu; const buildingExtent = new Extent([-85.63261, 41.94391], [-85.63222, 41.94419]); const cafePreset = presets.item('amenity/cafe'); @@ -142,7 +142,7 @@ export function uiIntroPoint(context, curtain) { container.select('.inspector-wrap').on('wheel.intro', eventCancel); // prevent scrolling - ui.sidebar.showPresetList(); + ui.Sidebar.showPresetList(); curtain.reveal({ revealSelector: '.preset-search-input', @@ -191,7 +191,7 @@ export function uiIntroPoint(context, curtain) { // If user leaves select mode here, just continue with the tutorial. _onModeChange = () => resolve(addNameAsync); - ui.sidebar.showEntityEditor(); + ui.Sidebar.showEntityEditor(); curtain.reveal({ revealSelector: '.entity-editor-pane', @@ -220,7 +220,7 @@ export function uiIntroPoint(context, curtain) { _onModeChange = () => resolve(hasPointAsync); _onStagingChange = () => resolve(addCloseEditorAsync); - ui.sidebar.showEntityEditor(); + ui.Sidebar.showEntityEditor(); // It's possible for the user to add a name in a previous step.. // If so, don't tell them to add the name in this step. @@ -262,7 +262,7 @@ export function uiIntroPoint(context, curtain) { _rejectStep = reject; _onModeChange = () => resolve(hasPointAsync); - ui.sidebar.showEntityEditor(); + ui.Sidebar.showEntityEditor(); const iconSelector = '.entity-editor-pane button.close svg use'; const iconName = d3_select(iconSelector).attr('href') || '#rapid-icon-close'; @@ -337,7 +337,7 @@ export function uiIntroPoint(context, curtain) { _onModeChange = reject; // disallow mode change _onStagingChange = () => resolve(updateCloseEditorAsync); - ui.sidebar.showEntityEditor(); + ui.Sidebar.showEntityEditor(); curtain.reveal({ revealSelector: '.entity-editor-pane', @@ -361,7 +361,7 @@ export function uiIntroPoint(context, curtain) { _rejectStep = reject; _onModeChange = () => resolve(rightClickPointAsync); - ui.sidebar.showEntityEditor(); + ui.Sidebar.showEntityEditor(); curtain.reveal({ revealSelector: '.entity-editor-pane', @@ -390,13 +390,13 @@ export function uiIntroPoint(context, curtain) { tipHtml: helpHtml(context, `intro.points.${textID}`) }); - editMenu.on('toggled.intro', open => { + EditMenu.on('toggled.intro', open => { if (open) resolve(enterDeleteAsync); }); }) .finally(() => { _onStagingChange = null; - editMenu.on('toggled.intro', null); + EditMenu.on('toggled.intro', null); }); } diff --git a/modules/ui/panes/help.js b/modules/ui/panes/help.js index 5521a04bf..25f8310c7 100644 --- a/modules/ui/panes/help.js +++ b/modules/ui/panes/help.js @@ -454,7 +454,7 @@ export function uiPaneHelp(context) { function clickShortcuts(d3_event) { d3_event.preventDefault(); - ui.shortcuts.show(); + ui.Shortcuts.show(); } diff --git a/modules/ui/sections/background_list.js b/modules/ui/sections/background_list.js index 35111cc0d..d7ff8c52f 100644 --- a/modules/ui/sections/background_list.js +++ b/modules/ui/sections/background_list.js @@ -107,7 +107,7 @@ export function uiSectionBackgroundList(context) { .attr('type', 'checkbox') .on('change', d3_event => { d3_event.preventDefault(); - ui.mapInMap.toggle(); + ui.Minimap.toggle(); }); minimapLabelEnter @@ -155,7 +155,7 @@ export function uiSectionBackgroundList(context) { .attr('type', 'checkbox') .on('change', d3_event => { d3_event.preventDefault(); - ui.info.toggle('background'); + ui.Info.toggle('background'); }); panelLabelEnter @@ -177,7 +177,7 @@ export function uiSectionBackgroundList(context) { .attr('type', 'checkbox') .on('change', d3_event => { d3_event.preventDefault(); - ui.info.toggle('location'); + ui.Info.toggle('location'); }); locPanelLabelEnter diff --git a/modules/ui/sections/data_layers.js b/modules/ui/sections/data_layers.js index 6b9c884ae..8c872bd15 100644 --- a/modules/ui/sections/data_layers.js +++ b/modules/ui/sections/data_layers.js @@ -361,7 +361,7 @@ export function uiSectionDataLayers(context) { .attr('type', 'checkbox') .on('change', d3_event => { d3_event.preventDefault(); - ui.info.toggle('history'); + ui.Info.toggle('history'); }); historyPanelLabelEnter @@ -383,7 +383,7 @@ export function uiSectionDataLayers(context) { .attr('type', 'checkbox') .on('change', d3_event => { d3_event.preventDefault(); - ui.info.toggle('measurement'); + ui.Info.toggle('measurement'); }); measurementPanelLabelEnter diff --git a/modules/ui/tools/UiToolSave.js b/modules/ui/tools/UiToolSave.js index 0ea2bf045..7b5226b1c 100644 --- a/modules/ui/tools/UiToolSave.js +++ b/modules/ui/tools/UiToolSave.js @@ -135,7 +135,7 @@ export class UiToolSave { // // consider: there are no tooltips for touch interactions so flash feedback instead // if (isDisabled) { - // context.systems.ui.flash + // context.systems.ui.Flash // .duration(2000) // .iconName('#rapid-icon-save') // .iconClass('disabled') diff --git a/modules/ui/zoom.js b/modules/ui/zoom.js index 5ff70576f..431141bf6 100644 --- a/modules/ui/zoom.js +++ b/modules/ui/zoom.js @@ -67,7 +67,7 @@ export function uiZoom(context) { if (!d.isDisabled()) { d.action(d3_event); } else if (_lastPointerUpType === 'touch' || _lastPointerUpType === 'pen') { - ui.flash + ui.Flash .duration(2000) .iconName(`#${d.icon}`) .iconClass('disabled') diff --git a/modules/ui/zoom_to_selection.js b/modules/ui/zoom_to_selection.js index 9c2f7f5da..c055a99d1 100644 --- a/modules/ui/zoom_to_selection.js +++ b/modules/ui/zoom_to_selection.js @@ -55,7 +55,7 @@ export function uiZoomToSelection(context) { } else { // tool disabled if (_lastPointerUpType === 'touch' || _lastPointerUpType === 'pen') { - ui.flash + ui.Flash .duration(2000) .iconName('#rapid-icon-framed-dot') .iconClass('disabled') diff --git a/modules/validations/missing_tag.js b/modules/validations/missing_tag.js index 8e6f5760b..0ce3d640a 100644 --- a/modules/validations/missing_tag.js +++ b/modules/validations/missing_tag.js @@ -8,6 +8,7 @@ export function validationMissingTag(context) { const type = 'missing_tag'; const editor = context.systems.editor; const l10n = context.systems.l10n; + const ui = context.systems.ui; function hasDescriptiveTags(entity, graph) { @@ -94,7 +95,7 @@ export function validationMissingTag(context) { icon: 'rapid-icon-search', title: l10n.t(`issues.fix.${selectFixType}.title`), onClick: function() { - context.systems.ui.sidebar.showPresetList(); + ui.Sidebar.showPresetList(); } }));