CalvinBackup/iD
1
0
Fork 0
mirror of https://github.com/FoggedLens/iD.git synced 2026-02-12 16:52:50 +00:00
Code Issues Packages Projects Releases Wiki Activity

Add set mapillary id button in the mapillary photo viewer

Browse Source 
It is the a. part in https://github.com/openstreetmap/iD/issues/6196#issuecomment-751460516

still need to add button disabled logic
This commit is contained in:
NaVis0mple
2023-12-28 00:34:14 +08:00
parent 33f4f8ee5c
commit 5890b79472
2 changed files with 68 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files

9
css/60_photos.css
View File

@@ -33,6 +33,15 @@
z-index: 50;
}
.photoviewer button.set-mapillary-image-ID-field {
border-radius: 0;
padding: 5px;
position: absolute;
left: 5px;
top: 5px;
z-index: 50;
}
.photoviewer button.resize-handle-xy {
border-radius: 0;
position: absolute;

60
modules/ui/photoviewer.js
View File

@@ -6,7 +6,7 @@ import { t } from '../core/localizer';
import { dispatch as d3_dispatch } from 'd3-dispatch';
import { svgIcon } from '../svg/icon';
import { utilGetDimensions } from '../util/dimensions';
import { utilRebind } from '../util';
import { utilRebind , utilGetSetValue } from '../util';
import { services } from '../services';
export function uiPhotoviewer(context) {
@@ -61,6 +61,64 @@ export function uiPhotoviewer(context) {
buildResizeListener(selection, 'resize', dispatch, { resizeOnY: true })
);
if (services.mapillary) {
addMapillayIdButton();
}
// add set-mapillary-button in mapillary viewer
function addMapillayIdButton () {
const service = services.mapillary;
selection
.append('button')
.attr('class', 'set-mapillary-image-ID-field')
.on('click', function(d3_event) {
d3_event.preventDefault();
const editorPane = d3_select('.entity-editor-pane');
const inspector_wrap = d3_select('.inspector-wrap');
const mailallary_image_ID_field = d3_select('.wrap-form-field-mapillary');
const changeEvent = new Event('change');
if (!editorPane) return;
if (!editorPane.classed('hide')&&!inspector_wrap.classed('inspector-hidden')){
// check if mapillary image id field exist
if (!mailallary_image_ID_field.empty()) {
// 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);
} 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);
// 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);
}
} else {
/* eslint-disable no-console */
console.log('editorPane hide');
/* eslint-disable no-console */
}
})
.append('div')
.call(svgIcon('#fas-rotate'))
.attr('title', t('inspector.set_mapillary'));
}
function buildResizeListener(target, eventName, dispatch, options) {
var resizeOnX = !!options.resizeOnX;