mirror/php-phpbb
1
0
Fork 0
mirror of https://github.com/phpbb/phpbb.git synced 2025-08-12 11:44:08 +02:00
Code Issues Releases Wiki Activity

[feature/new-tz-handling] Introduce 2 step timezone selection using javascript

Browse Source 
PHPBB3-9558
This commit is contained in:
Joas Schilling
2012-06-05 21:44:44 +02:00
parent 3c6272ff04
commit 66f7d45603
7 changed files with 107 additions and 22 deletions
Download Patch File Download Diff File Expand all files Collapse all files

63
phpBB/styles/prosilver/template/timezone.js
View File

@@ -1,10 +1,37 @@
function phpbb_preselect_tz_select()
function phpbb_switch_tz_date(keep_selection)
{
var selector = document.getElementsByClassName('tz_select')[0];
if (selector.value)
{
return;
var timezone_groups = document.getElementById("timezone");
for (var i = 0; i < timezone_groups.childElementCount; i++) {
if (timezone_groups.children[i].tagName == "OPTGROUP" &&
timezone_groups.children[i].label != document.getElementById("tz_date").value)
{
timezone_groups.children[i].style.display = "none";
}
else if (timezone_groups.children[i].tagName == "OPTGROUP")
{
// Display other options
timezone_groups.children[i].style.display = "block";
}
}
if (typeof keep_selection !== 'undefined')
{
if (!keep_selection)
{
timezone_groups.children[0].selected = true;
}
}
}
function phpbb_enable_tz_dates()
{
var tz_select_date = document.getElementById("tz_select_date");
tz_select_date.style.display = "block";
}
function phpbb_preselect_tz_select(force_selector, l_suggestion)
{
var selector = document.getElementById('tz_date');
// The offset returned here is in minutes and negated.
// http://www.w3schools.com/jsref/jsref_getTimezoneOffset.asp
var offset = (new Date()).getTimezoneOffset();
@@ -42,12 +69,26 @@ function phpbb_preselect_tz_select()
var option = selector.options[i];
if (option.value.substring(0, prefix_length) == prefix)
{
// Firefox scrolls the selector only to put the option into view;
// for negative-offset timezones, this means the first timezone
// of a particular offset will be the bottom one, and selected,
// with all other timezones not visible. Not much can be done
// about that here unfortunately.
option.selected = true;
if (selector.value && selector.value != option.value && !force_selector)
{
// We do not select the option for the user, but notify him,
// that we would suggest a different setting.
document.getElementById("tz_select_date_suggest").style.display = "inline";
document.getElementById("tz_select_date_suggest").title = l_suggestion.replace("%s", option.innerHTML);
document.getElementById("tz_select_date_suggest").innerHTML = l_suggestion.replace("%s", option.innerHTML.substring(0, 9));
phpbb_switch_tz_date(true);
}
else
{
// Firefox scrolls the selector only to put the option into view;
// for negative-offset timezones, this means the first timezone
// of a particular offset will be the bottom one, and selected,
// with all other timezones not visible. Not much can be done
// about that here unfortunately.
option.selected = true;
phpbb_switch_tz_date(!force_selector);
document.getElementById("tz_select_date_suggest").style.display = "none";
}
break;
}
}

10
phpBB/styles/prosilver/template/ucp_prefs_personal.html
View File

@@ -75,6 +75,13 @@
<!-- ENDIF -->
<dl>
<dt><label for="timezone">{L_BOARD_TIMEZONE}:</label></dt>
<dd id="tz_select_date" style="display: none;">
<select name="tz_date" id="tz_date" class="autowidth tz_select" onchange="phpbb_switch_tz_date(false);">
<option value="">{L_SELECT_CURRENT_TIME}</option>
{S_TZ_DATE_OPTIONS}
</select>
<a id="tz_select_date_suggest" style="display: none;" href="javascript: phpbb_preselect_tz_select(true, '');">{L_TIMEZONE_DATE_SUGGESTION}</a>
</dd>
<dd>
<select name="tz" id="timezone" class="autowidth tz_select">
<option value="">{L_SELECT_TIMEZONE}</option>
@@ -140,6 +147,7 @@
</script>
<script type="text/javascript" src="{T_SUPER_TEMPLATE_PATH}/timezone.js"></script>
<script type="text/javascript">phpbb_preselect_tz_select();</script>
<script type="text/javascript">phpbb_enable_tz_dates();</script>
<script type="text/javascript">phpbb_preselect_tz_select(false, '{L_TIMEZONE_DATE_SUGGESTION}');</script>
<!-- INCLUDE ucp_footer.html -->

5
phpBB/styles/prosilver/theme/forms.css
View File

@@ -32,6 +32,11 @@ option {
padding-right: 1em;
}
select optgroup option {
padding-right: 1em;
font-family: Verdana, Helvetica, Arial, sans-serif;
}
textarea {
font-family: "Lucida Grande", Verdana, Helvetica, Arial, sans-serif;
width: 60%;