From 4eee51f6d7a123c52f27d9a3804895a6ad63bd0c Mon Sep 17 00:00:00 2001
From: Aaron D Borden <adborden@a14n.net>
Date: Fri, 7 Oct 2016 23:31:24 -0700
Subject: [PATCH 1/2] Basic flash messaging on error

---
 app/app.js                                    |  2 +
 app/app.less                                  |  1 +
 app/components/common/error/error.less        | 36 +++++++
 .../common/error/error_message.html           | 17 ++++
 app/components/common/error/index.js          | 95 +++++++++++++++++++
 app/components/common/styles/colors.less      |  1 +
 app/index.html                                |  1 +
 7 files changed, 153 insertions(+)
 create mode 100644 app/components/common/error/error.less
 create mode 100644 app/components/common/error/error_message.html
 create mode 100644 app/components/common/error/index.js

diff --git a/app/app.js b/app/app.js
index def32b3..9110b0b 100755
--- a/app/app.js
+++ b/app/app.js
@@ -11,6 +11,7 @@
   require('./components/common/core/core');
   require('./components/homePageModule/homePage');
   require('./components/appMainModule/appMain');
+  require('./components/common/error');
   require('./components/common/page_metadata');
   require('./components/common/scroll_top');
   
@@ -24,6 +25,7 @@
       'coreModules',
       'homePageModule',
       'appMainModule',
+      'odca.error',
       'odca.page_metadata',
       'odca.scroll_top'
     ])
diff --git a/app/app.less b/app/app.less
index 2345f62..f715f3e 100755
--- a/app/app.less
+++ b/app/app.less
@@ -19,6 +19,7 @@ body .main {
 @import "components/common/candidate/candidate";
 @import "components/common/committeeListing/committeeListing";
 @import "components/common/contributionsCategoryTable/contributionsCategoryTable";
+@import "components/common/error/error";
 @import "components/common/globalSearchBar/globalSearchBar";
 @import "components/common/linkList/linkList";
 @import "components/common/localityListing/localityListing";
diff --git a/app/components/common/error/error.less b/app/components/common/error/error.less
new file mode 100644
index 0000000..59c2d99
--- /dev/null
+++ b/app/components/common/error/error.less
@@ -0,0 +1,36 @@
+odca-error-message {
+  display: block;
+  padding: 1rem;
+  position: fixed;
+  width: 100%;
+  z-index: 1;
+}
+
+.odca-error-message {
+  &:extend(.text-xsmall);
+  background-color: @color-gold-bg;
+  border: 3px solid @color-gold;
+  border-radius: 4px;
+  color: @core-grey-4;
+  font-style: italic;
+  padding-bottom: 2rem;
+  padding-top: 2rem;
+  position: relative;
+
+  a[ng-click] {
+    cursor: pointer;
+  }
+}
+
+.odca-error-message__alert {
+  color: @color-gold;
+  font-size: 300%;
+  text-align: center;
+  width: 100%;
+}
+
+.odca-error-message__close {
+  font-style: normal;
+  font-weight: bold;
+  text-align: right;
+}
diff --git a/app/components/common/error/error_message.html b/app/components/common/error/error_message.html
new file mode 100644
index 0000000..5bfb138
--- /dev/null
+++ b/app/components/common/error/error_message.html
@@ -0,0 +1,17 @@
+<div ng-if="$ctrl.isError" class="odca-error-message">
+  <div class="container-fluid">
+    <div class="row">
+      <div class="col-xs-2 col-sm-1">
+        <div class="odca-error-message__alert fa fa-exclamation-triangle"></div>
+      </div>
+      <div class="col-xs-8 col-sm-10">
+        <span>Sorry, something went wrong.</span>
+        <span ng-if="$ctrl.message" class="odca-error-message__message">{{ $ctrl.message }}</span>
+        <span>You can try <a ng-click="$ctrl.refresh()">refreshing</a> the page or <a ng-click="$ctrl.home()">start over</a>.</span>
+      </div>
+      <div class="col-xs-2 col-sm-1">
+        <div class="odca-error-message__close"><a ng-click="$ctrl.close()">X</a></div>
+      </div>
+    </div>
+  </div>
+</div>
diff --git a/app/components/common/error/index.js b/app/components/common/error/index.js
new file mode 100644
index 0000000..ce56b69
--- /dev/null
+++ b/app/components/common/error/index.js
@@ -0,0 +1,95 @@
+'use strict';
+
+angular.module('odca.error', [])
+  .config(['$httpProvider', function ($httpProvider) {
+    $httpProvider.interceptors.push('errorHttpInterceptor');
+  }])
+  .run(['$window', 'error', function ($window, error) {
+    $window.onerror = onError;
+
+    function onError (message, url, lineNo, columnNo, err) {
+      error(err, message, true);
+    }
+  }])
+  .directive('odcaErrorMessage', function () {
+    return {
+      restrict: 'E',
+      controller: ErrorMessageController,
+      controllerAs: '$ctrl',
+      bindToController: true,
+      template: require('./error_message.html')
+    };
+  })
+  .decorator('$exceptionHandler', ['error', function (error) {
+    return exceptionHandler;
+
+    function exceptionHandler (err, cause) {
+      error(err, cause);
+    }
+  }])
+  .factory('error', ['$injector', '$log', function ($injector, $log) {
+    return error;
+
+    function error (err, cause, fatal) {
+      var $rootScope = $injector.get('$rootScope'); // avoids a circular dependency with the $exceptionHandler
+      var $location = $injector.get('$location'); // avoids a circular dependency with the $rootScope
+      var messages = [err];
+      if (cause) {
+        messages.unshift(cause);
+      }
+
+      $log.error.apply(null, messages);
+      $rootScope.$emit('odca.error-message', cause);
+
+      if ($location.host().indexOf('localhost') === -1) {
+        ga('send', 'exception', {
+          exDescription: cause || err.message || err,
+          exFatal: !!fatal,
+        });
+      }
+    }
+  }])
+  .factory('errorHttpInterceptor', ['error', function (error) {
+    return {
+      responseError: function errorHttpInterceptor (response) {
+        //TODO maybe check response.status and redirect to 404?
+        error(new Error(response.statusText));
+      }
+    };
+  }]);
+
+
+function ErrorMessageController ($rootScope, $state) {
+  var ctrl = this;
+  ctrl.close = close;
+  ctrl.home = home;
+  ctrl.refresh = refresh;
+
+  $rootScope.$on('odca.error-message', function (e, message) {
+    ctrl.message = message; // optional message
+    ctrl.isError = true;
+  });
+
+  function close () {
+    ctrl.message = null;
+    ctrl.isError = false;
+  }
+
+  function home () {
+    close();
+
+    $state.go('home', {reload: true});
+  }
+
+  function refresh () {
+    close();
+
+    // Don't want to take chances on $location, just reload as best we can
+    window.location.reload();
+  }
+}
+
+ErrorMessageController.$inject = ['$rootScope', '$state'];
+
+
+module.exports = 'odca.error';
diff --git a/app/components/common/styles/colors.less b/app/components/common/styles/colors.less
index 6e6089c..0e6b283 100755
--- a/app/components/common/styles/colors.less
+++ b/app/components/common/styles/colors.less
@@ -15,6 +15,7 @@
 
 @color-blue: #006ea3;
 @color-gold: #ffdd1f;
+@color-gold-bg: #ffffcc;
 @color-green: #0fc48b;
 @color-red: #e95300;
 
diff --git a/app/index.html b/app/index.html
index 5576c25..1211584 100755
--- a/app/index.html
+++ b/app/index.html
@@ -30,6 +30,7 @@
 
     <!--<body ng-class="bodyClasses" ng-controller="MainCtrl">-->
     <body ng-class="bodyClasses">
+      <odca-error-message></odca-error-message>
 
       <campaign-finance-app></campaign-finance-app>
 

From ad1d2cf9e15b82ab82923e1007f0ab298a591233 Mon Sep 17 00:00:00 2001
From: Aaron D Borden <adborden@a14n.net>
Date: Sun, 16 Oct 2016 19:19:30 -0700
Subject: [PATCH 2/2] Remove http interceptor

---
 app/components/common/error/index.js | 11 -----------
 1 file changed, 11 deletions(-)

diff --git a/app/components/common/error/index.js b/app/components/common/error/index.js
index ce56b69..a9a3b4d 100644
--- a/app/components/common/error/index.js
+++ b/app/components/common/error/index.js
@@ -1,9 +1,6 @@
 'use strict';
 
 angular.module('odca.error', [])
-  .config(['$httpProvider', function ($httpProvider) {
-    $httpProvider.interceptors.push('errorHttpInterceptor');
-  }])
   .run(['$window', 'error', function ($window, error) {
     $window.onerror = onError;
 
@@ -48,14 +45,6 @@ angular.module('odca.error', [])
         });
       }
     }
-  }])
-  .factory('errorHttpInterceptor', ['error', function (error) {
-    return {
-      responseError: function errorHttpInterceptor (response) {
-        //TODO maybe check response.status and redirect to 404?
-        error(new Error(response.statusText));
-      }
-    };
   }]);