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.

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

Jump to bottom

add current language to topbar in alert.html #9868

Merged
merged 6 commits into from
Sep 18, 2024
Merged

add current language to topbar in alert.html #9868

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
6 commits
Select commit Hold shift + click to select a range
65af8c8
add current language to topbar in alert.html
ChinoUkaegbu Sep 11, 2024
9c657f4
add language dictionary to code.py
ChinoUkaegbu Sep 17, 2024
168d9e3
[pre-commit.ci] auto fixes from pre-commit.com hooks
pre-commit-ci[bot] Sep 17, 2024
706c4c9
display language - native and abbreviation - in topbar in alert.html
ChinoUkaegbu Sep 17, 2024
66d6f47
add border around language component
ChinoUkaegbu Sep 17, 2024
8068516
fix css hex refs to use colors.less
mekarpeles Sep 18, 2024
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
17 changes: 17 additions & 0 deletions openlibrary/plugins/openlibrary/code.py
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -1243,6 +1243,22 @@ def setup_template_globals():
get_cover_url,
)

SUPPORTED_LANGUAGES = {
"cs": {"localized": 'Czech', "native": "Čeština"},
Copy link
Collaborator

@cdrini cdrini Sep 23, 2024 •
edited
Loading

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

These will need to be wrapped with the _ in order to be actually localized, e.g.:

{"localized": _('Czech'), "native": "Čeština"}

Otherwise they will always be in English.

This also means we can't have this be a constant global, or else the _ will only read the user language once! So we'll want to make this into a function so that _ can get the user language per-request. E.g.

def get_supported_languages():
    return {
        "cs": {"localized": _('Czech'), "native": "Čeština"},
        ...
    }

And then make this function publicly accessible from the template.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

That makes sense! Initially when I tried to create the dictionary, it followed this format:

{"localized": _('Czech'), "native": "Čeština"}

but I kept getting an error message and so I left the dictionary in the format it currently is without the underscore with the intent of using the underscore in whatever page it's imported into. In PR #9889 I actually use the localization _ here and it works so I'm wondering if I should follow that format in this case or just have that get_supported_languages() dictionary with the localization embedded in

Copy link
Collaborator

@cdrini cdrini Sep 23, 2024 •
edited
Loading

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Ah you will have to import the _ in the python file to get access to it, with from openlibrary.i18n import gettext as _! That should do the trick. Was that maybe the error you were getting?

Unfortunately _ only works with static text, since essentially what happens is before the code is run, the python and html is analyzed and all _("...") are extracted and put into a separate file for our translators. This means that _ doesn't work with variables, only literal strings.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The import worked, thank you! I've addressed the concerns (hopefully) in #9906

Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Wonderful thank you! I responded there 😊

"de": {"localized": 'German', "native": "Deutsch"},
"en": {"localized": 'English', "native": "English"},
"es": {"localized": 'Spanish', "native": "Español"},
"fr": {"localized": 'French', "native": "Français"},
"hr": {"localized": 'Croatian', "native": "Hrvatski"},
"it": {"localized": 'Italian', "native": "Italiano"},
"pt": {"localized": 'Portuguese', "native": "Português"},
"hi": {"localized": 'Hindi', "native": "हिंदी"},
"sc": {"localized": 'Sardinian', "native": "Sardu"},
"te": {"localized": 'Telugu', "native": "తెలుగు"},
"uk": {"localized": 'Ukrainian', "native": "Українська"},
"zh": {"localized": 'Chinese', "native": "中文"},
}

web.template.Template.globals.update(
{
'cookies': web.cookies,
Expand All @@ -1258,6 +1274,7 @@ def setup_template_globals():
'random': random.Random(),
'choose_random_from': random.choice,
'get_lang': lambda: web.ctx.lang,
'supported_langs': SUPPORTED_LANGUAGES,
'ceil': math.ceil,
'get_best_edition': get_best_edition,
'get_book_provider': get_book_provider,
Expand Down
1 change: 1 addition & 0 deletions openlibrary/templates/site/alert.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -9,6 +9,7 @@
<div class="language-component header-dropdown">
<details>
<summary>
<span>$(supported_langs[get_lang() or 'en']['native']) ($(get_lang() or 'en'))</span>
Copy link
Collaborator

@cdrini cdrini Sep 23, 2024 •
edited
Loading

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This will error if the user language is not supported! Eg if get_lang() returns sq. Use the python .get to handle this case as well, eg

$ ui_lang = get_supported_languages().get(get_lang()) or get_supported_languages()['en']

Eg: https://staging.openlibrary.org/?lang=sq

Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Oh note this also means we'll have to change what's inside the brackets, otherwise for unsupported languages (eg Albanian which has language code sq) we'll see something like: "English (sq)" which is incorrect

<img class="translate-icon" src="/static/images/language-icon.svg" title="$_('Change Website Language')" alt="$_('Change Website Language')"/>
</summary>
<div class="language-dropdown-component">
Expand Down
3 changes: 3 additions & 0 deletions static/css/components/language.less
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -49,6 +49,9 @@
.iaBar .language-component {
position: relative;
display: block;
border: 1px solid @mid-grey;
border-radius: 5px;
padding: .2rem .4rem;
// stylelint-disable selector-max-specificity, max-nesting-depth
.language-dropdown-component {
position: absolute;
Expand Down
Loading