change classList fallback for multiple args

Author: Adam Bradley

js/ext/angular/src/controller/ionicScrollController.js

@@ -44,7 +44,8 @@ angular.module('ionic.ui.scroll')
       scrollView.activatePullToRefresh(refresherHeight, function() {
         self.refresher.classList.add('active');
       }, function() {
-        self.refresher.classList.remove('refreshing', 'active');
+        self.refresher.classList.remove('refreshing');
+        self.refresher.classList.remove('active');
       }, function() {
         self.refresher.classList.add('refreshing');
         $scope.onRefresh && $scope.onRefresh();

js/ext/angular/src/service/angularOverrides.js

@@ -1,22 +1,54 @@
 
 angular.element.prototype.addClass = function(cssClasses) {
+  var x, y, cssClass, el, splitClasses, existingClasses;
   if (cssClasses && cssClasses != 'ng-scope' && cssClasses != 'ng-isolate-scope') {
-    for(var x=0; x<this.length; x++) {
-      if(this[x].setAttribute) {
-        this[x].classList.add.apply(this[x].classList, cssClasses.split(/\s+/));
+    for(x=0; x<this.length; x++) {
+      el = this[x];
+      if(el.setAttribute) {
+
+        if(cssClasses.indexOf(' ') < 0) {
+          el.classList.add(cssClasses);
+        } else {
+          existingClasses = (' ' + (el.getAttribute('class') || '') + ' ')
+            .replace(/[\n\t]/g, " ");
+          splitClasses = cssClasses.split(' ');
+
+          for (y=0; y<splitClasses.length; y++) {
+            cssClass = splitClasses[y].trim();
+            if (existingClasses.indexOf(' ' + cssClass + ' ') === -1) {
+              existingClasses += cssClass + ' ';
+            }
+          }
+          el.setAttribute('class', existingClasses.trim());
+        }
       }
     }
   }
   return this;
 };
 
 angular.element.prototype.removeClass = function(cssClasses) {
+  var x, y, splitClasses, cssClass, el;
   if (cssClasses) {
-    for(var x=0; x<this.length; x++) {
-      if(this[x].setAttribute) {
-        this[x].classList.remove.apply(this[x].classList, cssClasses.split(/\s+/));
+    for(x=0; x<this.length; x++) {
+      el = this[x];
+      if(el.getAttribute) {
+        if(cssClasses.indexOf(' ') < 0) {
+          el.classList.remove(cssClasses);
+        } else {
+          splitClasses = cssClasses.split(' ');
+
+          for (y=0; y<splitClasses.length; y++) {
+            cssClass = splitClasses[y];
+            el.setAttribute('class', (
+                (" " + (el.getAttribute('class') || '') + " ")
+                .replace(/[\n\t]/g, " ")
+                .replace(" " + cssClass.trim() + " ", " ")).trim()
+            );
+          }
+        }
       }
     }
   }
   return this;
-};
+};

js/ext/angular/test/poly.html

@@ -34,19 +34,13 @@ <h1 class="title">Polyfill Tests</h1>
       Should be green by using ng-class
     </p>
 
-    <script>
-      console.error = function(){
-        alert(arguments)
-      }
-    </script>
-
     <script src="../../../../dist/js/ionic.bundle.js"></script>
     <script>
 
       document.getElementById('supportsClassList').classList.add('supported');
       document.getElementById('supportsClassList').classList.remove('not-supported');
 
-      document.getElementById('supportsClassListArgs').classList.add('support1', 'support2');
+      document.getElementById('supportsClassListArgs').classList.add('support1', 'support2', 'support2');
       document.getElementById('supportsClassListArgs').classList.remove('not-supported1', 'not-supported2');
 
       angular.module('ionicTest', ['ionic'])
@@ -55,6 +49,9 @@ <h1 class="title">Polyfill Tests</h1>
 
         $scope.ngClassTest = 'supported';
 
+        var body = angular.element( document.body );
+        body.addClass('class1 class2 class2');
+
       });
 
     </script>