Fix #369

hawtio · Jun 18, 2013 · 5c9f0b9 · 5c9f0b9
1 parent 8f880cc
commit 5c9f0b9
Show file tree

Hide file tree

Showing 3 changed files with 24 additions and 95 deletions.
diff --git a/hawtio-web/src/main/webapp/app/jmx/html/operations.html b/hawtio-web/src/main/webapp/app/jmx/html/operations.html
@@ -1,40 +1,5 @@
 <div ng-controller="Jmx.OperationsController">
 
-  <script type="text/ng-template" id="array_item.html">
-    <div ng-switch on="typeOf(data)">
-      <div class="tab" ng-switch-when="array">
-        <ol>
-          <li ng-repeat="data in data" ng-include="'array_item.html'"></li>
-        </ol>
-      </div>
-      <div class="tab" ng-switch-when="object">
-        <ul class="unstyled">
-          <li ng-repeat="(key, value) in data" ng-include="'object_item.html'"></li>
-        </ul>
-      </div>
-      <p style="display: inline;" ng-switch-default>{{data}}</p>
-    </div>
-  </script>
-
-  <script type="text/ng-template" id="object_item.html">
-    <div>
-      <strong>{{key}}:</strong>
-      <div style="display: inline;" ng-switch on="typeOf(value)">
-        <div class="tab" ng-switch-when="array">
-          <ol>
-            <li ng-repeat="data in value" ng-include="'array_item.html'"></li>
-          </ol>
-        </div>
-        <div class="tab" ng-switch-when="object">
-          <ul class="unstyled">
-            <li ng-repeat="(key, value) in value" ng-include="'object_item.html'"></li>
-          </ul>
-        </div>
-        <p style="display: inline;" ng-switch-default>{{value}}</p>
-      </div>
-    </div>
-  </script>
-
   <div class="row-fluid" ng-show="isOperationsEmpty()">
     The selected MBean has no JMX operations.
   </div>
@@ -49,18 +14,10 @@
 
           <form class="form-horizontal no-bottom-margin" ng-show="operationResult!=''">
             <fieldset>
-              <div class="alert alert-{{operationStatus}} no-bottom-margin">
+              <div class="no-bottom-margin">
                 <div class="control-group">
 
-                  <div ng-switch on="typeOf(operationResult)">
-                    <ol ng-switch-when="array">
-                      <li ng-repeat="data in operationResult" ng-include="'array_item.html'"></li>
-                    </ol>
-                    <ul class="unstyled" ng-switch-when="object">
-                      <li ng-repeat="(key, value) in operationResult" ng-include="'object_item.html'"></li>
-                    </ul>
-                    <span ng-switch-default>{{operationResult}}</span>
-                  </div>
+                  <div hawtio-editor="operationResult" mode="mode"></div>
 
                 </div>
                 <div class="control-group">

diff --git a/hawtio-web/src/main/webapp/app/jmx/js/jmxPlugin.ts b/hawtio-web/src/main/webapp/app/jmx/js/jmxPlugin.ts
@@ -1,7 +1,7 @@
 module Jmx {
   var pluginName = 'jmx';
 
-  angular.module(pluginName, ['bootstrap', 'ui.bootstrap', 'ui.bootstrap.modal', 'ngResource', 'ngGrid', 'hawtioCore']).config(($routeProvider) => {
+  angular.module(pluginName, ['bootstrap', 'ui.bootstrap', 'ui.bootstrap.modal', 'ngResource', 'ngGrid', 'hawtioCore', 'hawtio-ui']).config(($routeProvider) => {
     $routeProvider.
             when('/jmx/attributes', {templateUrl: 'app/jmx/html/attributes.html'}).
             when('/jmx/operations', {templateUrl: 'app/jmx/html/operations.html'}).

diff --git a/hawtio-web/src/main/webapp/app/jmx/js/operations.ts b/hawtio-web/src/main/webapp/app/jmx/js/operations.ts
@@ -19,8 +19,9 @@ module Jmx {
     export function OperationController($scope, workspace:Workspace, jolokia, $document) {
       $scope.title = $scope.item.humanReadable;
       $scope.desc = $scope.item.desc;
-      $scope.operationResult = "";
+      $scope.operationResult = '';
       $scope.executeIcon = "icon-ok";
+      $scope.mode = "text";
 
       var sanitize = (args) => {
         if (args) {
@@ -41,14 +42,17 @@ module Jmx {
 
       $scope.args = sanitize($scope.item.args);
 
+
       $scope.dump = (data) => {
         console.log(data);
       };
 
+
       $scope.ok = () => {
         $scope.operationResult = '';
       };
 
+
       $scope.reset = () => {
         if ($scope.item.args) {
           $scope.item.args.forEach( function (arg) {
@@ -58,23 +62,24 @@ module Jmx {
         $scope.ok();
       };
 
-      $scope.resultIsArray = () => {
-        return angular.isArray($scope.operationResult);
-      };
 
-      $scope.resultIsString = () => {
-        return angular.isString($scope.operationResult);
-      };
+      $scope.handleResponse = (response) => {
+        $scope.executeIcon = "icon-ok";
+        $scope.operationStatus = "success";
 
-      $scope.typeOf = (data) => {
-        if (angular.isArray(data)) {
-          return "array";
-        } else if (angular.isObject(data)) {
-          return "object";
+        if (response === null || 'null' === response) {
+          $scope.operationResult = "Operation Succeeded!";
+        } else if (typeof response === 'string') {
+          $scope.operationResult = response;
         } else {
-          return "string";
+          $scope.operationResult = angular.toJson(response, true);
         }
-      };
+
+        $scope.mode = CodeEditor.detectTextFormat($scope.operationResult);
+
+        $scope.$apply();
+      }
+
 
       $scope.execute = () => {
 
@@ -90,35 +95,14 @@ module Jmx {
           return;
         }
 
-        var get_response = (response) => {
-          $scope.executeIcon = "icon-ok";
-          $scope.operationStatus = "success";
-
-          if (response === null || 'null' === response) {
-            $scope.operationResult = "Operation Succeeded!";
-          } else {
-            if (typeof response === 'number' || typeof response === 'boolean') {
-              $scope.operationResult = "" + response;
-            } else if (angular.isArray(response) && response.length === 0) {
-              $scope.operationResult = "Operation succeeded and returned an empty array";
-            } else if (angular.isObject(response) && Object.keys(response).length === 0) {
-              $scope.operationResult = "Operation succeeded and returned an empty object";
-            } else {
-              $scope.operationResult = response;
-            }
-          }
-
-          $scope.$apply();
-        };
-
         var args = [objectName, $scope.item.name];
         if ($scope.item.args) {
           $scope.item.args.forEach( function (arg) {
             args.push(arg.value);
           });
         }
 
-        args.push(onSuccess(get_response, {
+        args.push(onSuccess($scope.handleResponse, {
           error: function (response) {
             $scope.executeIcon = "icon-ok";
             $scope.operationStatus = "error";
@@ -136,23 +120,11 @@ module Jmx {
         $scope.executeIcon = "icon-spinner icon-spin";
         var fn = jolokia.execute;
         fn.apply(jolokia, args);
-      };
+       };
 
-    }
 
-    /*
-    export interface IOperation {
-        [key : string] : { name : string; humanReadable : string; args : string; };
-        [key : string] : any;
     }
 
-    export interface IOperationsControllerScope extends IMyAppScope {
-        routeParams : ng.IRouteParamsService;
-        workspace : Workspace;
-        sanitize : (value : IOperation) => IOperation;
-        operations : IOperation;
-    }
-    */
 
     export function OperationsController($scope, $routeParams : ng.IRouteParamsService, workspace:Workspace, jolokia) {