diff --git a/src/app/add-event/add-event.component.html b/src/app/add-event/add-event.component.html
index b854181a11c480da1ca3845c34ccfd11dc170333..b8b51490a91b1d8bd7b6627617978e45721460bb 100644
--- a/src/app/add-event/add-event.component.html
+++ b/src/app/add-event/add-event.component.html
@@ -10,7 +10,7 @@
<form class="example-form">
<mat-form-field class="example-full-width">
<input matInput>
- <mat-placeholder class="placeholder">Event Name</mat-placeholder>
+ <mat-placeholder class="placeholder">Workshop Name</mat-placeholder>
</mat-form-field>
<mat-form-field class="example-full-width">
<input matInput>
@@ -35,7 +35,10 @@
<mat-form-field class="example-full-width">
<input matInput type="number">
<mat-placeholder class="placeholder">Capacity</mat-placeholder>
-
+ </mat-form-field>
+ <mat-form-field class="example-full-width">
+ <input matInput>
+ <mat-placeholder class="placeholder">Location</mat-placeholder>
</mat-form-field>
</form>
</div>
@@ -45,32 +48,25 @@
<form class="example-form">
<mat-form-field class="example-full-width">
<input matInput>
- <mat-placeholder class="placeholder">Name</mat-placeholder>
+ <mat-placeholder class="placeholder">Conference Name</mat-placeholder>
</mat-form-field>
<mat-form-field class="example-full-width">
<input matInput>
- <mat-placeholder class="placeholder">Reg. No.</mat-placeholder>
- </mat-form-field>
- <mat-form-field class="example-full-width">
- <input matInput type="password">
- <mat-placeholder class="placeholder">Password</mat-placeholder>
- </mat-form-field>
- <mat-form-field class="example-full-width">
- <input matInput type="password">
- <mat-placeholder class="placeholder">Confirm Password</mat-placeholder>
+ <mat-placeholder class="placeholder">Description</mat-placeholder>
</mat-form-field>
<mat-form-field class="example-full-width">
- <input matInput>
- <mat-placeholder class="placeholder">Program</mat-placeholder>
+ <input matInput type="number">
+ <mat-placeholder class="placeholder">Entry fee</mat-placeholder>
</mat-form-field>
<mat-form-field class="example-full-width">
- <input matInput type="email">
- <mat-placeholder class="placeholder">Email</mat-placeholder>
+ <input matInput type="number">
+ <mat-placeholder class="placeholder">Capacity</mat-placeholder>
</mat-form-field>
<mat-form-field class="example-full-width">
- <input matInput type="number">
- <mat-placeholder class="placeholder">Phone no.</mat-placeholder>
+ <input matInput type="date">
+ <mat-placeholder class="placeholder">Date</mat-placeholder>
</mat-form-field>
+
</form>
</div>
</mat-tab>
diff --git a/src/app/add-event/add-event.component.scss b/src/app/add-event/add-event.component.scss
index f3541c0485a6d1e6e1fc12e72c433da14dcbc60d..bada85f654f2848a0a586999e6fe39afab8056d8 100644
--- a/src/app/add-event/add-event.component.scss
+++ b/src/app/add-event/add-event.component.scss
@@ -1,5 +1,5 @@
.registerPage {
- background-image: url("../../assets/images/register_bgimg.jpg");
+ background-image: url("../../assets/images/eventAddBG.jpg");
background-repeat: no-repeat;
background-size: cover;
background-position: center;
@@ -17,7 +17,7 @@
.title {
margin-bottom: 1.5rem;
- margin-top: 30%;
+ margin-top: 20%;
display: flex;
flex-direction: row;
justify-content: flex-start;
@@ -46,7 +46,6 @@
max-width: 500px;
width: 100%;
padding: 2rem;
-
}
.example-full-width {
@@ -122,19 +121,25 @@
.event {
background: rgba(19, 17, 17, 0.555);
-color: white;
-border-radius: 1rem;
+ color: white;
+ border-radius: 1rem;
border: 5px solid white;
-}
+ height: 42rem;
+}
-::ng-deep .mat-tab-label-active .mat-tab-label-content {
- color: white !important;
-}
-::ng-deep.mat-tab-group.mat-primary .mat-ink-bar, ::ng-deep.mat-tab-nav-bar.mat-primary .mat-ink-bar{
- background-color: white !important;
+::ng-deep .mat-tab-label-active .mat-tab-label-content {
+ color: white !important;
}
+::ng-deep .mat-tab-label .mat-tab-label-content{
+ color: white !important;
+
+}
+::ng-deep.mat-tab-group.mat-primary .mat-ink-bar,
+::ng-deep.mat-tab-nav-bar.mat-primary .mat-ink-bar {
+ background-color: white !important;
+}
diff --git a/src/app/app.component.html b/src/app/app.component.html
index 42df503be708dcb8ea6e75cfdce2e91bcfb664a9..f2987b86d9c19378865f85f501936ba89c91a67e 100644
--- a/src/app/app.component.html
+++ b/src/app/app.component.html
@@ -1,5 +1,8 @@
<app-home-page></app-home-page>
+<app-add-event></app-add-event>
<app-register></app-register>
<app-login></app-login>
<app-listing></app-listing>
-<app-add-event></app-add-event>
+<app-moderator-portal></app-moderator-portal>
+<app-details></app-details>
+<app-history></app-history>
\ No newline at end of file
diff --git a/src/app/app.module.ts b/src/app/app.module.ts
index 806ffe885b6a6680a648dbd3965e53b69efb97c8..56e1c07afa21f61282ac6b80401166d33510d776 100644
--- a/src/app/app.module.ts
+++ b/src/app/app.module.ts
@@ -10,9 +10,12 @@ import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
import { MatInputModule, MatFormFieldModule,MatRadioModule,MatTabsModule } from '@angular/material';
import { ListingComponent } from './listing/listing.component';
import { AddEventComponent } from './add-event/add-event.component';
+import {DragDropModule} from '@angular/cdk/drag-drop';
-
-import { FormsModule } from '@angular/forms';
+import { FormsModule, ReactiveFormsModule } from '@angular/forms';
+import { ModeratorPortalComponent } from './moderator-portal/moderator-portal.component';
+import { DetailsComponent } from './details/details.component';
+import { HistoryComponent } from './history/history.component';
@NgModule({
declarations: [
@@ -21,7 +24,10 @@ import { FormsModule } from '@angular/forms';
HomePageComponent,
LoginComponent,
ListingComponent,
- AddEventComponent
+ AddEventComponent,
+ ModeratorPortalComponent,
+ DetailsComponent,
+ HistoryComponent
],
imports: [
BrowserModule,
@@ -35,6 +41,8 @@ import { FormsModule } from '@angular/forms';
MatTabsModule,
MatDatepickerModule,
MatNativeDateModule,
+ DragDropModule,
+ ReactiveFormsModule,
],
providers: [],
bootstrap: [AppComponent]
diff --git a/src/app/contracts/eventDetails.ts b/src/app/contracts/eventDetails.ts
index 6d2f22f4dfb94b465db112d327821d730fa50f29..faaabbb0358edbda1d137bb40e38ab080cfee9a0 100644
--- a/src/app/contracts/eventDetails.ts
+++ b/src/app/contracts/eventDetails.ts
@@ -11,5 +11,6 @@ export interface eventDetails{
description?:string;
isRegistrationAllowed:boolean;
createdBy?:number;
+ isWorkshop:boolean;
}
\ No newline at end of file
diff --git a/src/app/details/details.component.html b/src/app/details/details.component.html
new file mode 100644
index 0000000000000000000000000000000000000000..7584d776521a7564198288620ad3bb1a6dde9fc2
--- /dev/null
+++ b/src/app/details/details.component.html
@@ -0,0 +1,32 @@
+<div class="registerPage">
+ <div class="content">
+ <div class="title">
+ <div class=vertical></div>
+ <div>Event Details</div>
+ </div>
+ <div class="inputs">
+ <div class="eventName">
+ Event Name goes here
+ </div>
+ <div class="imgLogo">
+ <img mat-card-image src="../../assets/images/logo.jpg" style="max-width: 10rem" alt="Logo of event">
+ </div>
+
+ <div class="description">
+ Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
+ </div>
+ <div>
+ Date : 24th July, 2018
+ </div>
+ <div>
+ Time : 9 AM - 12 PM
+ </div>
+ <div>
+ Venue : Amriteshwari Hall
+ </div>
+ </div>
+ <div class="register">
+ <button class="controlButton">REGISTER</button>
+ </div>
+ </div>
+</div>
\ No newline at end of file
diff --git a/src/app/details/details.component.scss b/src/app/details/details.component.scss
new file mode 100644
index 0000000000000000000000000000000000000000..bc4ef13a7ec2016f8858e6f3c3b6c6a5fc1ff509
--- /dev/null
+++ b/src/app/details/details.component.scss
@@ -0,0 +1,125 @@
+.registerPage{
+ background-image: url("../../assets/images/viewDetailsBG.jpg");
+ background-repeat: no-repeat;
+ background-size: cover;
+ background-position:center;
+ width: 100%;
+ height: 60rem;
+ display: flex;
+ flex-direction: row;
+ justify-content: space-around;
+}
+
+.content{
+ display: flex;
+ flex-direction: column;
+
+}
+
+.title{
+ margin-bottom: 1.5rem;
+ margin-top: 30%;
+ display: flex;
+ flex-direction: row;
+ justify-content: flex-start;
+ font-family: 'Raleway', sans-serif;
+ -webkit-text-stroke: 0.5px white;
+ letter-spacing: 0.1rem;
+ color:white;
+ font-weight: 500;
+ font-size: 2.5rem;
+}
+
+.horizontal{
+ display: flex;
+ color: white;
+ flex-direction: row;
+ justify-content: flex-start;
+}
+
+.inputs{
+ color: white;
+ width: 30rem;
+ min-width: 150px;
+ max-width: 500px;
+ width: 100%;
+ padding: 2rem;
+ border-radius:1rem;
+ border: 5px solid white;
+ background: rgba(19, 17, 17, 0.555);
+}
+
+
+
+ .example-full-width {
+ width: 100%;
+ }
+
+ .example-form {
+ min-width: 150px;
+ max-width: 500px;
+ width: 100%;
+ }
+
+ .example-full-width {
+ width: 100%;
+ }
+
+ ::ng-deep .mat-focused .mat-form-field-label {
+ color: white !important;
+ }
+
+ ::ng-deep.mat-form-field-underline {
+ background-color: white !important;
+ }
+
+ ::ng-deep.mat-form-field-ripple {
+ background-color: white !important;;
+ }
+
+
+.controlButton{
+ padding: 0rem;
+ width: 12rem;
+ font-family: 'Raleway', sans-serif;
+ background-color: rgb(178, 83, 216);
+ color: white;
+ padding: 0.5rem 1rem;
+ border-radius: 1rem;
+ border: none;
+}
+
+.register{
+ display: flex;
+ flex-direction: row;
+ justify-content: space-around;
+ margin-top: 2rem;
+}
+
+.placeholder{
+color: white;
+}
+
+.vertical{
+ height: auto;
+ width: 0.2rem;
+ background-color: white;
+ margin-right: 1rem;
+}
+
+.eventName{
+ font-size: 2rem;
+}
+
+.description{
+ margin-top:1rem;
+ margin-bottom: 1rem;
+}
+
+.imgLogo{
+ width: 100%;
+ margin-top: 1rem;
+ display: flex;
+ flex-direction: row;
+ justify-content: space-around;
+}
diff --git a/src/app/details/details.component.spec.ts b/src/app/details/details.component.spec.ts
new file mode 100644
index 0000000000000000000000000000000000000000..1d5cbeb851a08d89c22db1bfbeaf5774275f858a
--- /dev/null
+++ b/src/app/details/details.component.spec.ts
@@ -0,0 +1,25 @@
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { DetailsComponent } from './details.component';
+
+describe('DetailsComponent', () => {
+ let component: DetailsComponent;
+ let fixture: ComponentFixture<DetailsComponent>;
+
+ beforeEach(async(() => {
+ TestBed.configureTestingModule({
+ declarations: [ DetailsComponent ]
+ })
+ .compileComponents();
+ }));
+
+ beforeEach(() => {
+ fixture = TestBed.createComponent(DetailsComponent);
+ component = fixture.componentInstance;
+ fixture.detectChanges();
+ });
+
+ it('should create', () => {
+ expect(component).toBeTruthy();
+ });
+});
diff --git a/src/app/details/details.component.ts b/src/app/details/details.component.ts
new file mode 100644
index 0000000000000000000000000000000000000000..6d03f79e656e5e551fe0c27c9a4d1022d1e319d4
--- /dev/null
+++ b/src/app/details/details.component.ts
@@ -0,0 +1,15 @@
+import { Component, OnInit } from '@angular/core';
+
+@Component({
+ selector: 'app-details',
+ templateUrl: './details.component.html',
+ styleUrls: ['./details.component.scss']
+})
+export class DetailsComponent implements OnInit {
+
+ constructor() { }
+
+ ngOnInit() {
+ }
+
+}
diff --git a/src/app/history/history.component.html b/src/app/history/history.component.html
new file mode 100644
index 0000000000000000000000000000000000000000..a3cce939cedd92adf117f27b52ed00d22747af02
--- /dev/null
+++ b/src/app/history/history.component.html
@@ -0,0 +1,26 @@
+<div class="history">
+ <div class="details">
+ <div class=vertical></div>
+ <div>{{userName}}'s history</div>
+ </div>
+ <div class="eventTotal">
+ <div>
+ <mat-tab-group>
+ <mat-tab label="Workshop">
+ <div *ngFor="let workshop of eventsAttended">
+ <div *ngIf="workshop.isWorkshop" class="event">
+ {{workshop.eventName}}
+ </div>
+ </div>
+ </mat-tab>
+ <mat-tab label="Conference">
+ <div *ngFor="let workshop of eventsAttended">
+ <div *ngIf="!workshop.isWorkshop" class="event">
+ {{workshop.eventName}}
+ </div>
+ </div>
+ </mat-tab>
+ </mat-tab-group>
+ </div>
+ </div>
+</div>
\ No newline at end of file
diff --git a/src/app/history/history.component.scss b/src/app/history/history.component.scss
new file mode 100644
index 0000000000000000000000000000000000000000..a95a5e2f94156cd3f8c6cc7ff9bff1f2fb22ce67
--- /dev/null
+++ b/src/app/history/history.component.scss
@@ -0,0 +1,66 @@
+.history {
+ background-image: url("../../assets/images/historyBG.jpg");
+ background-repeat: no-repeat;
+ background-size: cover;
+ background-position: center;
+ width: 100%;
+ height: 60rem;
+ display: flex;
+ flex-direction: column;
+}
+
+.details {
+ margin-left: 1rem;
+ height: 3rem;
+ margin-bottom: 1.5rem;
+ margin-top: 5%;
+ display: flex;
+ flex-direction: row;
+ justify-content: flex-start;
+ font-family: "Raleway", sans-serif;
+ -webkit-text-stroke: 0.5px white;
+ letter-spacing: 0.1rem;
+ color: white;
+ width: 100%;
+ font-weight: 500;
+ font-size: 2.5rem;
+}
+
+.vertical {
+ height: auto;
+ width: 0.2rem;
+ background-color: white;
+ margin-right: 1rem;
+}
+
+::ng-deep .mat-tab-label-active .mat-tab-label-content {
+ color: white !important;
+}
+
+::ng-deep .mat-tab-label .mat-tab-label-content {
+ color: white !important;
+}
+
+::ng-deep.mat-tab-group.mat-primary .mat-ink-bar,
+::ng-deep.mat-tab-nav-bar.mat-primary .mat-ink-bar {
+ background-color: white !important;
+}
+
+.event{
+color: white;
+padding: 1rem;
+border: 0.125rem solid white;
+border-radius: 0.5rem;
+margin: 1rem;
+width: 15rem;
+background-color: rgba(0, 0, 0, 0.521);
+}
+
+.eventTotal{
+ display: flex;
+ flex-direction: row;
+ justify-content: space-around;
+
+
+
+}
\ No newline at end of file
diff --git a/src/app/history/history.component.spec.ts b/src/app/history/history.component.spec.ts
new file mode 100644
index 0000000000000000000000000000000000000000..f68be4f230220a946d3c7ebfa3da28e658080d8c
--- /dev/null
+++ b/src/app/history/history.component.spec.ts
@@ -0,0 +1,25 @@
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { HistoryComponent } from './history.component';
+
+describe('HistoryComponent', () => {
+ let component: HistoryComponent;
+ let fixture: ComponentFixture<HistoryComponent>;
+
+ beforeEach(async(() => {
+ TestBed.configureTestingModule({
+ declarations: [ HistoryComponent ]
+ })
+ .compileComponents();
+ }));
+
+ beforeEach(() => {
+ fixture = TestBed.createComponent(HistoryComponent);
+ component = fixture.componentInstance;
+ fixture.detectChanges();
+ });
+
+ it('should create', () => {
+ expect(component).toBeTruthy();
+ });
+});
diff --git a/src/app/history/history.component.ts b/src/app/history/history.component.ts
new file mode 100644
index 0000000000000000000000000000000000000000..4e9fc41091381805c260b8f3954022acead7e5b4
--- /dev/null
+++ b/src/app/history/history.component.ts
@@ -0,0 +1,22 @@
+import { Component, OnInit } from '@angular/core';
+import { eventDetails } from '../contracts/eventDetails';
+import { EventServiceService } from '../services/event-service.service';
+
+@Component({
+ selector: 'app-history',
+ templateUrl: './history.component.html',
+ styleUrls: ['./history.component.scss']
+})
+export class HistoryComponent implements OnInit {
+
+ constructor(private eventService:EventServiceService) { }
+ userName="Rohini"
+ ngOnInit() {
+ this.eventsAttended=this.eventService.getPastEvents();
+
+ }
+ eventsAttended:eventDetails[]=[];
+
+
+
+}
diff --git a/src/app/home-page/home-page.component.html b/src/app/home-page/home-page.component.html
index 61cd23146ac1a9307a06abd0b3b21741bf8ecf9e..1ec2bbd3d06a95c46b5c097c7248a0ae72cd1c57 100644
--- a/src/app/home-page/home-page.component.html
+++ b/src/app/home-page/home-page.component.html
@@ -1,5 +1,4 @@
<div class="home">
-
<div class="totalContent">
<div class="content">
WCP - WORKSOP/CONFERENCE PORTAL
@@ -7,16 +6,13 @@
<div class="caption">
engaging minds, empowering success!
</div>
-
<div class="seperator"></div>
<div class="centerAlign">
<div class="controls">
<button class="controlButton">LOGIN</button>
<div class=verticleLine></div>
<button class="controlButton">REGISTER</button>
-
</div>
-
</div>
</div>
</div>
\ No newline at end of file
diff --git a/src/app/home-page/home-page.component.ts b/src/app/home-page/home-page.component.ts
index 8c2f98adf0ab8ecf434cde0c65cf48fe1d6c4d43..20ee274e913f47672f61a627c8140ee9cac6f1c3 100644
--- a/src/app/home-page/home-page.component.ts
+++ b/src/app/home-page/home-page.component.ts
@@ -8,8 +8,8 @@ import { Component, OnInit } from '@angular/core';
export class HomePageComponent implements OnInit {
title="Hello"
constructor() { }
-
ngOnInit() {
+
}
}
diff --git a/src/app/listing/listing.component.html b/src/app/listing/listing.component.html
index a6cde125b50a2c4e7f8d6a19a4325908b58b68bb..ff82c3b07504813da3033b60ccb24ba3d8f3b353 100644
--- a/src/app/listing/listing.component.html
+++ b/src/app/listing/listing.component.html
@@ -1,6 +1,6 @@
-<div class="eventsList">
- <div class="heading">Active events:</div>
-</div>
+
+ <div class="heading"><div>Active events</div></div>
+
<div class="eventsList list">
<div *ngFor="let event of events">
<mat-card class="event" [class.mat-elevation-z7]="true">
diff --git a/src/app/listing/listing.component.scss b/src/app/listing/listing.component.scss
index db121797d7e9def573000487e26b72fede6d70a5..a69280bfb76bdf4c188d8f70b45456b0db0c78b0 100644
--- a/src/app/listing/listing.component.scss
+++ b/src/app/listing/listing.component.scss
@@ -19,35 +19,50 @@
}
.list{
- background:
- radial-gradient(
- farthest-side at bottom left,
- rgba(255, 0, 255, 0.5),
- transparent
- ),
- radial-gradient(
- farthest-corner at bottom right,
- rgba(255, 50, 50, 0.5),
- transparent 400px
- ),
- radial-gradient(
- farthest-corner at top left,
- rgba(255, 50, 50, 0.5),
- transparent 400px
- ),
- radial-gradient(
- farthest-corner at top right,
- rgba(196, 181, 46, 0.795),
- transparent
- );
+ background-image: rgb(206, 196, 53);
+ // background:
+ // radial-gradient(
+ // farthest-side at bottom left,
+ // rgba(255, 0, 255, 0.5),
+ // transparent
+ // ),
+ // radial-gradient(
+ // farthest-corner at bottom right,
+ // rgba(255, 50, 50, 0.5),
+ // transparent 400px
+ // ),
+ // radial-gradient(
+ // farthest-corner at top left,
+ // rgba(255, 50, 50, 0.5),
+ // transparent 400px
+ // ),
+ // radial-gradient(
+ // farthest-corner at top right,
+ // rgba(196, 181, 46, 0.795),
+ // transparent
+ // );
}
.heading {
padding: 1rem;
+ display:flex;
+ flex-direction: row;
+ justify-content: space-around;
// border: rgb(145, 143, 143) 0.15rem solid;
font-family: "Pacifico", cursive;
font-size: 2.5rem;
color: rgb(255, 255, 255);
+ background:
+ radial-gradient(
+ circle at top left,
+ rgba(5, 5, 5, 0.795),
+ transparent
+ ),
+ radial-gradient(
+ circle at bottom right,
+ rgba(68, 67, 60, 0.795),
+ transparent
+ );
-webkit-text-stroke-width: 1px;
letter-spacing: 1px;
-webkit-text-stroke-color: black;
diff --git a/src/app/login/login.component.html b/src/app/login/login.component.html
index 147cfc4f8f814706025c8e9a855dacc3eaa0f40c..2b4eb77571d170fceb715cbac6ae343681d4f4b4 100644
--- a/src/app/login/login.component.html
+++ b/src/app/login/login.component.html
@@ -1 +1,25 @@
-<p>login works!</p>
+<div class="registerPage">
+ <div class="content">
+ <div class="title">
+ <div class=vertical></div>
+ <div>LOGIN</div>
+ </div>
+ <div class="inputs">
+ <form class="example-form">
+ <mat-form-field class="example-full-width">
+ <input matInput required>
+ <mat-placeholder class="placeholder">Login-ID</mat-placeholder>
+ </mat-form-field>
+ <mat-form-field class="example-full-width">
+ <input matInput type="password" required>
+ <mat-placeholder class="placeholder">Password</mat-placeholder>
+ </mat-form-field>
+ </form>
+ <div class="register">
+ <button class="controlButton">LOGIN</button>
+ </div>
+ </div>
+ </div>
+ </div>
+
+
\ No newline at end of file
diff --git a/src/app/login/login.component.scss b/src/app/login/login.component.scss
index e69de29bb2d1d6434b8b29ae775ad8c2e48c5391..079885ee9d7ea17396a707f3f007cb7d39b45ca3 100644
--- a/src/app/login/login.component.scss
+++ b/src/app/login/login.component.scss
@@ -0,0 +1,110 @@
+.registerPage{
+ background-image: url("../../assets/images/loginBG.jpg");
+ background-repeat: no-repeat;
+ background-size: cover;
+ background-position:center;
+ width: 100%;
+ height: 60rem;
+ display: flex;
+ flex-direction: row;
+ justify-content: space-around;
+}
+
+.content{
+ display: flex;
+ flex-direction: column;
+
+}
+
+.title{
+ margin-bottom: 1.5rem;
+ margin-top: 30%;
+ display: flex;
+ flex-direction: row;
+ justify-content: flex-start;
+ font-family: 'Raleway', sans-serif;
+ -webkit-text-stroke: 0.5px white;
+ letter-spacing: 0.1rem;
+ color:white;
+ font-weight: 500;
+ font-size: 2.5rem;
+}
+
+.horizontal{
+ display: flex;
+ color: white;
+ flex-direction: row;
+ justify-content: flex-start;
+}
+
+.inputs{
+ color: white;
+ width: 30rem;
+}
+
+.example-form {
+ min-width: 150px;
+ max-width: 500px;
+ width: 100%;
+ padding: 2rem;
+ border-radius:1rem;
+ border: 5px solid white;
+ background: rgba(19, 17, 17, 0.555);
+
+ }
+
+ .example-full-width {
+ width: 100%;
+ }
+
+ .example-form {
+ min-width: 150px;
+ max-width: 500px;
+ width: 100%;
+ }
+
+ .example-full-width {
+ width: 100%;
+ }
+
+ ::ng-deep .mat-focused .mat-form-field-label {
+ color: white !important;
+ }
+
+ ::ng-deep.mat-form-field-underline {
+ background-color: white !important;
+ }
+
+ ::ng-deep.mat-form-field-ripple {
+ background-color: white !important;;
+ }
+
+
+.controlButton{
+ padding: 0rem;
+ width: 12rem;
+ font-family: 'Raleway', sans-serif;
+ background-color: rgb(178, 83, 216);
+ color: white;
+ padding: 0.5rem 1rem;
+ border-radius: 1rem;
+ border: none;
+}
+
+.register{
+ display: flex;
+ flex-direction: row;
+ justify-content: space-around;
+ margin-top: 2rem;
+}
+
+.placeholder{
+color: white;
+}
+
+.vertical{
+ height: auto;
+ width: 0.2rem;
+ background-color: white;
+ margin-right: 1rem;
+}
diff --git a/src/app/login/login.component.ts b/src/app/login/login.component.ts
index 12de138adf7093dd940ed5356c43e1a4d98dad8e..303bc543536d18da18ce64c27e0de97956258a87 100644
--- a/src/app/login/login.component.ts
+++ b/src/app/login/login.component.ts
@@ -1,4 +1,5 @@
import { Component, OnInit } from '@angular/core';
+import { userInfo } from '../contracts/userInfo';
@Component({
selector: 'app-login',
@@ -8,7 +9,8 @@ import { Component, OnInit } from '@angular/core';
export class LoginComponent implements OnInit {
constructor() { }
-
+ harsha:userInfo;
+ value="";
ngOnInit() {
}
diff --git a/src/app/moderator-portal/moderator-portal.component.html b/src/app/moderator-portal/moderator-portal.component.html
new file mode 100644
index 0000000000000000000000000000000000000000..f928d62ceb4061b3e0345dac4ad80e6f612e8000
--- /dev/null
+++ b/src/app/moderator-portal/moderator-portal.component.html
@@ -0,0 +1,101 @@
+<!-- <mat-radio-group
+ aria-labelledby="example-radio-group-label"
+ class="example-radio-group"
+ [(ngModel)]="favoriteSeason">
+ <mat-radio-button class="example-radio-button" *ngFor="let season of seasons" [value]="season">
+ {{season}}
+ </mat-radio-button>
+</mat-radio-group> -->
+<div class="portal">
+ <div class="heading">Moderator portal</div>
+ <mat-tab-group class="event">
+ <mat-tab label="User requests">
+ <div class="content">
+ <div class="example-container">
+ <div class="sub-heading">Requests</div>
+ <div cdkDropList #todoList="cdkDropList" [cdkDropListData]="userReq"
+ [cdkDropListConnectedTo]="[doneList]" class="example-list" (cdkDropListDropped)="drop($event)">
+ <div class="example-box" *ngFor="let item of userReq" cdkDrag>
+ <div class="black"> {{item.name}} ({{item.regNo}})</div>
+ </div>
+ </div>
+ </div>
+
+ <div class="example-container">
+ <div class="sub-heading">Approved</div>
+ <div cdkDropList #doneList="cdkDropList" [cdkDropListData]="userApprove"
+ [cdkDropListConnectedTo]="[todoList]" class="example-list" (cdkDropListDropped)="drop($event)">
+ <div class="example-box" *ngFor="let item of userApprove" cdkDrag>
+ <div class="black"> {{item.name}} ({{item.regNo}})</div>
+ </div>
+ </div>
+ </div>
+ </div>
+
+ </mat-tab>
+ <mat-tab label="Event requests">
+ <div class="content">
+ <div class="example-container">
+ <div class="sub-heading">Requests</div>
+ <div cdkDropList #todoListEvent="cdkDropList" [cdkDropListData]="eventReq"
+ [cdkDropListConnectedTo]="[doneListEvent]" class="example-list" (cdkDropListDropped)="drop($event)">
+ <div class="example-box" *ngFor="let item of eventReq" cdkDrag>
+ <div class="black">{{item.eventName}}</div>
+ </div>
+ </div>
+ </div>
+
+ <div class="example-container">
+ <div class="sub-heading">Approved</div>
+ <div cdkDropList #doneListEvent="cdkDropList" [cdkDropListData]="eventApprove"
+ [cdkDropListConnectedTo]="[todoListEvent]" class="example-list" (cdkDropListDropped)="drop($event)">
+ <div class="example-box" *ngFor="let item of eventApprove" cdkDrag>
+ <div class="black">{{item.eventName}} </div></div>
+ </div>
+ </div>
+ </div>
+ </mat-tab>
+ </mat-tab-group>
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+<!--
+ <div class="content">
+ <div class="example-container">
+ <h2>To do</h2>
+
+ <div cdkDropList #todoList="cdkDropList" [cdkDropListData]="todo" [cdkDropListConnectedTo]="[doneList]"
+ class="example-list" (cdkDropListDropped)="drop($event)">
+ <div class="example-box" *ngFor="let item of todo" cdkDrag>{{item}}</div>
+ </div>
+ </div>
+
+ <div class="example-container">
+ <h2>Done</h2>
+
+ <div cdkDropList #doneList="cdkDropList" [cdkDropListData]="done" [cdkDropListConnectedTo]="[todoList]"
+ class="example-list" (cdkDropListDropped)="drop($event)">
+ <div class="example-box" *ngFor="let item of done" cdkDrag>{{item}}</div>
+ </div>
+ </div>
+ </div> -->
+ <div class="center">
+ <button mat-raised-button color="primary" (click)="approve()">Approve</button>
+ </div>
+</div>
+
diff --git a/src/app/moderator-portal/moderator-portal.component.scss b/src/app/moderator-portal/moderator-portal.component.scss
new file mode 100644
index 0000000000000000000000000000000000000000..7150db510f160bc76f454c57c4549087852c56fe
--- /dev/null
+++ b/src/app/moderator-portal/moderator-portal.component.scss
@@ -0,0 +1,97 @@
+.example-container {
+ width: 400px;
+ max-width: 100%;
+ margin: 0 25px 25px 0;
+ display: inline-block;
+ vertical-align: top;
+}
+
+.example-list {
+ border: solid 1px #ccc;
+ min-height: 60px;
+ background: white;
+ border-radius: 4px;
+ overflow: hidden;
+ display: block;
+}
+
+.example-box {
+ border-bottom: solid 1px #ccc;
+ color: rgba(255, 255, 255, 0.87);
+ display: flex;
+ flex-direction: row;
+ align-items: center;
+ justify-content: space-between;
+ box-sizing: border-box;
+ cursor: move;
+ background: white;
+ font-size: 16px;
+}
+
+.cdk-drag-preview {
+ box-sizing: border-box;
+ border-radius: 4px;
+ box-shadow: 0 5px 5px -3px rgba(0, 0, 0, 0.2), 0 8px 10px 1px rgba(0, 0, 0, 0.14), 0 3px 14px 2px rgba(0, 0, 0, 0.12);
+}
+
+.cdk-drag-placeholder {
+ opacity: 0;
+}
+
+.cdk-drag-animating {
+ transition: transform 250ms cubic-bezier(0, 0, 0.2, 1);
+}
+
+.example-box:last-child {
+ border: none;
+}
+
+.example-list.cdk-drop-list-dragging .example-box:not(.cdk-drag-placeholder) {
+ transition: transform 250ms cubic-bezier(0, 0, 0.2, 1);
+}
+
+.portal {
+ background-image: url("../../assets/images/moderatorBG.jpg");
+
+ background-size: cover;
+ background-position: center;
+ height: 60rem;
+}
+.content {
+ padding: 1rem;
+ display: flex;
+ flex-direction: row;
+ justify-content: space-around;
+}
+
+.heading {
+ padding: 1rem;
+ font-family: "Pacifico", cursive;
+ font-size: 2.5rem;
+ color: rgb(255, 255, 255);
+ -webkit-text-stroke-width: 1px;
+ letter-spacing: 1px;
+ -webkit-text-stroke-color: black;
+}
+
+.sub-heading {
+ font-size: 1.5rem;
+ color: white;
+}
+
+.center {
+ display: flex;
+ flex-direction: row;
+ justify-content: space-around;
+}
+.event {
+ height: 30rem;
+}
+.black {
+ padding: 20px 10px;
+ background-color: black;
+ width: 100%;
+ height: 100%;
+ font-weight: 300;
+ text-align: center;
+}
diff --git a/src/app/moderator-portal/moderator-portal.component.spec.ts b/src/app/moderator-portal/moderator-portal.component.spec.ts
new file mode 100644
index 0000000000000000000000000000000000000000..21afc9c5a6a31c727ad3d43cc5a48ed5b0004b41
--- /dev/null
+++ b/src/app/moderator-portal/moderator-portal.component.spec.ts
@@ -0,0 +1,25 @@
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { ModeratorPortalComponent } from './moderator-portal.component';
+
+describe('ModeratorPortalComponent', () => {
+ let component: ModeratorPortalComponent;
+ let fixture: ComponentFixture<ModeratorPortalComponent>;
+
+ beforeEach(async(() => {
+ TestBed.configureTestingModule({
+ declarations: [ ModeratorPortalComponent ]
+ })
+ .compileComponents();
+ }));
+
+ beforeEach(() => {
+ fixture = TestBed.createComponent(ModeratorPortalComponent);
+ component = fixture.componentInstance;
+ fixture.detectChanges();
+ });
+
+ it('should create', () => {
+ expect(component).toBeTruthy();
+ });
+});
diff --git a/src/app/moderator-portal/moderator-portal.component.ts b/src/app/moderator-portal/moderator-portal.component.ts
new file mode 100644
index 0000000000000000000000000000000000000000..30ef8b84d1457665c79614aef836cd33d25e144a
--- /dev/null
+++ b/src/app/moderator-portal/moderator-portal.component.ts
@@ -0,0 +1,42 @@
+import { Component, OnInit } from '@angular/core';
+import { CdkDragDrop, moveItemInArray, transferArrayItem } from '@angular/cdk/drag-drop';
+import { userInfo } from '../contracts/userInfo';
+import { ModeratorService } from '../services/moderator.service';
+import { eventDetails } from '../contracts/eventDetails';
+
+@Component({
+ selector: 'app-moderator-portal',
+ templateUrl: './moderator-portal.component.html',
+ styleUrls: ['./moderator-portal.component.scss']
+})
+export class ModeratorPortalComponent implements OnInit {
+
+ constructor(private moderator:ModeratorService) { }
+
+ ngOnInit() {
+ this.userReq=this.moderator.getUserRequests();
+ this.eventReq=this.moderator.getEventRequests();
+ }
+ userReq:userInfo[]=[];
+
+ userApprove:userInfo[]=[];
+
+ eventReq:eventDetails[]=[];
+ eventApprove:eventDetails[]=[];
+
+ drop(event: CdkDragDrop<string[]>) {
+ if (event.previousContainer === event.container) {
+ moveItemInArray(event.container.data, event.previousIndex, event.currentIndex);
+ } else {
+ transferArrayItem(event.previousContainer.data,
+ event.container.data,
+ event.previousIndex,
+ event.currentIndex);
+ }
+ }
+ approve(){
+ this.userApprove=[];
+ this.eventApprove=[];
+ }
+
+}
diff --git a/src/app/register/register.component.html b/src/app/register/register.component.html
index 344534e0a92bd608c17dcec25a3325999af1701b..989d39590e46e1e9f2cd4a5f924e1c98015a5fb7 100644
--- a/src/app/register/register.component.html
+++ b/src/app/register/register.component.html
@@ -5,41 +5,57 @@
<div>REGISTER FOR WCP</div>
</div>
<div class="inputs">
- <form class="example-form">
- <mat-form-field class="example-full-width">
- <input matInput>
+ <form class="example-form">
+ <mat-form-field class="example-full-width" hideRequiredMarker>
+ <input matInput required>
<mat-placeholder class="placeholder">Name</mat-placeholder>
</mat-form-field>
- <mat-form-field class="example-full-width">
- <input matInput>
+ <mat-form-field class="example-full-width" hideRequiredMarker>
+ <input matInput required>
<mat-placeholder class="placeholder">Reg. No.</mat-placeholder>
</mat-form-field>
- <mat-form-field class="example-full-width">
- <input matInput type="password">
+ <mat-form-field class="example-full-width" hideRequiredMarker>
+ <input matInput required type="password">
<mat-placeholder class="placeholder">Password</mat-placeholder>
</mat-form-field>
- <mat-form-field class="example-full-width">
- <input matInput type="password">
+ <mat-form-field class="example-full-width" hideRequiredMarker>
+ <input matInput required type="password">
<mat-placeholder class="placeholder">Confirm Password</mat-placeholder>
</mat-form-field>
- <mat-form-field class="example-full-width">
- <input matInput>
+ <!-- <mat-form-field>
+ <input type="password" matInput formControlName='password'>
+ <mat-placeholder class="placeholder">Password</mat-placeholder>
+ </mat-form-field>
+ <mat-form-field>
+ <input type="password" matInput formControlName='verifyPassword' [errorStateMatcher]="errorMatcher">
+ <mat-placeholder class="placeholder">Verify Password</mat-placeholder>
+
+ <mat-error *ngIf="userForm.hasError('passwordsDoNotMatch')">
+ Passwords do not match!
+ </mat-error>
+ </mat-form-field> -->
+ <mat-form-field class="example-full-width" hideRequiredMarker>
+ <input matInput required>
<mat-placeholder class="placeholder">Program</mat-placeholder>
</mat-form-field>
- <mat-form-field class="example-full-width">
- <input matInput type="email">
+ <mat-form-field class="example-full-width" hideRequiredMarker>
+ <input matInput [formControl]="emailFormControl" [errorStateMatcher]="matcher" required>
<mat-placeholder class="placeholder">Email</mat-placeholder>
+ <mat-error *ngIf="emailFormControl.hasError('email') && !emailFormControl.hasError('required')">
+ Please enter a valid email address
+ </mat-error>
+ <mat-error *ngIf="emailFormControl.hasError('required')">
+ Email is <strong>required</strong>
+ </mat-error>
</mat-form-field>
- <mat-form-field class="example-full-width">
- <input matInput type="number">
+ <mat-form-field class="example-full-width" hideRequiredMarker>
+ <input matInput type="number" required>
<mat-placeholder class="placeholder">Phone no.</mat-placeholder>
</mat-form-field>
- </form>
- <div class="register">
- <button class="controlButton">REGISTER ME</button>
- </div>
- </div>
+ </form>
+ <div class="register">
+ <button class="controlButton">REGISTER ME</button>
+ </div>
+ </div>
</div>
-</div>
-
-
\ No newline at end of file
+</div>
\ No newline at end of file
diff --git a/src/app/register/register.component.ts b/src/app/register/register.component.ts
index c6fd519faf261e343e1eab7214527c56fec35d8b..941cc97feb012ebedae5a7a6d962fe411313e11f 100644
--- a/src/app/register/register.component.ts
+++ b/src/app/register/register.component.ts
@@ -1,17 +1,63 @@
import { Component, OnInit } from '@angular/core';
import { userInfo } from '../contracts/userInfo';
+import { FormControl, FormGroupDirective, NgForm, Validators, FormGroup, FormBuilder } from '@angular/forms';
+import { ErrorStateMatcher } from '@angular/material';
+
+export class MyErrorStateMatcher implements ErrorStateMatcher {
+ isErrorState(control: FormControl | null, form: FormGroupDirective | NgForm | null): boolean {
+ const isSubmitted = form && form.submitted;
+ return !!(control && control.invalid && (control.dirty || control.touched || isSubmitted));
+ }
+}
+class CrossFieldErrorMatcher implements ErrorStateMatcher {
+ isErrorState(control: FormControl | null, form: FormGroupDirective | NgForm | null): boolean {
+ return control.dirty && form.invalid;
+ }
+}
+
@Component({
selector: 'app-register',
templateUrl: './register.component.html',
styleUrls: ['./register.component.scss']
})
+
+
export class RegisterComponent implements OnInit {
+ ngOnInit() {
+
+ }
harsha:userInfo;
+ password="";
value="";
- constructor() { }
+ userForm: FormGroup;
+ errorMatcher = new CrossFieldErrorMatcher();
+
+ constructor(private fb: FormBuilder) {
+ this.initForm();
+ }
+
+ initForm() {
+ this.userForm = this.fb.group({
+ password: '',
+ verifyPassword: ''
+ }, {
+ validator: this.passwordValidator
+ })
+ }
+
+ passwordValidator(form: FormGroup) {
+ const condition = form.get('password').value !== form.get('verifyPassword').value;
- ngOnInit(){
+ return condition ? { passwordsDoNotMatch: true} : null;
}
+
+ emailFormControl = new FormControl('', [
+ Validators.required,
+ Validators.email,
+ ]);
+
+
+ matcher = new MyErrorStateMatcher();
}
diff --git a/src/app/services/event-service.service.ts b/src/app/services/event-service.service.ts
index 839e32568e5fa9dd4f3c9aa05fc28d3ab5b247c5..30fa184af469432dc28917714e8c1b61989a2160 100644
--- a/src/app/services/event-service.service.ts
+++ b/src/app/services/event-service.service.ts
@@ -11,56 +11,70 @@ export class EventServiceService {
eventName:"Event 1",
totalSeats:50,
remainingSeats:30,
- isRegistrationAllowed:true
+ isRegistrationAllowed:true,
+ isWorkshop:true
},
{
eventId:2,
eventName:"Event 2",
totalSeats:70,
remainingSeats:10,
- isRegistrationAllowed:true
+ isRegistrationAllowed:true,
+ isWorkshop:false
+
},
{
eventId:3,
eventName:"Event 3",
totalSeats:100,
remainingSeats:70,
- isRegistrationAllowed:true
+ isRegistrationAllowed:true,
+ isWorkshop:true
+
},
{
eventId:4,
eventName:"Event 4",
totalSeats:75,
remainingSeats:10,
- isRegistrationAllowed:true
+ isRegistrationAllowed:true,
+ isWorkshop:true
+
},
{
eventId:5,
eventName:"Event 5",
totalSeats:50,
remainingSeats:45,
- isRegistrationAllowed:true
+ isRegistrationAllowed:true,
+ isWorkshop:false
},
{
eventId:6,
eventName:"Event 6",
totalSeats:50,
remainingSeats:5,
- isRegistrationAllowed:true
+ isRegistrationAllowed:true,
+ isWorkshop:true
+
},
{
eventId:7,
eventName:"Event 7",
totalSeats:50,
remainingSeats:40,
- isRegistrationAllowed:true
+ isRegistrationAllowed:true,
+ isWorkshop:true
+
},
{
eventId:8,
eventName:"Event 8",
totalSeats:500,
remainingSeats:300,
- isRegistrationAllowed:false
+ isRegistrationAllowed:false,
+ isWorkshop:false
+
}
]
constructor() { }
@@ -68,4 +82,8 @@ export class EventServiceService {
public getEvents():eventDetails[]{
return this.testData;
}
+
+ public getPastEvents():eventDetails[]{
+ return this.testData;
+ }
}
diff --git a/src/app/services/moderator.service.spec.ts b/src/app/services/moderator.service.spec.ts
new file mode 100644
index 0000000000000000000000000000000000000000..2cb075f613037aeeaf91d7cafcef249d192ae425
--- /dev/null
+++ b/src/app/services/moderator.service.spec.ts
@@ -0,0 +1,12 @@
+import { TestBed } from '@angular/core/testing';
+
+import { ModeratorService } from './moderator.service';
+
+describe('ModeratorService', () => {
+ beforeEach(() => TestBed.configureTestingModule({}));
+
+ it('should be created', () => {
+ const service: ModeratorService = TestBed.get(ModeratorService);
+ expect(service).toBeTruthy();
+ });
+});
diff --git a/src/app/services/moderator.service.ts b/src/app/services/moderator.service.ts
new file mode 100644
index 0000000000000000000000000000000000000000..8ea594d8d9f392fe79433955929ccf5dd0da4968
--- /dev/null
+++ b/src/app/services/moderator.service.ts
@@ -0,0 +1,42 @@
+import { Injectable } from '@angular/core';
+import { userInfo } from '../contracts/userInfo';
+import { eventDetails } from '../contracts/eventDetails';
+
+@Injectable({
+ providedIn: 'root'
+})
+export class ModeratorService {
+ pendingUsers:userInfo[]=[];
+ pendingEvents:eventDetails[]=[];
+ constructor() {
+ this.pendingEvents.push(
+ {isRegistrationAllowed:true,eventName:"Dummy workshop 1",eventId:123,totalSeats:50,isWorkshop:true},
+ {isRegistrationAllowed:true,eventName:"Dummy workshop 2",eventId:123,totalSeats:60,isWorkshop:true},
+ {isRegistrationAllowed:true,eventName:"Dummy workshop 3",eventId:123,totalSeats:70,isWorkshop:true}
+ )
+ this.pendingUsers.push(
+ {email:"dummy@dummy.com",hashedPassword:"*",mobileNo:1234567890,name:"Dummy name 1",program:"B.Tech.",regNo:"CB.EN.U4CSE16207",type:"user",yearOfAdmission:123},
+ {email:"dummy@dummy.com",hashedPassword:"*",mobileNo:1234567890,name:"Dummy name 2",program:"B.Tech.",regNo:"CB.EN.U4CSE16208",type:"user",yearOfAdmission:456},
+ {email:"dummy@dummy.com",hashedPassword:"*",mobileNo:1234567890,name:"Dummy name 3",program:"B.Tech.",regNo:"CB.EN.U4CSE16209",type:"user",yearOfAdmission:789},
+
+ )
+ }
+ public addUserRequest(user:userInfo){
+ this.pendingUsers.push(user);
+ }
+ public addEventRequest(event:eventDetails){
+ this.pendingEvents.push(event);
+ }
+
+ public getUserRequests():userInfo[]{
+ return [...this.pendingUsers];
+ }
+
+ public getEventRequests():eventDetails[]{
+ return [...this.pendingEvents];
+ }
+
+
+
+
+}
diff --git a/src/assets/images/eventAddBG.jpg b/src/assets/images/eventAddBG.jpg
new file mode 100644
index 0000000000000000000000000000000000000000..8764c239f44e15efe7ef4ed5d7a41860e1fbb42f
Binary files /dev/null and b/src/assets/images/eventAddBG.jpg differ
diff --git a/src/assets/images/historyBG.jpg b/src/assets/images/historyBG.jpg
new file mode 100644
index 0000000000000000000000000000000000000000..4faabf9d47fe20d62793a62eb424e00859737ab0
Binary files /dev/null and b/src/assets/images/historyBG.jpg differ
diff --git a/src/assets/images/loginBG.jpg b/src/assets/images/loginBG.jpg
new file mode 100644
index 0000000000000000000000000000000000000000..d1a1bde3244060b41ee6f25a12e57d378772db37
Binary files /dev/null and b/src/assets/images/loginBG.jpg differ
diff --git a/src/assets/images/moderatorBG.jpg b/src/assets/images/moderatorBG.jpg
new file mode 100644
index 0000000000000000000000000000000000000000..2f51f82e8d4166cfd849328f583534089b02165d
Binary files /dev/null and b/src/assets/images/moderatorBG.jpg differ
diff --git a/src/assets/images/viewDetailsBG.jpg b/src/assets/images/viewDetailsBG.jpg
new file mode 100644
index 0000000000000000000000000000000000000000..543f6d901f9400fc7c1f5af3bfce3d5885244c41
Binary files /dev/null and b/src/assets/images/viewDetailsBG.jpg differ