Skip to content

Commit 78a1f6f

Browse files
author
shantanu_kamdi
committed
Add FCM notifications and Styles
1 parent 1589dff commit 78a1f6f

20 files changed

+241
-139
lines changed

‎config.xml

+1
Original file line numberDiff line numberDiff line change
@@ -79,6 +79,7 @@
7979
</platform>
8080
<plugin name="cordova-plugin-console" spec="1.0.5" />
8181
<plugin name="cordova-plugin-device" spec="1.1.4" />
82+
<plugin name="cordova-plugin-fcm" spec="^2.1.2" />
8283
<plugin name="cordova-plugin-network-information" spec="^1.3.3" />
8384
<plugin name="cordova-plugin-splashscreen" spec="~4.0.1" />
8485
<plugin name="cordova-plugin-statusbar" spec="2.2.2" />

‎google-services.json

+42
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,42 @@
1+
{
2+
"project_info": {
3+
"project_number": "108315354380",
4+
"firebase_url": "https://fhc-app-47154.firebaseio.com",
5+
"project_id": "fhc-app-47154",
6+
"storage_bucket": "fhc-app-47154.appspot.com"
7+
},
8+
"client": [
9+
{
10+
"client_info": {
11+
"mobilesdk_app_id": "1:108315354380:android:08df404de14ca906",
12+
"android_client_info": {
13+
"package_name": "com.ionicframework.fhcapp585995"
14+
}
15+
},
16+
"oauth_client": [
17+
{
18+
"client_id": "108315354380-r02616c93kbc3kshakvjrqvsjn9sib07.apps.googleusercontent.com",
19+
"client_type": 3
20+
}
21+
],
22+
"api_key": [
23+
{
24+
"current_key": "AIzaSyA_otJq83uyPbHfWjnXOgJWYHNMMXXI7QA"
25+
}
26+
],
27+
"services": {
28+
"analytics_service": {
29+
"status": 1
30+
},
31+
"appinvite_service": {
32+
"status": 1,
33+
"other_platform_oauth_client": []
34+
},
35+
"ads_service": {
36+
"status": 2
37+
}
38+
}
39+
}
40+
],
41+
"configuration_version": "1"
42+
}

‎package.json

+74-72
Original file line numberDiff line numberDiff line change
@@ -1,74 +1,76 @@
11
{
2-
"name": "ionic-hello-world",
3-
"version": "0.0.0",
4-
"author": "Ionic Framework",
5-
"homepage": "http://ionicframework.com/",
6-
"private": true,
7-
"scripts": {
8-
"clean": "ionic-app-scripts clean",
9-
"build": "ionic-app-scripts build",
10-
"lint": "ionic-app-scripts lint",
11-
"ionic:build": "ionic-app-scripts build",
12-
"ionic:serve": "ionic-app-scripts serve"
13-
},
14-
"dependencies": {
15-
"@angular/common": "4.1.2",
16-
"@angular/compiler": "4.1.2",
17-
"@angular/compiler-cli": "4.1.2",
18-
"@angular/core": "4.1.2",
19-
"@angular/forms": "4.1.2",
20-
"@angular/http": "4.1.2",
21-
"@angular/platform-browser": "4.1.2",
22-
"@angular/platform-browser-dynamic": "4.1.2",
23-
"@ionic-native/core": "3.10.2",
24-
"@ionic-native/keyboard": "^3.12.1",
25-
"@ionic-native/network": "^3.12.1",
26-
"@ionic-native/splash-screen": "3.10.2",
27-
"@ionic-native/status-bar": "3.10.2",
28-
"@ionic-native/toast": "^3.12.1",
29-
"@ionic/storage": "2.0.1",
30-
"angularfire2": "^4.0.0-rc.1",
31-
"cordova-plugin-console": "1.0.5",
32-
"cordova-plugin-device": "1.1.4",
33-
"cordova-plugin-network-information": "^1.3.3",
34-
"cordova-plugin-splashscreen": "~4.0.1",
35-
"cordova-plugin-statusbar": "2.2.2",
36-
"cordova-plugin-whitelist": "1.3.1",
37-
"cordova-plugin-x-toast": "^2.6.0",
38-
"firebase": "^4.1.1",
39-
"ionic-angular": "3.3.0",
40-
"ionic-plugin-keyboard": "~2.2.1",
41-
"ionicons": "3.0.0",
42-
"rxjs": "5.1.1",
43-
"sw-toolbox": "3.6.0",
44-
"zone.js": "0.8.11"
45-
},
46-
"devDependencies": {
47-
"@ionic/app-scripts": "1.3.7",
48-
"@ionic/cli-plugin-cordova": "1.3.0",
49-
"@ionic/cli-plugin-ionic-angular": "1.3.0",
50-
"typescript": "2.3.3"
51-
},
52-
"cordovaPlugins": [
53-
"cordova-plugin-whitelist",
54-
"cordova-plugin-console",
55-
"cordova-plugin-statusbar",
56-
"cordova-plugin-device",
57-
"cordova-plugin-splashscreen",
58-
"ionic-plugin-keyboard"
59-
],
60-
"cordovaPlatforms": [],
61-
"description": "fhc-app: An Ionic project",
62-
"cordova": {
63-
"plugins": {
64-
"cordova-plugin-x-toast": {},
65-
"cordova-plugin-network-information": {},
66-
"cordova-plugin-console": {},
67-
"cordova-plugin-device": {},
68-
"cordova-plugin-splashscreen": {},
69-
"cordova-plugin-statusbar": {},
70-
"cordova-plugin-whitelist": {},
71-
"ionic-plugin-keyboard": {}
2+
"name": "ionic-hello-world",
3+
"version": "0.0.0",
4+
"author": "Ionic Framework",
5+
"homepage": "http://ionicframework.com/",
6+
"private": true,
7+
"scripts": {
8+
"clean": "ionic-app-scripts clean",
9+
"build": "ionic-app-scripts build",
10+
"lint": "ionic-app-scripts lint",
11+
"ionic:build": "ionic-app-scripts build",
12+
"ionic:serve": "ionic-app-scripts serve"
13+
},
14+
"dependencies": {
15+
"@angular/common": "4.1.2",
16+
"@angular/compiler": "4.1.2",
17+
"@angular/compiler-cli": "4.1.2",
18+
"@angular/core": "4.1.2",
19+
"@angular/forms": "4.1.2",
20+
"@angular/http": "4.1.2",
21+
"@angular/platform-browser": "4.1.2",
22+
"@angular/platform-browser-dynamic": "4.1.2",
23+
"@ionic-native/core": "3.10.2",
24+
"@ionic-native/keyboard": "^3.12.1",
25+
"@ionic-native/network": "^3.12.1",
26+
"@ionic-native/splash-screen": "3.10.2",
27+
"@ionic-native/status-bar": "3.10.2",
28+
"@ionic-native/toast": "^3.12.1",
29+
"@ionic/storage": "2.0.1",
30+
"angularfire2": "^4.0.0-rc.1",
31+
"cordova-plugin-console": "1.0.5",
32+
"cordova-plugin-device": "1.1.4",
33+
"cordova-plugin-fcm": "^2.1.2",
34+
"cordova-plugin-network-information": "^1.3.3",
35+
"cordova-plugin-splashscreen": "~4.0.1",
36+
"cordova-plugin-statusbar": "2.2.2",
37+
"cordova-plugin-whitelist": "1.3.1",
38+
"cordova-plugin-x-toast": "^2.6.0",
39+
"firebase": "^4.1.1",
40+
"ionic-angular": "3.3.0",
41+
"ionic-plugin-keyboard": "~2.2.1",
42+
"ionicons": "3.0.0",
43+
"rxjs": "5.1.1",
44+
"sw-toolbox": "3.6.0",
45+
"zone.js": "0.8.11"
46+
},
47+
"devDependencies": {
48+
"@ionic/app-scripts": "1.3.7",
49+
"@ionic/cli-plugin-cordova": "1.3.0",
50+
"@ionic/cli-plugin-ionic-angular": "1.3.0",
51+
"typescript": "2.3.3"
52+
},
53+
"cordovaPlugins": [
54+
"cordova-plugin-whitelist",
55+
"cordova-plugin-console",
56+
"cordova-plugin-statusbar",
57+
"cordova-plugin-device",
58+
"cordova-plugin-splashscreen",
59+
"ionic-plugin-keyboard"
60+
],
61+
"cordovaPlatforms": [],
62+
"description": "fhc-app: An Ionic project",
63+
"cordova": {
64+
"plugins": {
65+
"cordova-plugin-x-toast": {},
66+
"cordova-plugin-network-information": {},
67+
"cordova-plugin-console": {},
68+
"cordova-plugin-device": {},
69+
"cordova-plugin-splashscreen": {},
70+
"cordova-plugin-statusbar": {},
71+
"cordova-plugin-whitelist": {},
72+
"ionic-plugin-keyboard": {},
73+
"cordova-plugin-fcm": {}
74+
}
7275
}
73-
}
74-
}
76+
}

‎src/app/app.component.ts

+5-2
Original file line numberDiff line numberDiff line change
@@ -6,6 +6,8 @@ import { Keyboard } from '@ionic-native/keyboard';
66

77
import { AngularFireAuth } from 'angularfire2/auth';
88

9+
declare var FCMPlugin;
10+
911
@Component({
1012
templateUrl: 'app.html'
1113
})
@@ -27,17 +29,18 @@ export class MyApp {
2729
this.rootPage = 'HomePage';
2830
authObserver.unsubscribe();
2931
}else{
30-
this.rootPage = 'MainLoginPage';
32+
this.rootPage = 'LoginWithEmailPage';
3133
authObserver.unsubscribe();
3234
}
3335
});
3436

3537
// Okay, so the platform is ready and our plugins are available.
3638
// Here you can do any higher level native things you might need.
37-
statusBar.backgroundColorByHexString('#035E7B');
39+
statusBar.backgroundColorByHexString('#00BFE5');
3840
splashScreen.hide();
3941
keyboard.disableScroll(true);
4042
});
4143
}
44+
4245
}
4346

‎src/app/app.scss

+4
Original file line numberDiff line numberDiff line change
@@ -14,3 +14,7 @@
1414
// To declare rules for a specific mode, create a child rule
1515
// for the .md, .ios, or .wp mode classes. The mode class is
1616
// automatically applied to the <body> element in the app.
17+
.bg{
18+
background-color: white;
19+
font-weight: normal;
20+
}

‎src/pages/forget-password/forget-password.html

+4-4
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
1-
<ion-content padding>
2-
<h6><b>Welcome Back!</b></h6><hr>
1+
<ion-content padding class="bg">
2+
<h6><b>Reset Password</b></h6><hr>
33

44
<form [formGroup] = "forgotPasswordForm">
55

@@ -19,8 +19,8 @@ <h6><b>Welcome Back!</b></h6><hr>
1919
</form>
2020
<div>
2121
<button ion-button color = "btn-login" block (tap) = "resetPassword()">RESET PASSWORD</button>
22-
23-
<button ion-button block clear (tap) = "navigateToLogin()">LOGIN</button>
22+
<div style="height: 20px;"></div>
23+
<button ion-button block outline (tap) = "navigateToLogin()">LOGIN</button>
2424
</div>
2525

2626

‎src/pages/forget-password/forget-password.scss

+2-3
Original file line numberDiff line numberDiff line change
@@ -7,9 +7,8 @@ page-forget-password {
77
width: 30px;
88
border-bottom: 1px solid #2196F3;
99
}
10-
.bg {
11-
background-color:#035E7B;
12-
color: black;
10+
.item.item-input {
11+
background-color: transparent;
1312
}
1413

1514
}

‎src/pages/home/home.html

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
<ion-header>
1+
<ion-header class="bg">
22

33
<ion-navbar>
44
<ion-title>home</ion-title>

‎src/pages/home/home.ts

+44-3
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,10 @@ import { Component } from '@angular/core';
22
import { IonicPage, NavController, NavParams } from 'ionic-angular';
33

44
import { AuthProvider } from '../../providers/auth';
5+
import { AngularFireDatabase } from 'angularfire2/database';
6+
import firebase from 'firebase';
7+
8+
declare var FCMPlugin;
59

610
@IonicPage()
711
@Component({
@@ -10,14 +14,51 @@ import { AuthProvider } from '../../providers/auth';
1014
})
1115
export class HomePage {
1216

17+
fireStore = firebase.database().ref('/pushTokens');
18+
1319
constructor(public navCtrl: NavController,
1420
public navParams: NavParams,
15-
private _auth: AuthProvider
21+
private _auth: AuthProvider,
22+
private afd: AngularFireDatabase
1623
) {
24+
this.tokenSetup().then((token) => {
25+
this.storeToken(token);
26+
})
1727
}
28+
ionViewDidLoad(){
29+
FCMPlugin.onNotification((data) => {
30+
if(data.tapped){
31+
alert( JSON.stringify(data) );
32+
}else{
33+
alert( JSON.stringify(data) );
34+
}
35+
});
1836

19-
ionViewDidLoad() {
20-
console.log('ionViewDidLoad HomePage');
37+
FCMPlugin.onTokenRefresh((token) => {
38+
alert(token);
39+
});
40+
}
41+
42+
storeToken(token){
43+
this.afd.list(this.fireStore).push({
44+
uid: firebase.auth().currentUser.uid,
45+
devToken: token
46+
}).then(() => {
47+
alert('Token Stored');
48+
}).catch(() => {
49+
alert('Token not stored');
50+
});
51+
}
52+
tokenSetup(){
53+
var promise = new Promise((resolve, reject) => {
54+
FCMPlugin.getToken((token) => {
55+
resolve(token);
56+
}, (err) => {
57+
reject(err);
58+
});
59+
60+
});
61+
return promise;
2162
}
2263
logout(){
2364
this._auth.logout();

‎src/pages/intro-slider/intro-slider.html

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
<ion-content>
1+
<ion-content class="bg">
22

33
<ion-slides pager="true" parallax="true" >
44

‎src/pages/login-with-email/login.html

+10-6
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,8 @@
1-
<ion-content padding>
2-
<h6><b>Welcome Back!</b></h6><hr>
1+
<ion-content padding class="bg" scroll="false">
2+
3+
<img src="assets/logo.png" alt="FHC Logo">
4+
5+
<h6><b>Welcome</b></h6><hr>
36

47
<form [formGroup] = "loginForm">
58

@@ -8,7 +11,7 @@ <h6><b>Welcome Back!</b></h6><hr>
811
<ion-label floating>
912
Email
1013
</ion-label>
11-
<ion-input type="text" formControlName = "emailId" [class.invalid] = "!loginForm.controls.emailId.valid && (loginForm.controls.emailId.dirty || submitAttempt)"></ion-input>
14+
<ion-input type="email" formControlName = "emailId" [class.invalid] = "!loginForm.controls.emailId.valid && (loginForm.controls.emailId.dirty || submitAttempt)"></ion-input>
1215
</ion-item>
1316
<ion-item *ngIf = "!loginForm.controls.emailId.valid && (loginForm.controls.emailId.dirty || submitAttempt)" >
1417
<p>Please enter email id</p>
@@ -29,12 +32,13 @@ <h6><b>Welcome Back!</b></h6><hr>
2932
</form>
3033

3134
<div>
32-
<button ion-button color = "btn-login" block (tap) = "login()">LOGIN</button>
33-
<button ion-button block clear (tap) = "forgotPassword()">Forgot your Password ?</button>
35+
<button ion-button color = "btn-login" style="color: white;" block (tap) = "login()">LOGIN</button>
36+
<div style="height: 20px;"></div>
37+
<button ion-button block color = "btn-login" clear (tap) = "forgotPassword()"><b>Forgot your Password?</b></button>
3438

3539
<div style="height: 80px;"></div>
3640

37-
<button ion-button block clear (tap) = "navigateToSignup()">CREATE AN ACCOUNT</button>
41+
<button ion-button block color = "btn-login" outline (tap) = "navigateToSignup()">SIGN UP</button>
3842
</div>
3943

4044

0 commit comments

Comments
 (0)