Merge pull request #157 from cheld/error-dialog

Show simple error dialog

src/app/frontend/common/errorhandling/errordialog_service.js

+// Copyright 2015 Google Inc. All Rights Reserved.
+//
+// Licensed under the Apache License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License.
+// You may obtain a copy of the License at
+//
+//     http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the License.
+
+/**
+ * Error dialog to display errors which could not be responded properly
+ *
+ * @final
+ */
+export default class ErrorDialog {
+  /**
+   * @param {!md.$dialog} $mdDialog
+   * @ngInject
+   */
+  constructor($mdDialog) {
+    /** @private {!md.$dialog} */
+    this.mdDialog_ = $mdDialog;
+  }
+
+  /**
+   * Opens a pop-up window that displays the error message
+   *
+   * @param {string} message
+   * @export
+   */
+  open(message) {
+    let alert = this.mdDialog_.alert();
+    alert.title(message);
+    alert.ok('Close');
+    this.mdDialog_.show(alert);
+  }
+}

src/app/frontend/common/errorhandling/errorhandling_module.js

+
+// Copyright 2015 Google Inc. All Rights Reserved.
+//
+// Licensed under the Apache License, Version 2.0 (the "License");
+// you may not use this file except in compliance with the License.
+// You may obtain a copy of the License at
+//
+//     http://www.apache.org/licenses/LICENSE-2.0
+//
+// Unless required by applicable law or agreed to in writing, software
+// distributed under the License is distributed on an "AS IS" BASIS,
+// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+// See the License for the specific language governing permissions and
+// limitations under the License.
+
+import errorDialogService from './errordialog_service';
+
+/**
+ * Angular module containing navigation chrome for the application.
+ */
+export default angular.module(
+                          'kubernetesDashboard.errorhandling',
+                          [
+                            'ngMaterial',
+                          ])
+    .service('errorDialog', errorDialogService);

src/app/frontend/deploy/createnamespace.html

@@ -19,7 +19,7 @@ limitations under the License.
     <h4 class="md-title" >Create a new namespace</h4>
     <p>The new namespace will be added to the cluster.</p>
     <!-- TODO(maciaszczykm): Missing detailed cluster info. -->
-    <form name="namespaceForm" ng-submit="ctrl.createNamespace()"
+    <form name="ctrl.namespaceForm" ng-submit="ctrl.createNamespace()"
           novalidate>
       <md-input-container class="md-block">
         <label>Namespace name</label>
@@ -27,7 +27,7 @@ limitations under the License.
             md-maxlength="{{ctrl.namespaceMaxLength}}"
             ng-pattern="ctrl.namespacePattern"
             required>
-        <div ng-messages="namespaceForm.namespace.$error">
+        <div ng-messages="ctrl.namespaceForm.namespace.$error">
             <div ng-message="pattern">Name must be alphanumeric and may contain dashes</div>
             <div ng-message="md-maxlength">Name is too long</div>
             <div ng-message="required">Name is required</div>

src/app/frontend/deploy/createnamespace_controller.js

@@ -22,10 +22,12 @@ export default class NamespaceDialogController {
    * @param {!md.$dialog} $mdDialog
    * @param {!angular.$log} $log
    * @param {!angular.$resource} $resource
+   * TODO (cheld) Set correct type after fixing issue #159
+   * @param {!Object} errorDialog
    * @param {!Array<string>} namespaces
    * @ngInject
    */
-  constructor($mdDialog, $log, $resource, namespaces) {
+  constructor($mdDialog, $log, $resource, errorDialog, namespaces) {
     /** @private {!md.$dialog} */
     this.mdDialog_ = $mdDialog;
 
@@ -35,6 +37,12 @@ export default class NamespaceDialogController {
     /** @private {!angular.$resource} */
     this.resource_ = $resource;
 
+    /**
+     * TODO (cheld) Set correct type after fixing issue #159
+     * @private {!Object}
+     */
+    this.errorDialog_ = errorDialog;
+
     /**
      * List of available namespaces.
      * @export {!Array<string>}
@@ -93,8 +101,9 @@ export default class NamespaceDialogController {
           this.mdDialog_.hide(this.namespace);
         },
         (err) => {
-          this.log_.info('Error creating namespace:', err);
           this.mdDialog_.hide();
+          this.errorDialog_.open('Error creating namespace');
+          this.log_.info('Error creating namespace:', err);
         });
   }
 }

src/app/frontend/deploy/deploy_module.js

@@ -13,6 +13,7 @@
 // limitations under the License.
 
 import stateConfig from './deploy_stateconfig';
+import errorHandlingModule from '../common/errorhandling/errorhandling_module';
 import deployFromSettingsDirective from './deployfromsettings_directive';
 import deployLabelDirective from './deploylabel_directive';
 import deployFromFileDirective from './deployfromfile_directive';
@@ -33,6 +34,7 @@ export default angular.module(
                             'ngResource',
                             'ui.router',
                             helpSectionModule.name,
+                            errorHandlingModule.name,
                           ])
     .config(stateConfig)
     .directive('deployFromSettings', deployFromSettingsDirective)