From b5cef5944845622dcffceee41ba8698b99b57341 Mon Sep 17 00:00:00 2001
From: Pawel Kadluczka <moozzyk@gmail.com>
Date: Sun, 6 Nov 2016 00:12:43 -0700
Subject: [PATCH] Fixing - infinite loop when a client disconnects - enum
 values serialization

Replacing reports div with a table
---
 .../SocialWeather/SocialWeatherEndPoint.cs    |  4 +-
 samples/SocialWeather/WeatherReport.cs        |  7 ++--
 samples/SocialWeather/wwwroot/weather.html    | 42 ++++++++++++++-----
 3 files changed, 36 insertions(+), 17 deletions(-)
diff --git a/samples/SocialWeather/SocialWeatherEndPoint.cs b/samples/SocialWeather/SocialWeatherEndPoint.cs
index c37cfd7a29..858091705a 100644
--- a/samples/SocialWeather/SocialWeatherEndPoint.cs
+++ b/samples/SocialWeather/SocialWeatherEndPoint.cs
@@ -34,9 +34,9 @@ namespace SocialWeather
             var formatter = _formatterResolver.GetFormatter<WeatherReport>(
                 connection.Metadata.Get<string>("formatType"));
 
-            while (true)
+            WeatherReport weatherReport;
+            while ((weatherReport = await formatter.ReadAsync(stream)) != null)
             {
-                var weatherReport = await formatter.ReadAsync(stream);
                 lock(_lockObj)
                 {
                     _lastWeatherReport = weatherReport;
diff --git a/samples/SocialWeather/WeatherReport.cs b/samples/SocialWeather/WeatherReport.cs
index 366630698f..0963465183 100644
--- a/samples/SocialWeather/WeatherReport.cs
+++ b/samples/SocialWeather/WeatherReport.cs
@@ -1,7 +1,5 @@
-﻿using System;
-using System.Collections.Generic;
-using System.Linq;
-using System.Threading.Tasks;
+﻿using Newtonsoft.Json;
+using Newtonsoft.Json.Converters;
 
 namespace SocialWeather
 {
@@ -13,6 +11,7 @@ namespace SocialWeather
 
         public long ReportTime { get; set; }
 
+        [JsonConverter(typeof(StringEnumConverter))]
         public Weather Weather { get; set; }
 
         public string ZipCode { get; set; }
diff --git a/samples/SocialWeather/wwwroot/weather.html b/samples/SocialWeather/wwwroot/weather.html
index 22a8f953c8..5ba5ef7710 100644
--- a/samples/SocialWeather/wwwroot/weather.html
+++ b/samples/SocialWeather/wwwroot/weather.html
@@ -5,9 +5,6 @@
     <title>Social weather</title>
 </head>
 <body>
-    <div id="weatherDiv" display="none">
-        <p>Weather: <span id="current" /></p>
-    </div>
     <form id="reportWeather" action="#">
         <label for="temperature">Temperature</label><input type="number" id="temperature" value="72"/>
         <label for="weather">Weather</label>
@@ -19,18 +16,43 @@
             <option value="MostlyCloudy">Mostly Cloudy</option>
             <option value="Cloudy">Cloudy</option>
         </select>
-        <label for="zipCode">Zip</label><input type="text" id="zipCode" />
+        <label for="zipCode">Zip</label><input type="text" id="zipCode" value="98052" />
         <input type="submit" value="Send report" />
     </form>
+    <div>
+        <h3>Weather reports</h3>
+        <table id="reportsTable"></table>
+    </div>
     <div>
         <p>Status: <span id="status" /></p>
     </div>
     <script>
-        document.addEventListener('DOMContentLoaded', () => {
-            function get(id) {
-                return document.getElementById(id);
-            }
+        function get(id) {
+            return document.getElementById(id);
+        }
 
+        function updateReport(report) {
+            if (report.ZipCode) {
+                let row = get('report' + report.ZipCode);
+                if (row) {
+                    while (row.hasChildNodes()) {
+                        row.removeChild(row.lastChild);
+                    }
+                }
+                else {
+                    row = document.createElement('tr');
+                    row.id = 'report' + report.ZipCode;
+                    get('reportsTable').appendChild(row);
+                }
+                row.innerHTML = `
+                    <td>${report.ZipCode}</td>
+                    <td>${report.Temperature}&#8457; </td>
+                    <td>${report.Weather.match(/[A-Z][a-z]+|[0-9]+/g).join(" ")}</td>
+                    <td>${report.ReportTime}</td>`;
+            }
+        }
+
+        document.addEventListener('DOMContentLoaded', () => {
             function updateStatus(text, color) {
                 var span = get('status');
                 span.innerHTML = text;
@@ -48,9 +70,7 @@
             };
 
             webSocket.onmessage = event => {
-                get('weatherDiv').style.display = 'block';
-                let weatherReport = JSON.parse(event.data);
-                get('current').innerHTML = event.data;
+                updateReport(JSON.parse(event.data));
             }
 
             webSocket.onclose = event => {
