add a diagram tab for the camel viewer/editor for #228

hawtio · Apr 9, 2013 · 2236ae2 · 2236ae2
1 parent fbf0478
commit 2236ae2
Show file tree

Hide file tree

Showing 4 changed files with 19 additions and 9 deletions.
diff --git a/hawtio-web/src/main/webapp/app/camel/js/camel.ts b/hawtio-web/src/main/webapp/app/camel/js/camel.ts
@@ -2,6 +2,7 @@
 module Camel {
   export function CamelController($scope, $element, workspace:Workspace, jolokia) {
     $scope.routes = [];
+    $scope.routeNodes = {};
 
     $scope.$on("$routeChangeSuccess", function (event, current, previous) {
       // lets do this asynchronously to avoid Error: $digest already in progress
@@ -13,8 +14,13 @@ module Camel {
       updateRoutes();
     });
 
+    $scope.$watch('nodeXmlNode', function () {
+      if (workspace.moveIfViewInvalid()) return;
+      updateRoutes();
+    });
+
     function updateRoutes() {
-      var routeXmlNode = getSelectedRouteNode(workspace);
+      var routeXmlNode = getSelectedRouteNode(workspace) || $scope.nodeXmlNode;
       $scope.mbean = getSelectionCamelContextMBean(workspace);
       if (routeXmlNode) {
         // lets show the remaining parts of the diagram of this route node
@@ -38,7 +44,7 @@ module Camel {
       $scope.routes = data;
       // nodes and routeNodes is the GUI nodes for the processors and routes shown in the diagram
       $scope.nodes = {};
-      $scope.routeNodes = {}
+      $scope.routeNodes = {};
       var nodes = [];
       var links = [];
       var selectedRouteId = getSelectedRouteId(workspace);
@@ -70,11 +76,13 @@ module Camel {
       var svg = canvasDiv.children("svg")[0];
       $scope.graphData = Core.dagreLayoutGraph(nodes, links, width, height, svg);
 
-      Core.register(jolokia, $scope, {
-        type: 'exec', mbean: $scope.mbean,
-        operation: 'dumpRoutesStatsAsXml',
-        arguments: [true, true]
-      }, onSuccess(statsCallback));
+      if ($scope.mbean) {
+        Core.register(jolokia, $scope, {
+          type: 'exec', mbean: $scope.mbean,
+          operation: 'dumpRoutesStatsAsXml',
+          arguments: [true, true]
+        }, onSuccess(statsCallback));
+      }
       return width;
     }
 

diff --git a/hawtio-web/src/main/webapp/app/wiki/html/camelDiagram.html b/hawtio-web/src/main/webapp/app/wiki/html/camelDiagram.html
@@ -1 +1 @@
-<h1>Diagram</h1>
+<div ng-include="diagramTemplate"></div>
diff --git a/hawtio-web/src/main/webapp/app/wiki/js/camel.ts b/hawtio-web/src/main/webapp/app/wiki/js/camel.ts
@@ -32,6 +32,7 @@ module Wiki {
 
     $scope.onNodeSelect = (treeNode) => {
       $scope.propertiesTemplate = null;
+      $scope.diagramTemplate = null;
       $scope.nodeXmlNode = null;
       var routeXmlNode = treeNode["routeXmlNode"];
       if (routeXmlNode) {
@@ -43,6 +44,7 @@ module Wiki {
         if ($scope.nodeModel) {
           $scope.propertiesTemplate = "app/wiki/html/camelPropertiesEdit.html";
         }
+        $scope.diagramTemplate = "app/camel/html/routes.html";
         Core.$apply($scope);
       }
     };

diff --git a/hawtio-web/src/main/webapp/app/wiki/js/wikiPlugin.ts b/hawtio-web/src/main/webapp/app/wiki/js/wikiPlugin.ts
@@ -1,6 +1,6 @@
 module Wiki {
   var pluginName = 'wiki';
-  angular.module(pluginName, ['bootstrap', 'ngResource', 'hawtioCore', 'tree']).
+  angular.module(pluginName, ['bootstrap', 'ngResource', 'hawtioCore', 'tree', 'camel']).
           config(($routeProvider) => {
             $routeProvider.
                     when('/wiki/view/*page', {templateUrl: 'app/wiki/html/viewPage.html'}).