Skip to content

Fixed dropdowns in RTL mode #353

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 5 commits into from
Dec 12, 2019
Merged

Fixed dropdowns in RTL mode #353

Show file tree
Hide file tree
Changes from 3 commits
Commits
Show all changes
5 commits
Select commit Hold shift + click to select a range
410b489
Fixed dropdowns in RTL mode
diogoscf Dec 10, 2019
e8b180a
Comply with es-lint
diogoscf Dec 10, 2019
e26bc0a
Comply with flow
diogoscf Dec 10, 2019
d8ac886
tweak to attempt triggering a docker build
sushain97 Dec 12, 2019
f65a17c
one more attempt to trigger this build
sushain97 Dec 12, 2019
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 1 addition & 1 deletion assets/js/localization.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -422,7 +422,7 @@ function setLocale(newLocale /*: string */) {
return newLocale;
}

/*:: export {getLangByCode, getDynamicLocalization, iso639Codes, iso639CodesInverse, locale, localizeInterface, setLocale} */
/*:: export {getLangByCode, getDynamicLocalization, iso639Codes, iso639CodesInverse, locale, localizeInterface, setLocale, langDirection} */

/*:: import {curDstLang, curSrcLang, dstLangs, getPairs, populateTranslationList, refreshLangList, srcLangs} from "./translator.js" */
/*:: import {ajaxSend, ajaxComplete, getURLParam, modeEnabled, onlyUnique, sendEvent} from "./util.js" */
Expand Down
17 changes: 14 additions & 3 deletions assets/js/translator.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -27,7 +27,7 @@ var PUNCTUATION_KEY_CODES = [46, 33, 58, 63, 47, 45, 190, 171, 49]; // eslint-di

/* global config, modeEnabled, synchronizeTextareaHeights, persistChoices, getLangByCode, sendEvent, onlyUnique, restoreChoices
getDynamicLocalization, locale, ajaxSend, ajaxComplete, localizeInterface, filterLangList, cache, readCache, iso639Codes,
callApy, apyRequestTimeout, isURL, removeSoftHyphens, parentLang, isVariant */
callApy, apyRequestTimeout, isURL, removeSoftHyphens, parentLang, isVariant, langDirection */
/* global ENTER_KEY_CODE, HTTP_BAD_REQUEST_CODE, HTTP_OK_CODE, SPACE_KEY_CODE, XHR_DONE, XHR_LOADING */

if(modeEnabled('translation')) {
Expand Down Expand Up @@ -554,10 +554,21 @@ function populateTranslationList() {

var minColumnWidth = TRANSLATION_LIST_MAX_WIDTH / TRANSLATION_LIST_MAX_COLUMNS;

var maxSrcLangsWidth, maxDstLangsWidth;

var direction = locale ? langDirection(locale) : 'ltr';

// figure out how much space is actually available for the columns
var maxSrcLangsWidth = $(window).width() - $('#srcLanguagesDropdownTrigger').offset().left - TRANSLATION_LISTS_BUFFER,
if(direction === 'ltr') {
maxSrcLangsWidth = $(window).width() - $('#srcLanguagesDropdownTrigger').offset().left - TRANSLATION_LISTS_BUFFER;
maxDstLangsWidth = $('#dstLanguagesDropdownTrigger').offset().left + $('#dstLanguagesDropdownTrigger').outerWidth() -
TRANSLATION_LISTS_BUFFER;
}
else {
maxSrcLangsWidth = $('#srcLanguagesDropdownTrigger').offset().left + $('#srcLanguagesDropdownTrigger').outerWidth() -
TRANSLATION_LISTS_BUFFER;
maxDstLangsWidth = $(window).width() - $('#dstLanguagesDropdownTrigger').offset().left - TRANSLATION_LISTS_BUFFER;
}

// then, prevent all the columns from getting too wide
maxSrcLangsWidth = Math.min(TRANSLATION_LIST_MAX_WIDTH, maxSrcLangsWidth);
Expand Down Expand Up @@ -1270,6 +1281,6 @@ function setRecentDstLangs(langs /*: string[] */) {
apyRequestTimeout, removeSoftHyphens, parentLang, isVariant} from "./util.js" */
/*:: import {ENTER_KEY_CODE, HTTP_BAD_REQUEST_CODE, HTTP_OK_CODE, SPACE_KEY_CODE, XHR_DONE, XHR_LOADING} from "./util.js" */
/*:: import {persistChoices, restoreChoices} from "./persistence.js" */
/*:: import {localizeInterface, getLangByCode, getDynamicLocalization, locale, iso639Codes} from "./localization.js" */
/*:: import {localizeInterface, getLangByCode, getDynamicLocalization, locale, iso639Codes, langDirection} from "./localization.js" */
/*:: import {readCache, cache} from "./persistence.js" */
/*:: import {isURL} from "./util.js" */