From f070326a93d5981c01fac14072c93ba8cd673cba Mon Sep 17 00:00:00 2001 From: kj1352 Date: Thu, 2 Jul 2020 17:37:43 +0530 Subject: [PATCH] Demo data service + observable for demo type and data init for class list of both teacher and student + data integration for welcome & home page --- src/app/app.component.ts | 3 +- src/app/app.module.ts | 7 +- .../class-card-list.component.html | 5 +- src/app/services/demo.service.spec.ts | 16 ++ src/app/services/demo.service.ts | 177 ++++++++++++++++++ src/app/tabs/home/home.component.html | 15 +- src/app/tabs/home/home.component.scss | 13 ++ src/app/tabs/home/home.component.ts | 119 +++--------- src/app/welcome/welcome.component.html | 4 +- src/app/welcome/welcome.component.scss | 4 + src/app/welcome/welcome.component.ts | 112 +++-------- 11 files changed, 276 insertions(+), 199 deletions(-) create mode 100644 src/app/services/demo.service.spec.ts create mode 100644 src/app/services/demo.service.ts diff --git a/src/app/app.component.ts b/src/app/app.component.ts index 3735244..ce035d7 100644 --- a/src/app/app.component.ts +++ b/src/app/app.component.ts @@ -1,10 +1,11 @@ import { Component } from '@angular/core'; + @Component({ selector: 'app-root', templateUrl: './app.component.html', styleUrls: ['./app.component.scss'] }) export class AppComponent { - title = 'lms-app-new'; + } diff --git a/src/app/app.module.ts b/src/app/app.module.ts index ce0c307..c25558b 100644 --- a/src/app/app.module.ts +++ b/src/app/app.module.ts @@ -34,6 +34,9 @@ import { ChatWindowComponent } from './chat-page/chat-window/chat-window.compone import { SettingsComponent } from './settings/settings.component'; import { ClassCardListComponent } from './reusable-components/class-card-list/class-card-list.component'; +// Import services +import { DemoService } from './services/demo.service'; + @NgModule({ declarations: [ AppComponent, @@ -69,7 +72,9 @@ import { ClassCardListComponent } from './reusable-components/class-card-list/cl AngularSvgIconModule.forRoot(), ServiceWorkerModule.register('ngsw-worker.js', { enabled: environment.production }) ], - providers: [], + providers: [ + DemoService + ], bootstrap: [AppComponent] }) export class AppModule { } diff --git a/src/app/reusable-components/class-card-list/class-card-list.component.html b/src/app/reusable-components/class-card-list/class-card-list.component.html index c54ae25..c0a1b3a 100644 --- a/src/app/reusable-components/class-card-list/class-card-list.component.html +++ b/src/app/reusable-components/class-card-list/class-card-list.component.html @@ -8,10 +8,13 @@
-

+

{{ class.teacher.name }}

+

+ {{ class.classLevel }} +

@@ -100,7 +101,7 @@
-
+
{{ class.date }}
diff --git a/src/app/tabs/home/home.component.scss b/src/app/tabs/home/home.component.scss index 2154c51..ea29c15 100644 --- a/src/app/tabs/home/home.component.scss +++ b/src/app/tabs/home/home.component.scss @@ -102,6 +102,19 @@ .tutor { color: white; + width: 100%; + + .go-live-button { + width: 100px; + display: block; + margin: 15px auto 0px; + background-color: var(--teal-green); + border-radius: 5px; + border: 0px; + color: white; + font-size: 14px; + height: 35px; + } @media screen and (min-width: 1023px) { position: relative; diff --git a/src/app/tabs/home/home.component.ts b/src/app/tabs/home/home.component.ts index ee6dbce..86e1c3b 100644 --- a/src/app/tabs/home/home.component.ts +++ b/src/app/tabs/home/home.component.ts @@ -1,6 +1,7 @@ import { Component, OnInit } from '@angular/core'; import { ScrollEvent } from 'ngx-scroll-event'; -import * as moment from 'moment'; +import { DemoService } from '../../services/demo.service'; +import { Subscription } from 'rxjs'; @Component({ selector: 'app-home', @@ -11,105 +12,15 @@ export class HomeComponent implements OnInit { expandVideo: boolean = false; showClassDetails: boolean; selectedSegment: string = 'transcript'; + showVideo: boolean = false; + demoTypeSubscriber: Subscription; + demoType: string; - studentClassList = [{ - date: moment(new Date()).format('MMM, DD 2020'), - classes: [{ - time: '10:00 AM', - duration: '45 Mins', - subject: 'Mathematics', - teacher: { - name: 'Mr Kashinath Kashyap', - profile_image: 'https://pbs.twimg.com/profile_images/3478244961/01ebfc40ecc194a2abc81e82ab877af4.jpeg' - }, - classUrl: '/video-chapter', - classId: 'topic1', - attendanceStatus: 'LATE' - }, { - time: '11:00 AM', - duration: '45 Mins', - subject: 'Physics', - teacher: { - name: 'Dr Meghana', - profile_image: 'https://pbs.twimg.com/profile_images/416884752377843712/MW2qg7-f.jpeg' - }, - classUrl: '/chapter-notes', - classId: 'topic1', - attendanceStatus: 'ABSENT' - }, { - time: '12:00 PM', - duration: '45 Mins', - subject: 'Chemistry', - teacher: { - name: 'Mr Kashinath Kashyap', - profile_image: 'https://pbs.twimg.com/profile_images/3478244961/01ebfc40ecc194a2abc81e82ab877af4.jpeg' - }, - classUrl: '/chapter-notes', - classId: 'topic1', - attendanceStatus: 'PRESENT' - }, { - time: '2:00 PM', - duration: '45 Mins', - subject: 'EVS', - teacher: { - name: 'Mr Kashinath Kashyap', - profile_image: 'https://pbs.twimg.com/profile_images/3478244961/01ebfc40ecc194a2abc81e82ab877af4.jpeg' - } - }, { - time: '3:00 PM', - duration: '45 Mins', - subject: 'Biology', - teacher: { - name: 'Dr Meghana', - profile_image: 'https://pbs.twimg.com/profile_images/416884752377843712/MW2qg7-f.jpeg' - } - }] - }, { - date: moment(new Date()).subtract(1, 'day').format('MMM, DD 2020'), - classes: [{ - time: '10:00 AM', - duration: '45 Mins', - subject: 'Mathematics', - teacher: { - name: 'Mr Kashinath Kashyap', - profile_image: 'https://pbs.twimg.com/profile_images/3478244961/01ebfc40ecc194a2abc81e82ab877af4.jpeg' - } - }, { - time: '11:00 AM', - duration: '45 Mins', - subject: 'Physics', - teacher: { - name: 'Dr Meghana', - profile_image: 'https://pbs.twimg.com/profile_images/416884752377843712/MW2qg7-f.jpeg' - } - }, { - time: '12:00 PM', - duration: '45 Mins', - subject: 'Chemistry', - teacher: { - name: 'Mr Kashinath Kashyap', - profile_image: 'https://pbs.twimg.com/profile_images/3478244961/01ebfc40ecc194a2abc81e82ab877af4.jpeg' - } - }, { - time: '2:00 PM', - duration: '45 Mins', - subject: 'EVS', - teacher: { - name: 'Mr Kashinath Kashyap', - profile_image: 'https://pbs.twimg.com/profile_images/3478244961/01ebfc40ecc194a2abc81e82ab877af4.jpeg' - } - }, { - time: '3:00 PM', - duration: '45 Mins', - subject: 'Biology', - teacher: { - name: 'Dr Meghana', - profile_image: 'https://pbs.twimg.com/profile_images/416884752377843712/MW2qg7-f.jpeg' - } - }] - }]; + classList = []; - constructor() { } + constructor( + private demoService: DemoService + ) { } ngOnInit(): void { if (window.innerWidth > 1023) { @@ -117,6 +28,18 @@ export class HomeComponent implements OnInit { } else { this.showClassDetails = false; } + + this.demoTypeSubscriber = this.demoService.demoType.subscribe((type) => { + this.demoType = type; + if (type === 'Student') { + this.classList = this.demoService.studentClassList; + this.showVideo = true; + } + + if (type === 'Teacher') { + this.classList = this.demoService.teacherClassList; + } + }); } public handleScroll(event: ScrollEvent) { diff --git a/src/app/welcome/welcome.component.html b/src/app/welcome/welcome.component.html index ec3bed5..0991eae 100644 --- a/src/app/welcome/welcome.component.html +++ b/src/app/welcome/welcome.component.html @@ -2,7 +2,7 @@

Good Morning,
- Shashank + {{ demoType }}

Your schedule for the day! @@ -10,7 +10,7 @@

-
+
{{ class.date }}
diff --git a/src/app/welcome/welcome.component.scss b/src/app/welcome/welcome.component.scss index 4519c52..c27a5d8 100644 --- a/src/app/welcome/welcome.component.scss +++ b/src/app/welcome/welcome.component.scss @@ -1,3 +1,7 @@ +.page-container { + padding-bottom: 100px; +} + .upfold { width: 100%; color: white; diff --git a/src/app/welcome/welcome.component.ts b/src/app/welcome/welcome.component.ts index 4306d7b..cc8c760 100644 --- a/src/app/welcome/welcome.component.ts +++ b/src/app/welcome/welcome.component.ts @@ -1,5 +1,6 @@ import { Component, OnInit } from '@angular/core'; -import * as moment from 'moment'; +import { DemoService } from '../services/demo.service'; +import { Subscription } from 'rxjs'; @Component({ selector: 'app-welcome', @@ -7,97 +8,30 @@ import * as moment from 'moment'; styleUrls: ['./welcome.component.scss'] }) export class WelcomeComponent implements OnInit { - studentClassList = [{ - date: moment(new Date()).format('MMM, DD 2020'), - classes: [{ - time: '10:00 AM', - duration: '45 Mins', - subject: 'Mathematics', - teacher: { - name: 'Mr Kashinath Kashyap', - profile_image: 'https://pbs.twimg.com/profile_images/3478244961/01ebfc40ecc194a2abc81e82ab877af4.jpeg' - } - }, { - time: '11:00 AM', - duration: '45 Mins', - subject: 'Physics', - teacher: { - name: 'Dr Meghana', - profile_image: 'https://pbs.twimg.com/profile_images/416884752377843712/MW2qg7-f.jpeg' - } - }, { - time: '12:00 PM', - duration: '45 Mins', - subject: 'Chemistry', - teacher: { - name: 'Mr Kashinath Kashyap', - profile_image: 'https://pbs.twimg.com/profile_images/3478244961/01ebfc40ecc194a2abc81e82ab877af4.jpeg' - } - }, { - time: '2:00 PM', - duration: '45 Mins', - subject: 'EVS', - teacher: { - name: 'Mr Kashinath Kashyap', - profile_image: 'https://pbs.twimg.com/profile_images/3478244961/01ebfc40ecc194a2abc81e82ab877af4.jpeg' - } - }, { - time: '3:00 PM', - duration: '45 Mins', - subject: 'Biology', - teacher: { - name: 'Dr Meghana', - profile_image: 'https://pbs.twimg.com/profile_images/416884752377843712/MW2qg7-f.jpeg' - } - }] - }, { - date: moment(new Date()).subtract(1, 'day').format('MMM, DD 2020'), - classes: [{ - time: '10:00 AM', - duration: '45 Mins', - subject: 'Mathematics', - teacher: { - name: 'Mr Kashinath Kashyap', - profile_image: 'https://pbs.twimg.com/profile_images/3478244961/01ebfc40ecc194a2abc81e82ab877af4.jpeg' - } - }, { - time: '11:00 AM', - duration: '45 Mins', - subject: 'Physics', - teacher: { - name: 'Dr Meghana', - profile_image: 'https://pbs.twimg.com/profile_images/416884752377843712/MW2qg7-f.jpeg' - } - }, { - time: '12:00 PM', - duration: '45 Mins', - subject: 'Chemistry', - teacher: { - name: 'Mr Kashinath Kashyap', - profile_image: 'https://pbs.twimg.com/profile_images/3478244961/01ebfc40ecc194a2abc81e82ab877af4.jpeg' - } - }, { - time: '2:00 PM', - duration: '45 Mins', - subject: 'EVS', - teacher: { - name: 'Mr Kashinath Kashyap', - profile_image: 'https://pbs.twimg.com/profile_images/3478244961/01ebfc40ecc194a2abc81e82ab877af4.jpeg' - } - }, { - time: '3:00 PM', - duration: '45 Mins', - subject: 'Biology', - teacher: { - name: 'Dr Meghana', - profile_image: 'https://pbs.twimg.com/profile_images/416884752377843712/MW2qg7-f.jpeg' - } - }] - }]; + demoTypeSubscriber: Subscription; + demoType: string; - constructor() { } + classList = []; + + constructor( + private demoService: DemoService + ) { } ngOnInit(): void { + this.demoTypeSubscriber = this.demoService.demoType.subscribe((type) => { + this.demoType = type; + if (type === 'Student') { + this.classList = this.demoService.studentClassList; + } + + if (type === 'Teacher') { + this.classList = this.demoService.teacherClassList; + } + }); } + ngOnDestroy() { + this.demoTypeSubscriber.unsubscribe(); + } + }