From 4dc355bdae58fd8cb910ae6fb2a7cc6acb0179f6 Mon Sep 17 00:00:00 2001
From: vakrilov <alexander.vakrilov@telerik.com>
Date: Tue, 26 Jul 2016 17:41:16 +0300
Subject: [PATCH] nav extensions snippets

---
 .../app/examples/router/router-outlet-test.ts |  2 +-
 .../snippets/navigation/navigation-common.ts  | 21 +----
 .../navigation/router-extensions.html         | 28 +++++++
 .../snippets/navigation/router-extensions.ts  | 80 +++++++++++++++++++
 4 files changed, 110 insertions(+), 21 deletions(-)
 create mode 100644 tests/app/snippets/navigation/router-extensions.html
 create mode 100644 tests/app/snippets/navigation/router-extensions.ts

diff --git a/ng-sample/app/examples/router/router-outlet-test.ts b/ng-sample/app/examples/router/router-outlet-test.ts
index 8855546a0..f5196b187 100644
--- a/ng-sample/app/examples/router/router-outlet-test.ts
+++ b/ng-sample/app/examples/router/router-outlet-test.ts
@@ -1,6 +1,6 @@
 import { Component, OnInit, OnDestroy } from "@angular/core";
 import { RouterConfig, ActivatedRoute, ROUTER_DIRECTIVES } from '@angular/router';
-import { NS_ROUTER_DIRECTIVES, nsProvideRouter} from "nativescript-angular/router"
+import { NS_ROUTER_DIRECTIVES, nsProvideRouter} from "nativescript-angular/router";
 
 @Component({
     selector: "first",
diff --git a/tests/app/snippets/navigation/navigation-common.ts b/tests/app/snippets/navigation/navigation-common.ts
index 432fbc206..f85434dfa 100644
--- a/tests/app/snippets/navigation/navigation-common.ts
+++ b/tests/app/snippets/navigation/navigation-common.ts
@@ -23,23 +23,4 @@ export class FirstComponent { }
     </StackLayout>`
 })
 export class SecondComponent { }
-// << router-content-components
-
-
-// >> router-location-back
-import {Location} from '@angular/common';
-
-@Component({ 
-    // ...
-    // >> (hide)
-    template: '', selector:"go-back"
-    // << (hide)
-})
-export class MyComponent {
-    constructor(private location: Location) { }
-
-    public goBack() {
-        this.location.back();
-    }
-}
-// << router-location-back
+// << router-content-components
\ No newline at end of file
diff --git a/tests/app/snippets/navigation/router-extensions.html b/tests/app/snippets/navigation/router-extensions.html
new file mode 100644
index 000000000..0a00fb05f
--- /dev/null
+++ b/tests/app/snippets/navigation/router-extensions.html
@@ -0,0 +1,28 @@
+<StackLayout>
+    <Label text="Second component" class="title"></Label>
+    <!-- >> router-clear-history-link -->
+    <Button text="login" [nsRouterLink]="['/main']" clearHistory="true"></Button>
+    <!-- << router-clear-history-link -->
+
+    <!-- >> router-page-transition-link -->
+    <Button text="flip to next" [nsRouterLink]="['/main']" pageTransition="flip"></Button>
+    <Button text="no transition" [nsRouterLink]="['/main']" pageTransition="none"></Button>
+    <!-- << router-page-transition-link -->
+
+
+    <!-- >> router-clear-history-code-->
+    <Button text="login" (tap)="login()"></Button>
+    <!-- << router-clear-history-code -->
+
+    <!-- >> router-back -->
+    <Button text="< BACK" (tap)="goBack()"></Button>
+    <!-- << router-back -->
+
+    <!-- >> router-page-back -->
+    <Button text="<< BACK" (tap)="goBackPage()"></Button>
+    <!-- << router-page-back -->
+
+    <!-- >> router-page-transition-code -->
+    <Button text="flip to next" (tap)="flipToNextPage()"></Button>
+    <!-- << router-page-transition-code -->
+</StackLayout>
\ No newline at end of file
diff --git a/tests/app/snippets/navigation/router-extensions.ts b/tests/app/snippets/navigation/router-extensions.ts
new file mode 100644
index 000000000..ff0d5ac44
--- /dev/null
+++ b/tests/app/snippets/navigation/router-extensions.ts
@@ -0,0 +1,80 @@
+import {Component} from "@angular/core";
+import {nativeScriptBootstrap} from 'nativescript-angular/application';
+import {NS_ROUTER_DIRECTIVES } from 'nativescript-angular/router';
+import {nsProvideRouter} from 'nativescript-angular/router';
+import {RouterConfig} from '@angular/router';
+
+
+import { RouterExtensions } from 'nativescript-angular/router';
+
+@Component({
+    // ...
+    // >> (hide)
+    selector: "router-extensions-import",
+    directives: [NS_ROUTER_DIRECTIVES],
+    templateUrl: 'snippets/navigation/router-extensions.html'
+    // << (hide)
+})
+export class MyComponent {
+    constructor(private routerExtensions: RouterExtensions) { }
+
+    // >> router-clear-history-code
+    login() {
+        // app logic here ...
+        this.routerExtensions.navigate(["/main"], { clearHistory: true });
+    }
+    // << router-clear-history-code
+
+    // >> router-back
+    public goBack() {
+        this.routerExtensions.back();
+    }
+    // << router-back
+
+    // >> router-page-back
+    public goBackPage() {
+        this.routerExtensions.backToPreviousPage();
+    }
+    // << router-page-back
+
+    // >> router-page-transition-code
+    flipToNextPage() {
+        this.routerExtensions.navigate(["/main"], {
+            transition: {
+                name: "flip",
+                duration: 2000,
+                curve: "linear"
+            }
+        });
+    }
+    // << router-page-transition-code
+}
+
+// >> router-extensions-import
+@Component({
+    // ...
+    // >> (hide)
+    selector: 'component',
+    template: `<StackLayout><Label text="Main Page"></Label></StackLayout>`
+    // << (hide)
+})
+export class MainComponent {
+    constructor(private routerExtensions: RouterExtensions) {
+        // ...
+    }
+}
+// << router-extensions-import
+
+@Component({
+    selector: 'application',
+    directives: [NS_ROUTER_DIRECTIVES],
+    template: "<page-router-outlet></page-router-outlet>"
+})
+export class App { }
+
+const routes: RouterConfig = [
+    { path: "", component: MyComponent },
+    { path: "main", component: MainComponent },
+];
+
+export const providers = nsProvideRouter(routes, {});