Skip to content

Commit 7385e1e

Browse files
yannbfyannbf
authored
Merge pull request yannbf#31 from danielsogl/ionic33
refactor(): update to ionic 3.3
2 parents 1da8f69 + efe8981 commit 7385e1e

File tree

22 files changed

+156
-161
lines changed

22 files changed

+156
-161
lines changed

‎README.md

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
1-
# Ionic 2 Advanced Components [![Open Source Love](https://badges.frapsoft.com/os/v1/open-source.svg?v=103)](https://github.com/ellerbrock/open-source-badge/)
1+
# Ionic Advanced Components [![Open Source Love](https://badges.frapsoft.com/os/v1/open-source.svg?v=103)](https://github.com/ellerbrock/open-source-badge/)
22

3-
_Currently this project is using the latest versions of all: Ionic 3 and Angular 4_
3+
_Currently this project is using the latest versions of all: Ionic and Angular 4_
44

55
This repository was made in order to help people learn and speed up their development process.
66
You will find many many different components, pages, pipes, services, of which can be very useful to you. Note though that these are all experimental!

‎ionic.config.json

Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,5 @@
11
{
22
"name": "Advanced Ionic2 Components",
33
"app_id": "bd1b6d71",
4-
"v2": true,
5-
"typescript": true
4+
"type": "ionic-angular"
65
}

‎package.json

Lines changed: 25 additions & 24 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
{
2-
"name": "ionic-hello-world",
2+
"name": "ionic3-components",
33
"author": "Ionic Framework",
4-
"homepage": "http://ionicframework.com/",
4+
"homepage": "https://ionicframework.com/",
55
"private": true,
66
"scripts": {
77
"clean": "ionic-app-scripts clean",
@@ -10,35 +10,36 @@
1010
"ionic:serve": "ionic-app-scripts serve"
1111
},
1212
"dependencies": {
13-
"@angular/common": "4.0.0",
14-
"@angular/compiler": "4.0.0",
15-
"@angular/compiler-cli": "4.0.0",
16-
"@angular/core": "4.0.0",
17-
"@angular/forms": "4.0.0",
18-
"@angular/http": "4.0.0",
19-
"@angular/platform-browser": "4.0.0",
20-
"@angular/platform-browser-dynamic": "4.0.0",
21-
"@ionic-native/barcode-scanner": "^3.4.4",
22-
"@ionic-native/camera": "^3.4.4",
23-
"@ionic-native/card-io": "^3.4.4",
24-
"@ionic-native/core": "^3.4.2",
25-
"@ionic-native/diagnostic": "^3.4.4",
26-
"@ionic-native/geolocation": "^3.4.4",
27-
"@ionic-native/splash-screen": "3.4.2",
28-
"@ionic-native/status-bar": "3.4.2",
13+
"@angular/common": "4.1.2",
14+
"@angular/compiler": "4.1.2",
15+
"@angular/compiler-cli": "4.1.2",
16+
"@angular/core": "4.1.2",
17+
"@angular/forms": "4.1.2",
18+
"@angular/http": "4.1.2",
19+
"@angular/platform-browser": "4.1.2",
20+
"@angular/platform-browser-dynamic": "4.1.2",
21+
"@ionic-native/barcode-scanner": "3.10.3",
22+
"@ionic-native/camera": "3.10.3",
23+
"@ionic-native/card-io": "3.10.3",
24+
"@ionic-native/core": "3.10.3",
25+
"@ionic-native/diagnostic": "3.10.3",
26+
"@ionic-native/geolocation": "3.10.3",
27+
"@ionic-native/splash-screen": "3.10.3",
28+
"@ionic-native/status-bar": "3.10.3",
2929
"@ionic/storage": "2.0.1",
30-
"angular2-swing": "^0.10.0",
30+
"angular2-swing": "^0.12.1",
3131
"chart.js": "^2.4.0",
32-
"ionic-angular": "3.0.0",
32+
"ionic-angular": "3.3.0",
3333
"ionicons": "3.0.0",
3434
"moment": "^2.15.2",
3535
"rxjs": "5.1.1",
36-
"sw-toolbox": "3.4.0",
37-
"zone.js": "^0.8.4"
36+
"sw-toolbox": "3.6.0",
37+
"zone.js": "^0.8.11"
3838
},
3939
"devDependencies": {
40-
"@ionic/app-scripts": "1.3.0",
41-
"typescript": "~2.2.1"
40+
"@ionic/app-scripts": "1.3.7",
41+
"@ionic/cli-plugin-ionic-angular": "1.2.0",
42+
"typescript": "~2.3.3"
4243
},
4344
"cordovaPlugins": [
4445
"cordova-plugin-whitelist",

‎src/components/countdown-timer/timer.html

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -4,21 +4,21 @@
44
<button ion-button *ngIf="!timeInSeconds || timeInSeconds == 0" large block clear class="timer-button">Timer set up incorrectly</button>
55
</ion-card-header>
66
<ion-item *ngIf="timeInSeconds && timeInSeconds > 0">
7-
<button ion-button clear class="large" color="danger" (click)="initTimer()" item-left *ngIf="!timer.runTimer && (timer.hasStarted || timer.hasFinished) || timer.hasFinished">
7+
<button ion-button clear class="large" color="danger" (click)="initTimer()" item-start *ngIf="!timer.runTimer && (timer.hasStarted || timer.hasFinished) || timer.hasFinished">
88
<ion-icon name="refresh"></ion-icon>
99
Restart
1010
</button>
11-
<button ion-button clear class="large" (click)="pauseTimer()" item-right *ngIf="timer.runTimer && timer.hasStarted && !timer.hasFinished">
11+
<button ion-button clear class="large" (click)="pauseTimer()" item-end *ngIf="timer.runTimer && timer.hasStarted && !timer.hasFinished">
1212
<ion-icon name="pause"></ion-icon>
1313
Pause
1414
</button>
15-
<button ion-button clear class="large" (click)="resumeTimer()" item-right *ngIf="!timer.runTimer && timer.hasStarted && !timer.hasFinished">
15+
<button ion-button clear class="large" (click)="resumeTimer()" item-end *ngIf="!timer.runTimer && timer.hasStarted && !timer.hasFinished">
1616
<ion-icon name="play"></ion-icon>
1717
Resume
1818
</button>
19-
<button ion-button clear class="large" (click)="startTimer()" item-right *ngIf="!timer.hasStarted">
19+
<button ion-button clear class="large" (click)="startTimer()" item-end *ngIf="!timer.hasStarted">
2020
<ion-icon name="play"></ion-icon>
2121
Start
2222
</button>
2323
</ion-item>
24-
</ion-card>
24+
</ion-card>

‎src/components/timer-progress/timer-progress.html

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -14,25 +14,25 @@
1414
<div class="inset">
1515
<div class="percentage">{{timer.displayTime}}</div>
1616
</div>
17-
</div>
17+
</div>
1818
<button ion-button *ngIf="!timeInSeconds || timeInSeconds == 0" large block clear class="timer-button">Timer set up incorrectly</button>
1919
</ion-card-header>
2020
<ion-item *ngIf="timeInSeconds && timeInSeconds > 0">
21-
<button ion-button clear class="large" color="danger" (click)="initTimer()" item-left *ngIf="!timer.runTimer && (timer.hasStarted || timer.hasFinished) || timer.hasFinished">
21+
<button ion-button clear class="large" color="danger" (click)="initTimer()" item-start *ngIf="!timer.runTimer && (timer.hasStarted || timer.hasFinished) || timer.hasFinished">
2222
<ion-icon name="refresh"></ion-icon>
2323
Restart
2424
</button>
25-
<button ion-button clear class="large" (click)="pauseTimer()" item-right *ngIf="timer.runTimer && timer.hasStarted && !timer.hasFinished">
25+
<button ion-button clear class="large" (click)="pauseTimer()" item-end *ngIf="timer.runTimer && timer.hasStarted && !timer.hasFinished">
2626
<ion-icon name="pause"></ion-icon>
2727
Pause
2828
</button>
29-
<button ion-button clear class="large" (click)="resumeTimer()" item-right *ngIf="!timer.runTimer && timer.hasStarted && !timer.hasFinished">
29+
<button ion-button clear class="large" (click)="resumeTimer()" item-end *ngIf="!timer.runTimer && timer.hasStarted && !timer.hasFinished">
3030
<ion-icon name="play"></ion-icon>
3131
Resume
3232
</button>
33-
<button ion-button clear class="large" (click)="startTimer()" item-right *ngIf="!timer.hasStarted">
33+
<button ion-button clear class="large" (click)="startTimer()" item-end *ngIf="!timer.hasStarted">
3434
<ion-icon name="play"></ion-icon>
3535
Start
3636
</button>
3737
</ion-item>
38-
</ion-card>
38+
</ion-card>

‎src/pages/ionic-official-components/button/button-components/button-components.html

Lines changed: 5 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -19,29 +19,28 @@
1919
<img src="assets/img/misc/img-icon.png" />
2020
</ion-card-content>
2121
<ion-item>
22-
<button ion-button clear item-left>Like</button>
23-
<button ion-button clear item-right>Comment</button>
22+
<button ion-button clear item-start>Like</button>
23+
<button ion-button clear item-end>Comment</button>
2424
</ion-item>
2525
</ion-card>
2626
<ion-list>
2727
<ion-item>
2828
Inner Button
29-
<button ion-button item-right outline>Outline</button>
29+
<button ion-button item-end outline>Outline</button>
3030
</ion-item>
3131
<ion-item>
3232
Left Icon Button
33-
<button ion-button item-right outline icon-left>
33+
<button ion-button item-end outline icon-left>
3434
<ion-icon name='star'></ion-icon>
3535
Left Icon
3636
</button>
3737
</ion-item>
3838
<ion-item>
3939
Right Icon Button
40-
<button ion-button item-right outline icon-right>
40+
<button ion-button item-end outline icon-right>
4141
Right Icon
4242
<ion-icon name='star'></ion-icon>
4343
</button>
4444
</ion-item>
4545
</ion-list>
4646
</ion-content>
47-

‎src/pages/ionic-official-components/card/card-badge/card-badge.html

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -15,14 +15,14 @@ <h2 class="card-title">
1515
</p>
1616
</ion-card-content>
1717
<ion-item (click)="albumsTapped(card)">
18-
<ion-icon name='musical-notes' item-left class="albums-icon"></ion-icon>
18+
<ion-icon name='musical-notes' item-start class="albums-icon"></ion-icon>
1919
Albums
20-
<ion-badge item-right>{{card.albums}}</ion-badge>
20+
<ion-badge item-end>{{card.albums}}</ion-badge>
2121
</ion-item>
2222
<ion-item (click)="followersTapped(card)">
23-
<ion-icon name='logo-twitter' item-left class="twitter-icon"></ion-icon>
23+
<ion-icon name='logo-twitter' item-start class="twitter-icon"></ion-icon>
2424
Followers
25-
<ion-badge item-right>{{card.followers}}</ion-badge>
25+
<ion-badge item-end>{{card.followers}}</ion-badge>
2626
</ion-item>
2727
</ion-card>
2828
</ion-content>

‎src/pages/ionic-official-components/card/card-map/card-map.html

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -14,14 +14,14 @@
1414
</ion-fab>
1515
</div>
1616
<ion-item *ngFor="let place of card.places" (click)="placeTapped(place)">
17-
<ion-icon color="subtle" large item-left [name]='place.icon'></ion-icon>
17+
<ion-icon color="subtle" large item-start [name]='place.icon'></ion-icon>
1818
<h2>{{place.name}}</h2>
1919
<p>{{place.address}}</p>
2020
</ion-item>
2121
<ion-item actions>
22-
<span item-left ion-text color="secondary" class="item-bold">{{card.ETA}}</span>
23-
<span item-left ion-text color="subtle">{{card.distance}}</span>
24-
<button ion-button color="primary" clear item-right icon-left (click)="getDirections(card)">
22+
<span item-start ion-text color="secondary" class="item-bold">{{card.ETA}}</span>
23+
<span item-start ion-text color="subtle">{{card.distance}}</span>
24+
<button ion-button color="primary" clear item-end icon-left (click)="getDirections(card)">
2525
<ion-icon name='navigate'></ion-icon>
2626
Start
2727
</button>

‎src/pages/ionic-official-components/card/card-social/card-social.html

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@
66
<ion-content>
77
<ion-card *ngFor="let card of cards">
88
<ion-item>
9-
<ion-avatar item-left>
9+
<ion-avatar item-start>
1010
<img [src]="card.avatarImageUrl" (click)="avatarTapped(card)">
1111
</ion-avatar>
1212
<h2>{{card.name}}</h2>

‎src/pages/list/settings/settings.html

Lines changed: 16 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -9,28 +9,28 @@
99
Settings
1010
</ion-list-header>
1111
<ion-item>
12-
<ion-icon name="plane" item-left color="danger"></ion-icon>
12+
<ion-icon name="plane" item-start color="danger"></ion-icon>
1313
<ion-label>Airplane Mode</ion-label>
1414
<ion-toggle color="secondary"></ion-toggle>
1515
</ion-item>
1616
<button ion-item>
17-
<ion-icon name="wifi" item-left color="primary"></ion-icon>
17+
<ion-icon name="wifi" item-start color="primary"></ion-icon>
1818
<ion-label>Wi-Fi</ion-label>
19-
<ion-note item-right>The Interwebz</ion-note>
19+
<ion-note item-end>The Interwebz</ion-note>
2020
</button>
2121
<button ion-item>
22-
<ion-icon name="bluetooth" item-left color="primary"></ion-icon>
22+
<ion-icon name="bluetooth" item-start color="primary"></ion-icon>
2323
<ion-label>Bluetooth</ion-label>
24-
<ion-note item-right>Off</ion-note>
24+
<ion-note item-end>Off</ion-note>
2525
</button>
2626
<button ion-item>
27-
<ion-icon name="call" item-left color="secondary"></ion-icon>
27+
<ion-icon name="call" item-start color="secondary"></ion-icon>
2828
<ion-label>Cellular</ion-label>
2929
</button>
3030
<button ion-item>
31-
<ion-icon name="link" item-left color="secondary"></ion-icon>
31+
<ion-icon name="link" item-start color="secondary"></ion-icon>
3232
<ion-label>Personal Hotspot</ion-label>
33-
<ion-note item-right>Off</ion-note>
33+
<ion-note item-end>Off</ion-note>
3434
</button>
3535
</ion-list>
3636
<ion-list radio-group>
@@ -51,25 +51,24 @@
5151
Apps Installed
5252
</ion-list-header>
5353
<ion-item>
54-
<ion-icon name="ionic" item-left color="primary"></ion-icon>
54+
<ion-icon name="ionic" item-start color="primary"></ion-icon>
5555
<ion-label>Ionic View</ion-label>
56-
<button ion-button outline item-right>Uninstall</button>
56+
<button ion-button outline item-end>Uninstall</button>
5757
</ion-item>
5858
<ion-item>
59-
<ion-icon name="brush" item-left color="primary"></ion-icon>
59+
<ion-icon name="brush" item-start color="primary"></ion-icon>
6060
<ion-label>Ionic Creator</ion-label>
61-
<button ion-button outline item-right>Uninstall</button>
61+
<button ion-button outline item-end>Uninstall</button>
6262
</ion-item>
6363
<ion-item>
64-
<ion-icon name="logo-octocat" item-left color="dark"></ion-icon>
64+
<ion-icon name="logo-octocat" item-start color="dark"></ion-icon>
6565
<ion-label>Hubstruck</ion-label>
66-
<button ion-button outline item-right>Uninstall</button>
66+
<button ion-button outline item-end>Uninstall</button>
6767
</ion-item>
6868
<ion-item>
69-
<ion-icon name="paw" item-left color="danger"></ion-icon>
69+
<ion-icon name="paw" item-start color="danger"></ion-icon>
7070
<ion-label>Barkpark</ion-label>
71-
<button ion-button outline item-right>Uninstall</button>
71+
<button ion-button outline item-end>Uninstall</button>
7272
</ion-item>
7373
</ion-list>
7474
</ion-content>
75-

‎src/pages/list/sliding-item/sliding-item.html

Lines changed: 2 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@
77
<ion-list>
88
<ion-item-sliding *ngFor="let item of items">
99
<ion-item>
10-
<ion-thumbnail item-left>
10+
<ion-thumbnail item-start>
1111
<img [src]="item.imageUrl">
1212
</ion-thumbnail>
1313
<h2>{{item.title}}</h2>
@@ -24,10 +24,9 @@ <h2>{{item.title}}</h2>
2424
</button>
2525
<button ion-button color="danger" (click)="delete(item)">
2626
<ion-icon name="trash"></ion-icon>
27-
Delete
27+
Deleteå
2828
</button>
2929
</ion-item-options>
3030
</ion-item-sliding>
3131
</ion-list>
3232
</ion-content>
33-

‎src/pages/miscellaneous/chat/chats.html

Lines changed: 10 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -9,50 +9,50 @@
99
<ion-list>
1010
<ion-list-header>Today</ion-list-header>
1111
<ion-item *ngFor="let chat of chats" (click)="viewMessages(chat)">
12-
<ion-avatar item-left>
12+
<ion-avatar item-start>
1313
<img [src]="chat.imageUrl">
1414
</ion-avatar>
1515
<h2>{{chat.title}}</h2>
1616
<p>{{chat.lastMessage}}</p>
17-
<ion-note item-right>{{chat.timestamp | moment:"hh:mm a" | lowercase}}</ion-note>
17+
<ion-note item-end>{{chat.timestamp | moment:"hh:mm a" | lowercase}}</ion-note>
1818
</ion-item>
1919
</ion-list>
2020
<ion-list>
2121
<ion-list-header>Yesterday</ion-list-header>
2222
<ion-item>
23-
<ion-avatar item-left>
23+
<ion-avatar item-start>
2424
<img src="assets/img/avatar/marty-avatar.png">
2525
</ion-avatar>
2626
<h2>McFly</h2>
2727
<p>Lorem ipsum dolor sit amet..</p>
28-
<ion-note item-right>11:11 pm</ion-note>
28+
<ion-note item-end>11:11 pm</ion-note>
2929
</ion-item>
3030
<ion-item>
31-
<ion-avatar item-left>
31+
<ion-avatar item-start>
3232
<img src="assets/img/avatar/marty-avatar.png">
3333
</ion-avatar>
3434
<h2>McFly</h2>
3535
<p>Lorem ipsum dolor sit amet..</p>
36-
<ion-note item-right>11:11 pm</ion-note>
36+
<ion-note item-end>11:11 pm</ion-note>
3737
</ion-item>
3838
<ion-item>
39-
<ion-avatar item-left>
39+
<ion-avatar item-start>
4040
<img src="assets/img/avatar/marty-avatar.png">
4141
</ion-avatar>
4242
<h2>McFly</h2>
4343
<p>Lorem ipsum dolor sit amet..</p>
44-
<ion-note item-right>11:11 pm</ion-note>
44+
<ion-note item-end>11:11 pm</ion-note>
4545
</ion-item>
4646
</ion-list>
4747
<ion-list>
4848
<ion-list-header>Last Week</ion-list-header>
4949
<ion-item>
50-
<ion-avatar item-left>
50+
<ion-avatar item-start>
5151
<img src="assets/img/avatar/marty-avatar.png">
5252
</ion-avatar>
5353
<h2>McFly</h2>
5454
<p>Lorem ipsum dolor sit amet..</p>
55-
<ion-note item-right>11:11 pm</ion-note>
55+
<ion-note item-end>11:11 pm</ion-note>
5656
</ion-item>
5757
</ion-list>
5858
</ion-content>

‎src/pages/miscellaneous/chat/messages/messages.html

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -47,7 +47,7 @@
4747
<form [formGroup]="messageForm" (submit)="send(chatBox)" novalidate>
4848
<ion-item>
4949
<ion-input formControlName="message" [(ngModel)]="chatBox" placeholder="Send {{toUser.username}} a message..."></ion-input>
50-
<button ion-button clear (click)="send(chatBox)" item-right><ion-icon class="footer-btn" name="send"></ion-icon></button>
50+
<button ion-button clear (click)="send(chatBox)" item-end><ion-icon class="footer-btn" name="send"></ion-icon></button>
5151
</ion-item>
5252
</form>
53-
</ion-footer>
53+
</ion-footer>

0 commit comments

Comments
 (0)