added a simple tree based dialog for the palette for #228

hawtio · Apr 9, 2013 · d9e6240 · d9e6240
1 parent 3f2b662
commit d9e6240
Show file tree

Hide file tree

Showing 3 changed files with 53 additions and 1 deletion.
diff --git a/hawtio-web/src/main/webapp/app/wiki/html/camelSubLevelTabs.html b/hawtio-web/src/main/webapp/app/wiki/html/camelSubLevelTabs.html
@@ -8,3 +8,13 @@
       <i class="icon-plus"></i> Add</a></li>
 </ul>
 
+<div modal="showAddDialog" close="closeAddDialog()" options="addDialogOptions">
+  <div class="modal-header"><h4>Add Node</h4></div>
+  <div class="modal-body">
+    <div hawtio-tree="paletteTree" hideRoot="true" onselect="onPaletteSelect"></div>
+  </div>
+  <div class="modal-footer">
+    <button class="btn btn-primary add" type="button" ng-disabled="!selectedPaletteNode" ng-click="addAndCloseDialog()">Add</button>
+    <button class="btn btn-warning cancel" type="button" ng-click="closeAddDialog()">Cancel</button>
+  </div>
+</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
@@ -3,6 +3,48 @@ module Wiki {
   export function CamelController($scope, $location, $routeParams, workspace:Workspace, wikiRepository:GitWikiRepository) {
     $scope.schema = _apacheCamelModel;
 
+    $scope.addDialogOptions = {
+      backdropFade: true,
+      dialogFade: true
+    };
+    $scope.showAddDialog = false;
+
+    $scope.paletteItemSearch = "";
+    $scope.paletteTree = new Folder("Palette");
+
+    angular.forEach(_apacheCamelModel.definitions, (value, key) => {
+      if (value.group) {
+        var group = $scope.paletteTree.getOrElse(value.group);
+        value["_id"] = key;
+        var node = new Folder(key);
+        node["nodeModel"] = value;
+        var imageUrl = Camel.getRouteNodeIcon(value);
+        node.icon = imageUrl;
+        node.tooltip = tooltip;
+        var tooltip = value["tooltip"] || value["description"] || label;
+
+        group.children.push(node);
+      }
+    });
+
+    $scope.addNode = () => {
+      $scope.showAddDialog = true;
+    };
+
+    $scope.closeAddDialog = () => {
+      $scope.showAddDialog = false;
+    };
+
+    $scope.onPaletteSelect = (node) => {
+      $scope.selectedPaletteNode =  (node && node["nodeModel"]) ? node : null;
+    };
+
+    $scope.addAndCloseDialog = () => {
+      console.log("About to add node: " + $scope.selectedPaletteNode["title"]);
+      $scope.closeAddDialog();
+    };
+
+
     $scope.camelSubLevelTabs = () => {
       return $scope.breadcrumbs;
     };

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', 'camel']).
+  angular.module(pluginName, ['bootstrap', 'ui.bootstrap.dialog', 'ngResource', 'hawtioCore', 'tree', 'camel']).
           config(($routeProvider) => {
             $routeProvider.
                     when('/wiki/view/*page', {templateUrl: 'app/wiki/html/viewPage.html'}).