Display dates/times in local TZ (#7)

This commit is contained in:
Daniel J. Summers 2021-01-20 21:28:55 -05:00
parent 4155072990
commit 340b93c6d7
7 changed files with 98 additions and 42 deletions

View File

@ -1,4 +1,6 @@
using JobsJobsJobs.Shared;
using Microsoft.JSInterop;
using NodaTime;
using System;
using System.Collections.Generic;
using System.Net.Http;
@ -75,6 +77,32 @@ namespace JobsJobsJobs.Client
return _continents;
}
private DateTimeZone? _tz = null;
/// <summary>
/// Get the time zone for the current user's browser
/// </summary>
/// <param name="js">The JS interop runtime for the application</param>
/// <returns>The time zone based on the user's browser</returns>
public async Task<DateTimeZone> GetTimeZone(IJSRuntime js)
{
if (_tz == null)
{
try
{
_tz = DateTimeZoneProviders.Tzdb.GetZoneOrNull(await js.InvokeAsync<string>("getTimeZone"));
}
catch (Exception) { }
}
if (_tz == null)
{
// Either the zone wasn't found, or the user's browser denied us access to it; there's not much to do
// here but set it to UTC and move on
_tz = DateTimeZoneProviders.Tzdb.GetZoneOrNull("Etc/UTC")!;
}
return _tz;
}
public AppState() { }
private void NotifyChanged() => OnChange.Invoke();

View File

@ -1,23 +1,4 @@
@using NodaTime
@using NodaTime.Text
@using System.Globalization
@inject IJSRuntime js
@inject AppState state
@Translated
@code {
/// <summary>
/// The pattern with which dates will be formatted
/// </summary>
private static InstantPattern pattern = InstantPattern.Create("ld<MMMM d, yyyy>", CultureInfo.CurrentCulture);
/// <summary>
/// The date to be formatted
/// </summary>
[Parameter]
public Instant TheDate { get; set; }
/// <summary>
/// The formatted date
/// </summary>
private string Translated => pattern.Format(TheDate);
}

View File

@ -0,0 +1,30 @@
using Microsoft.AspNetCore.Components;
using NodaTime;
using NodaTime.Text;
using System.Threading.Tasks;
namespace JobsJobsJobs.Client.Shared
{
public partial class FullDate : ComponentBase
{
/// <summary>
/// The pattern with which dates will be formatted
/// </summary>
private static readonly ZonedDateTimePattern Pattern =
ZonedDateTimePattern.CreateWithCurrentCulture("ld<MMMM d, yyyy>", DateTimeZoneProviders.Tzdb);
/// <summary>
/// The date to be formatted
/// </summary>
[Parameter]
public Instant TheDate { get; set; }
/// <summary>
/// The formatted date
/// </summary>
private string Translated { get; set; } = "";
protected override async Task OnInitializedAsync() =>
Translated = Pattern.Format(TheDate.InZone(await state.GetTimeZone(js)));
}
}

View File

@ -1,23 +1,4 @@
@using NodaTime
@using NodaTime.Text
@using System.Globalization
@inject IJSRuntime js
@inject AppState state
@Translated
@code {
/// <summary>
/// The pattern with which dates will be formatted
/// </summary>
private static InstantPattern pattern = InstantPattern.Create("ld<D> ' at ' lt<t>", CultureInfo.CurrentCulture);
/// <summary>
/// The date to be formatted
/// </summary>
[Parameter]
public Instant TheDate { get; set; }
/// <summary>
/// The formatted date
/// </summary>
private string Translated => pattern.Format(TheDate);
}

View File

@ -0,0 +1,30 @@
using Microsoft.AspNetCore.Components;
using NodaTime;
using NodaTime.Text;
using System.Threading.Tasks;
namespace JobsJobsJobs.Client.Shared
{
public partial class FullDateTime : ComponentBase
{
/// <summary>
/// The pattern with which dates will be formatted
/// </summary>
private static readonly ZonedDateTimePattern Pattern =
ZonedDateTimePattern.CreateWithCurrentCulture("ld<D> ' at ' lt<t>", DateTimeZoneProviders.Tzdb);
/// <summary>
/// The date to be formatted
/// </summary>
[Parameter]
public Instant TheDate { get; set; }
/// <summary>
/// The formatted date
/// </summary>
private string Translated { get; set; } = "";
protected override async Task OnInitializedAsync() =>
Translated = Pattern.Format(TheDate.InZone(await state.GetTimeZone(js)));
}
}

View File

@ -43,6 +43,9 @@
function setPageTitle(theTitle) {
document.title = theTitle
}
function getTimeZone() {
return Intl.DateTimeFormat().resolvedOptions().timeZone
}
</script>
</body>

View File

@ -35,6 +35,9 @@
function setPageTitle(theTitle) {
document.title = theTitle
}
function getTimeZone() {
return Intl.DateTimeFormat().resolvedOptions().timeZone
}
</script>
</body>