Integration with the socket server

tasklist/package.json

@@ -24,6 +24,7 @@
     "ionic-native": "2.2.11",
     "ionicons": "3.0.0",
     "rxjs": "5.0.0-beta.12",
+    "socket.io-client": "^1.7.3",
     "sw-toolbox": "3.4.0",
     "zone.js": "0.6.26"
   },

tasklist/src/config/development.json

@@ -1,3 +1,4 @@
 {
-	"apiUrl": "http://127.0.0.1:8000/api/v1"
+	"apiUrl": "http://127.0.0.1:8000/api/v1",
+  "socketUrl": "http://127.0.0.1:3000"
 }

tasklist/src/config/production.json

@@ -1,3 +1,4 @@
 {
-	"apiUrl": "http://198.27.119.182/api/v1"
+	"apiUrl": "http://198.27.119.182/api/v1",
+  "socketUrl": "http://198.27.119.182:3000"
 }

tasklist/src/pages/login/login.ts

@@ -4,12 +4,13 @@ import { NavController, ToastController } from 'ionic-angular';
 
 import { ListProject } from '../listProject/listProject';
 import {AuthenticationService} from '../../services/authenticationService';
+import {SocketService} from '../../services/socketService';
 import { Storage } from '@ionic/storage';
 
 @Component({
   selector: 'page-login',
   templateUrl: 'login.html',
-  providers: [AuthenticationService]
+  providers: [AuthenticationService,SocketService]
 })
 export class Login {
   username: string;
@@ -18,6 +19,7 @@ export class Login {
   constructor(
     public navCtrl: NavController,
     private authenticationService: AuthenticationService,
+    private socketService: SocketService,
     public toastCtrl: ToastController,
     public storage: Storage
   ) {
@@ -30,8 +32,25 @@ export class Login {
 
           this.authenticationService.authenticate(this.username, this.password).subscribe(
             data => {
-              this.storage.set('token', data.token)
+              this.storage.set('token', data.token);
+              this.storage.set('userid', data.id);
               this.navCtrl.setRoot(ListProject, { });
+
+              // When a user is authenticated start the connection to the socket server
+              this.socketService.connect(data.token, data.id).then(() => {
+                // Subscribe to the main channel: task
+                this.socketService.subscribe('task').then((stream:any) => {
+                  console.log(stream);
+					stream.subscribe(data => {
+					  // Toast notification
+					  let toast = this.toastCtrl.create({
+						message: "You have a new assgined task: " + data.title,
+						dismissOnPageChange: true
+					  });
+					  toast.present();
+					})
+                })
+              });
             }
           );
         });
@@ -45,8 +64,25 @@ export class Login {
         // Redirect after control
         this.storage.set('username', this.username);
         this.storage.set('password', this.password);
-        this.storage.set('token', data.token)
+        this.storage.set('token', data.token);
+        this.storage.set('userid', data.id);
         this.navCtrl.setRoot(ListProject, { });
+
+        // When a user is authenticated start the connection to the socket server
+        this.socketService.connect(data.token, data.id).then(() => {
+          // Subscribe to the main channel: task
+          this.socketService.subscribe('task').then((stream:any) => {
+            console.log(stream);
+            stream.subscribe(data => {
+              // Toast notification
+              let toast = this.toastCtrl.create({
+                message: "You have a new assgined task: " + data.title,
+                dismissOnPageChange: true
+              });
+              toast.present();
+            })
+          })
+        });
       },
       err => {
         let toast = this.toastCtrl.create({

tasklist/src/services/socketService.ts

@@ -0,0 +1,97 @@
+import {Http} from '@angular/http';
+import 'rxjs/add/operator/map';
+import { Observable } from 'rxjs/Rx';
+import { Injectable } from "@angular/core";
+import { Storage } from '@ionic/storage';
+import { Config } from '../config/config';
+import * as io from "socket.io-client";
+
+/**
+ *
+ */
+
+@Injectable()
+export class SocketService {
+  private _socketUrl:string;
+  private _socket:any;
+
+  constructor (public storage: Storage, protected http:Http, private _config:Config) {
+    this._socketUrl = _config.get('socketUrl');
+    this._socket = null;
+  }
+
+  connect(token:string, userid:string) {
+    return new Promise((resolve, reject) => {
+      this._socket = io.connect(this._socketUrl);
+      this._socket.on('connect', () => {
+        // When one is connected, proceed to authentication
+        this._socket.emit('authenticate', {
+          token: token,
+          id: userid
+        }, (res) => {
+          console.log(res);
+          if( res.status ) {
+            resolve();
+          } else {
+            reject();
+          }
+        });
+      });
+    });
+
+  }
+
+  subscribe(channel:string) {
+    return new Promise((resolve, reject) => {
+      if( this._socket == null || !this._socket.connected ) {
+        reject();
+        return;
+      }
+
+      this._socket.emit('subscribe', {channel}, (res) => {
+        if( res.status ) {
+          const key = 'on' + channel.charAt(0).toUpperCase() + channel.slice(1);
+          const stream = Observable.fromEvent(this._socket, key);
+          resolve(stream);
+        } else {
+          reject();
+        }
+      });
+    });
+  }
+
+  unsubscribe(channel:string) {
+    return new Promise((resolve, reject) => {
+      if( this._socket == null || !this._socket.connected ) {
+        reject();
+        return;
+      }
+
+      this._socket.emit('unsubscribe', {channel}, (res) => {
+        if( res.status ) {
+          resolve();
+        } else {
+          reject();
+        }
+      });
+    });
+  }
+
+  emit(channel:string, event:string, data:Object = {}) {
+    return new Promise((resolve, reject) => {
+      if( this._socket == null || !this._socket.connected ) {
+        reject();
+        return;
+      }
+
+      this._socket.emit(channel + '.' + event, data, (res) => {
+        if(res.status) {
+          resolve();
+        } else {
+          reject();
+        }
+      });
+    });
+  }
+
+}

tasklist/typings.json

@@ -0,0 +1,5 @@
+{
+  "globalDependencies": {
+    "socket.io-client": "registry:dt/socket.io-client#1.4.4+20161116080703"
+  }
+}