Add role alert to toasts

For accessibility reasons, 'role="alert" is required for toast
messages. This notifies screen readers that an error or success
message has appeared. Adds a service layer for toast messages
that adds the role attribute to the message.

Change-Id: Ic4dbf5556337eea589de5692c1b4c3323e771813
Signed-off-by: beccabroek <beccabroek@gmail.com>

1 files changed, 28 insertions, 0 deletions

diff --git a/app/common/services/toastService.js b/app/common/services/toastService.js
new file mode 100644
index 0000000..c199e96
--- /dev/null
+++ b/app/common/services/toastService.js
@@ -0,0 +1,28 @@
+/**
+ * data service
+ *
+ * @module app/common/services/toastService
+ * @exports toastService
+ * @name toastService
+
+ */
+
+window.angular && (function(angular) {
+  'use strict';
+
+  angular.module('app.common.services').service('toastService', [
+    'ngToast', '$sce',
+    function(ngToast, $sce) {
+      this.error = function(message) {
+        var errorMessage = $sce.trustAsHtml(
+            '<div role="alert"><b>Error</b><br>' + message + '</div>');
+        ngToast.create({className: 'danger', content: errorMessage});
+      };
+      this.success = function(message) {
+        var successMessage = $sce.trustAsHtml(
+            '<div role="alert"><b>Success!</b><br>' + message + '</div>');
+        ngToast.create({className: 'success', content: successMessage});
+      };
+    }
+  ]);
+})(window.angular);