caspervk/nightr
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Added routing through Angular

Browse Source
This commit is contained in:
Christian Lynggaard Jørgensen 2019-04-06 23:11:23 +02:00
parent 8826d77647
commit e1ae6d2d54
11 changed files with 128 additions and 46 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
client/Nightr/package-lock.json generated
View File

@ -3999,6 +3999,21 @@
"resolved": "https://registry.npmjs.org/nativescript-permissions/-/nativescript-permissions-1.2.3.tgz",
"integrity": "sha1-4+ZVRfmP5IjdVXj3/5DrrjCI5wA="
},
"nativescript-powerinfo": {
"version": "1.0.7",
"resolved": "https://registry.npmjs.org/nativescript-powerinfo/-/nativescript-powerinfo-1.0.7.tgz",
"integrity": "sha1-ZXIq2bQwxIR7lRJT5kUmt1zsGXo=",
"requires": {
"typescript": "^1.8.10"
},
"dependencies": {
"typescript": {
"version": "1.8.10",
"resolved": "https://registry.npmjs.org/typescript/-/typescript-1.8.10.tgz",
"integrity": "sha1-tHXW4N/wv1DyluXKbvn7tccyDx4="
}
}
},
"nativescript-theme-core": {
"version": "1.0.4",
"resolved": "https://registry.npmjs.org/nativescript-theme-core/-/nativescript-theme-core-1.0.4.tgz",

1
client/Nightr/package.json
View File

@ -24,6 +24,7 @@
"nativescript-angular": "~7.2.0",
"nativescript-camera": "^4.4.0",
"nativescript-geolocation": "^5.0.0",
"nativescript-powerinfo": "^1.0.7",
"nativescript-theme-core": "~1.0.4",
"reflect-metadata": "~0.1.12",
"rxjs": "~6.3.0",

15
client/Nightr/src/app/app.component.html
View File

@ -1,12 +1,3 @@
<AbsoluteLayout>
<ns-side-drawer></ns-side-drawer>
<StackLayout class="float-btn-container">
<ns-my-button (tap)=onTap($event) text="Nightr"></ns-my-button>
</StackLayout>
<StackLayout>
<ns-locationButton></ns-locationButton>
<ns-camera-button></ns-camera-button>
</StackLayout>
</AbsoluteLayout>
<GridLayout>
<page-router-outlet></page-router-outlet>
</GridLayout>

35
client/Nightr/src/app/app.component.ts
View File

@ -1,41 +1,8 @@
import { Component } from "@angular/core";
import * as dialogs from "tns-core-modules/ui/dialogs";
import { MyHttpPostService } from './services/my-http-post-service'
import { TouchGestureEventData, GestureEventData } from 'tns-core-modules/ui/gestures'
import { isEnabled, enableLocationRequest, getCurrentLocation, watchLocation, distance, clearWatch } from "nativescript-geolocation";
@Component({
selector: "ns-app",
moduleId: module.id,
templateUrl: "./app.component.html",
styleUrls: ['./app.component.css'],
providers: [MyHttpPostService]
})
export class AppComponent {
public user: string = "";
public pass: string = "";
returnMessage: string = "";
constructor(private myHttpPostSerivce: MyHttpPostService) { }
public onTap(args: GestureEventData): any {
this.submit();
dialogs.confirm("Should be result").then(result => {
console.log("Dialog result: " + result);
});
}
public submit(): void {
this.makePostRequest();
}
private makePostRequest(): void {
console.log('Reached makepostRequest');
this.myHttpPostSerivce
.postData({ username: this.user, password: this.pass })
.subscribe(res => {
console.log('This is res', res);
this.returnMessage = (<any>res).json.data.username;
});
}
}
export class AppComponent {}

11
client/Nightr/src/app/app.module.ts
View File

@ -1,11 +1,14 @@
import { NgModule, NO_ERRORS_SCHEMA } from "@angular/core";
import { NativeScriptModule } from "nativescript-angular/nativescript.module";
import { NativeScriptRouterModule } from "nativescript-angular/router";
import { AppComponent } from "./app.component";
import { HomePageComponent } from "./home-page/home-page.component";
import { MyButtonComponent } from './component/my-button/my-button.component';
import { NativeScriptHttpClientModule } from "nativescript-angular/http-client";
import { MyLocationButtonComponent } from './component/locationButton/locationButton.component';
import { CameraButtonComponent } from './component/camera-button/camera-button.component';
import { ResultPageComponent } from './result-page/result-page.component';
// Uncomment and add to NgModule imports if you need to use two-way binding
// import { NativeScriptFormsModule } from "nativescript-angular/forms";
@ -18,6 +21,12 @@ import { CameraButtonComponent } from './component/camera-button/camera-button.c
AppComponent
],
imports: [
NativeScriptRouterModule,
NativeScriptRouterModule.forRoot([
{ path: "", redirectTo: "/home-page", pathMatch: "full" },
{ path: "home-page", component: HomePageComponent},
{ path: "result-page", component: ResultPageComponent}
]),
NativeScriptModule,
NativeScriptHttpClientModule,
],
@ -26,6 +35,8 @@ import { CameraButtonComponent } from './component/camera-button/camera-button.c
MyLocationButtonComponent,
MyButtonComponent,
CameraButtonComponent,
ResultPageComponent,
HomePageComponent,
],
providers: [],
schemas: [

5
client/Nightr/src/app/home-page/home-page.component.css Normal file
View File

@ -0,0 +1,5 @@
.float-btn-container
{
margin-top: 35%;
margin-left: 20%;
}

14
client/Nightr/src/app/home-page/home-page.component.html Normal file
View File

@ -0,0 +1,14 @@
<ActionBar title="Home" class="action-bar"></ActionBar>
<ScrollView class="page">
<AbsoluteLayout>
<StackLayout class="float-btn-container">
<ns-my-button (tap)=onTap($event) text="Nightr"></ns-my-button>
</StackLayout>
<StackLayout>
<ns-locationButton></ns-locationButton>
<ns-camera-button></ns-camera-button>
<Button class="btn btn-primary" text="Result page" [nsRouterLink]="['/result-page']"></Button>
</StackLayout>
</AbsoluteLayout>
</ScrollView>

49
client/Nightr/src/app/home-page/home-page.component.ts Normal file
View File

@ -0,0 +1,49 @@
import { Component, OnInit } from "@angular/core";
import * as dialogs from "tns-core-modules/ui/dialogs";
import { MyHttpPostService } from '../services/my-http-post-service'
import { RouterExtensions } from "nativescript-angular/router";
import { TouchGestureEventData, GestureEventData } from 'tns-core-modules/ui/gestures'
import { isEnabled, enableLocationRequest, getCurrentLocation, watchLocation, distance, clearWatch } from "nativescript-geolocation";
@Component({
selector: "home-page",
moduleId: module.id,
templateUrl: './home-page.component.html',
styleUrls: ['./home-page.component.css'],
providers: [MyHttpPostService]
})
export class HomePageComponent implements OnInit {
public user: string = "";
public pass: string = "";
returnMessage: string = "";
constructor(private myHttpPostSerivce: MyHttpPostService, private routerExtensions: RouterExtensions) { }
public onTap(args: GestureEventData): any {
this.routerExtensions.navigateByUrl("/result-page");
this.submit();
dialogs.confirm("Should be result").then(result => {
console.log("Dialog result: " + result);
});
}
public submit(): void {
this.makePostRequest();
}
private makePostRequest(): void {
console.log('Reached makepostRequest');
this.myHttpPostSerivce
.postData({ username: this.user, password: this.pass })
.subscribe(res => {
console.log('This is res', res);
this.returnMessage = (<any>res).json.data.username;
});
}
ngOnInit(): void {
}
goBack(): void {
this.routerExtensions.back();
}
}

1
client/Nightr/src/app/result-page/result-page.component.css Normal file
View File

@ -0,0 +1 @@
/* Add mobile styles for the component here. */

7
client/Nightr/src/app/result-page/result-page.component.html Normal file
View File

@ -0,0 +1,7 @@
<ActionBar title="Result" class="action-bar"></ActionBar>
<ScrollView class="page">
<AbsoluteLayout>
<Button class="btn btn-primary" text="Home" [nsRouterLink]="['/home-page']"></Button>
</AbsoluteLayout>
</ScrollView>

21
client/Nightr/src/app/result-page/result-page.component.ts Normal file
View File

@ -0,0 +1,21 @@
import { Component, OnInit } from '@angular/core';
import { RouterExtensions } from 'nativescript-angular/router';
@Component({
selector: 'result-page',
templateUrl: './result-page.component.html',
styleUrls: ['./result-page.component.css'],
moduleId: module.id,
})
export class ResultPageComponent implements OnInit {
constructor(private routerExtensions: RouterExtensions) { }
ngOnInit(): void {
}
goBack(): void {
this.routerExtensions.back();
}
}