Some initial work on this -- rebase me with issue num before merge

Author: chieffancypants

src/loading-bar.js

@@ -126,13 +126,23 @@ angular.module('chieffancypants.loadingBar', [])
   .provider('cfpLoadingBar', function() {
 
     this.includeSpinner = true;
-    this.parentSelector = 'body';
+    this.parentSelector = null;
 
-    this.$get = ['$document', '$timeout', '$animate', function ($document, $timeout, $animate) {
+    this.$get = ['$rootElement', '$timeout', '$animate', function ($rootElement, $timeout, $animate) {
+      var $parent;
 
-      var $parentSelector = this.parentSelector,
-        $parent = $document.find($parentSelector),
-        loadingBarContainer = angular.element('<div id="loading-bar"><div class="bar"><div class="peg"></div></div></div>'),
+      if (!this.parentSelector) {
+        $parent = $rootElement;
+      } else {
+        $parent = $rootElement.find(this.parentSelector);
+      }
+
+      // if the parentSelector isn't found, alert the developer instead of
+      if ($parent.length === 0) {
+        throw new Error('Could not attach the loading bar to the DOM: selector ("' + this.parentSelector + '") not found');
+      }
+
+      var loadingBarContainer = angular.element('<div id="loading-bar"><div class="bar"><div class="peg"></div></div></div>'),
         loadingBar = loadingBarContainer.find('div').eq(0),
         spinner = angular.element('<div id="loading-bar-spinner"><div class="spinner-icon"></div></div>');
 
@@ -170,9 +180,9 @@ angular.module('chieffancypants.loadingBar', [])
         loadingBar.css('width', pct);
         status = n;
 
-        // increment loadingbar to give the illusion that there is always progress
-        // but make sure to cancel the previous timeouts so we don't have multiple
-        // incs running at the same time.
+        // increment loadingbar to give the illusion that there is always
+        // progress but make sure to cancel the previous timeouts so we don't
+        // have multiple incs running at the same time.
         $timeout.cancel(incTimeout);
         incTimeout = $timeout(function() {
           _inc();

test/loading-bar-interceptor.coffee

@@ -1,15 +1,16 @@
-isLoadingBarInjected = (doc) ->
-  injected = false
-  divs = angular.element(doc).find('div')
-  for i in divs
-    if angular.element(i).attr('id') is 'loading-bar'
-      injected = true
-      break
-  return injected
 
 describe 'loadingBarInterceptor Service', ->
 
-  $http = $httpBackend = $document = $timeout = result = loadingBar = null
+  isLoadingBarInjected = () ->
+    injected = false
+    divs = $rootElement.find('div')
+    for i in divs
+      if angular.element(i).attr('id') is 'loading-bar'
+        injected = true
+        break
+    return injected
+
+  $http = $httpBackend = $rootElement = $timeout = result = loadingBar = null
   response = {message:'OK'}
   endpoint = '/service'
 
@@ -19,10 +20,10 @@ describe 'loadingBarInterceptor Service', ->
       return
 
     result = null
-    inject (_$http_, _$httpBackend_, _$document_, _$timeout_) ->
+    inject (_$http_, _$httpBackend_, _$rootElement_, _$timeout_) ->
       $http = _$http_
       $httpBackend = _$httpBackend_
-      $document = _$document_
+      $rootElement = _$rootElement_
       $timeout = _$timeout_
 
   beforeEach ->
@@ -35,6 +36,8 @@ describe 'loadingBarInterceptor Service', ->
         return this.actual > low && this.actual < high
 
 
+
+
   afterEach ->
     $httpBackend.verifyNoOutstandingRequest()
     $timeout.verifyNoPendingTasks()
@@ -158,7 +161,7 @@ describe 'loadingBarInterceptor Service', ->
 
     $httpBackend.flush(1)
 
-    injected = isLoadingBarInjected $document.find(cfpLoadingBar.parentSelector)
+    injected = isLoadingBarInjected $rootElement.find(cfpLoadingBar.parentSelector)
 
     expect(injected).toBe true
     $httpBackend.flush()
@@ -172,12 +175,12 @@ describe 'loadingBarInterceptor Service', ->
     $http.get(endpoint)
 
     $timeout.flush() # loading bar is animated, so flush timeout
-    expect(isLoadingBarInjected($document.find(cfpLoadingBar.parentSelector))).toBe true
+    expect(isLoadingBarInjected($rootElement.find(cfpLoadingBar.parentSelector))).toBe true
 
     $httpBackend.flush()
     $timeout.flush()
 
-    expect(isLoadingBarInjected($document.find(cfpLoadingBar.parentSelector))).toBe false
+    expect(isLoadingBarInjected($rootElement.find(cfpLoadingBar.parentSelector))).toBe false
 
   it 'should get and set status', inject (cfpLoadingBar) ->
     cfpLoadingBar.start()