Local Time Zone (fixes #102) (#403)

* Local Time Zone (fixes #102)

All times displayed in the UX for players, authors, and admins now appear in the browser's local time zone, with the exception of the event creation/properties because I don't know how to do the time zone transitions for editable fields.

Internet wisdom is that the only way to do this well is to do it in Javascript because anything done on the server will use the server timezone instead of the user timezone. I searched around for a while to locate the easiest-looking version of this, and it seems to be working properly.

* PR changes

ServerCore/Helpers/TimeHelper.cs

@@ -0,0 +1,21 @@
+using System;
+using System.Linq;
+using System.Threading.Tasks;
+using Microsoft.EntityFrameworkCore;
+using ServerCore.DataModel;
+
+namespace ServerCore.Helpers
+{
+    public static class TimeHelper
+    {
+        /// <summary>
+        /// returns a time with the formatting required for the jQuery code in site.js to convert it to browser local time
+        /// </summary>
+        /// <param name="date"></param>
+        /// <returns></returns>
+        public static string LocalTime(DateTime? date)
+        {
+            return date == null ? "&nbsp;" : $"<time>{date.Value.ToString("yyyy-MM-ddTHH:mm:ssZ")}</time>";
+        }
+    }
+}

ServerCore/ModelBases/EventSpecificPageModel.cs

@@ -87,6 +87,11 @@ public async Task<int> GetTeamId()
             }
         }
 
+        public string LocalTime(DateTime? date)
+        {
+            return TimeHelper.LocalTime(date);
+        }
+
         public class EventBinder : IModelBinder
         {
             public async Task BindModelAsync(ModelBindingContext bindingContext)

ServerCore/Pages/Events/Create.cshtml

@@ -6,6 +6,7 @@
 }
 
 <h2>Create a new event</h2>
+<h3><span style="color: red">ALL TIMES UTC! Current time is @DateTime.UtcNow.ToShortTimeString()</span></h3>
 
 <h4>Event</h4>
 <hr />

ServerCore/Pages/Events/Details.cshtml

@@ -9,6 +9,7 @@
 }
 
 <h2>@Model.Event.Name: Details</h2>
+<h3><span style="color: red">ALL TIMES UTC! Current time is @DateTime.UtcNow.ToShortTimeString()</span></h3>
 
 <a asp-page="./Edit">Edit</a> | <a asp-page="./Import">Import</a> | <a asp-page="./Delete">Delete</a>
 

ServerCore/Pages/Events/Edit.cshtml

@@ -9,6 +9,7 @@
 }
 
 <h2>@Model.Event.Name: Edit</h2>
+<h3><span style="color: red">ALL TIMES UTC! Current time is @DateTime.UtcNow.ToShortTimeString()</span></h3>
 <div>
     <a asp-page="./Details">Cancel</a>
 </div>

ServerCore/Pages/Hints/AuthorIndex.cshtml

@@ -77,7 +77,7 @@
                     @Html.DisplayFor(modelItem => item.Hint.Cost)
                 </td>
                 <td>
-                    @Html.DisplayFor(modelItem => item.UnlockTime)
+                    @Html.Raw(Model.LocalTime(item.UnlockTime))
                 </td>
             </tr>
             }

ServerCore/Pages/Puzzles/Feedback.cshtml

@@ -68,7 +68,7 @@ else
                     @Html.DisplayFor(modelItem => item.Submitter.Email)
                 </td>
                 <td>
-                    @Html.DisplayFor(modelItem => item.Feedback.SubmissionTime)
+                    @Html.Raw(Model.LocalTime(item.Feedback.SubmissionTime))
                 </td>
                 <td>
                     @Html.DisplayFor(modelItem => item.Feedback.WrittenFeedback)

ServerCore/Pages/Puzzles/Status.cshtml

@@ -55,7 +55,7 @@
                     }
                     else
                     {
-                        @Html.DisplayFor(modelItem => item.UnlockedTime)
+                        @Html.Raw(Model.LocalTime(item.UnlockedTime))
                         <a asp-page-handler="UnlockState" asp-route-sort="@Model.Sort" asp-route-teamId="@item.Team.ID" asp-route-puzzleid="@Model.Puzzle.ID" asp-route-value="false" onclick="return confirm('Are you sure you want to mark @(item.Team.Name) as locked?')"> X</a>
                     }
                 </td>
@@ -66,7 +66,7 @@
                     }
                     else
                     {
-                        @Html.DisplayFor(modelItem => item.SolvedTime)
+                        @Html.Raw(Model.LocalTime(item.SolvedTime))
                         <a asp-page-handler="SolveState" asp-route-sort="@Model.Sort" asp-route-teamId="@item.Team.ID" asp-route-puzzleid="@Model.Puzzle.ID" asp-route-value="false" onclick="return confirm('Are you sure you want to mark @(item.Team.Name) as unsolved?')"> X</a>
                     }
                 </td>

ServerCore/Pages/Submissions/AuthorIndex.cshtml

@@ -88,7 +88,7 @@
                     @Html.DisplayFor(modelItem => item.SubmissionText)
                 </td>
                 <td>
-                    @Html.DisplayFor(modelItem => item.TimeSubmitted)
+                    @Html.Raw(Model.LocalTime(item.TimeSubmitted))
                 </td>
             </tr>
             }

ServerCore/Pages/Submissions/Index.cshtml

@@ -96,7 +96,7 @@
             {
                 <tr>
                     <td>
-                        @Html.DisplayFor(modelItem => item.TimeSubmitted)
+                        @Html.Raw(Model.LocalTime(item.TimeSubmitted))
                     </td>
                     <td>
                         @Html.DisplayFor(modelItem => item.Submitter.Name)

ServerCore/Pages/Teams/Answers.cshtml

@@ -43,7 +43,7 @@
         {
         <tr>
             <td>
-                @item.TimeSubmitted
+                @Html.Raw(Model.LocalTime(item.TimeSubmitted))
             </td>
             <td>
                 @item.Group

ServerCore/Pages/Teams/Play.cshtml

@@ -78,7 +78,7 @@
                 <a asp-page="/Submissions/Index" asp-route-puzzleId="@item.Puzzle.ID">
                     @if (item.State.SolvedTime != null)
                     {
-                        <text>Solved at </text>@item.State.SolvedTime
+                        <text>Solved on </text>@Html.Raw(Model.LocalTime(item.State.SolvedTime))
                     }
                     else if (@Model.Event.IsAnswerSubmissionActive)
                     {

ServerCore/Pages/Teams/Status.cshtml

@@ -54,7 +54,7 @@
                     }
                     else
                     {
-                        @Html.DisplayFor(modelItem => item.UnlockedTime)
+                        @Html.Raw(Model.LocalTime(item.UnlockedTime))
                         <a asp-page-handler="UnlockState" asp-route-sort="@Model.Sort" asp-route-puzzleId="@item.Puzzle.ID" asp-route-teamId="@Model.Team.ID" asp-route-value="false" onclick="return confirm('Are you sure you want to mark @(item.Puzzle.Name) as locked?')"> X</a>
                     }
                 </td>
@@ -65,7 +65,7 @@
                     }
                     else
                     {
-                        @Html.DisplayFor(modelItem => item.SolvedTime)
+                        @Html.Raw(Model.LocalTime(item.SolvedTime))
                         <a asp-page-handler="SolveState" asp-route-sort="@Model.Sort" asp-route-puzzleId="@item.Puzzle.ID" asp-route-teamId="@Model.Team.ID" asp-route-value="false" onclick="return confirm('Are you sure you want to mark @(item.Puzzle.Name) as unsolved?')"> X</a>
                     }
                 </td>

ServerCore/wwwroot/js/site.js

@@ -1 +1,6 @@
 // Write your Javascript code.
+$("time").each(function (elem) {
+    var utctimeval = $(this).html();
+    var date = new Date(utctimeval);
+    $(this).html(date.toLocaleString());
+});