Skip to content

refactor: Use render_globe_dropdown for phone and desktop layouts 🗺️ #667

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

Open
darcywong00 wants to merge 4 commits into
base: master
Choose a base branch
from
+42 −13
Open

refactor: Use render_globe_dropdown for phone and desktop layouts 🗺️ #667

Changes from all commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
31301ae
refactor: Use render_globe_dropdown for phone and desktop layouts
darcywong00 Feb 24, 2026
77c39a0
refactor id array
darcywong00 Feb 24, 2026
ba7318f
cleanup to address review comments
darcywong00 Feb 25, 2026
bb84a07
more cleanup
darcywong00 Feb 25, 2026
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
55 changes: 42 additions & 13 deletions _includes/2020/templates/Menu.php
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -52,19 +52,54 @@ private static function change_ui_language($language): string {
}

/**
* Render the globe dropdown for changing the UI language
* Generate links that correspond to the UI options
* As UI languages get added, we'll need to update this.
*/
private static function render_ui_list() {
echo "<ul>\n <!-- Just use autonyms -->\n";
$linkArray = array(
'en' => array(Menu::change_ui_language('en'), 'English'),
'de' => array(Menu::change_ui_language('de'), 'Deutsch'),
'es' => array(Menu::change_ui_language('es'), 'Español'),
'fr' => array(Menu::change_ui_language('fr'), 'Français'),
'km' => array(Menu::change_ui_language('km'), 'ខ្មែរ')
);

foreach($linkArray as $id) {
echo <<<END
<li><a href="{$id[0]}">{$id[1]}</a></li>\n
END;
}
Copy link
Contributor

@ermshiperete ermshiperete Feb 24, 2026

Choose a reason for hiding this comment

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

Are we missing </ul> ?

Copy link
Contributor Author

@darcywong00 darcywong00 Feb 25, 2026

Choose a reason for hiding this comment

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

good catch! I dropped that in 77c39a0

echo "</ul>";
}

/**
* Render the globe dropdown for changing the UI language
* Limitation: Currently only visible on pages that use localized strings
* @param number - Div number, default 0.
* @param divID - <div> ID to handle 3 cases:
* ui-language (default) Desktop globe hover
* ui-language1 - Desktop globe hover
* phone - Mobile list
*/
private static function render_globe_dropdown($number = 0): void {
private static function render_globe_dropdown($divID = "ui-language"): void {
global $page_is_using_locale;
if (!isset($page_is_using_locale) || !$page_is_using_locale) {
// only render on pages that use localized strings
return;
}

$divID = ($number == 1) ? "ui-language1" : "ui-language";
// Phone layout
if ($divID === "phone") {
?>
<div class="phone-menu-item">
<h3><span><img src="<?php echo Util::cdn("img/globe.png"); ?>" alt="UI globe dropdown" /></span> Keyboard Search UI</h3>
<?= Menu::render_ui_list(); ?>
</div>
<?php
return;
}

// Desktop layout
echo <<<END
<p>
<div id='$divID' class="menu-item">
Expand All @@ -73,14 +108,7 @@ private static function render_globe_dropdown($number = 0): void {
<img src="<?php echo Util::cdn("img/globe.png"); ?>" alt="UI globe dropdown" />
<div class="menu-item-dropdown">
<div class="menu-dropdown-inner">
<ul>
<!-- Just use autonyms -->
<li><a href="<?= Menu::change_ui_language('en'); ?>">English</a></li>
<li><a href="<?= Menu::change_ui_language('de'); ?>">Deutsch</a></li>
<li><a href="<?= Menu::change_ui_language('es'); ?>">Español</a></li>
<li><a href="<?= Menu::change_ui_language('fr'); ?>">Français</a></li>
<li><a href="<?= Menu::change_ui_language('km'); ?>">ខ្មែរ</a></li>
</ul>
<?= Menu::render_ui_list(); ?>
</div>
</div>
</div>
Expand All @@ -100,7 +128,8 @@ private static function render_phone_menu(object $fields): void {
<input id="search-submit2" type="image" src="<?php echo Util::cdn("img/search-button.png"); ?>" alt="search button" value="Search" onclick="if(document.getElementById('language-search2').value==''){return false;}">
</form>
</div>
<div class="phone-menu-item">
<?= Menu::render_globe_dropdown("phone"); ?>
<div class="phone-menu-item">
<h3>Products</h3>
<ul>
<li><a href="/windows/">Keyman <?=$fields->stable_version?> for Windows</a></li>
Expand Down