framework7 7.1.5 → 8.0.0-beta.2

package/modules/router/clear-previous-history.js

@@ -1,6 +1,5 @@
 import $ from '../../shared/dom7.js';
 import appRouterCheck from './app-router-check.js';
-
 function clearPreviousPages(router) {
   appRouterCheck(router, 'clearPreviousPages');
   const app = router.app;
@@ -12,25 +11,14 @@ function clearPreviousPages(router) {
   $pagesToRemove.each(pageEl => {
     const $oldPageEl = $(pageEl);
     const $oldNavbarEl = $(app.navbar.getElByPage($oldPageEl));
-
-    if (router.params.stackPages && router.initialPages.indexOf($oldPageEl[0]) >= 0) {
-      $oldPageEl.addClass('stacked');
-
-      if (dynamicNavbar) {
-        $oldNavbarEl.addClass('stacked');
-      }
-    } else {
-      // Page remove event
-      router.pageCallback('beforeRemove', $oldPageEl, $oldNavbarEl, 'previous', undefined, {});
-      router.removePage($oldPageEl);
-
-      if (dynamicNavbar && $oldNavbarEl.length) {
-        router.removeNavbar($oldNavbarEl);
-      }
+    // Page remove event
+    router.pageCallback('beforeRemove', $oldPageEl, $oldNavbarEl, 'previous', undefined, {});
+    router.removePage($oldPageEl);
+    if (dynamicNavbar && $oldNavbarEl.length) {
+      router.removeNavbar($oldNavbarEl);
     }
   });
 }
-
 function clearPreviousHistory() {
   const router = this;
   appRouterCheck(router, 'clearPreviousHistory');
@@ -40,5 +28,4 @@ function clearPreviousHistory() {
   router.view.history = [url];
   router.saveHistory();
 }
-
 export { clearPreviousHistory }; // eslint-disable-line

package/modules/router/component-loader.js

@@ -7,35 +7,32 @@ export default {
         url,
         route: {
           path: url,
-          options: { ...options,
+          options: {
+            ...options,
             openIn: undefined
           }
         }
       };
-      const params = { ...options
+      const params = {
+        ...options
       };
-
       if (options.openIn === 'popup') {
         params.content = `<div class="popup popup-router-open-in" data-url="${url}"><div class="view view-init" data-links-view="${router.view.selector}" data-url="${url}" data-ignore-open-in="true"></div></div>`;
         navigateOptions.route.popup = params;
       }
-
       if (options.openIn === 'loginScreen') {
         params.content = `<div class="login-screen login-screen-router-open-in" data-url="${url}"><div class="view view-init" data-links-view="${router.view.selector}" data-url="${url}" data-ignore-open-in="true"></div></div>`;
         navigateOptions.route.loginScreen = params;
       }
-
       if (options.openIn === 'sheet') {
         params.content = `<div class="sheet-modal sheet-modal-router-open-in" data-url="${url}"><div class="sheet-modal-inner"><div class="view view-init" data-links-view="${router.view.selector}" data-url="${url}" data-ignore-open-in="true"></div></div></div>`;
         navigateOptions.route.sheet = params;
       }
-
       if (options.openIn === 'popover') {
         params.targetEl = options.clickedEl || options.targetEl;
         params.content = `<div class="popover popover-router-open-in" data-url="${url}"><div class="popover-inner"><div class="view view-init" data-links-view="${router.view.selector}" data-url="${url}" data-ignore-open-in="true"></div></div></div>`;
         navigateOptions.route.popover = params;
       }
-
       if (options.openIn.indexOf('panel') >= 0) {
         const parts = options.openIn.split(':');
         const side = parts[1] || 'left';
@@ -44,22 +41,18 @@ export default {
         params.content = `<div class="panel panel-router-open-in panel-${side} panel-${effect}" data-url="${url}"><div class="view view-init" data-links-view="${router.view.selector}" data-url="${url}" data-ignore-open-in="true"></div></div>`;
         navigateOptions.route.panel = params;
       }
-
       return router.navigate(navigateOptions);
     },
-
     componentLoader(component, componentUrl, options, resolve, reject) {
       if (options === void 0) {
         options = {};
       }
-
       const router = this;
       const {
         app
       } = router;
       const url = typeof component === 'string' ? component : componentUrl;
       const compiledUrl = router.replaceRequestUrlParams(url, options);
-
       function compile(componentFunction) {
         let context = options.context || {};
         if (typeof context === 'function') context = context.call(router);else if (typeof context === 'string') {
@@ -77,15 +70,12 @@ export default {
         const componentProps = merge(options.route ? options.route.params || {} : {}, options.props || {}, options.routeProps || {});
         let componentEl;
         let componentRoot;
-
         if (options.componentOptions && options.componentOptions.el) {
           componentEl = options.componentOptions.el;
         }
-
         if (options.componentOptions && options.componentOptions.root) {
           componentRoot = options.componentOptions.root;
         }
-
         app.component.create(componentFunction, componentProps, {
           context: componentContext,
           el: componentEl,
@@ -97,15 +87,12 @@ export default {
           throw new Error(err);
         });
       }
-
       let cachedComponent;
-
       if (compiledUrl && router.params.componentCache) {
         router.cache.components.forEach(cached => {
           if (cached.url === compiledUrl) cachedComponent = cached.component;
         });
       }
-
       if (compiledUrl && cachedComponent) {
         compile(cachedComponent);
       } else if (compiledUrl && !cachedComponent) {
@@ -114,17 +101,14 @@ export default {
           router.xhrAbortController.abort();
           router.xhrAbortController = false;
         }
-
         router.xhrRequest(url, options).then(loadedComponent => {
           const parsedComponent = app.component.parse(loadedComponent);
-
           if (router.params.componentCache) {
             router.cache.components.push({
               url: compiledUrl,
               component: parsedComponent
             });
           }
-
           compile(parsedComponent);
         }).catch(err => {
           reject();
@@ -134,7 +118,6 @@ export default {
         compile(component);
       }
     },
-
     modalComponentLoader(_temp) {
       let {
         component,
@@ -148,7 +131,6 @@ export default {
         resolve(el);
       }, reject);
     },
-
     tabComponentLoader(_temp2) {
       let {
         component,
@@ -162,7 +144,6 @@ export default {
         resolve(el);
       }, reject);
     },
-
     pageComponentLoader(_temp3) {
       let {
         component,
@@ -176,10 +157,8 @@ export default {
         if (newOptions === void 0) {
           newOptions = {};
         }
-
         resolve(el, newOptions);
       }, reject);
     }
-
   }
 };

package/modules/router/modal.js

@@ -1,12 +1,10 @@
 import { extend, nextTick } from '../../shared/utils.js';
 import History from '../../shared/history.js';
 import asyncComponent from './async-component.js';
-
 function modalLoad(modalType, route, loadOptions, direction) {
   if (loadOptions === void 0) {
     loadOptions = {};
   }
-
   const router = this;
   const app = router.app;
   const isPanel = modalType === 'panel';
@@ -20,58 +18,48 @@ function modalLoad(modalType, route, loadOptions, direction) {
   }, loadOptions);
   const modalParams = extend({}, route.route[modalType]);
   const modalRoute = route.route;
-
   const routeCallback = (modal, name) => {
     const {
       on,
       once
     } = options;
     let callback;
-
     if (name === 'open') {
       callback = on.modalOpen || once.modalOpen || on.panelOpen || once.panelOpen;
     }
-
     if (name === 'close') {
       callback = on.modalClose || once.modalClose || on.panelClose || once.panelClose;
     }
-
     if (name === 'closed') {
       callback = on.modalClosed || once.modalClosed || on.panelClosed || once.panelClosed;
     }
-
     if (callback) callback(modal);
   };
-
   function onModalLoaded() {
     // Create Modal
     const modal = app[modalType].create(modalParams);
     modalRoute.modalInstance = modal;
     const hasEl = modal.el;
-
     function closeOnSwipeBack() {
       modal.close();
     }
-
     modal.on(`${modalOrPanel}Open`, () => {
       if (!hasEl) {
         // Remove theme elements
-        router.removeThemeElements(modal.el); // Emit events
+        router.removeThemeElements(modal.el);
 
+        // Emit events
         modal.$el.trigger(`${modalType.toLowerCase()}:init ${modalType.toLowerCase()}:mounted`, route, modal);
         router.emit(`${!isPanel ? 'modalInit' : ''} ${modalType}Init ${modalType}Mounted`, modal.el, route, modal);
       }
-
       router.once('swipeBackMove', closeOnSwipeBack);
       routeCallback(modal, 'open');
     });
     modal.on(`${modalOrPanel}Close`, () => {
       router.off('swipeBackMove', closeOnSwipeBack);
-
       if (!modal.closeByRouter) {
         router.back();
       }
-
       routeCallback(modal, 'close');
     });
     modal.on(`${modalOrPanel}Closed`, () => {
@@ -79,22 +67,18 @@ function modalLoad(modalType, route, loadOptions, direction) {
       modal.emit(`${!isPanel ? 'modalBeforeRemove ' : ''}${modalType}BeforeRemove`, modal.el, route, modal);
       const modalComponent = modal.el.f7Component;
       routeCallback(modal, 'closed');
-
       if (modalComponent) {
         modalComponent.destroy();
       }
-
       nextTick(() => {
         if (modalComponent || modalParams.component || modalParams.asyncComponent) {
           router.removeModal(modal.el);
         }
-
         modal.destroy();
         delete modal.route;
         delete modalRoute.modalInstance;
       });
     });
-
     if (options.route) {
       // Update Browser History
       if (router.params.browserHistory && options.browserHistory) {
@@ -102,36 +86,36 @@ function modalLoad(modalType, route, loadOptions, direction) {
           url: options.route.url,
           modal: modalType
         }, (router.params.browserHistoryRoot || '') + router.params.browserHistorySeparator + options.route.url);
-      } // Set Route
-
+      }
 
+      // Set Route
       if (options.route !== router.currentRoute) {
         modal.route = extend(options.route, {
           modal
         });
         router.currentRoute = modal.route;
-      } // Update Router History
-
+      }
 
+      // Update Router History
       if (options.history && !options.reloadCurrent) {
         router.history.push(options.route.url);
         router.saveHistory();
       }
     }
-
     if (hasEl) {
       // Remove theme elements
-      router.removeThemeElements(modal.el); // Emit events
+      router.removeThemeElements(modal.el);
 
+      // Emit events
       modal.$el.trigger(`${modalType.toLowerCase()}:init ${modalType.toLowerCase()}:mounted`, route, modal);
       router.emit(`${modalOrPanel}Init ${modalType}Init ${modalType}Mounted`, modal.el, route, modal);
-    } // Open
-
+    }
 
+    // Open
     modal.open(options.animate === false || options.animate === true ? options.animate : undefined);
-  } // Load Modal Content
-
+  }
 
+  // Load Modal Content
   function loadModal(loadModalParams, loadModalOptions) {
     // Load Modal Props
     const {
@@ -139,8 +123,9 @@ function modalLoad(modalType, route, loadOptions, direction) {
       content,
       component,
       componentUrl
-    } = loadModalParams; // Component/Template Callbacks
+    } = loadModalParams;
 
+    // Component/Template Callbacks
     function resolve(contentEl) {
       if (contentEl) {
         if (typeof contentEl === 'string') {
@@ -153,16 +138,13 @@ function modalLoad(modalType, route, loadOptions, direction) {
         } else {
           modalParams.el = contentEl;
         }
-
         onModalLoaded();
       }
     }
-
     function reject() {
       router.allowPageChange = true;
       return router;
     }
-
     if (content) {
       resolve(content);
     } else if (component || componentUrl) {
@@ -186,7 +168,6 @@ function modalLoad(modalType, route, loadOptions, direction) {
         router.xhrAbortController.abort();
         router.xhrAbortController = false;
       }
-
       router.xhrRequest(url, loadModalOptions).then(modalContent => {
         modalParams.content = modalContent;
         onModalLoaded();
@@ -197,7 +178,6 @@ function modalLoad(modalType, route, loadOptions, direction) {
       onModalLoaded();
     }
   }
-
   let foundLoadProp;
   'url content component el componentUrl template'.split(' ').forEach(modalLoadProp => {
     if (modalParams[modalLoadProp] && !foundLoadProp) {
@@ -207,20 +187,17 @@ function modalLoad(modalType, route, loadOptions, direction) {
       }, options);
     }
   });
-
   if (!foundLoadProp && modalType === 'actions') {
     onModalLoaded();
-  } // Async
-
+  }
 
+  // Async
   function asyncResolve(resolveParams, resolveOptions) {
     loadModal(resolveParams, extend(options, resolveOptions));
   }
-
   function asyncReject() {
     router.allowPageChange = true;
   }
-
   if (modalParams.async) {
     modalParams.async.call(router, {
       router,
@@ -232,19 +209,15 @@ function modalLoad(modalType, route, loadOptions, direction) {
       app
     });
   }
-
   if (modalParams.asyncComponent) {
     asyncComponent(router, modalParams.asyncComponent, asyncResolve, asyncReject);
   }
-
   return router;
 }
-
 function modalRemove(modal) {
   extend(modal, {
     closeByRouter: true
   });
   modal.close();
 }
-
 export { modalLoad, modalRemove };