Change dom state classes to follow our classes namespaces

assets/scripts/transitions/BaseTransition.js

@@ -25,8 +25,8 @@ export default class {
         }
 
         $html
-            .removeClass('dom-is-loaded dom-is-animated ')
+            .removeClass('has-dom-loaded has-dom-animated ')
-            .addClass(`dom-is-loading ${this.overrideClass}`);
+            .addClass(`has-dom-loading ${this.overrideClass}`);
 
     }
 
@@ -54,15 +54,15 @@ export default class {
         $html.attr('data-template', view.getAttribute('data-template'));
 
         setTimeout(() => {
-                
+
             $html
-                .addClass('dom-is-loaded')
+                .addClass('has-dom-loaded')
-                .removeClass('dom-is-loading');
+                .removeClass('has-dom-loading');
 
             setTimeout(() => {
                 $html
                     .removeClass(this.overrideClass)
-                    .addClass('dom-is-animated');
+                    .addClass('has-dom-animated');
             }, 1000);
 
             // launch it at the end (animations...)
@@ -73,7 +73,7 @@ export default class {
         },1000);
     }
 
-    
+
     destroy() {
         if(isDebug) {
             console.log("---- ❌ [transition]:destroy -----");

assets/scripts/transitions/TransitionManager.js

@@ -16,13 +16,13 @@ const EVENT = {
 
 /*
 
-@todo : 
+@todo :
 
 - ✅ get data-transition on clicked link -> launch() and add switch(){}
 - ❌ add goto listener
 - ❌ add newPageReady functon with google analytics send (maybe pjax do that?)
 - ✅ add overrideClass system for all transitions
-- ✅ add base class manager like old DefaultTransition (dom-is-loaded, dom-is-loading etc..)
+- ✅ add base class manager like old DefaultTransition (has-dom-loaded, has-dom-loading etc..)
 
 
 
@@ -48,7 +48,7 @@ display() -> (transition) displayView() -> display animations & *readyToDestroy
 
 export default class {
     constructor() {
-        
+
 
         // jQuery ondomready
         $window.on('load',() => {
@@ -131,7 +131,7 @@ export default class {
 
     /**
      * (PJAX) Launch when new page is loaded
-     * @param  {js dom element}, 
+     * @param  {js dom element},
      * @param  {js dom element}
      * @param  {options : pjax options}
      * @return void
@@ -140,13 +140,13 @@ export default class {
         if(isDebug) {
             console.log('---- Next view loaded 👌 -----');
         }
-        this.transition.hideView(oldView, newView);        
+        this.transition.hideView(oldView, newView);
     }
 
     /**
      * Launch when you trigger EVENT.READYTOREMOVE in your transition -> hideView(), at the end
      * after oldView hidden, delete modules and launch this.display()
-     * @param  {js dom element}, 
+     * @param  {js dom element},
      * @param  {js dom element}
      * @return void
      */
@@ -164,7 +164,7 @@ export default class {
 
     /**
      * launch after this.remove()
-     * @param  {js dom element}, 
+     * @param  {js dom element},
      * @return void
      */
     display(view) {
@@ -210,10 +210,10 @@ export default class {
      * @return {void}
      */
     load() {
-        $html.addClass('dom-is-loaded');
+        $html.addClass('has-dom-loaded');
-        $html.removeClass('dom-is-loading');
+        $html.removeClass('has-dom-loading');
         setTimeout(() => {
-            $html.addClass('dom-is-animated');
+            $html.addClass('has-dom-animated');
         }, 1000)
     }
 }