diff --git a/packages/demos/conference-app/angular/package-lock.json b/packages/demos/conference-app/angular/package-lock.json index 427bce1b3d..7e3031bbfa 100644 --- a/packages/demos/conference-app/angular/package-lock.json +++ b/packages/demos/conference-app/angular/package-lock.json @@ -69,7 +69,7 @@ "chalk": "2.2.2", "circular-dependency-plugin": "4.3.0", "common-tags": "1.6.0", - "copy-webpack-plugin": "4.3.0", + "copy-webpack-plugin": "4.3.1", "core-object": "3.1.5", "css-loader": "0.28.7", "cssnano": "3.10.0", @@ -283,6 +283,42 @@ "resolved": "https://registry.npmjs.org/@ionic-native/status-bar/-/status-bar-4.5.2.tgz", "integrity": "sha512-i2j2J9KIobCqyX6LlrlYhaHgd7qmP1pzHs4XAthHgth8m6c4gsHsh+Pl3fqknD7AX18ghpqo3tVtv0EFhSFU3w==" }, + "@ionic/angular": { + "version": "0.0.2-12", + "resolved": "https://registry.npmjs.org/@ionic/angular/-/angular-0.0.2-12.tgz", + "integrity": "sha512-JagxmwuGf0FAUfRMLadZIy4MWa6NqlBiWJgy4GcSGhVFK6xw2LBFKxAXP+g0RvmFP2P0KXlCht/AS2c2L7liuA==", + "requires": { + "@stencil/core": "0.1.1-0" + }, + "dependencies": { + "@stencil/core": { + "version": "0.1.1-0", + "resolved": "https://registry.npmjs.org/@stencil/core/-/core-0.1.1-0.tgz", + "integrity": "sha512-F4frvyNcIJoWO+ht2Hw8nT7TS7IN0/WKx4vGUbdKWnSvIN4/V+gO5pu/Um3MccSEDFnp+VYMKEZk99scF2wX2g==", + "requires": { + "chokidar": "1.7.0", + "jsdom": "11.3.0", + "node-sass": "4.5.3", + "rollup": "0.50.0", + "rollup-plugin-commonjs": "8.2.5", + "rollup-plugin-node-resolve": "3.0.0", + "typescript": "2.6.2", + "uglify-es": "3.1.6", + "workbox-build": "2.1.1" + } + }, + "typescript": { + "version": "2.6.2", + "resolved": "https://registry.npmjs.org/typescript/-/typescript-2.6.2.tgz", + "integrity": "sha1-PFtv1/beCRQmkCfwPAlGdY92c6Q=" + } + } + }, + "@ionic/core": { + "version": "0.0.2-32", + "resolved": "https://registry.npmjs.org/@ionic/core/-/core-0.0.2-32.tgz", + "integrity": "sha512-43Y6nzBM3HqnitRMcuXlX51XjfVDgHdQJQTf6Ybp+VXxJ6CxV/9cQ28XrvtESa40QRfCLHV5MRNwUajy7F4xJw==" + }, "@ionic/storage": { "version": "2.1.3", "resolved": "https://registry.npmjs.org/@ionic/storage/-/storage-2.1.3.tgz", @@ -406,7 +442,8 @@ "@types/node": { "version": "6.0.95", "resolved": "https://registry.npmjs.org/@types/node/-/node-6.0.95.tgz", - "integrity": "sha512-d1Twx1NM49dQ7jbNZfaHTQWuYL9cFVrGxYpbc3BvMf4626lOJOZnp2aJQNB9vP/WX3UOe1TrTUMABrGRu6FZhg==" + "integrity": "sha512-d1Twx1NM49dQ7jbNZfaHTQWuYL9cFVrGxYpbc3BvMf4626lOJOZnp2aJQNB9vP/WX3UOe1TrTUMABrGRu6FZhg==", + "dev": true }, "@types/q": { "version": "0.0.32", @@ -1665,9 +1702,9 @@ } }, "copy-webpack-plugin": { - "version": "4.3.0", - "resolved": "https://registry.npmjs.org/copy-webpack-plugin/-/copy-webpack-plugin-4.3.0.tgz", - "integrity": "sha512-5o1/xyWm8OYDmLFKAWMuPU3A/jZ4Z6kZSZGh36KD2XmtxnRa8lQyLx7bCNQm08BPaR/oqUdtJOr9jWfnYINp9g==", + "version": "4.3.1", + "resolved": "https://registry.npmjs.org/copy-webpack-plugin/-/copy-webpack-plugin-4.3.1.tgz", + "integrity": "sha512-xlcFiW/U7KrpS6dFuWq3r8Wb7koJx7QVc7LDFCosqkikaVSxkaYOnwDLwilbjrszZ0LYZXThDAJKcQCSrvdShQ==", "dev": true, "requires": { "cacache": "10.0.1", @@ -6772,7 +6809,14 @@ "resolved": "https://registry.npmjs.org/parse5/-/parse5-3.0.3.tgz", "integrity": "sha512-rgO9Zg5LLLkfJF9E6CCmXlSE4UVceloys8JrFqCcHloC3usd/kJCyPDwH2SOlzix2j3xaP9sUX3e8+kvkuleAA==", "requires": { - "@types/node": "6.0.95" + "@types/node": "8.5.2" + }, + "dependencies": { + "@types/node": { + "version": "8.5.2", + "resolved": "https://registry.npmjs.org/@types/node/-/node-8.5.2.tgz", + "integrity": "sha512-KA4GKOpgXnrqEH2eCVhiv2CsxgXGQJgV1X0vsGlh+WCnxbeAE1GT44ZsTU1IN5dEeV/gDupKa7gWo08V5IxWVQ==" + } } }, "parsejson": { diff --git a/packages/demos/conference-app/angular/src/app/app.module.ts b/packages/demos/conference-app/angular/src/app/app.module.ts index 17c99a41f6..a3d2316d9c 100644 --- a/packages/demos/conference-app/angular/src/app/app.module.ts +++ b/packages/demos/conference-app/angular/src/app/app.module.ts @@ -1,16 +1,22 @@ import { BrowserModule, } from '@angular/platform-browser'; import { CUSTOM_ELEMENTS_SCHEMA, NgModule } from '@angular/core'; +import { HttpModule } from '@angular/http'; import { IonicAngularModule } from '@ionic/angular'; import { IonicStorageModule } from '@ionic/storage'; +import { InAppBrowser } from '@ionic-native/in-app-browser'; +import { SplashScreen } from '@ionic-native/splash-screen'; import { AppComponent } from './app.component'; import { AboutPage } from '../pages/about/about'; import { PopoverPage } from '../pages/about-popover/about-popover'; import { MapPage } from '../pages/map/map'; +import { SpeakerListPage } from '../pages/speaker-list/speaker-list'; import { TabsPage } from '../pages/tabs-page/tabs-page'; +import { ConferenceData } from '../providers/conference-data'; +import { UserData } from '../providers/user-data'; @NgModule({ declarations: [ @@ -18,20 +24,28 @@ import { TabsPage } from '../pages/tabs-page/tabs-page'; AppComponent, MapPage, PopoverPage, + SpeakerListPage, TabsPage ], entryComponents: [ AboutPage, MapPage, PopoverPage, + SpeakerListPage, TabsPage ], imports: [ BrowserModule, + HttpModule, IonicAngularModule.forRoot(), IonicStorageModule.forRoot() ], - providers: [], + providers: [ + ConferenceData, + InAppBrowser, + SplashScreen, + UserData + ], bootstrap: [AppComponent], schemas: [ CUSTOM_ELEMENTS_SCHEMA diff --git a/packages/demos/conference-app/angular/src/assets/data/data.json b/packages/demos/conference-app/angular/src/assets/data/data.json new file mode 100755 index 0000000000..4ab9d7e22a --- /dev/null +++ b/packages/demos/conference-app/angular/src/assets/data/data.json @@ -0,0 +1,345 @@ +{ + + "schedule": [{ + "date": "2047-05-17", + "groups": [{ + "time": "8:00 am", + "sessions": [{ + "name": "Breakfast", + "timeStart": "8:00 am", + "timeEnd": "9:00 am", + "location": "Main hallway", + "tracks": ["Food"], + "id": "1" + }] + }, { + "time": "9:15 am", + "sessions": [{ + "name": "Introduction to Appcamp.io", + "location": "Room 2203", + "description": "Mobile devices and browsers are now advanced enough that developers can build native-quality mobile apps using open web technologies like HTML5, Javascript, and CSS. In this talk, we’ll provide background on why and how we created Ionic, the design decisions made as we integrated Ionic with Angular, and the performance considerations for mobile platforms that our team had to overcome. We’ll also review new and upcoming Ionic features, and talk about the hidden powers and benefits of combining mobile app development and Angular.", + "speakerNames": ["Ellie Elephant"], + "timeStart": "9:15 am", + "timeEnd": "9:30 am", + "tracks": ["Ionic"], + "id": "2" + }, { + "name": "Getting started with Ionic", + "location": "Room 2202", + "description": "Mobile devices and browsers are now advanced enough that developers can build native-quality mobile apps using open web technologies like HTML5, Javascript, and CSS. In this talk, we’ll provide background on why and how we created Ionic, the design decisions made as we integrated Ionic with Angular, and the performance considerations for mobile platforms that our team had to overcome. We’ll also review new and upcoming Ionic features, and talk about the hidden powers and benefits of combining mobile app development and Angular.", + "speakerNames": ["Ted Turtle"], + "timeStart": "9:30 am", + "timeEnd": "9:45 am", + "tracks": ["Ionic"], + "id": "3" + }, { + "name": "Tooling for Ionic", + "location": "Room 2201", + "description": "Mobile devices and browsers are now advanced enough that developers can build native-quality mobile apps using open web technologies like HTML5, Javascript, and CSS. In this talk, we’ll provide background on why and how we created Ionic, the design decisions made as we integrated Ionic with Angular, and the performance considerations for mobile platforms that our team had to overcome. We’ll also review new and upcoming Ionic features, and talk about the hidden powers and benefits of combining mobile app development and Angular.", + "speakerNames": ["Rachel Rabbit"], + "timeStart": "9:45 am", + "timeEnd": "10:00 am", + "tracks": ["Tooling"], + "id": "4" + }] + }, { + "time": "10:00 am", + "sessions": [{ + "name": "Migrating to Ionic2", + "location": "Room 2201", + "description": "Mobile devices and browsers are now advanced enough that developers can build native-quality mobile apps using open web technologies like HTML5, Javascript, and CSS. In this talk, we’ll provide background on why and how we created Ionic, the design decisions made as we integrated Ionic with Angular, and the performance considerations for mobile platforms that our team had to overcome. We’ll also review new and upcoming Ionic features, and talk about the hidden powers and benefits of combining mobile app development and Angular.", + "speakerNames": ["Eva Eagle", "Lionel Lion"], + "timeStart": "10:00 am", + "timeEnd": "10:15 am", + "tracks": ["Ionic"], + "id": "5" + }, { + "name": "Whats new in Angular", + "location": "Room 2203", + "description": "Mobile devices and browsers are now advanced enough that developers can build native-quality mobile apps using open web technologies like HTML5, Javascript, and CSS. In this talk, we’ll provide background on why and how we created Ionic, the design decisions made as we integrated Ionic with Angular, and the performance considerations for mobile platforms that our team had to overcome. We’ll also review new and upcoming Ionic features, and talk about the hidden powers and benefits of combining mobile app development and Angular.", + "speakerNames": ["Rachel Rabbit"], + "timeStart": "10:15 am", + "timeEnd": "10:30 am", + "tracks": ["Angular"], + "id": "6" + }, { + "name": "The evolution of Ionicons", + "location": "Room 2202", + "description": "Mobile devices and browsers are now advanced enough that developers can build native-quality mobile apps using open web technologies like HTML5, Javascript, and CSS. In this talk, we’ll provide background on why and how we created Ionic, the design decisions made as we integrated Ionic with Angular, and the performance considerations for mobile platforms that our team had to overcome. We’ll also review new and upcoming Ionic features, and talk about the hidden powers and benefits of combining mobile app development and Angular.", + "speakerNames": ["Isabella Iguana", "Eva Eagle"], + "timeStart": "10:15 am", + "timeEnd": "10:30 am", + "tracks": ["Design"], + "id": "7" + }, { + "name": "Ionic.io Services", + "location": "Room 2202", + "description": "Mobile devices and browsers are now advanced enough that developers can build native-quality mobile apps using open web technologies like HTML5, Javascript, and CSS. In this talk, we’ll provide background on why and how we created Ionic, the design decisions made as we integrated Ionic with Angular, and the performance considerations for mobile platforms that our team had to overcome. We’ll also review new and upcoming Ionic features, and talk about the hidden powers and benefits of combining mobile app development and Angular.", + "speakerNames": ["Charlie Cheetah"], + "timeStart": "10:45 am", + "timeEnd": "11:00 am", + "tracks": ["Services"], + "id": "8" + }] + }, { + "time": "11:00 am", + "sessions": [{ + "name": "Ionic Workshop", + "location": "Room 2201", + "description": "Mobile devices and browsers are now advanced enough that developers can build native-quality mobile apps using open web technologies like HTML5, Javascript, and CSS. In this talk, we’ll provide background on why and how we created Ionic, the design decisions made as we integrated Ionic with Angular, and the performance considerations for mobile platforms that our team had to overcome. We’ll also review new and upcoming Ionic features, and talk about the hidden powers and benefits of combining mobile app development and Angular.", + "speakerNames": ["Karl Kitten", "Lionel Lion"], + "timeStart": "11:00 am", + "timeEnd": "11:45 am", + "tracks": ["Workshop"], + "id": "9" + }, { + "name": "Community Interaction", + "location": "Room 2203", + "description": "Mobile devices and browsers are now advanced enough that developers can build native-quality mobile apps using open web technologies like HTML5, Javascript, and CSS. In this talk, we’ll provide background on why and how we created Ionic, the design decisions made as we integrated Ionic with Angular, and the performance considerations for mobile platforms that our team had to overcome. We’ll also review new and upcoming Ionic features, and talk about the hidden powers and benefits of combining mobile app development and Angular.", + "speakerNames": ["Lionel Lion", "Gino Giraffe"], + "timeStart": "11:30 am", + "timeEnd": "11:50 am", + "tracks": ["Communication"], + "id": "10" + }, { + "name": "Navigation in Ionic", + "location": "Room 2203", + "description": "Mobile devices and browsers are now advanced enough that developers can build native-quality mobile apps using open web technologies like HTML5, Javascript, and CSS. In this talk, we’ll provide background on why and how we created Ionic, the design decisions made as we integrated Ionic with Angular, and the performance considerations for mobile platforms that our team had to overcome. We’ll also review new and upcoming Ionic features, and talk about the hidden powers and benefits of combining mobile app development and Angular.", + "speakerNames": ["Rachel Rabbit", "Eva Eagle"], + "timeStart": "11:30 am", + "timeEnd": "12:00 pm", + "tracks": ["Navigation"], + "id": "11" + }] + }, { + "time": "12:00 pm", + "sessions": [{ + "name": "Lunch", + "location": "Auditorium", + "description": "Come grab lunch with all the Ionic fanatics and talk all things Ionic", + "timeStart": "12:00 pm", + "timeEnd": "1:00 pm", + "tracks": ["Food"], + "id": "12" + }] + }, { + "time": "1:00 pm", + "sessions": [{ + "name": "Ionic in the Enterprise", + "location": "Room 2201", + "description": "Mobile devices and browsers are now advanced enough that developers can build native-quality mobile apps using open web technologies like HTML5, Javascript, and CSS. In this talk, we’ll provide background on why and how we created Ionic, the design decisions made as we integrated Ionic with Angular, and the performance considerations for mobile platforms that our team had to overcome. We’ll also review new and upcoming Ionic features, and talk about the hidden powers and benefits of combining mobile app development and Angular.", + "speakerNames": ["Paul Puppy"], + "timeStart": "1:00 pm", + "timeEnd": "1:15 pm", + "tracks": ["Communication"], + "id": "13" + }, { + "name": "Ionic Worldwide", + "location": "Room 2201", + "description": "Mobile devices and browsers are now advanced enough that developers can build native-quality mobile apps using open web technologies like HTML5, Javascript, and CSS. In this talk, we’ll provide background on why and how we created Ionic, the design decisions made as we integrated Ionic with Angular, and the performance considerations for mobile platforms that our team had to overcome. We’ll also review new and upcoming Ionic features, and talk about the hidden powers and benefits of combining mobile app development and Angular.", + "speakerNames": ["Gino Giraffe"], + "timeStart": "1:15 pm", + "timeEnd": "1:30 pm", + "tracks": ["Communication"], + "id": "14" + }, { + "name": "The Ionic package service", + "location": "Room 2203", + "description": "Mobile devices and browsers are now advanced enough that developers can build native-quality mobile apps using open web technologies like HTML5, Javascript, and CSS. In this talk, we’ll provide background on why and how we created Ionic, the design decisions made as we integrated Ionic with Angular, and the performance considerations for mobile platforms that our team had to overcome. We’ll also review new and upcoming Ionic features, and talk about the hidden powers and benefits of combining mobile app development and Angular.", + "speakerNames": ["Molly Mouse", "Burt Bear"], + "timeStart": "1:30 pm", + "timeEnd": "2:00 pm", + "tracks": ["Services"], + "id": "15" + }] + }, { + "time": "2:00 pm", + "sessions": [{ + "name": "Push Notifications in Ionic", + "location": "Room 2202", + "description": "Mobile devices and browsers are now advanced enough that developers can build native-quality mobile apps using open web technologies like HTML5, Javascript, and CSS. In this talk, we’ll provide background on why and how we created Ionic, the design decisions made as we integrated Ionic with Angular, and the performance considerations for mobile platforms that our team had to overcome. We’ll also review new and upcoming Ionic features, and talk about the hidden powers and benefits of combining mobile app development and Angular.", + "speakerNames": ["Burt Bear", "Charlie Cheetah"], + "timeStart": "2:00 pm", + "timeEnd": "2:30 pm", + "tracks": ["Services"], + "id": "16" + }, { + "name": "Ionic Documentation", + "location": "Room 2202", + "description": "Mobile devices and browsers are now advanced enough that developers can build native-quality mobile apps using open web technologies like HTML5, Javascript, and CSS. In this talk, we’ll provide background on why and how we created Ionic, the design decisions made as we integrated Ionic with Angular, and the performance considerations for mobile platforms that our team had to overcome. We’ll also review new and upcoming Ionic features, and talk about the hidden powers and benefits of combining mobile app development and Angular.", + "speakerNames": ["Donald Duck"], + "timeStart": "2:30 pm", + "timeEnd": "2:45 pm", + "tracks": ["Documentation"], + "id": "17" + }, { + "name": "UX planning in Ionic", + "location": "Room 2203", + "description": "Mobile devices and browsers are now advanced enough that developers can build native-quality mobile apps using open web technologies like HTML5, Javascript, and CSS. In this talk, we’ll provide background on why and how we created Ionic, the design decisions made as we integrated Ionic with Angular, and the performance considerations for mobile platforms that our team had to overcome. We’ll also review new and upcoming Ionic features, and talk about the hidden powers and benefits of combining mobile app development and Angular.", + "speakerNames": ["Isabella Iguana", "Ellie Elephant"], + "timeStart": "2:45 pm", + "timeEnd": "3:00 pm", + "tracks": ["Design"], + "id": "18" + }] + }, { + "time": "3:00", + "sessions": [{ + "name": "Directives in Ionic", + "location": "Room 2201", + "description": "Mobile devices and browsers are now advanced enough that developers can build native-quality mobile apps using open web technologies like HTML5, Javascript, and CSS. In this talk, we’ll provide background on why and how we created Ionic, the design decisions made as we integrated Ionic with Angular, and the performance considerations for mobile platforms that our team had to overcome. We’ll also review new and upcoming Ionic features, and talk about the hidden powers and benefits of combining mobile app development and Angular.", + "speakerNames": ["Ted Turtle"], + "timeStart": "3:00 pm", + "timeEnd": "3:30 pm", + "tracks": ["Angular"], + "id": "19" + }, { + "name": "Mobile States", + "location": "Room 2202", + "description": "Mobile devices and browsers are now advanced enough that developers can build native-quality mobile apps using open web technologies like HTML5, Javascript, and CSS. In this talk, we’ll provide background on why and how we created Ionic, the design decisions made as we integrated Ionic with Angular, and the performance considerations for mobile platforms that our team had to overcome. We’ll also review new and upcoming Ionic features, and talk about the hidden powers and benefits of combining mobile app development and Angular.", + "speakerNames": ["Rachel Rabbit"], + "timeStart": "3:30 pm", + "timeEnd": "3:45 pm", + "tracks": ["Navigation"], + "id": "20" + }] + }] + }], + + + "speakers": [{ + "name": "Burt Bear", + "profilePic": "assets/img/speakers/bear.jpg", + "twitter": "ionicframework", + "about": "Burt is a Bear.", + "location": "Everywhere", + "email": "burt@example.com", + "phone": "+1-541-754-3010", + "id": "1" + }, { + "name": "Charlie Cheetah", + "profilePic": "assets/img/speakers/cheetah.jpg", + "twitter": "ionicframework", + "about": "Charlie is a Cheetah.", + "location": "Everywhere", + "email": "charlie@example.com", + "phone": "+1-541-754-3010", + "id": "2" + }, { + "name": "Donald Duck", + "profilePic": "assets/img/speakers/duck.jpg", + "twitter": "ionicframework", + "about": "Donald is a Duck.", + "location": "Everywhere", + "email": "donald@example.com", + "phone": "+1-541-754-3010", + "id": "3" + }, { + "name": "Eva Eagle", + "profilePic": "assets/img/speakers/eagle.jpg", + "twitter": "ionicframework", + "about": "Eva is an Eagle.", + "location": "Everywhere", + "email": "eva@example.com", + "phone": "+1-541-754-3010", + "id": "4" + }, { + "name": "Ellie Elephant", + "profilePic": "assets/img/speakers/elephant.jpg", + "twitter": "ionicframework", + "about": "Ellie is an Elephant.", + "location": "Everywhere", + "email": "ellie@example.com", + "phone": "+1-541-754-3010", + "id": "5" + }, { + "name": "Gino Giraffe", + "profilePic": "assets/img/speakers/giraffe.jpg", + "twitter": "ionicframework", + "about": "Gino is a Giraffe.", + "location": "Everywhere", + "email": "gino@example.com", + "phone": "+1-541-754-3010", + "id": "6" + }, { + "name": "Isabella Iguana", + "profilePic": "assets/img/speakers/iguana.jpg", + "twitter": "ionicframework", + "about": "Isabella is an Iguana.", + "location": "Everywhere", + "email": "isabella@example.com", + "phone": "+1-541-754-3010", + "id": "7" + }, { + "name": "Karl Kitten", + "profilePic": "assets/img/speakers/kitten.jpg", + "twitter": "ionicframework", + "about": "Karl is a Kitten.", + "location": "Everywhere", + "email": "karl@example.com", + "phone": "+1-541-754-3010", + "id": "8" + }, { + "name": "Lionel Lion", + "profilePic": "assets/img/speakers/lion.jpg", + "twitter": "ionicframework", + "about": "Lionel is a Lion.", + "location": "Everywhere", + "email": "lionel@example.com", + "phone": "+1-541-754-3010", + "id": "9" + }, { + "name": "Molly Mouse", + "profilePic": "assets/img/speakers/mouse.jpg", + "twitter": "ionicframework", + "about": "Molly is a Mouse.", + "location": "Everywhere", + "email": "molly@example.com", + "phone": "+1-541-754-3010", + "id": "10" + }, { + "name": "Paul Puppy", + "profilePic": "assets/img/speakers/puppy.jpg", + "twitter": "ionicframework", + "about": "Paul is a Puppy.", + "location": "Everywhere", + "email": "paul@example.com", + "phone": "+1-541-754-3010", + "id": "11" + }, { + "name": "Rachel Rabbit", + "profilePic": "assets/img/speakers/rabbit.jpg", + "twitter": "ionicframework", + "about": "Rachel is a Rabbit.", + "location": "Everywhere", + "email": "rachel@example.com", + "phone": "+1-541-754-3010", + "id": "12" + }, { + "name": "Ted Turtle", + "profilePic": "assets/img/speakers/turtle.jpg", + "twitter": "ionicframework", + "about": "Ted is a Turtle.", + "location": "Everywhere", + "email": "ted@example.com", + "phone": "+1-541-754-3010", + "id": "13" + }], + + + "map": [{ + "name": "Monona Terrace Convention Center", + "lat": 43.071584, + "lng": -89.380120, + "center": true + }, { + "name": "Ionic HQ", + "lat": 43.074395, + "lng": -89.381056 + }, { + "name": "Afterparty - Brocach Irish Pub", + "lat": 43.07336, + "lng": -89.38335 + }] + +} diff --git a/packages/demos/conference-app/angular/src/assets/img/appicon.png b/packages/demos/conference-app/angular/src/assets/img/appicon.png new file mode 100644 index 0000000000..1c24dc0fc2 Binary files /dev/null and b/packages/demos/conference-app/angular/src/assets/img/appicon.png differ diff --git a/packages/demos/conference-app/angular/src/assets/img/appicon.svg b/packages/demos/conference-app/angular/src/assets/img/appicon.svg new file mode 100644 index 0000000000..5962da1162 --- /dev/null +++ b/packages/demos/conference-app/angular/src/assets/img/appicon.svg @@ -0,0 +1,3 @@ + \ No newline at end of file diff --git a/packages/demos/conference-app/angular/src/assets/img/ica-slidebox-img-1.png b/packages/demos/conference-app/angular/src/assets/img/ica-slidebox-img-1.png new file mode 100644 index 0000000000..9233602614 Binary files /dev/null and b/packages/demos/conference-app/angular/src/assets/img/ica-slidebox-img-1.png differ diff --git a/packages/demos/conference-app/angular/src/assets/img/ica-slidebox-img-2.png b/packages/demos/conference-app/angular/src/assets/img/ica-slidebox-img-2.png new file mode 100644 index 0000000000..2fdce7dd57 Binary files /dev/null and b/packages/demos/conference-app/angular/src/assets/img/ica-slidebox-img-2.png differ diff --git a/packages/demos/conference-app/angular/src/assets/img/ica-slidebox-img-3.png b/packages/demos/conference-app/angular/src/assets/img/ica-slidebox-img-3.png new file mode 100644 index 0000000000..a304e88e0d Binary files /dev/null and b/packages/demos/conference-app/angular/src/assets/img/ica-slidebox-img-3.png differ diff --git a/packages/demos/conference-app/angular/src/assets/img/ica-slidebox-img-4.png b/packages/demos/conference-app/angular/src/assets/img/ica-slidebox-img-4.png new file mode 100644 index 0000000000..2f263d6f03 Binary files /dev/null and b/packages/demos/conference-app/angular/src/assets/img/ica-slidebox-img-4.png differ diff --git a/packages/demos/conference-app/angular/src/assets/img/ionic-logo-white.svg b/packages/demos/conference-app/angular/src/assets/img/ionic-logo-white.svg new file mode 100644 index 0000000000..1bf560b595 --- /dev/null +++ b/packages/demos/conference-app/angular/src/assets/img/ionic-logo-white.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/packages/demos/conference-app/angular/src/assets/img/speakers/bear.jpg b/packages/demos/conference-app/angular/src/assets/img/speakers/bear.jpg new file mode 100644 index 0000000000..30e575e1db Binary files /dev/null and b/packages/demos/conference-app/angular/src/assets/img/speakers/bear.jpg differ diff --git a/packages/demos/conference-app/angular/src/assets/img/speakers/cheetah.jpg b/packages/demos/conference-app/angular/src/assets/img/speakers/cheetah.jpg new file mode 100644 index 0000000000..8370e3503a Binary files /dev/null and b/packages/demos/conference-app/angular/src/assets/img/speakers/cheetah.jpg differ diff --git a/packages/demos/conference-app/angular/src/assets/img/speakers/duck.jpg b/packages/demos/conference-app/angular/src/assets/img/speakers/duck.jpg new file mode 100644 index 0000000000..16574d5434 Binary files /dev/null and b/packages/demos/conference-app/angular/src/assets/img/speakers/duck.jpg differ diff --git a/packages/demos/conference-app/angular/src/assets/img/speakers/eagle.jpg b/packages/demos/conference-app/angular/src/assets/img/speakers/eagle.jpg new file mode 100644 index 0000000000..bb45922823 Binary files /dev/null and b/packages/demos/conference-app/angular/src/assets/img/speakers/eagle.jpg differ diff --git a/packages/demos/conference-app/angular/src/assets/img/speakers/elephant.jpg b/packages/demos/conference-app/angular/src/assets/img/speakers/elephant.jpg new file mode 100644 index 0000000000..2718d8d9a3 Binary files /dev/null and b/packages/demos/conference-app/angular/src/assets/img/speakers/elephant.jpg differ diff --git a/packages/demos/conference-app/angular/src/assets/img/speakers/giraffe.jpg b/packages/demos/conference-app/angular/src/assets/img/speakers/giraffe.jpg new file mode 100644 index 0000000000..38d167e856 Binary files /dev/null and b/packages/demos/conference-app/angular/src/assets/img/speakers/giraffe.jpg differ diff --git a/packages/demos/conference-app/angular/src/assets/img/speakers/iguana.jpg b/packages/demos/conference-app/angular/src/assets/img/speakers/iguana.jpg new file mode 100644 index 0000000000..b5bd117b0c Binary files /dev/null and b/packages/demos/conference-app/angular/src/assets/img/speakers/iguana.jpg differ diff --git a/packages/demos/conference-app/angular/src/assets/img/speakers/kitten.jpg b/packages/demos/conference-app/angular/src/assets/img/speakers/kitten.jpg new file mode 100644 index 0000000000..d0e63195d7 Binary files /dev/null and b/packages/demos/conference-app/angular/src/assets/img/speakers/kitten.jpg differ diff --git a/packages/demos/conference-app/angular/src/assets/img/speakers/lion.jpg b/packages/demos/conference-app/angular/src/assets/img/speakers/lion.jpg new file mode 100644 index 0000000000..6d652063b1 Binary files /dev/null and b/packages/demos/conference-app/angular/src/assets/img/speakers/lion.jpg differ diff --git a/packages/demos/conference-app/angular/src/assets/img/speakers/mouse.jpg b/packages/demos/conference-app/angular/src/assets/img/speakers/mouse.jpg new file mode 100644 index 0000000000..c7228511bb Binary files /dev/null and b/packages/demos/conference-app/angular/src/assets/img/speakers/mouse.jpg differ diff --git a/packages/demos/conference-app/angular/src/assets/img/speakers/puppy.jpg b/packages/demos/conference-app/angular/src/assets/img/speakers/puppy.jpg new file mode 100644 index 0000000000..5ca27976f7 Binary files /dev/null and b/packages/demos/conference-app/angular/src/assets/img/speakers/puppy.jpg differ diff --git a/packages/demos/conference-app/angular/src/assets/img/speakers/rabbit.jpg b/packages/demos/conference-app/angular/src/assets/img/speakers/rabbit.jpg new file mode 100644 index 0000000000..9aced6001e Binary files /dev/null and b/packages/demos/conference-app/angular/src/assets/img/speakers/rabbit.jpg differ diff --git a/packages/demos/conference-app/angular/src/assets/img/speakers/turtle.jpg b/packages/demos/conference-app/angular/src/assets/img/speakers/turtle.jpg new file mode 100644 index 0000000000..2c263450be Binary files /dev/null and b/packages/demos/conference-app/angular/src/assets/img/speakers/turtle.jpg differ diff --git a/packages/demos/conference-app/angular/src/pages/about/about.html b/packages/demos/conference-app/angular/src/pages/about/about.html index af23fe3e7e..cc292156d0 100644 --- a/packages/demos/conference-app/angular/src/pages/about/about.html +++ b/packages/demos/conference-app/angular/src/pages/about/about.html @@ -1,13 +1,13 @@ - + About - + diff --git a/packages/demos/conference-app/angular/src/pages/about/about.scss b/packages/demos/conference-app/angular/src/pages/about/about.scss index a366ec44be..ef6cb5f699 100644 --- a/packages/demos/conference-app/angular/src/pages/about/about.scss +++ b/packages/demos/conference-app/angular/src/pages/about/about.scss @@ -19,7 +19,7 @@ } .about-info ion-icon { - color: color($colors, primary); + // color: color($colors, primary); width: 20px; } diff --git a/packages/demos/conference-app/angular/src/pages/about/about.ts b/packages/demos/conference-app/angular/src/pages/about/about.ts index 4bfc4bbec8..298cfb9f45 100644 --- a/packages/demos/conference-app/angular/src/pages/about/about.ts +++ b/packages/demos/conference-app/angular/src/pages/about/about.ts @@ -14,7 +14,10 @@ export class AboutPage { constructor(public popoverCtrl: PopoverController) { } presentPopover(event: Event) { - const popover = this.popoverCtrl.create(PopoverPage); - popover.present({ ev: event }); + const popover = this.popoverCtrl.create({ + component: PopoverPage, + ev: event + }); + popover.present(); } } diff --git a/packages/demos/conference-app/angular/src/pages/speaker-detail/speaker-detail.html b/packages/demos/conference-app/angular/src/pages/speaker-detail/speaker-detail.html new file mode 100644 index 0000000000..75c7e0f78c --- /dev/null +++ b/packages/demos/conference-app/angular/src/pages/speaker-detail/speaker-detail.html @@ -0,0 +1,23 @@ + + + {{speaker?.name}} + + + + +
+
+ + + + + + + + + + +
+ +

{{speaker?.about}}

+
diff --git a/packages/demos/conference-app/angular/src/pages/speaker-detail/speaker-detail.scss b/packages/demos/conference-app/angular/src/pages/speaker-detail/speaker-detail.scss new file mode 100644 index 0000000000..cb09475250 --- /dev/null +++ b/packages/demos/conference-app/angular/src/pages/speaker-detail/speaker-detail.scss @@ -0,0 +1,9 @@ + +.speaker-detail img { + max-width: 140px; + border-radius: 50%; +} + +.speaker-detail p { + color: #60646B; +} diff --git a/packages/demos/conference-app/angular/src/pages/speaker-detail/speaker-detail.ts b/packages/demos/conference-app/angular/src/pages/speaker-detail/speaker-detail.ts new file mode 100644 index 0000000000..99571090df --- /dev/null +++ b/packages/demos/conference-app/angular/src/pages/speaker-detail/speaker-detail.ts @@ -0,0 +1,33 @@ +import { Component } from '@angular/core'; +import { NavController, NavParams } from '@ionic/angular'; + +import { ConferenceData } from '../../providers/conference-data'; + +@Component({ + selector: 'page-speaker-detail', + templateUrl: 'speaker-detail.html' +}) +export class SpeakerDetailPage { + speaker: any; + + constructor(public dataProvider: ConferenceData, public navCtrl: NavController, public navParams: NavParams) { + } + + ionViewWillEnter() { + this.dataProvider.load().subscribe((data: any) => { + if (data && data.speakers) { + for (const speaker of data.speakers) { + if (speaker && speaker.id === this.navParams.data.speakerId) { + this.speaker = speaker; + break; + } + } + } + }); + + } + + goToSessionDetail(session: any) { + this.navCtrl.push('SessionDetailPage', { sessionId: session.id }); + } +} diff --git a/packages/demos/conference-app/angular/src/pages/speaker-list/speaker-list.html b/packages/demos/conference-app/angular/src/pages/speaker-list/speaker-list.html new file mode 100644 index 0000000000..1b3788c34a --- /dev/null +++ b/packages/demos/conference-app/angular/src/pages/speaker-list/speaker-list.html @@ -0,0 +1,66 @@ + + + + + + Speakers + + + + + + + + + + + + + + + Speaker profile pic + + {{speaker.name}} + + + + + + +

{{session.name}}

+
+ + +

About {{speaker.name}}

+
+
+
+ + + + + + Tweet + + + + + + Share + + + + + + Contact + + + + +
+ +
+
+
+
+
diff --git a/packages/demos/conference-app/angular/src/pages/speaker-list/speaker-list.scss b/packages/demos/conference-app/angular/src/pages/speaker-list/speaker-list.scss new file mode 100644 index 0000000000..051ffe3bba --- /dev/null +++ b/packages/demos/conference-app/angular/src/pages/speaker-list/speaker-list.scss @@ -0,0 +1,31 @@ +page-speaker-list { + .scroll-content { + background: #EDEDED; + } + + .speaker-card { + height: 100%; + display: flex; + flex-direction: column; + + ion-card-content { + flex: 1 1 auto; + } + } + + // Todo: remove when this issue https://github.com/ionic-team/ionic/issues/11212 is fixed + @media(min-width: 769px) { + .speaker-card { + height: 370px; + } + } + + .speaker-card ion-card-header .item { + padding: 4px 16px; + } + + .speaker-card ion-card-content { + padding-left: 0; + padding-right: 0; + } +} diff --git a/packages/demos/conference-app/angular/src/pages/speaker-list/speaker-list.ts b/packages/demos/conference-app/angular/src/pages/speaker-list/speaker-list.ts new file mode 100644 index 0000000000..f76a446148 --- /dev/null +++ b/packages/demos/conference-app/angular/src/pages/speaker-list/speaker-list.ts @@ -0,0 +1,104 @@ +import { Component } from '@angular/core'; + +import { + ActionSheetController, + NavController +} from '@ionic/angular'; + + +import { InAppBrowser } from '@ionic-native/in-app-browser'; + +import { ConferenceData } from '../../providers/conference-data'; + +// import { SessionDetailPage } from '../session-detail/session-detail'; +import { SpeakerDetailPage } from '../speaker-detail/speaker-detail'; + +@Component({ + selector: 'page-speaker-list', + templateUrl: 'speaker-list.html' +}) +export class SpeakerListPage { + speakers: any[] = []; + + constructor( + public actionSheetCtrl: ActionSheetController, + public navCtrl: NavController, + public confData: ConferenceData, + public inAppBrowser: InAppBrowser + ) {} + + ionViewDidLoad() { + this.confData.getSpeakers().subscribe((speakers: any[]) => { + this.speakers = speakers; + }); + } + + goToSessionDetail(session: any) { + // this.navCtrl.push(SessionDetailPage, { sessionId: session.id }); + } + + goToSpeakerDetail(speaker: any) { + // this.navCtrl.push(SpeakerDetailPage, { speakerId: speaker.id }); + } + + goToSpeakerTwitter(speaker: any) { + this.inAppBrowser.create( + `https://twitter.com/${speaker.twitter}`, + '_blank' + ); + } + + openSpeakerShare(speaker: any) { + const actionSheet = this.actionSheetCtrl.create({ + title: 'Share ' + speaker.name, + buttons: [ + { + text: 'Copy Link', + handler: () => { + console.log('Copy link clicked on https://twitter.com/' + speaker.twitter); + if ( (window as any)['cordova'] && (window as any)['cordova'].plugins.clipboard) { + (window as any)['cordova'].plugins.clipboard.copy( + 'https://twitter.com/' + speaker.twitter + ); + } + } + }, + { + text: 'Share via ...' + }, + { + text: 'Cancel', + role: 'cancel' + } + ] + }); + + actionSheet.present(); + } + + openContact(speaker: any) { + const mode = 'ios'; // this.config.get('mode'); + + const actionSheet = this.actionSheetCtrl.create({ + title: 'Contact ' + speaker.name, + buttons: [ + { + text: `Email ( ${speaker.email} )`, + icon: mode !== 'ios' ? 'mail' : null, + handler: () => { + window.open('mailto:' + speaker.email); + } + }, + { + text: `Call ( ${speaker.phone} )`, + icon: mode !== 'ios' ? 'call' : null, + handler: () => { + window.open('tel:' + speaker.phone); + } + } + ] + }); + + actionSheet.present(); + } +} diff --git a/packages/demos/conference-app/angular/src/pages/tabs-page/tabs-page.ts b/packages/demos/conference-app/angular/src/pages/tabs-page/tabs-page.ts index 748a8ac511..35192a02d5 100644 --- a/packages/demos/conference-app/angular/src/pages/tabs-page/tabs-page.ts +++ b/packages/demos/conference-app/angular/src/pages/tabs-page/tabs-page.ts @@ -3,7 +3,7 @@ import { Component } from '@angular/core'; import { AboutPage } from '../about/about'; import { MapPage } from '../map/map'; // import { SchedulePage } from '../schedule/schedule'; -// import { SpeakerListPage } from '../speaker-list/speaker-list'; +import { SpeakerListPage } from '../speaker-list/speaker-list'; @Component({ templateUrl: 'tabs-page.html' @@ -11,7 +11,7 @@ import { MapPage } from '../map/map'; export class TabsPage { // set the root pages for each tab tab1Root: any = AboutPage; - tab2Root: any = AboutPage; + tab2Root: any = SpeakerListPage; tab3Root: any = MapPage; tab4Root: any = AboutPage; mySelectedIndex: number;