32 |
33 |
34 |
35 |
36 |
37 |
38 |
39 |
40 |
--------------------------------------------------------------------------------
/src/pages/home/home.module.ts:
--------------------------------------------------------------------------------
1 | import { NgModule } from '@angular/core';
2 | import { IonicModule } from 'ionic-angular';
3 | import { Home } from './home';
4 |
5 | @NgModule({
6 | declarations: [
7 | Home
8 | ],
9 | imports: [
10 | IonicModule.forRoot(Home),
11 | ],
12 | exports: [
13 | Home
14 | ]
15 | })
16 | export class HomeModule {}
17 |
--------------------------------------------------------------------------------
/src/pages/home/home.scss:
--------------------------------------------------------------------------------
1 | page-home {
2 |
3 | }
4 |
--------------------------------------------------------------------------------
/src/pages/home/home.ts:
--------------------------------------------------------------------------------
1 | import { Component } from '@angular/core';
2 | import { IonicPage, NavController, NavParams } from 'ionic-angular';
3 | import { HelloIonicPage } from '../hello-ionic/hello-ionic';
4 | /**
5 | * Generated class for the Home page.
6 | *
7 | * See http://ionicframework.com/docs/components/#navigation for more info
8 | * on Ionic pages and navigation.
9 | */
10 | @IonicPage()
11 | @Component({
12 | selector: 'page-home',
13 | templateUrl: 'home.html',
14 | })
15 | export class Home {
16 |
17 | constructor(public navCtrl: NavController, public navParams: NavParams) {
18 | }
19 |
20 | ionViewDidLoad() {
21 | console.log('ionViewDidLoad Home');
22 | }
23 |
24 | click(user){
25 | this.navCtrl.push(HelloIonicPage, {user: user})
26 | }
27 |
28 | }
29 |
--------------------------------------------------------------------------------
/src/pipes/chat-date.ts:
--------------------------------------------------------------------------------
1 | import { Pipe } from '@angular/core';
2 | import * as moment from 'moment';
3 |
4 | @Pipe({
5 | name: 'chatDate'
6 | })
7 | export class ChatDate {
8 | transform(value, args) {
9 |
10 | let today = moment();
11 | let yesterday = today.clone().subtract(1, 'days');
12 | let within5Days = today.clone().subtract(5, 'days');
13 | let date = moment(value);
14 |
15 | let isToday = today.isSame(date, 'd');
16 | let isYesterday = date.isSame(yesterday, 'd');
17 | let isWithin5Days = date.isAfter(within5Days);
18 |
19 | let isDifferentYear = date.year != today.year;
20 |
21 | if (isToday) {
22 | return "Today";
23 | } else if (isYesterday) {
24 | return "Yesterday";
25 | } else if (isWithin5Days) {
26 | return date.format('dddd');
27 | } else if (isDifferentYear) {
28 | return date.format("ddd D MMM YYYY");
29 | } else {
30 | return date.format("ddd D MMM");
31 | }
32 |
33 | }
34 |
35 |
36 |
37 | }
--------------------------------------------------------------------------------
/src/service-worker.js:
--------------------------------------------------------------------------------
1 | // tick this to make the cache invalidate and update
2 | const CACHE_VERSION = 1;
3 | const CURRENT_CACHES = {
4 | 'read-through': 'read-through-cache-v' + CACHE_VERSION
5 | };
6 |
7 | self.addEventListener('activate', (event) => {
8 | // Delete all caches that aren't named in CURRENT_CACHES.
9 | // While there is only one cache in this example, the same logic will handle the case where
10 | // there are multiple versioned caches.
11 | const expectedCacheNames = Object.keys(CURRENT_CACHES).map((key) => {
12 | return CURRENT_CACHES[key];
13 | });
14 |
15 | event.waitUntil(
16 | caches.keys().then((cacheNames) => {
17 | return Promise.all(
18 | cacheNames.map((cacheName) => {
19 | if (expectedCacheNames.indexOf(cacheName) === -1) {
20 | // If this cache name isn't present in the array of "expected" cache names, then delete it.
21 | console.log('Deleting out of date cache:', cacheName);
22 | return caches.delete(cacheName);
23 | }
24 | })
25 | );
26 | })
27 | );
28 | });
29 |
30 | // This sample illustrates an aggressive approach to caching, in which every valid response is
31 | // cached and every request is first checked against the cache.
32 | // This may not be an appropriate approach if your web application makes requests for
33 | // arbitrary URLs as part of its normal operation (e.g. a RSS client or a news aggregator),
34 | // as the cache could end up containing large responses that might not end up ever being accessed.
35 | // Other approaches, like selectively caching based on response headers or only caching
36 | // responses served from a specific domain, might be more appropriate for those use cases.
37 | self.addEventListener('fetch', (event) => {
38 |
39 | event.respondWith(
40 | caches.open(CURRENT_CACHES['read-through']).then((cache) => {
41 | return cache.match(event.request).then((response) => {
42 | if (response) {
43 | // If there is an entry in the cache for event.request, then response will be defined
44 | // and we can just return it.
45 |
46 | return response;
47 | }
48 |
49 | // Otherwise, if there is no entry in the cache for event.request, response will be
50 | // undefined, and we need to fetch() the resource.
51 | console.log(' No response for %s found in cache. ' +
52 | 'About to fetch from network...', event.request.url);
53 |
54 | // We call .clone() on the request since we might use it in the call to cache.put() later on.
55 | // Both fetch() and cache.put() "consume" the request, so we need to make a copy.
56 | // (see https://fetch.spec.whatwg.org/#dom-request-clone)
57 | return fetch(event.request.clone()).then((response) => {
58 |
59 | // Optional: add in extra conditions here, e.g. response.type == 'basic' to only cache
60 | // responses from the same domain. See https://fetch.spec.whatwg.org/#concept-response-type
61 | if (response.status < 400 && response.type === 'basic') {
62 | // We need to call .clone() on the response object to save a copy of it to the cache.
63 | // (https://fetch.spec.whatwg.org/#dom-request-clone)
64 | cache.put(event.request, response.clone());
65 | }
66 |
67 | // Return the original response object, which will be used to fulfill the resource request.
68 | return response;
69 | });
70 | }).catch((error) => {
71 | // This catch() will handle exceptions that arise from the match() or fetch() operations.
72 | // Note that a HTTP error response (e.g. 404) will NOT trigger an exception.
73 | // It will return a normal response object that has the appropriate error code set.
74 | console.error(' Read-through caching failed:', error);
75 |
76 | throw error;
77 | });
78 | })
79 | );
80 | });
--------------------------------------------------------------------------------
/src/theme/variables.scss:
--------------------------------------------------------------------------------
1 | // Ionic Variables and Theming. For more info, please see:
2 | // http://ionicframework.com/docs/v2/theming/
3 | @import "ionic.globals";
4 |
5 |
6 | // Shared Variables
7 | // --------------------------------------------------
8 | // To customize the look and feel of this app, you can override
9 | // the Sass variables found in Ionic's source scss files.
10 | // To view all the possible Ionic variables, see:
11 | // http://ionicframework.com/docs/v2/theming/overriding-ionic-variables/
12 |
13 | $text-color: #000;
14 | $background-color: #fff;
15 |
16 |
17 | // Named Color Variables
18 | // --------------------------------------------------
19 | // Named colors makes it easy to reuse colors on various components.
20 | // It's highly recommended to change the default colors
21 | // to match your app's branding. Ionic uses a Sass map of
22 | // colors so you can add, rename and remove colors as needed.
23 | // The "primary" color is the only required color in the map.
24 |
25 | $colors: (
26 | primary: #387ef5,
27 | secondary: #32db64,
28 | danger: #f53d3d,
29 | light: #f4f4f4,
30 | dark: #222,
31 | favorite: #69BB7B
32 | );
33 |
34 |
35 | // App iOS Variables
36 | // --------------------------------------------------
37 | // iOS only Sass variables can go here
38 |
39 |
40 |
41 |
42 | // App Material Design Variables
43 | // --------------------------------------------------
44 | // Material Design only Sass variables can go here
45 |
46 |
47 |
48 |
49 | // App Windows Variables
50 | // --------------------------------------------------
51 | // Windows only Sass variables can go here
52 |
53 |
54 |
55 |
56 | // App Theme
57 | // --------------------------------------------------
58 | // Ionic apps can have different themes applied, which can
59 | // then be future customized. This import comes last
60 | // so that the above variables are used and Ionic's
61 | // default are overridden.
62 |
63 | @import "ionic.theme.default";
64 |
65 |
66 | // Ionicons
67 | // --------------------------------------------------
68 | // The premium icon font for Ionic. For more info, please see:
69 | // http://ionicframework.com/docs/v2/ionicons/
70 |
71 | $ionicons-font-path: "../assets/fonts";
72 | @import "ionicons";
73 |
74 | $chat-bubble:(
75 | background-left: #f2f2f2,
76 | background-right: #005677,
77 | );
78 |
--------------------------------------------------------------------------------
/tsconfig.json:
--------------------------------------------------------------------------------
1 | {
2 | "compilerOptions": {
3 | "allowSyntheticDefaultImports": true,
4 | "declaration": false,
5 | "emitDecoratorMetadata": true,
6 | "experimentalDecorators": true,
7 | "lib": [
8 | "dom",
9 | "es2015"
10 | ],
11 | "module": "es2015",
12 | "moduleResolution": "node",
13 | "sourceMap": true,
14 | "target": "es5"
15 | },
16 | "include": [
17 | "src/**/*.ts"
18 | ],
19 | "exclude": [
20 | "node_modules"
21 | ],
22 | "compileOnSave": false,
23 | "atom": {
24 | "rewriteTsconfig": false
25 | }
26 | }
27 |
--------------------------------------------------------------------------------
/tslint.json:
--------------------------------------------------------------------------------
1 | {
2 | "rules": {
3 | "no-duplicate-variable": true,
4 | "no-unused-variable": [
5 | true
6 | ]
7 | },
8 | "rulesDirectory": [
9 | "node_modules/tslint-eslint-rules/dist/rules"
10 | ]
11 | }
12 |
--------------------------------------------------------------------------------
16 |
19 | 
23 |