CalvinBackup/iD
1
0
Fork 0
mirror of https://github.com/FoggedLens/iD.git synced 2026-05-14 21:28:11 +02:00
Code Issues Packages Projects Releases Wiki Activity

update butotn logic

Browse Source
This commit is contained in:
laigyu
2024-04-12 18:37:26 +08:00
parent 6b8b41c2ff
commit 2325de4662
2 changed files with 119 additions and 58 deletions
Download Patch File Download Diff File Expand all files Collapse all files
modules/services/mapillary.js
+11
View File
@@ -30,6 +30,7 @@ let _mlyShowFeatureDetections = false;
let _mlyShowSignDetections = false;
let _mlyViewer;
let _mlyViewerFilter = ['all'];
let _isViewerOpen = false;
// Load all data for the specified type from Mapillary vector tiles
@@ -478,6 +479,8 @@ export default {
_mlyViewer.resize();
}
_isViewerOpen = true;
return this;
},
@@ -504,10 +507,18 @@ export default {
dispatch.call('loadedMapFeatures');
dispatch.call('loadedSigns');
_isViewerOpen = false;
return this.setStyles(context, null);
},
// Get viewer status
isViewerOpen: function() {
return _isViewerOpen;
},
// Update the URL with current image id
updateUrlImage: function(imageId) {
if (!window.mocha) {
modules/ui/photoviewer.js
+108 -58
View File
@@ -63,39 +63,103 @@ export function uiPhotoviewer(context) {
);
// set_photo_from_viewer button
context.container().on('click.setPhotoFromViewer', setPhotoFromViewerButton);
let _selectedID = context.selectedIDs();
context.container().on('click.setPhotoFromViewer', function(e) {
setPhotoFromViewerButton(e);
});
function setPhotoFromViewerButton() {
services.mapillary.on('imageChanged', function() {
let activeImageId;
const layers = context.layers();
function layerStatus(which) {
const layer = layers.layer(which);
return layer.enabled();
function setPhotoFromViewerButton(e) {
services.mapillary.ensureViewerLoaded(context).then(() => {
if (e.target.closest('.mly-wrapper')) {
services.mapillary.on('imageChanged.set', function() {
MapillaryButtonDisabledUpdate();
});
return;
}
if (!services.mapillary.isViewerOpen()) return;
if (context.mode().id !== 'select' || !paneCheck() || !(layerStatus('mapillary') && getServiceId() === 'mapillary')) {
buttonRemove();
} else {
if (selection.select('.set-photo-from-viewer').empty()) {
const button = buttonCreate();
button.on('click', function (e) {
e.preventDefault();
e.stopPropagation();
setMapillaryPhotoId();
buttonDisable(true);
});
MapillaryButtonDisabledUpdate();
} else {
if (isSelectedIDChanged()) {
MapillaryButtonDisabledUpdate();
updateSelectedID();
}
}
}
function MapillaryButtonDisabledUpdate() {
let activeImageId = services.mapillary.getActiveImage()?.id;
const fieldInput = d3_select('.wrap-form-field-mapillary .identifier');
if (!fieldInput.empty()) {
if (activeImageId === utilGetSetValue(fieldInput)) {
buttonDisable(true);
} else {
buttonDisable(false);
}
} else {
buttonDisable(false);
}
}
function setMapillaryPhotoId() {
function insertIdAndTriggerChangeAtField() {
const changeEvent = new Event('change');
const service = services.mapillary;
// insert id
const image = service.getActiveImage();
const fieldInput = d3_select('.wrap-form-field-mapillary .identifier');
utilGetSetValue(fieldInput, image.id);
// trigger change at field
fieldInput.node().focus();
fieldInput.node().dispatchEvent(changeEvent);
}
// check if mapillary image id field exist
const mapillaryImageIDField = d3_select('.wrap-form-field-mapillary');
if (!mapillaryImageIDField.empty()) {
insertIdAndTriggerChangeAtField();
} else {
// open the Mapillary field
const comboboxInput = d3_select('.value.combobox-input');
const EnterEvent = new KeyboardEvent('keydown', { keyCode: 13 });
utilGetSetValue(comboboxInput, 'Mapillary Image ID');
comboboxInput.node().focus();
comboboxInput.node().dispatchEvent(EnterEvent);
insertIdAndTriggerChangeAtField();
}
}
});
function layerStatus(which) {
const layers = context.layers();
const layer = layers.layer(which);
return layer.enabled();
}
function getServiceId() {
const hash = utilStringQs(window.location.hash);
let serviceId;
if (hash.photo) {
let result = hash.photo.split('/');
serviceId = result[0];
}
activeImageId = services.mapillary.getActiveImage()?.id;
// check layer enabled && currently only support mapillary && editorpane open
if (layerStatus('mapillary') && serviceId === 'mapillary' && paneCheck()) {
const fieldInput = d3_select('.wrap-form-field-mapillary .identifier');
if (!fieldInput.empty()) {
if (activeImageId === utilGetSetValue(fieldInput)) return buttonRemove();
}
const buttonWithoutClickEvent = buttonCreate();
buttonWithoutClickEvent.on('click', function () {
setPhotoFromMapillaryViewer();
buttonRemove();
});
} else {
buttonRemove();
}
});
return serviceId;
}
function paneCheck() {
const inspectorWrap = d3_select('.inspector-wrap');
@@ -103,26 +167,35 @@ export function uiPhotoviewer(context) {
const presetPane = d3_select('.preset-list-pane');
return !inspectorWrap.classed('inspector-hidden') &&
!editorPane.classed('hide') &&
presetPane.classed('hide') &&
context.mode().id === 'select';
!editorPane.classed('hide') &&
presetPane.classed('hide');
}
function isSelectedIDChanged() {
const currentSelectId = context.selectedIDs();
if (JSON.stringify(_selectedID) === JSON.stringify(currentSelectId)) {
return false;
} else {
return true;
}
}
function updateSelectedID() {
_selectedID = context.selectedIDs();
}
function buttonCreate() {
const button = selection.selectAll('.set-photo-from-viewer').data([0]);
const buttonEnter = button.enter()
.append('button')
.attr('class', 'set-photo-from-viewer')
.append('div')
.call(svgIcon('#iD-operation-merge'))
.call(uiTooltip()
.title(() => t.append('inspector.set_photo_from_viewer'))
.placement('right')
);
buttonEnter
.select('.tooltip')
buttonEnter.select('.tooltip')
.classed('dark', true)
.style('width', '300px');
@@ -131,36 +204,13 @@ export function uiPhotoviewer(context) {
function buttonRemove() {
const button = selection.selectAll('.set-photo-from-viewer').data([0]);
button?.remove();
button.remove();
}
}
function setPhotoFromMapillaryViewer() {
function insertIdAndTriggerChangeAtField() {
const changeEvent = new Event('change');
const service = services.mapillary;
// insert id
const image = service.getActiveImage();
const fieldInput = d3_select('.wrap-form-field-mapillary .identifier');
utilGetSetValue(fieldInput, image.id);
// trigger change at field
fieldInput.node().focus();
fieldInput.node().dispatchEvent(changeEvent);
}
// check if mapillary image id field exist
const mapillaryImageIDField = d3_select('.wrap-form-field-mapillary');
if (!mapillaryImageIDField.empty()) {
insertIdAndTriggerChangeAtField();
} else {
// open the Mapillary field
const comboboxInput = d3_select('.value.combobox-input');
const EnterEvent = new KeyboardEvent('keydown', { keyCode: 13 });
utilGetSetValue(comboboxInput, 'Mapillary Image ID');
comboboxInput.node().focus();
comboboxInput.node().dispatchEvent(EnterEvent);
insertIdAndTriggerChangeAtField();
function buttonDisable(disabled) {
const button = selection.selectAll('.set-photo-from-viewer').data([0]);
button.attr('disabled', disabled ? 'true' : null);
button.classed('disabled', disabled);
}
}