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

Right-to-left layout support for drag-and-drop favorites, favorite shortcuts, and feature search

Browse Source
This commit is contained in:
Quincy Morgan
2019-03-06 14:59:21 -05:00
parent f676720928
commit ca8f499482
3 changed files with 40 additions and 11 deletions
Download Patch File Download Diff File Expand all files Collapse all files

11
css/80_app.css
View File

@@ -634,6 +634,10 @@ button.add-note svg.icon {
top: 10px;
pointer-events: none;
}
[dir='rtl'] .search-add .search-icon {
left: auto;
right: 10px;
}
.search-add .popover {
max-height: 250px;
width: 100%;
@@ -723,9 +727,14 @@ button.add-note svg.icon {
color: #666;
}
.search-add .subsection {
padding-left: 6px;
background-color: #CBCBCB;
}
[dir='ltr'] .search-add .subsection {
padding-left: 6px;
}
[dir='rtl'] .search-add .subsection {
padding-right: 6px;
}
/* Header for modals / panes
------------------------------------------------------- */
.header {

38
modules/ui/modes.js
View File

@@ -11,7 +11,7 @@ import {
} from '../modes';
import { svgIcon } from '../svg';
import { t } from '../util/locale';
import { t, textDirection } from '../util/locale';
import { tooltip } from '../util/tooltip';
import { uiPresetIcon } from './preset_icon';
import { uiTooltipHtml } from './tooltipHtml';
@@ -96,13 +96,26 @@ export function uiModes(context) {
preset: preset,
geometry: d.geom
};
var keyCode = index + 1;
if (keyCode <= 10) {
if (keyCode === 10) {
var keyCode;
if (textDirection === 'ltr') {
// use number row order: 1 2 3 4 5 6 7 8 9 0
if (index === 9) {
keyCode = 0;
} else if (index < 10) {
keyCode = index + 1;
}
} else {
// use number row order from right to left
if (index === 0) {
keyCode = 0;
} else if (index < 10) {
keyCode = 10 - index;
}
}
if (keyCode !== null) {
favoriteMode.key = keyCode.toString();
}
var mode;
switch (d.geom) {
case 'point':
@@ -201,22 +214,29 @@ export function uiModes(context) {
selection.selectAll('button.add-preset')
.style('transform', function(d2, index2) {
var node = d3_select(this).node();
if (index === index2) {
return 'translate(' + x + 'px, ' + y + 'px)';
} else if (y > 50) {
if (index2 > index) {
return 'translateX(-100%)';
return 'translateX(' + (textDirection === 'rtl' ? '' : '-') + '100%)';
}
} else if (index2 > index && d3_event.x > d3_select(this).node().offsetLeft) {
} else if (index2 > index && (
(d3_event.x > node.offsetLeft && textDirection === 'ltr') ||
(d3_event.x < node.offsetLeft + node.offsetWidth && textDirection === 'rtl')
)) {
if (targetIndex === null || index2 > targetIndex) {
targetIndex = index2;
}
return 'translateX(-100%)';
} else if (index2 < index && d3_event.x < d3_select(this).node().offsetLeft + d3_select(this).node().offsetWidth) {
return 'translateX(' + (textDirection === 'rtl' ? '' : '-') + '100%)';
} else if (index2 < index && (
(d3_event.x < node.offsetLeft + node.offsetWidth && textDirection === 'ltr') ||
(d3_event.x > node.offsetLeft && textDirection === 'rtl')
)) {
if (targetIndex === null || index2 < targetIndex) {
targetIndex = index2;
}
return 'translateX(100%)';
return 'translateX(' + (textDirection === 'rtl' ? '-' : '') + '100%)';
}
return null;
});

2
modules/ui/search_add.js
View File

@@ -40,7 +40,7 @@ export function uiSearchAdd(context) {
.call(tooltip()
.placement('bottom')
.html(true)
.title(function(d) { return uiTooltipHtml(t('modes.add_feature.description'), key); })
.title(function() { return uiTooltipHtml(t('modes.add_feature.description'), key); })
);
search = searchWrap