Merge pull request #24 from fippo/improved-sdp

handle legacy and new json formats

Author: fippo

import.js

@@ -237,11 +237,26 @@ export class WebRTCInternalsDumpImporter extends EventTarget {
         el.innerText = traceEvent.type;
         details.appendChild(el);
 
-        if (['іcecandidate', 'addIceCandidate'].includes(traceEvent.type)) {
-            if (traceEvent.value) {
+        if (['іcecandidate', 'addIceCandidate'].includes(traceEvent.type) && traceEvent.value) {
+            const toShow = [];
+            if (traceEvent.value.startsWith('{')) {
+                const parts = JSON.parse(traceEvent.value);
+                ['sdpMid', 'sdpMLineIndex'].forEach(property => {
+                    toShow.push(property + ': ' + parts[property]);
+                });
+                if (parts.candidate) {
+                    const candidate = SDPUtils.parseCandidate(parts.candidate.trim());
+                    if (candidate) {
+                        toShow.push('port:' + candidate.port);
+                        toShow.push('type: ' + candidate.type);
+                    }
+                }
+                if (parts.relayProtocol) {
+                    toShow.push('relayProtocol: ' + parts.relayProtocol);
+                }
+            } else {
                 const parts = traceEvent.value.split(', ')
                     .map(part => part.split(': '));
-                const toShow = [];
                 parts.forEach(part => {
                     if (['sdpMid', 'sdpMLineIndex'].includes(part[0])) {
                         toShow.push(part.join(': '));
@@ -255,18 +270,39 @@ export class WebRTCInternalsDumpImporter extends EventTarget {
                         toShow.push('relayProtocol: ' + part[1]);
                     }
                 });
-                el.innerText += ' (' + toShow.join(', ') + ')';
             }
+            el.innerText += ' (' + toShow.join(', ') + ')';
         }
-        if (traceEvent.value.indexOf(', sdp: ') != -1) {
-            const [type, sdp] = traceEvent.value.substr(6).split(', sdp: ');
+
+        if (traceEvent.value.startsWith('{"type":') || traceEvent.value.indexOf(', sdp: ') != -1) {
+            let type;
+            let sdp;
+            if (traceEvent.value.startsWith('{"type":')) {
+                const result = JSON.parse(traceEvent.value);
+                type = result.type;
+                sdp = result.sdp;
+            } else { // legacy format.
+                const result = traceEvent.value.substr(6).split(', sdp: ');
+                type = result[0];
+                sdp = result[1];
+            }
             let last_sections;
             let remote_sections;
             if (traceEvent.type === 'setLocalDescription') {
                 const lastCreated = type === 'offer' ? state.lastCreatedOffer : state.lastCreatedAnswer;
                 if ((type === 'offer' && state.lastCreatedOffer) || (type === 'answer' && state.lastCreatedAnswer)) {
-                    const [last_type, last_sdp] = (type === 'offer' ? state.lastCreatedOffer : state.lastCreatedAnswer)
-                        .substr(6).split(', sdp: ');
+                    let last_type;
+                    let last_sdp;
+                    const lastDescription = (type === 'offer' ? state.lastCreatedOffer : state.lastCreatedAnswer);
+                    if (lastDescription.startsWith('{"type":')) {
+                        const result = JSON.parse(lastDescription);
+                        last_type = result.type;
+                        last_sdp = result.sdp;
+                    } else {
+                        const result = lastDescription.substr(6).split(', sdp: ');
+                        last_type = result[0];
+                        last_sdp = result[1];
+                    }
                     if (sdp != last_sdp) {
                         last_sections = SDPUtils.splitSections(last_sdp);
                         details.open = true;
@@ -278,6 +314,9 @@ export class WebRTCInternalsDumpImporter extends EventTarget {
                 }
             }
             processDescriptionEvent(details, traceEvent.type, {type, sdp}, last_sections, remote_sections);
+        } else if (traceEvent.value && traceEvent.value.startsWith('{')) {
+            el = document.createElement('pre');
+            el.innerText = JSON.stringify(JSON.parse(traceEvent.value), null, ' ');
         } else {
             el = document.createElement('pre');
             el.innerText = traceEvent.value;
@@ -300,9 +339,12 @@ export class WebRTCInternalsDumpImporter extends EventTarget {
             switch(traceEvent.value) {
                 case 'connected':
                 case 'completed':
+                case '"connected"':
+                case '"completed"':
                     row.style.backgroundColor = 'green';
                     break;
                 case 'failed':
+                case '"failed"':
                     row.style.backgroundColor = 'red';
                     break;
             }