Bug 1232914: Allow switching between structured & raw ping data via radio button. r=dexter

toolkit/content/aboutTelemetry.js

@@ -282,6 +282,11 @@ var PingPicker = {
       el.addEventListener("change", () => this.onPingSourceChanged(), false);
     }
 
+    let displays = document.getElementsByName("choose-ping-display");
+    for (let el of displays) {
+      el.addEventListener("change", () => this.onPingDisplayChanged(), false);
+    }
+
     document.getElementById("show-subsession-data").addEventListener("change", () => {
       this._updateCurrentPingData();
     });
@@ -298,10 +303,6 @@ var PingPicker = {
             .addEventListener("click", () => this._movePingIndex(-1), false);
     document.getElementById("older-ping")
             .addEventListener("click", () => this._movePingIndex(1), false);
-    document.getElementById("show-raw-ping")
-            .addEventListener("click", () => this._showRawPingData(), false);
-    document.getElementById("hide-raw-ping")
-            .addEventListener("click", () => this._hideRawPingData(), false);
     document.getElementById("choose-payload")
             .addEventListener("change", () => displayPingData(gPingData), false);
   },
@@ -310,6 +311,10 @@ var PingPicker = {
     this.update();
   },
 
+  onPingDisplayChanged: function() {
+    this.update();
+  },
+
   update: function() {
     let el = document.getElementById("ping-source-current");
     this.viewCurrentPingData = el.checked;
@@ -323,6 +328,15 @@ var PingPicker = {
       this._updateArchivedPingList().then(() =>
         document.getElementById("archived-ping-picker").classList.remove("hidden"));
     }
+
+    let element = document.getElementById("ping-source-structured");
+    this.viewCurrentPingData = element.checked;
+
+    if (this.viewCurrentPingData) {
+      this._hideRawPingData();
+    } else {
+      this._showRawPingData();
+    }
   },
 
   _updateCurrentPingData: function() {