introduce ng-ui-scroll-hide class instead of built-in ng-hide

Author: dhilt

src/modules/elementRoutines.js

@@ -1,9 +1,29 @@
+const hideClassToken = 'ng-ui-scroll-hide';
+
+function addCSSRule(sheet, selector, rules, index) {
+  if("insertRule" in sheet) {
+    sheet.insertRule(selector + '{' + rules + '}', index);
+  }
+  else if("addRule" in sheet) {
+    sheet.addRule(selector, rules, index);
+  }
+}
+
 export default class ElementRoutines {
 
   constructor($injector, $q) {
     this.$animate = ($injector.has && $injector.has('$animate')) ? $injector.get('$animate') : null;
     this.isAngularVersionLessThen1_3 = angular.version.major === 1 && angular.version.minor < 3;
     this.$q = $q;
+    addCSSRule(document.styleSheets[0], '.' + hideClassToken, 'display: none');
+  }
+
+  hideElement(wrapper) {
+    wrapper.element.addClass(hideClassToken);
+  }
+
+  showElement(wrapper) {
+    wrapper.element.removeClass(hideClassToken);
   }
 
   insertElement(newElement, previousElement) {

src/ui-scroll.js

@@ -234,7 +234,7 @@ angular.module('ui.scroll', [])
           if (!isElementVisible(wrapper)) {
             wrapper.unregisterVisibilityWatcher = wrapper.scope.$watch(() => visibilityWatcher(wrapper));
           }
-          wrapper.element.addClass('ng-hide'); // hide inserted elements before data binding
+          elementRoutines.hideElement(wrapper); // hide inserted elements before data binding
         }
 
         function createElement(wrapper, insertAfter, insertElement) {
@@ -351,8 +351,8 @@ angular.module('ui.scroll', [])
           // We need the item bindings to be processed before we can do adjustment
           !$scope.$$phase && $scope.$digest();
 
-          updates.inserted.forEach(w => w.element.removeClass('ng-hide'));
-          updates.prepended.forEach(w => w.element.removeClass('ng-hide'));
+          updates.inserted.forEach(w => elementRoutines.showElement(w));
+          updates.prepended.forEach(w => elementRoutines.showElement(w));
 
           if (isInvalid(rid)) {
             return;
@@ -372,8 +372,8 @@ angular.module('ui.scroll', [])
           // We need the item bindings to be processed before we can do adjustment
           !$scope.$$phase && $scope.$digest();
 
-          updates.inserted.forEach(w => w.element.removeClass('ng-hide'));
-          updates.prepended.forEach(w => w.element.removeClass('ng-hide'));
+          updates.inserted.forEach(w => elementRoutines.showElement(w));
+          updates.prepended.forEach(w => elementRoutines.showElement(w));
 
           viewport.onAfterPrepend(updates);