add jsonview resource files.

src/DotNetCore.CAP/Dashboard/Content/css/jsonview.min.css

@@ -0,0 +1 @@
+@charset "UTF-8";.jsonview{font-family:monospace;font-size:1.1em;white-space:pre-wrap}.jsonview .prop{font-weight:700;text-decoration:none;color:#000}.jsonview .null,.jsonview .undefined{color:red}.jsonview .bool,.jsonview .num{color:#00f}.jsonview .string{color:green;white-space:pre-wrap}.jsonview .string.multiline{display:inline-block;vertical-align:text-top}.jsonview .collapser{position:absolute;left:-1em;cursor:pointer}.jsonview .collapsible{transition:height 1.2s;transition:width 1.2s}.jsonview .collapsible.collapsed{height:.8em;width:1em;display:inline-block;overflow:hidden;margin:0}.jsonview .collapsible.collapsed:before{content:"…";width:1em;margin-left:.2em}.jsonview .collapser.collapsed{transform:rotate(0)}.jsonview .q{display:inline-block;width:0;color:transparent}.jsonview li{position:relative}.jsonview ul{list-style:none;margin:0 0 0 2em;padding:0}.jsonview h1{font-size:1.2em}

src/DotNetCore.CAP/Dashboard/Content/js/cap.js

@@ -5,12 +5,12 @@
         locale: document.documentElement.lang
     };
 
-    cap.Metrics = (function() {
+    cap.Metrics = (function () {
         function Metrics() {
             this._metrics = {};
         }
 
-        Metrics.prototype.addElement = function(name, element) {
+        Metrics.prototype.addElement = function (name, element) {
             if (!(name in this._metrics)) {
                 this._metrics[name] = [];
             }
@@ -18,7 +18,7 @@
             this._metrics[name].push(element);
         };
 
-        Metrics.prototype.getElements = function(name) {
+        Metrics.prototype.getElements = function (name) {
             if (!(name in this._metrics)) {
                 return [];
             }
@@ -26,7 +26,7 @@
             return this._metrics[name];
         };
 
-        Metrics.prototype.getNames = function() {
+        Metrics.prototype.getNames = function () {
             var result = [];
             var metrics = this._metrics;
 
@@ -77,11 +77,11 @@
 
         if (xSettings) {
             this._xAxis = new Rickshaw.Graph.Axis.Time($.extend({
-              graph: graph,
-              timeFixture: new Rickshaw.Fixtures.Time.Local()
+                graph: graph,
+                timeFixture: new Rickshaw.Fixtures.Time.Local()
             }, xSettings));
         }
-        
+
         if (ySettings) {
             this._yAxis = new Rickshaw.Graph.Axis.Y($.extend({
                 graph: graph,
@@ -92,7 +92,7 @@
         graph.render();
     }
 
-    cap.RealtimeGraph = (function() {
+    cap.RealtimeGraph = (function () {
         function RealtimeGraph(element, succeeded, failed, succeededStr, failedStr) {
             this._succeeded = succeeded;
             this._failed = failed;
@@ -100,8 +100,16 @@
             this._initGraph(element, {
                 renderer: 'bar',
                 series: new Rickshaw.Series.FixedDuration([
-                        { name: failedStr, color: '#d9534f' },
-                        { name: succeededStr, color: '#5cb85c' }
+                    {
+                        name: failedStr,
+                        //color: '#d9534f'
+                        color: 'red'
+                    },
+                    {
+                        name: succeededStr,
+                        //color: '#5cb85c'
+                        color: '#cb513a'
+                    }
                 ],
                     undefined,
                     { timeInterval: 2000, maxDataPoints: 100 }
@@ -122,7 +130,7 @@
                 this._graph.series.addData({ failed: failed, succeeded: succeeded });
                 this._graph.render();
             }
-            
+
             this._succeeded = newSucceeded;
             this._failed = newFailed;
         };
@@ -130,17 +138,19 @@
         return RealtimeGraph;
     })();
 
-    cap.HistoryGraph = (function() {
+    cap.HistoryGraph = (function () {
         function HistoryGraph(element, succeeded, failed, succeededStr, failedStr) {
             this._initGraph(element, {
                 renderer: 'area',
                 series: [
                     {
                         color: '#d9534f',
+                        //color: 'red',
                         data: failed,
                         name: failedStr
                     }, {
                         color: '#6ACD65',
+                        //color: 'blue',
                         data: succeeded,
                         name: succeededStr
                     }
@@ -153,7 +163,7 @@
         return HistoryGraph;
     })();
 
-    cap.StatisticsPoller = (function() {
+    cap.StatisticsPoller = (function () {
         function StatisticsPoller(metricsCallback, statisticsUrl, pollInterval) {
             this._metricsCallback = metricsCallback;
             this._listeners = [];
@@ -165,9 +175,9 @@
         StatisticsPoller.prototype.start = function () {
             var self = this;
 
-            var intervalFunc = function() {
+            var intervalFunc = function () {
                 try {
-                    $.post(self._statisticsUrl, { metrics: self._metricsCallback() }, function(data) {
+                    $.post(self._statisticsUrl, { metrics: self._metricsCallback() }, function (data) {
                         self._notifyListeners(data);
                     });
                 } catch (e) {
@@ -178,21 +188,21 @@
             this._intervalId = setInterval(intervalFunc, this._pollInterval);
         };
 
-        StatisticsPoller.prototype.stop = function() {
+        StatisticsPoller.prototype.stop = function () {
             if (this._intervalId !== null) {
                 clearInterval(this._intervalId);
                 this._intervalId = null;
             }
         };
 
-        StatisticsPoller.prototype.addListener = function(listener) {
+        StatisticsPoller.prototype.addListener = function (listener) {
             this._listeners.push(listener);
         };
 
-        StatisticsPoller.prototype._notifyListeners = function(statistics) {
+        StatisticsPoller.prototype._notifyListeners = function (statistics) {
             var length = this._listeners.length;
             var i;
-            
+
             for (i = 0; i < length; i++) {
                 this._listeners[i](statistics);
             }
@@ -201,7 +211,7 @@
         return StatisticsPoller;
     })();
 
-    cap.Page = (function() {
+    cap.Page = (function () {
         function Page(config) {
             this._metrics = new cap.Metrics();
 
@@ -219,7 +229,7 @@
             this._poller.start();
         };
 
-        Page.prototype._createRealtimeGraph = function(elementId) {
+        Page.prototype._createRealtimeGraph = function (elementId) {
             var realtimeElement = document.getElementById(elementId);
             if (realtimeElement) {
                 var succeeded = parseInt($(realtimeElement).data('succeeded'));
@@ -233,7 +243,7 @@
                     realtimeGraph.appendHistory(data);
                 });
 
-                $(window).resize(function() {
+                $(window).resize(function () {
                     realtimeGraph.update();
                 });
 
@@ -243,7 +253,7 @@
             return null;
         };
 
-        Page.prototype._createHistoryGraph = function(elementId) {
+        Page.prototype._createHistoryGraph = function (elementId) {
             var historyElement = document.getElementById(elementId);
             if (historyElement) {
                 var createSeries = function (obj) {
@@ -348,11 +358,11 @@
 
                 if (!confirmText || confirm(confirmText)) {
                     $this.prop('disabled');
-                    var loadingDelay = setTimeout(function() {
+                    var loadingDelay = setTimeout(function () {
                         $this.button('loading');
                     }, 100);
 
-                    $.post($this.data('ajax'), function() {
+                    $.post($this.data('ajax'), function () {
                         clearTimeout(loadingDelay);
                         window.location.reload();
                     });
@@ -369,20 +379,20 @@
                     $expander.text('Less details...');
                 }
 
-				$expandable.slideToggle(
-					150, 
-					function() {
-					    if (!$expandable.is(':visible')) {
-					        $expander.text('More details...');
-					    }
-					});
+                $expandable.slideToggle(
+                    150,
+                    function () {
+                        if (!$expandable.is(':visible')) {
+                            $expander.text('More details...');
+                        }
+                    });
                 e.preventDefault();
             });
 
             $('.js-jobs-list').each(function () {
                 var container = this;
 
-                var selectRow = function(row, isSelected) {
+                var selectRow = function (row, isSelected) {
                     var $checkbox = $('.js-jobs-list-checkbox', row);
                     if ($checkbox.length > 0) {
                         $checkbox.prop('checked', isSelected);
@@ -390,7 +400,7 @@
                     }
                 };
 
-                var toggleRowSelection = function(row) {
+                var toggleRowSelection = function (row) {
                     var $checkbox = $('.js-jobs-list-checkbox', row);
                     if ($checkbox.length > 0) {
                         var isSelected = $checkbox.is(':checked');
@@ -402,13 +412,13 @@
                     $('.js-jobs-list-select-all', container)
                         .prop('checked', state === 'all-selected')
                         .prop('indeterminate', state === 'some-selected');
-                    
+
                     $('.js-jobs-list-command', container)
                         .prop('disabled', state === 'none-selected');
                 };
 
-                var updateListState = function() {
-                    var selectedRows = $('.js-jobs-list-checkbox', container).map(function() {
+                var updateListState = function () {
+                    var selectedRows = $('.js-jobs-list-checkbox', container).map(function () {
                         return $(this).prop('checked');
                     }).get();
 
@@ -427,7 +437,7 @@
                     setListState(state);
                 };
 
-                $(this).on('click', '.js-jobs-list-checkbox', function(e) {
+                $(this).on('click', '.js-jobs-list-checkbox', function (e) {
                     selectRow(
                         $(this).closest('.js-jobs-list-row').first(),
                         $(this).is(':checked'));
@@ -444,21 +454,21 @@
                     updateListState();
                 });
 
-                $(this).on('click', '.js-jobs-list-select-all', function() {
+                $(this).on('click', '.js-jobs-list-select-all', function () {
                     var selectRows = $(this).is(':checked');
 
-                    $('.js-jobs-list-row', container).each(function() {
+                    $('.js-jobs-list-row', container).each(function () {
                         selectRow(this, selectRows);
                     });
 
                     updateListState();
                 });
 
-                $(this).on('click', '.js-jobs-list-command', function(e) {
+                $(this).on('click', '.js-jobs-list-command', function (e) {
                     var $this = $(this);
                     var confirmText = $this.data('confirm');
 
-                    var jobs = $("input[name='jobs[]']:checked", container).map(function() {
+                    var jobs = $("input[name='jobs[]']:checked", container).map(function () {
                         return $(this).val();
                     }).get();
 

src/DotNetCore.CAP/Dashboard/Content/js/jsonview.min.js

@@ -0,0 +1 @@
+!function(e){var t,n,r,l,o;return o=["object","array","number","string","boolean","null"],r=function(){function t(e){null==e&&(e={}),this.options=e}return t.prototype.htmlEncode=function(e){return null!==e?e.toString().replace(/&/g,"&amp;").replace(/"/g,"&quot;").replace(/</g,"&lt;").replace(/>/g,"&gt;"):""},t.prototype.jsString=function(e){return e=JSON.stringify(e).slice(1,-1),this.htmlEncode(e)},t.prototype.decorateWithSpan=function(e,t){return'<span class="'+t+'">'+this.htmlEncode(e)+"</span>"},t.prototype.valueToHTML=function(t,n){var r;if(null==n&&(n=0),r=Object.prototype.toString.call(t).match(/\s(.+)]/)[1].toLowerCase(),this.options.strict&&!e.inArray(r,o))throw new Error(""+r+" is not a valid JSON value type");return this[""+r+"ToHTML"].call(this,t,n)},t.prototype.nullToHTML=function(e){return this.decorateWithSpan("null","null")},t.prototype.undefinedToHTML=function(){return this.decorateWithSpan("undefined","undefined")},t.prototype.numberToHTML=function(e){return this.decorateWithSpan(e,"num")},t.prototype.stringToHTML=function(e){var t,n;return/^(http|https|file):\/\/[^\s]+$/i.test(e)?'<a href="'+this.htmlEncode(e)+'"><span class="q">"</span>'+this.jsString(e)+'<span class="q">"</span></a>':(t="",e=this.jsString(e),this.options.nl2br&&(n=/([^>\\r\\n]?)(\\r\\n|\\n\\r|\\r|\\n)/g,n.test(e)&&(t=" multiline",e=(e+"").replace(n,"$1<br />"))),'<span class="string'+t+'">"'+e+'"</span>')},t.prototype.booleanToHTML=function(e){return this.decorateWithSpan(e,"bool")},t.prototype.arrayToHTML=function(e,t){var n,r,l,o,i,s,a,p;for(null==t&&(t=0),r=!1,i="",o=e.length,l=a=0,p=e.length;p>a;l=++a)s=e[l],r=!0,i+="<li>"+this.valueToHTML(s,t+1),o>1&&(i+=","),i+="</li>",o--;return r?(n=0===t?"":" collapsible",'[<ul class="array level'+t+n+'">'+i+"</ul>]"):"[ ]"},t.prototype.objectToHTML=function(e,t){var n,r,l,o,i,s,a;null==t&&(t=0),r=!1,i="",o=0;for(s in e)o++;for(s in e)a=e[s],r=!0,l=this.options.escape?this.jsString(s):s,i+='<li><a class="prop" href="javascript:;"><span class="q">"</span>'+l+'<span class="q">"</span></a>: '+this.valueToHTML(a,t+1),o>1&&(i+=","),i+="</li>",o--;return r?(n=0===t?"":" collapsible",'{<ul class="obj level'+t+n+'">'+i+"</ul>}"):"{ }"},t.prototype.jsonToHTML=function(e){return'<div class="jsonview">'+this.valueToHTML(e)+"</div>"},t}(),"undefined"!=typeof module&&null!==module&&(module.exports=r),n=function(){function e(){}return e.bindEvent=function(e,t){var n;return e.firstChild.addEventListener("click",function(e){return function(n){return e.toggle(n.target.parentNode.firstChild,t)}}(this)),n=document.createElement("div"),n.className="collapser",n.innerHTML=t.collapsed?"+":"-",n.addEventListener("click",function(e){return function(n){return e.toggle(n.target,t)}}(this)),e.insertBefore(n,e.firstChild),t.collapsed?this.collapse(n):void 0},e.expand=function(e){var t,n;return n=this.collapseTarget(e),""!==n.style.display?(t=n.parentNode.getElementsByClassName("ellipsis")[0],n.parentNode.removeChild(t),n.style.display="",e.innerHTML="-"):void 0},e.collapse=function(e){var t,n;return n=this.collapseTarget(e),"none"!==n.style.display?(n.style.display="none",t=document.createElement("span"),t.className="ellipsis",t.innerHTML=" &hellip; ",n.parentNode.insertBefore(t,n),e.innerHTML="+"):void 0},e.toggle=function(e,t){var n,r,l,o,i,s;if(null==t&&(t={}),l=this.collapseTarget(e),n="none"===l.style.display?"expand":"collapse",t.recursive_collapser){for(r=e.parentNode.getElementsByClassName("collapser"),s=[],o=0,i=r.length;i>o;o++)e=r[o],s.push(this[n](e));return s}return this[n](e)},e.collapseTarget=function(e){var t,n;return n=e.parentNode.getElementsByClassName("collapsible"),n.length?t=n[0]:void 0},e}(),t=e,l={collapse:function(e){return"-"===e.innerHTML?n.collapse(e):void 0},expand:function(e){return"+"===e.innerHTML?n.expand(e):void 0},toggle:function(e){return n.toggle(e)}},t.fn.JSONView=function(){var e,o,i,s,a,p,c;return e=arguments,null!=l[e[0]]?(a=e[0],this.each(function(){var n,r;return n=t(this),null!=e[1]?(r=e[1],n.find(".jsonview .collapsible.level"+r).siblings(".collapser").each(function(){return l[a](this)})):n.find(".jsonview > ul > li .collapsible").siblings(".collapser").each(function(){return l[a](this)})})):(s=e[0],p=e[1]||{},o={collapsed:!1,nl2br:!1,recursive_collapser:!1,escape:!0,strict:!1},p=t.extend(o,p),i=new r(p),"[object String]"===Object.prototype.toString.call(s)&&(s=JSON.parse(s)),c=i.jsonToHTML(s),this.each(function(){var e,r,l,o,i,s;for(e=t(this),e.html(c),l=e[0].getElementsByClassName("collapsible"),s=[],o=0,i=l.length;i>o;o++)r=l[o],"LI"===r.parentNode.nodeName?s.push(n.bindEvent(r.parentNode,p)):s.push(void 0);return s}))}}(jQuery);