Skip to content
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.

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

Localize keyboard button texts (e.g. "Ctrl" -> "Strg") #4090

Open
manfredbrandl opened this issue Jun 6, 2017 · 18 comments · May be fixed by #10570
Open

Localize keyboard button texts (e.g. "Ctrl" -> "Strg") #4090

manfredbrandl opened this issue Jun 6, 2017 · 18 comments · May be fixed by #10570
Labels
localization Adapting iD across languages, regions, and cultures new contributor opportunity Best for first-time contributors without prior experience. You won’t be assigned; PRs welcome!

Comments

@manfredbrandl
Copy link
Contributor

There is one untranslatable item at Browsing "Enter full screen mode".
Maybe you can make some button-texts translatable:
"Ctrl", "Space", "PgUp", "PgDn", "Home", "End", "Backspace"
maybe even those I would use the same Text in German as in English:
"Shift", "Pause", "Alt", "Enter", "Esc"

image

@tyrasd tyrasd added the localization Adapting iD across languages, regions, and cultures label Jun 6, 2017
@bhousel
Copy link
Member

bhousel commented Jun 6, 2017

re: "Enter full screen mode": I just added it last night. It should be picked up by Transifex today and be available for translation soon. If you see it tomorrow we can close this issue 👍

@bhousel bhousel added the waitfor Waiting for something label Jun 6, 2017
@bhousel
Copy link
Member

bhousel commented Jun 6, 2017

Sorry just read again and it looks like you also want the button texts translatable too, I agree this is a good idea.

@bhousel bhousel removed the waitfor Waiting for something label Jun 6, 2017
@bhousel bhousel changed the title not translatable items in keyboard shortcuts Localize keyboard button texts (e.g. "Ctrl" -> "Strg") Jun 6, 2017
@manfredbrandl
Copy link
Contributor Author

@bhousel 'full screen mode' arrived at transifex, thanks. Waiting for 'Ctrl' etc.

bhousel added a commit that referenced this issue Jun 6, 2017
@bhousel
Copy link
Member

bhousel commented Jun 6, 2017

I've added the localizable button labels in c22fa60. These will appear on Transifex within the next day, and when they do, I'll add some translation instructions.

While it works for the "Keyboard shortcuts" screen, localization won't work yet in the popup tooltips. This is because iD.uiCmd() works a little differently than the iD.uiCmd.display() function that I added for the keyboard shortcuts. iD.uiCmd() generates a code in a specific way that a regex in d3.keybinding.js parses, so swapping e.g. "Ctrl" to "Strg" would mess it up.

Still trying to think of how I can reconcile the two approaches. Probably some combination of:

  1. iD.uiCmd should not do any display-focused translations, only conversions between win-mac-linux,
  2. use iD.uiCmd.display() everywhere we want a displayable code (like tooltips), and
  3. change iD.uiCmd.display from accepting single character codes to accept a string (e.g. "⌘A"), and return an array of keys found in it (e.g. ['⌘ Cmd', 'A']).
  4. maybe make another function to take that array and wrap those things in <kbd> tags and join with <span>+</span>

@manfredbrandl
Copy link
Contributor Author

manfredbrandl commented Jun 7, 2017

The localizable button labels arrived at transifex

@bhousel
Copy link
Member

bhousel commented Jun 7, 2017

Thanks! I'm leaving it open until I can fix how the shortcuts are displayed in tooltips.

@bhousel bhousel reopened this Jun 7, 2017
@manfredbrandl
Copy link
Contributor Author

manfredbrandl commented Jan 22, 2018

@bhousel Do you mean that you also want to display "Strg" + "<- Rück" here:
image

@bhousel
Copy link
Member

bhousel commented Jan 22, 2018

Do you mean that you also want to display "Strg" + "<- Rück" here:

Yes!

@manfredbrandl
Copy link
Contributor Author

@bhousel is this still on your agenda?

@1ec5 1ec5 added the new contributor opportunity Best for first-time contributors without prior experience. You won’t be assigned; PRs welcome! label Oct 15, 2024
@StillAbeginnerr
Copy link

StillAbeginnerr commented Nov 29, 2024

@1ec5 hello, I'm interested to solve this issue, is there something which I should know other than the previous comments? I'm new to open source and been tested the repository on my local.

I've started to work on it.

@1ec5
Copy link
Collaborator

1ec5 commented Nov 29, 2024

Sure, feel free to post a pull request for review when you’re ready. Per #4090 (comment), the only thing left to do here is update tooltips to also localize the modifier key names.

You’ll need to be using either Windows or Linux to see the key names, because on macOS, language-independent key symbols appear in the tooltips instead. In your local environment, append the language parameter to the URL to test iD in a particular language, for example, &language=de for German.

Here’s an example of where a tooltip shows shortcut keys (specifically, when hovering over the Show History Panel checkbox in the Map Data panel):

.keys([uiCmd('⌘⇧' + t('info_panels.history.key'))])

That calls into a function that hard-codes English names, which seems promising. However, it’s right next to the code that was fixed in c22fa60, so there must be a reason why it wasn’t changed. This function might be used elsewhere where it needs to retain the raw English names, in which case you might need to find a different way to localize these key names.

@StillAbeginnerr
Copy link

Sure, feel free to post a pull request for review when you’re ready. Per #4090 (comment), the only thing left to do here is update tooltips to also localize the modifier key names.

You’ll need to be using either Windows or Linux to see the key names, because on macOS, language-independent key symbols appear in the tooltips instead. In your local environment, append the language parameter to the URL to test iD in a particular language, for example, &language=de for German.

Here’s an example of where a tooltip shows shortcut keys (specifically, when hovering over the Show History Panel checkbox in the Map Data panel):

.keys([uiCmd('⌘⇧' + t('info_panels.history.key'))])

That calls into a function that hard-codes English names, which seems promising. However, it’s right next to the code that was fixed in c22fa60, so there must be a reason why it wasn’t changed. This function might be used elsewhere where it needs to retain the raw English names, in which case you might need to find a different way to localize these key names.

Thank you so much for providing such a clear and detailed explanation of this issue, I’ll review the mentioned areas and proceed with the updates as suggested.

I'm on MacOS but will try to figure out somehow.

@StillAbeginnerr
Copy link

image

So, I approached this issue in mentioned way, I got a bit familiar and saw that,

In the local environment, append the language parameter to the URL to test iD in a particular language doesn't seem to work directly as http://localhost:8080/?language=de doesn't change the language unless the computer system language is set to that particular language or any browser extension forcibly change the language of the webpage.

I used UserSwitcherAgent Extension setting to Windows Browser Environment like Internet Explorer and Locale Switcher Extension to convert on English to German (Device used MacOS Sequoia 15.1)

On it! It's very Interesting ))

@1ec5
Copy link
Collaborator

1ec5 commented Nov 29, 2024

Sorry, I should’ve been clearer: iD doesn’t use real URL query parameters; instead, it uses a similar syntax as the URL hash (after the #), so that the hash can update dynamically as you pan the map, select features, etc.

@StillAbeginnerr
Copy link

No problem, hopefully I'll be able to push a quality PR to this issue.

@StillAbeginnerr
Copy link

StillAbeginnerr commented Nov 30, 2024

Sorry, I don't know if this is the right approach,

But since only modifiers key names is left to be localised,

I plan to create a function that:
Detects the system language.
Parses the corresponding JSON file for the language.
Dynamically replaces hardcoded modifier key names with localized ones.

Would parsing the JSON file dynamically at runtime be a feasible approach?
Let me know if I’m heading in the right direction..
Thank you for your time and guidance.



Update :

I found I should exactly work,

image

I rely on the user agent string to determine the platform and simulated it as a Windows-based user agent
Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/111.0.0.0 Safari/537.36

For example, like for german Language
Now I think I need to localise this portion of
CTRL + Shift + t('info_panels.history.key') into STRG + Umschalt + t('info_panels.history.key')


Update 2 :

At line 20 in cmd.js :

  var result = '',
        replacements = {
            '⌘': 'Ctrl',
            '⇧': 'Shift',
            '⌥': 'Alt',
            '⌫': 'Backspace',
            '⌦': 'Delete'
        };

so if we make the line number 20-26 like below,

  var mac = (detected.os === 'mac');
    var result = '',
           replacements = {
            '⌘': mac ?  t('shortcuts.key.cmd')    : t('shortcuts.key.ctrl'),
            '⇧': mac ? t('shortcuts.key.shift')  : t('shortcuts.key.shift'),
            '⌥': mac ?  t('shortcuts.key.option') : t('shortcuts.key.alt'),
            '⌫': mac ?  t('shortcuts.key.delete') : t('shortcuts.key.backspace'),
            '⌦': mac ?  t('shortcuts.key.del')    : t('shortcuts.key.del'),
        };

Above Changes, I think would be more better for this function to work more dynamically according to the localization ?

It would correctly translate like this...

image

should I go ahead for a PR?

Proposed Changes below for file cmd.js from line 20 to 26:

  var mac = (detected.os === 'mac');
    var result = '',
            replacements = {
            '⌘': mac ?  t('shortcuts.key.cmd')    : t('shortcuts.key.ctrl'),
            '⇧': mac ? t('shortcuts.key.shift')  : t('shortcuts.key.shift'),
            '⌥': mac ?  t('shortcuts.key.option') : t('shortcuts.key.alt'),
            '⌫': mac ?  t('shortcuts.key.delete') : t('shortcuts.key.backspace'),
            '⌦': mac ?  t('shortcuts.key.del')    : t('shortcuts.key.del'),
        };
        

@StillAbeginnerr
Copy link

StillAbeginnerr commented Nov 30, 2024

@1ec5 Please let me know if I'm missing out on something on StillAbeginnerr@672b376

StillAbeginnerr added a commit to StillAbeginnerr/iD that referenced this issue Nov 30, 2024
…specific keyboard shortcut mappings with localization
StillAbeginnerr added a commit to StillAbeginnerr/iD that referenced this issue Nov 30, 2024
…specific keyboard shortcut mappings with localization
StillAbeginnerr added a commit to StillAbeginnerr/iD that referenced this issue Nov 30, 2024
…specific keyboard shortcut mappings with localization
@1ec5
Copy link
Collaborator

1ec5 commented Dec 1, 2024

Thanks for posting #10570 – let’s continue the discussion about your implementation there.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
localization Adapting iD across languages, regions, and cultures new contributor opportunity Best for first-time contributors without prior experience. You won’t be assigned; PRs welcome!
Projects
None yet
5 participants