Merge pull request #368 from NativeScript/clear-history

ClearHistory and PageTransitions

Author: Alexander Vakrilov

Diff for: nativescript-angular/application.ts

@@ -30,7 +30,7 @@ import {topmost, NavigationEntry} from "ui/frame";
 
 export type ProviderArray = Array<Type | Provider | any[]>;
 
-import {defaultPageProvider, defaultDeviceProvider, defaultAnimationDriverProvider} from "./platform-providers";
+import {defaultPageProvider, defaultFrameProvider, defaultDeviceProvider, defaultAnimationDriverProvider} from "./platform-providers";
 
 import * as nativescriptIntl from "nativescript-intl";
 global.Intl = nativescriptIntl;
@@ -91,6 +91,7 @@ export function bootstrap(appComponentType: any,
             }, deps: []
         }),
 
+        defaultFrameProvider,
         defaultPageProvider,
         defaultDeviceProvider,
         defaultAnimationDriverProvider,

Diff for: nativescript-angular/platform-providers.ts

@@ -1,4 +1,4 @@
-import {topmost} from 'ui/frame';
+import {topmost, Frame} from 'ui/frame';
 import {Page} from 'ui/page';
 import {provide, Provider, OpaqueToken} from '@angular/core/src/di';
 import {device} from "platform";
@@ -19,6 +19,8 @@ export function getDefaultPage(): Page {
     }
 }
 
+export const defaultFrameProvider = provide(Frame, { useFactory: topmost });
+
 export const defaultDeviceProvider = provide(DEVICE, { useValue: device });
 
 export const defaultAnimationDriverProvider = provide(AnimationDriver, { useClass: NativeScriptAnimationDriver });

Diff for: nativescript-angular/router-deprecated/page-router-outlet.ts

@@ -98,7 +98,7 @@ export class PageRouterOutlet extends RouterOutlet {
         let previousInstruction = this.currentInstruction;
         this.currentInstruction = nextInstruction;
 
-        if (this.location.isPageNavigatingBack()) {
+        if (this.location._isPageNavigatingBack()) {
             return this.activateOnGoBack(nextInstruction, previousInstruction);
         } else {
             return this.activateOnGoForward(nextInstruction, previousInstruction);
@@ -108,7 +108,7 @@ export class PageRouterOutlet extends RouterOutlet {
     private activateOnGoBack(nextInstruction: ComponentInstruction, previousInstruction: ComponentInstruction): Promise<any> {
         routerLog("PageRouterOutlet.activate() - Back naviation, so load from cache: " + nextInstruction.componentType.name);
 
-        this.location.finishBackPageNavigation();
+        this.location._finishBackPageNavigation();
 
         // Get Component form ref and just call the activate hook
         let cacheItem = this.refCache.peek();
@@ -177,7 +177,7 @@ export class PageRouterOutlet extends RouterOutlet {
         //Add it to the new page
         page.content = componentView;
 
-        this.location.navigateToNewPage();
+        this.location._beginPageNavigation();
         return new Promise((resolve, reject) => {
             page.on('navigatingTo', () => {
                 // Finish activation when page navigation has started
@@ -186,7 +186,7 @@ export class PageRouterOutlet extends RouterOutlet {
 
             page.on('navigatedFrom', (<any>global).Zone.current.wrap((args: NavigatedData) => {
                 if (args.isBackNavigation) {
-                    this.location.beginBackPageNavigation();
+                    this.location._beginBackPageNavigation();
                     this.location.back();
                 }
             }));
@@ -214,7 +214,7 @@ export class PageRouterOutlet extends RouterOutlet {
                 (<OnDeactivate>this.componentRef.instance).routerOnDeactivate(nextInstruction, this.currentInstruction));
         }
 
-        if (this.location.isPageNavigatingBack()) {
+        if (this.location._isPageNavigatingBack()) {
             routerLog("PageRouterOutlet.deactivate() while going back - should destroy: " + instruction.componentType.name)
             return next.then((_) => {
                 const popedItem = this.refCache.pop();
@@ -311,6 +311,6 @@ export class PageRouterOutlet extends RouterOutlet {
     }
 
     private log(method: string, nextInstruction: ComponentInstruction) {
-        routerLog("PageRouterOutlet." + method + " isBack: " + this.location.isPageNavigatingBack() + " nextUrl: " + nextInstruction.urlPath);
+        routerLog("PageRouterOutlet." + method + " isBack: " + this.location._isPageNavigatingBack() + " nextUrl: " + nextInstruction.urlPath);
     }
 }

Diff for: nativescript-angular/router/ns-location-strategy.ts

@@ -1,33 +1,48 @@
 import application = require("application");
+import { Injectable } from '@angular/core';
 import { LocationStrategy } from '@angular/common';
-import { NgZone, ApplicationRef, Inject, forwardRef } from '@angular/core';
 import { routerLog } from "../trace";
-import { topmost } from "ui/frame";
+import { Frame, NavigationTransition } from "ui/frame";
+import {isPresent} from '@angular/core/src/facade/lang';
 
-interface LocationState {
+export interface NavigationOptions {
+    clearHistory?: boolean;
+    animated?: boolean;
+    transition?: NavigationTransition;
+}
+
+const defaultNavOptions: NavigationOptions = {
+    clearHistory: false,
+    animated: true
+};
+
+export interface LocationState {
     state: any,
     title: string,
     url: string,
     queryParams: string,
     isPageNavigation: boolean
 }
 
+@Injectable()
 export class NSLocationStrategy extends LocationStrategy {
     private states = new Array<LocationState>();
     private popStateCallbacks = new Array<(_: any) => any>();
 
     private _isPageNavigationgBack = false;
     private _isPageNavigatingForward: boolean = false;
+    private _currentNavigationOptions: NavigationOptions;
 
-    constructor() {
+    constructor(private frame: Frame) {
         super();
         routerLog("NSLocationStrategy.constructor()");
     }
 
     path(): string {
-        routerLog("NSLocationStrategy.path()");
         let state = this.peekState();
-        return state ? state.url : "/";
+        const result = state ? state.url : "/";
+        routerLog("NSLocationStrategy.path(): " + result);
+        return result;
     }
 
     prepareExternalUrl(internal: string): string {
@@ -42,7 +57,16 @@ export class NSLocationStrategy extends LocationStrategy {
     }
 
     pushStateInternal(state: any, title: string, url: string, queryParams: string): void {
-        let isNewPage = this._isPageNavigatingForward;
+        let isNewPage = this._isPageNavigatingForward || this.states.length === 0;
+
+        const navOptions = this._currentNavigationOptions || defaultNavOptions;
+
+        if (navOptions.clearHistory) {
+            routerLog("NSLocationStrategy.pushStateInternal clearing states history");
+            this.states.length = 0;
+        }
+
+        this._currentNavigationOptions = undefined;
 
         this._isPageNavigatingForward = false;
         this.states.push({
@@ -55,19 +79,22 @@ export class NSLocationStrategy extends LocationStrategy {
     }
 
     replaceState(state: any, title: string, url: string, queryParams: string): void {
-        routerLog(`NSLocationStrategy.replaceState state: ${state}, title: ${title}, url: ${url}, queryParams: ${queryParams}`);
-        
         if (this.states.length > 0) {
-            let oldState = this.states.pop();
-            routerLog(`NSLocationStrategy.replaceState state poped: ${oldState.state}, title: ${oldState.title}, url: ${oldState.url}, queryParams: ${oldState.queryParams}`);
+            routerLog(`NSLocationStrategy.replaceState changing exisitng state: ${state}, title: ${title}, url: ${url}, queryParams: ${queryParams}`);
+            const topState = this.peekState();
+            topState.state = state;
+            topState.title = title;
+            topState.url = url;
+            topState.queryParams = queryParams;
+        }
+        else {
+            routerLog(`NSLocationStrategy.replaceState pushing new state: ${state}, title: ${title}, url: ${url}, queryParams: ${queryParams}`);
+            this.pushStateInternal(state, title, url, queryParams);
         }
-
-        this.pushStateInternal(state, title, url, queryParams);
     }
 
     forward(): void {
-        routerLog("NSLocationStrategy.forward");
-        throw new Error("Not implemented");
+        throw new Error("NSLocationStrategy.forward() - not implemented");
     }
 
     back(): void {
@@ -76,21 +103,23 @@ export class NSLocationStrategy extends LocationStrategy {
             // clear the stack until we get to a page navigation state
             let state = this.states.pop();
             let count = 1;
-            while (!state.isPageNavigation) {
+
+            while (!(state.isPageNavigation)) {
                 state = this.states.pop();
                 count++;
             }
-            routerLog("NSLocationStrategy.back() while navigating back. States popped: " + count)
+
+            routerLog("NSLocationStrategy.back() while navigating back. States popped: " + count);
             this.callPopState(state, true);
         } else {
             let state = this.peekState();
             if (state.isPageNavigation) {
                 // This was a page navigation - so navigate through frame.
-                routerLog("NSLocationStrategy.back() while not navigating back but top state is page - will call frame.goback()")
-                topmost().goBack();
+                routerLog("NSLocationStrategy.back() while not navigating back but top state is page - will call frame.goback()");
+                this.frame.goBack();
             } else {
                 // Nested navigation - just pop the state
-                routerLog("NSLocationStrategy.back() while not navigating back but top state is not page - just pop")
+                routerLog("NSLocationStrategy.back() while not navigating back but top state is not page - just pop");
                 this.callPopState(this.states.pop(), true);
             }
         }
@@ -108,8 +137,8 @@ export class NSLocationStrategy extends LocationStrategy {
     }
 
     private callPopState(state: LocationState, pop: boolean = true) {
-        var change = { url: state.url, pop: pop };
-        for (var fn of this.popStateCallbacks) {
+        const change = { url: state.url, pop: pop };
+        for (let fn of this.popStateCallbacks) {
             fn(change);
         }
     }
@@ -121,32 +150,53 @@ export class NSLocationStrategy extends LocationStrategy {
         return null;
     }
 
+    public toString() {
+        return this.states
+            .map((v, i) => `${i}.[${v.isPageNavigation ? "PAGE" : "INTERNAL"}] "${v.url}"`)
+            .reverse()
+            .join("\n");
+    }
+
     // Methods for syncing with page navigation in PageRouterOutlet
-    public beginBackPageNavigation() {
+    public _beginBackPageNavigation() {
         routerLog("NSLocationStrategy.startGoBack()");
         if (this._isPageNavigationgBack) {
-            throw new Error("Calling startGoBack while going back.")
+            throw new Error("Calling startGoBack while going back.");
         }
         this._isPageNavigationgBack = true;
     }
 
-    public finishBackPageNavigation() {
+    public _finishBackPageNavigation() {
         routerLog("NSLocationStrategy.finishBackPageNavigation()");
         if (!this._isPageNavigationgBack) {
-            throw new Error("Calling endGoBack while not going back.")
+            throw new Error("Calling endGoBack while not going back.");
         }
         this._isPageNavigationgBack = false;
     }
 
-    public isPageNavigatingBack() {
+    public _isPageNavigatingBack() {
         return this._isPageNavigationgBack;
     }
 
-    public navigateToNewPage() {
+    public _beginPageNavigation(): NavigationOptions {
         routerLog("NSLocationStrategy.navigateToNewPage()");
         if (this._isPageNavigatingForward) {
-            throw new Error("Calling navigateToNewPage while already navigating to new page.")
+            throw new Error("Calling navigateToNewPage while already navigating to new page.");
         }
+
         this._isPageNavigatingForward = true;
+        return this._currentNavigationOptions || defaultNavOptions;
+    }
+
+    public _setNavigationOptions(options: NavigationOptions) {
+        this._currentNavigationOptions = {
+            clearHistory: isPresent(options.clearHistory) ? options.clearHistory : false,
+            animated: isPresent(options.animated) ? options.animated : true,
+            transition: options.transition
+        };
+    }
+
+    public _getSatates(): Array<LocationState> {
+        return this.states.slice();
     }
 }

Diff for: nativescript-angular/router/ns-platform-location.ts

@@ -17,52 +17,38 @@ export class NativescriptPlatformLocation extends PlatformLocation {
     }
 
     onPopState(fn: UrlChangeListener): void {
-        routerLog("NativescriptPlatformLocation.onPopState()");
         this.locationStartegy.onPopState(fn);
     }
 
     onHashChange(fn: UrlChangeListener): void {
-        routerLog("NativescriptPlatformLocation.onHashChange()");
     }
 
     get search(): string {
-        routerLog("NativescriptPlatformLocation.get search()");
-
         return "";
     }
     get hash(): string {
-        routerLog("NativescriptPlatformLocation.get hash()");
-
         return "";
     }
     get pathname(): string {
-        routerLog("NativescriptPlatformLocation.get pathname()");
         return this.locationStartegy.path();
     }
     set pathname(newPath: string) {
-        routerLog("NativescriptPlatformLocation.set pathname(): " + newPath);
+        throw new Error("NativescriptPlatformLocation set pathname - not implemented")
     }
 
     pushState(state: any, title: string, url: string): void {
-        routerLog("NativescriptPlatformLocation.pushState()");
-
         this.locationStartegy.pushState(state, title, url, null);
     }
 
     replaceState(state: any, title: string, url: string): void {
-        routerLog("NativescriptPlatformLocation.replaceState()");
         this.locationStartegy.replaceState(state, title, url, null);
     }
 
     forward(): void {
-        routerLog("NativescriptPlatformLocation.forward()");
-
-        throw new Error("NativescriptPlatformLocation.forward() not implemend");
+        throw new Error("NativescriptPlatformLocation.forward() - not implemented");
     }
 
     back(): void {
-        routerLog("NativescriptPlatformLocation.back()");
-        
         this.locationStartegy.back();
     }
 }