Upgrade to latest ionic version

Author: ralscha

.editorconfig

@@ -0,0 +1,17 @@
+# EditorConfig helps developers define and maintain consistent coding styles between different editors and IDEs
+# editorconfig.org
+
+root = true
+
+[*]
+indent_style = space
+indent_size = 2
+
+# We recommend you to keep these unchanged
+end_of_line = lf
+charset = utf-8
+trim_trailing_whitespace = true
+insert_final_newline = true
+
+[*.md]
+trim_trailing_whitespace = false

package.json

@@ -1,50 +1,49 @@
 {
-    "name": "ionic-hello-world",
+    "name": "ionic3-chat",
     "author": "Ionic Framework",
     "homepage": "http://ionicframework.com/",
     "private": true,
     "scripts": {
         "clean": "ionic-app-scripts clean",
         "build": "ionic-app-scripts build",
+    "lint": "ionic-app-scripts lint",
         "ionic:build": "ionic-app-scripts build",
         "ionic:serve": "ionic-app-scripts serve"
     },
     "dependencies": {
-        "@angular/common": "5.0.0",
-        "@angular/compiler": "5.0.0",
-        "@angular/compiler-cli": "5.0.0",
-        "@angular/core": "5.0.0",
-        "@angular/forms": "5.0.0",
-        "@angular/http": "5.0.0",
-        "@angular/platform-browser": "5.0.0",
-        "@angular/platform-browser-dynamic": "5.0.0",
+        "@angular/common": "5.1.2",
+        "@angular/compiler": "5.1.2",
+        "@angular/compiler-cli": "5.1.2",
+        "@angular/core": "5.1.2",
+        "@angular/forms": "5.1.2",
+        "@angular/http": "5.1.2",
+        "@angular/platform-browser": "5.1.2",
+        "@angular/platform-browser-dynamic": "5.1.2",
         "@ionic/storage": "2.1.3",
         "ionic-angular": "3.9.2",
-        "rxjs": "5.5.2",
-        "zone.js": "0.8.18",
-        "@ionic-native/core": "3.12.1",
-        "@ionic-native/splash-screen": "3.12.1",
-        "@ionic-native/status-bar": "3.12.1",
-        "cordova-browser": "~4.1.0",
-        "cordova-ios": "^4.4.0",
-        "cordova-plugin-console": "1.0.5",
-        "cordova-plugin-device": "1.1.4",
-        "cordova-plugin-splashscreen": "~4.0.1",
-        "cordova-plugin-statusbar": "2.2.1",
-        "cordova-plugin-whitelist": "1.3.1",
+        "rxjs": "5.5.6",
+        "zone.js": "0.8.19",
+        "@ionic-native/core": "4.5.2",
+        "@ionic-native/splash-screen": "4.5.2",
+        "@ionic-native/status-bar": "4.5.2",
+        "cordova-browser": "~5.0.3",
+        "cordova-ios": "^4.5.4",
+        "cordova-plugin-console": "1.1.0",
+        "cordova-plugin-device": "2.0.0",
+        "cordova-plugin-splashscreen": "~5.0.0",
+        "cordova-plugin-statusbar": "2.4.0",
+        "cordova-plugin-whitelist": "1.3.3",
         "ionic-plugin-keyboard": "~2.2.1",
         "ionicons": "3.0.0",
-        "moment": "^2.18.1",
+        "moment": "^2.20.1",
         "sw-toolbox": "3.6.0",
-        "cordova-android": "~6.0.0"
+        "cordova-android": "~7.0.0"
     },
     "devDependencies": {
-        "@ionic/cli-plugin-cordova": "1.6.2",
-        "@ionic/cli-plugin-ionic-angular": "1.4.1",
         "cross-spawn": "^5.1.0",
-        "ionic": "3.13.1",
-        "@ionic/app-scripts": "3.1.0",
-        "typescript" : "2.4.2"
+        "ionic": "3.19.0",
+        "@ionic/app-scripts": "3.1.7",
+        "typescript": "2.6.2"
     },
     "cordovaPlugins": [
         "cordova-plugin-whitelist",
@@ -78,4 +77,4 @@
             "ionic-plugin-keyboard": {}
         }
     }
-}
+}

src/app/app.component.ts

@@ -3,9 +3,6 @@ import { Platform } from 'ionic-angular';
 import { StatusBar } from '@ionic-native/status-bar';
 import { SplashScreen } from '@ionic-native/splash-screen';
 
-// import { TabsPage } from '../pages/tabs/tabs';
-
-
 @Component({
   templateUrl: 'app.html'
 })
@@ -14,8 +11,6 @@ export class MyApp {
 
   constructor(platform: Platform, statusBar: StatusBar, splashScreen: SplashScreen) {
     platform.ready().then(() => {
-      // Okay, so the platform is ready and our plugins are available.
-      // Here you can do any higher level native things you might need.
       statusBar.styleDefault();
       splashScreen.hide();
     });

src/app/app.module.ts

@@ -1,13 +1,13 @@
 import { NgModule, ErrorHandler } from '@angular/core';
 import { IonicApp, IonicModule, IonicErrorHandler } from 'ionic-angular';
-import { HttpModule } from "@angular/http";
 import { BrowserModule } from '@angular/platform-browser';
 
 import { MyApp } from './app.component';
 
 import { StatusBar } from '@ionic-native/status-bar';
 import { SplashScreen } from '@ionic-native/splash-screen';
 import { EmojiProvider } from '../providers/emoji';
+import { HttpClientModule } from "@angular/common/http";
 
 
 @NgModule({
@@ -16,12 +16,12 @@ import { EmojiProvider } from '../providers/emoji';
   ],
   imports: [
     BrowserModule,
-    HttpModule,
+    HttpClientModule,
     IonicModule.forRoot(MyApp,{
       tabsHideOnSubPages:true,
-      tabsLayout:'icon-left'
+      tabsLayout:'icon-left',
+      preloadModules: true
     }),
-
   ],
   bootstrap: [IonicApp],
   entryComponents: [

src/app/app.scss

@@ -1,4 +1,4 @@
-// http://ionicframework.com/docs/v2/theming/
+// http://ionicframework.com/docs/theming/
 
 
 // App Global Sass

src/components/emoji-picker/emoji-picker.ts

@@ -2,13 +2,6 @@ import { Component, forwardRef } from '@angular/core';
 import { EmojiProvider } from "../../providers/emoji";
 import { ControlValueAccessor, NG_VALUE_ACCESSOR } from "@angular/forms";
 
-/**
- * Generated class for the EmojiPickerComponent component.
- *
- * See https://angular.io/docs/ts/latest/api/core/index/ComponentMetadata-class.html
- * for more info on Angular Components.
- */
-
 export const EMOJI_PICKER_VALUE_ACCESSOR: any = {
     provide: NG_VALUE_ACCESSOR,
     useExisting: forwardRef(() => EmojiPickerComponent),

src/declarations.d.ts

@@ -11,12 +11,19 @@
   <link rel="manifest" href="manifest.json">
   <meta name="theme-color" content="#4e8ef7">
 
+  <!-- add to homescreen for ios -->
+  <meta name="apple-mobile-web-app-capable" content="yes">
+  <meta name="apple-mobile-web-app-status-bar-style" content="black">
+
+  <!-- cordova.js required for cordova apps (remove if not needed) -->
+  <script src="cordova.js"></script>
+
   <!-- un-comment this code to enable service worker
   <script>
     if ('serviceWorker' in navigator) {
       navigator.serviceWorker.register('service-worker.js')
         .then(() => console.log('service worker installed'))
-        .catch(err => console.log('Error', err));
+        .catch(err => console.error('Error', err));
     }
   </script>-->
 
@@ -28,17 +35,14 @@
   <!-- Ionic's root component and where the app will load -->
   <ion-app></ion-app>
 
-  <!-- cordova.js required for cordova apps -->
-  <script src="cordova.js"></script>
-
   <!-- The polyfills js is generated during the build process -->
   <script src="build/polyfills.js"></script>
 
   <!-- The vendor js is generated during the build process
-       and includes all files in the node_modules directory -->
+       It contains all of the dependencies in node_modules -->
   <script src="build/vendor.js"></script>
 
-  <!-- The bundle js is generated during the build process -->
+  <!-- The main bundle js is generated during the build process -->
   <script src="build/main.js"></script>
 
 </body>

src/index.html

@@ -1,17 +1,11 @@
 import { Component } from '@angular/core';
+import { IonicPage } from 'ionic-angular';
 
-import {NavController, IonicPage} from 'ionic-angular';
 @IonicPage()
 @Component({
   selector: 'page-about',
   templateUrl: 'about.html'
 })
 export class AboutPage {
 
-  constructor(
-      public navCtrl: NavController,
-  ) {
-
-  }
-
 }

src/pages/about/about.ts

@@ -1,9 +1,3 @@
-<!--
-  Generated template for the Chat page.
-
-  See http://ionicframework.com/docs/v2/components/#navigation for more info on
-  Ionic pages and navigation.
--->
 <ion-header>
 
     <ion-navbar>
@@ -51,7 +45,7 @@
                               placeholder="Text Input"
                               [(ngModel)]="editorMsg"
                               (keyup.enter)="sendMsg()"
-                              (focus)="onFocus()">
+                              (ionFocus)="onFocus()">
                 </ion-textarea>
             </ion-col>
             <ion-col col-2>
@@ -62,4 +56,4 @@
         </ion-row>
     </ion-grid>
     <emoji-picker *ngIf="showEmojiPicker" [(ngModel)]="editorMsg"></emoji-picker>
-</ion-footer>
+</ion-footer>