Skip to content

ClearHistory and PageTransitions #368

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 2 commits into from
Jul 26, 2016
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
3 changes: 2 additions & 1 deletion nativescript-angular/application.ts
Original file line number Diff line number Diff line change
Expand Up @@ -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;
Expand Down Expand Up @@ -91,6 +91,7 @@ export function bootstrap(appComponentType: any,
}, deps: []
}),

defaultFrameProvider,
defaultPageProvider,
defaultDeviceProvider,
defaultAnimationDriverProvider,
Expand Down
4 changes: 3 additions & 1 deletion nativescript-angular/platform-providers.ts
Original file line number Diff line number Diff line change
@@ -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";
Expand All @@ -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 });
12 changes: 6 additions & 6 deletions nativescript-angular/router-deprecated/page-router-outlet.ts
Original file line number Diff line number Diff line change
Expand Up @@ -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);
Expand All @@ -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();
Expand Down Expand Up @@ -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
Expand All @@ -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();
}
}));
Expand Down Expand Up @@ -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();
Expand Down Expand Up @@ -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);
}
}
108 changes: 79 additions & 29 deletions nativescript-angular/router/ns-location-strategy.ts
Original file line number Diff line number Diff line change
@@ -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 {
Expand All @@ -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({
Expand All @@ -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 {
Expand All @@ -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);
}
}
Expand All @@ -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);
}
}
Expand All @@ -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();
}
}
18 changes: 2 additions & 16 deletions nativescript-angular/router/ns-platform-location.ts
Original file line number Diff line number Diff line change
Expand Up @@ -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();
}
}
Loading