Fairoj : Certificate Social Media Share and issues Fixes

ng8-seed/package-lock.json

@@ -702,6 +702,43 @@
         }
       }
     },
+    "@fortawesome/angular-fontawesome": {
+      "version": "0.5.0",
+      "resolved": "https://registry.npmjs.org/@fortawesome/angular-fontawesome/-/angular-fontawesome-0.5.0.tgz",
+      "integrity": "sha512-5IR/jNMddiEpgApcqSMfp7l5kZqOtxQYzkSLW6iZ4MZHbQQ+Kc9tu9qi2hro6VFSk/sPxeYEzkzGZUNrMYiwOg==",
+      "requires": {
+        "tslib": "^1.9.0"
+      }
+    },
+    "@fortawesome/fontawesome-common-types": {
+      "version": "0.2.25",
+      "resolved": "https://registry.npmjs.org/@fortawesome/fontawesome-common-types/-/fontawesome-common-types-0.2.25.tgz",
+      "integrity": "sha512-3RuZPDuuPELd7RXtUqTCfed14fcny9UiPOkdr2i+cYxBoTOfQgxcDoq77fHiiHcgWuo1LoBUpvGxFF1H/y7s3Q=="
+    },
+    "@fortawesome/fontawesome-svg-core": {
+      "version": "1.2.25",
+      "resolved": "https://registry.npmjs.org/@fortawesome/fontawesome-svg-core/-/fontawesome-svg-core-1.2.25.tgz",
+      "integrity": "sha512-MotKnn53JKqbkLQiwcZSBJVYtTgIKFbh7B8+kd05TSnfKYPFmjKKI59o2fpz5t0Hzl35vVGU6+N4twoOpZUrqA==",
+      "requires": {
+        "@fortawesome/fontawesome-common-types": "^0.2.25"
+      }
+    },
+    "@fortawesome/free-brands-svg-icons": {
+      "version": "5.11.2",
+      "resolved": "https://registry.npmjs.org/@fortawesome/free-brands-svg-icons/-/free-brands-svg-icons-5.11.2.tgz",
+      "integrity": "sha512-wKK5znpHiZ2S0VgOvbeAnYuzkk3H86rxWajD9PVpfBj3s/kySEWTFKh/uLPyxiTOx8Tsd0OGN4En/s9XudVHLQ==",
+      "requires": {
+        "@fortawesome/fontawesome-common-types": "^0.2.25"
+      }
+    },
+    "@fortawesome/free-solid-svg-icons": {
+      "version": "5.11.2",
+      "resolved": "https://registry.npmjs.org/@fortawesome/free-solid-svg-icons/-/free-solid-svg-icons-5.11.2.tgz",
+      "integrity": "sha512-zBue4i0PAZJUXOmLBBvM7L0O7wmsDC8dFv9IhpW5QL4kT9xhhVUsYg/LX1+5KaukWq4/cbDcKT+RT1aRe543sg==",
+      "requires": {
+        "@fortawesome/fontawesome-common-types": "^0.2.25"
+      }
+    },
     "@ngtools/webpack": {
       "version": "8.2.2",
       "resolved": "https://registry.npmjs.org/@ngtools/webpack/-/webpack-8.2.2.tgz",
@@ -726,6 +763,30 @@
         }
       }
     },
+    "@ngx-share/button": {
+      "version": "7.1.4",
+      "resolved": "https://registry.npmjs.org/@ngx-share/button/-/button-7.1.4.tgz",
+      "integrity": "sha512-XgmrQhpnB8CuRSdLYPWZgSz/zcJC7dNdK40MUjZA/0Z5tzMVkhcvrig6MRD0JBoBDbLd2HPG3XlfoWQqMZicZQ==",
+      "requires": {
+        "tslib": "^1.9.0"
+      }
+    },
+    "@ngx-share/buttons": {
+      "version": "7.1.4",
+      "resolved": "https://registry.npmjs.org/@ngx-share/buttons/-/buttons-7.1.4.tgz",
+      "integrity": "sha512-dcJm2qY5IvJH7FuzpyRTeBXpg86WkSqXfEaHMGHCKWwptM8twZxyyZwVorDLrtsMEHabUzw1mhqlX6DsiqSobA==",
+      "requires": {
+        "tslib": "^1.9.0"
+      }
+    },
+    "@ngx-share/core": {
+      "version": "7.1.4",
+      "resolved": "https://registry.npmjs.org/@ngx-share/core/-/core-7.1.4.tgz",
+      "integrity": "sha512-N6j1/7/I27Wfz1Uoy15uQ8fpRkPZXF1g9+dKrkEh6yi9jKmqNjr1hHB59DHfxrTGivxAgEEFgZMgnPzTd+2kcQ==",
+      "requires": {
+        "tslib": "^1.9.0"
+      }
+    },
     "@ngx-translate/core": {
       "version": "10.0.2",
       "resolved": "https://registry.npmjs.org/@ngx-translate/core/-/core-10.0.2.tgz",
@@ -1226,6 +1287,11 @@
         "tslib": "^1.9.0"
       }
     },
+    "angular-socialshare": {
+      "version": "2.3.11",
+      "resolved": "https://registry.npmjs.org/angular-socialshare/-/angular-socialshare-2.3.11.tgz",
+      "integrity": "sha1-BTKLM9mF/Zt+FQAmPCCpqg+ELJk="
+    },
     "angular-sortablejs": {
       "version": "2.7.0",
       "resolved": "https://registry.npmjs.org/angular-sortablejs/-/angular-sortablejs-2.7.0.tgz",
@@ -7520,6 +7586,14 @@
         "tslib": "^1.9.0"
       }
     },
+    "ngx-social-button": {
+      "version": "1.0.4",
+      "resolved": "https://registry.npmjs.org/ngx-social-button/-/ngx-social-button-1.0.4.tgz",
+      "integrity": "sha512-4viKbk68w0cZx2njg6gdrSi5e9ndqtSdAst+eWn1dW2C46QlIe/bTRLECZzBzkMm3YzinZMMgwzWG+6ZEcM32A==",
+      "requires": {
+        "tslib": "^1.9.0"
+      }
+    },
     "nice-try": {
       "version": "1.0.5",
       "resolved": "https://registry.npmjs.org/nice-try/-/nice-try-1.0.5.tgz",

ng8-seed/package.json

@@ -14,7 +14,7 @@
   "dependencies": {
     "@agm/core": "^1.0.0-beta.5",
     "@angular/animations": "^8.2.2",
-    "@angular/cdk": "^7.0.3",
+    "@angular/cdk": "^7.3.7",
     "@angular/common": "^8.2.2",
     "@angular/compiler": "^8.2.2",
     "@angular/core": "^8.2.2",
@@ -24,10 +24,18 @@
     "@angular/platform-browser": "^8.2.2",
     "@angular/platform-browser-dynamic": "^8.2.2",
     "@angular/router": "^8.2.2",
+    "@fortawesome/angular-fontawesome": "^0.5.0",
+    "@fortawesome/fontawesome-svg-core": "^1.2.25",
+    "@fortawesome/free-brands-svg-icons": "^5.11.2",
+    "@fortawesome/free-solid-svg-icons": "^5.11.2",
+    "@ngx-share/button": "^7.1.4",
+    "@ngx-share/buttons": "^7.1.4",
+    "@ngx-share/core": "^7.1.4",
     "@ngx-translate/core": "^10.0.2",
     "@ngx-translate/http-loader": "^3.0.1",
     "@swimlane/ngx-datatable": "^15.0.2",
     "angular-calendar": "^0.26.4",
+    "angular-socialshare": "^2.3.11",
     "angular-sortablejs": "^2.6.0",
     "angular-tree-component": "^8.4.0",
     "chart.js": "^2.7.3",
@@ -53,6 +61,7 @@
     "ngx-cookie-service": "^2.2.0",
     "ngx-perfect-scrollbar": "5.0.0-7",
     "ngx-slick-carousel": "^0.4.6",
+    "ngx-social-button": "^1.0.4",
     "perfect-scrollbar": "^1.4.0",
     "quill": "^1.3.6",
     "rxjs": "^6.3.3",

ng8-seed/src/app/app.module.ts

@@ -51,7 +51,7 @@ import { AuthGuardService } from './shared/guards/auth-guard.service';
 import { MatTableDataSource, MatTableModule, MatSlideToggleModule, MatRadioModule, MatButtonModule } from '@angular/material';
 import { SchoolDetailsService } from './shared/school-details.service';
 // import { AddEventModule } from './add-event.module';
-import {HashLocationStrategy,LocationStrategy} from '@angular/common';
+import {HashLocationStrategy,LocationStrategy,PathLocationStrategy} from '@angular/common';
 import {CookieService} from 'ngx-cookie-service'
 import { LoginComponent } from './components/login/login.component';
 import { RegisterComponent } from './components/register/register.component';
@@ -59,8 +59,14 @@ import { ReqListComponent } from './components/req-list/req-list.component';
 import { UserProfileComponent } from './components/user-profile/user-profile.component';
 import { SuccessComponent } from './components/payment-status/success/success.component';
 import { FailureComponent } from './components/payment-status/failure/failure.component';
-import { UserCertificateComponent } from './components/user-certificate/user-certificate.component';
+import { UserCertificateComponent, userCertificateDisplay } from './components/user-certificate/user-certificate.component';
 import { PrivacyPolicyComponent } from './components/privacy-policy/privacy-policy.component';
+import {
+  NgxSocialButtonModule,
+  SocialServiceConfig
+} from "ngx-social-button";
+import { PasswordChangeComponent } from './components/password-change/password-change.component';
+import { ShareButtonsModule } from '@ngx-share/buttons';
 
 
 export function HttpLoaderFactory(http: HttpClient) {
@@ -70,6 +76,13 @@ export function HttpLoaderFactory(http: HttpClient) {
 export function createTranslateLoader(http: HttpClient) {
     return new TranslateHttpLoader(http, './assets/i18n/', '.json');
 }
+export function getAuthServiceConfigs() {
+  let config = new SocialServiceConfig()
+      .addFacebook("Your-Facebook-app-id")
+      .addGoogle("Your-Google-Client-Id")
+      .addLinkedIn("Your-LinkedIn-Client-Id");
+  return config;
+}
 
 const DEFAULT_PERFECT_SCROLLBAR_CONFIG: PerfectScrollbarConfigInterface = {
   suppressScrollX: true
@@ -95,6 +108,8 @@ const DEFAULT_PERFECT_SCROLLBAR_CONFIG: PerfectScrollbarConfigInterface = {
     FailureComponent,
     UserCertificateComponent,
     PrivacyPolicyComponent,
+    PasswordChangeComponent,
+    userCertificateDisplay
     
     // ProjectListComponent
   ],
@@ -139,6 +154,8 @@ const DEFAULT_PERFECT_SCROLLBAR_CONFIG: PerfectScrollbarConfigInterface = {
     MatSlideToggleModule,
     MatProgressBarModule,
     // MDBBootstrapModule.forRoot()
+    NgxSocialButtonModule,
+    ShareButtonsModule
   ],
   providers: [
     TranslateService,
@@ -153,8 +170,12 @@ const DEFAULT_PERFECT_SCROLLBAR_CONFIG: PerfectScrollbarConfigInterface = {
       multi: true
     },AuthGuardService,
     SchoolDetailsService,
+    {
+      provide: SocialServiceConfig,
+      useFactory: getAuthServiceConfigs
+  },
   ],
-  entryComponents: [],
+  entryComponents: [PasswordChangeComponent,UserCertificateComponent],
   bootstrap: [AppComponent]
 })
 export class AppModule { }

ng8-seed/src/app/app.routing.ts

@@ -15,7 +15,7 @@ import { Component } from '@angular/core';
 import { UserProfileComponent } from './components/user-profile/user-profile.component';
 import { SuccessComponent } from './components/payment-status/success/success.component';
 import { FailureComponent } from './components/payment-status/failure/failure.component';
-import { UserCertificateComponent } from './components/user-certificate/user-certificate.component';
+import { UserCertificateComponent, userCertificateDisplay } from './components/user-certificate/user-certificate.component';
 import { PrivacyPolicyComponent } from './components/privacy-policy/privacy-policy.component';
 export const AppRoutes: Routes = [{
   path: '',
@@ -67,7 +67,7 @@ export const AppRoutes: Routes = [{
   },
   {
     path:'user-certificate',
-    component:UserCertificateComponent
+    component:userCertificateDisplay
   },
   {
     canActivate:[AuthGuardService],

ng8-seed/src/app/components/contribute/contribute.component.html

@@ -203,5 +203,5 @@
 <!-- </div> -->
 </div>
 <footer class="footer">
-    <h5>&#9400; TN Schools, All rights reserved &nbsp;&nbsp;<span ><a class="footer-privacy" href="#/privacy-policy" target="_blank">Privacy Policy</a></span></h5>
+  <h5>&#9400; TN Schools, All rights reserved &nbsp;&nbsp;|<span class="footer-web"><a class="footer-privacy" href="#/privacy-policy" target="_blank">Privacy Policy</a></span></h5>
  </footer>

ng8-seed/src/app/components/contribute/contribute.component.scss

@@ -125,12 +125,13 @@ a {
   // bottom: 10px;
   top:20px;
   // margin:0;
-  width: 97%;
+  width: 100%;
   padding-left:10px;
   /* Set the fixed height of the footer here */
   height: 40px;
   line-height: 60px;
   background-color:rgb(69, 189, 189);
+  z-index: 3;
 
 }
 .footer-privacy{
@@ -149,6 +150,16 @@ a {
   -webkit-transform: translateX(-50%) translateY(-50%);
   transform: translateX(-50%) translateY(-50%);
 }
+.footer-privacy{
+    color:blue;
+    text-decoration: underline;
+    cursor: pointer;
+    
+}
+.footer-web{
+    margin-left: 15px;
+  }
+  
 .quote{
     font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
     font-size: 16px;

ng8-seed/src/app/components/password-change/password-change.component.html

@@ -0,0 +1,30 @@
+<div fxLayout="column">
+       
+    <div fxFlex="100" fxFlex.xs="100" fxFlex.sm="100" style="margin:10px">
+            <div class="close_icon" (click)="closeDialog()">
+                    <mat-icon  >close</mat-icon>
+                </div>
+        <header> <h4>Password Change</h4></header>
+        <!-- <mat-card style="width:100%">
+            
+            <mat-card-header>
+                <mat-card-title>
+                   
+                </mat-card-title>
+            </mat-card-header> -->
+        <form [formGroup]="passwordChangeForm">
+     
+            <mat-form-field appearance="outline" style="width:100%">
+                <input matInput type="password" placeholder="Password" formControlName="password" autocomplete="off">
+            </mat-form-field>
+            <mat-form-field appearance="outline" style="width:100%">
+                    <input matInput type="password" placeholder="Confirm Password" formControlName="confirm_password" autocomplete="off" (keyup)="checkValidators($event.target.value,'pass')">
+                </mat-form-field>
+                <div style="color:red;font-size: 12px;margin-bottom: 5px;" *ngIf="pass_pattern_error"> Password & Confirm Password does not match.</div><br/>
+                <button style="float:right;" class="mat-red" mat-raised-button (click)="csrUserRegistration()">Update</button> <br/>
+       
+        </form>
+        
+    <!-- </mat-card> -->
+    </div>
+</div>

ng8-seed/src/app/components/password-change/password-change.component.scss

@@ -0,0 +1,15 @@
+.mat-card,mat-card{
+    background-color:rgba(255, 255, 255, 0.493);
+}
+.close_icon{
+    // float: right;
+    text-align: right;
+    color: gray;
+    margin: 0px;
+    padding: 0px;
+}
+.close_icon:hover {
+    transition: transform 1.5s;    
+    // color: blue;
+    cursor: pointer;
+}

ng8-seed/src/app/components/password-change/password-change.component.spec.ts

@@ -0,0 +1,25 @@
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { PasswordChangeComponent } from './password-change.component';
+
+describe('PasswordChangeComponent', () => {
+  let component: PasswordChangeComponent;
+  let fixture: ComponentFixture<PasswordChangeComponent>;
+
+  beforeEach(async(() => {
+    TestBed.configureTestingModule({
+      declarations: [ PasswordChangeComponent ]
+    })
+    .compileComponents();
+  }));
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(PasswordChangeComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

ng8-seed/src/app/components/password-change/password-change.component.ts

@@ -0,0 +1,90 @@
+import { Component, OnInit, Inject } from '@angular/core';
+import {environment}  from 'environments/environment'
+import { ApiService } from 'app/shared/api.service';
+import { FormGroup, FormBuilder, FormControl, Validators } from '@angular/forms';
+import { MatDialogRef, MatDialog, MAT_DIALOG_DATA } from '@angular/material';
+import { Router } from '@angular/router';
+
+@Component({
+  selector: 'app-password-change',
+  templateUrl: './password-change.component.html',
+  styleUrls: ['./password-change.component.scss']
+})
+export class PasswordChangeComponent implements OnInit {
+  passwordChangeForm:FormGroup
+  pass_pattern_error: boolean;
+  go_reg: any;
+  constructor(private restApi:ApiService,private fb:FormBuilder,private dialogRef:MatDialog,@Inject(MAT_DIALOG_DATA)  public data:any,private router:Router) {
+    console.log(data)
+   }
+
+  ngOnInit() {
+    this.passwordChangeForm=this.fb.group({
+      id:[this.data,Validators.compose([Validators.required])],
+      password:['',Validators.compose([Validators.required])],
+      confirm_password:['',Validators.compose([Validators.required])]
+      // name:[''],
+      // email:[{value:'',disabled:true}],
+      // mobile:[{value:'',disabled:true}],
+      // password:[null],
+      // user_type:new FormControl(''),
+      //   org_info: this.fb.group({
+      //     id:[''],
+      //   orgname: new FormControl(''),
+      //   org_address: new FormControl(''),
+      //   org_pan: new FormControl(''),
+      //   }),
+      // profile_share:['',{disabled:true}],
+      // notify_pref:['',{disable:true}]
+    
+    })
+  }
+  checkValidators(value,option){
+    if(option == 'pass'){
+      if(value == this.passwordChangeForm.value.password){
+        this.pass_pattern_error=false
+      }
+      else{
+        this.pass_pattern_error=true
+      }
+    }
+   
+
+  }
+  csrUserRegistration()
+  {
+    if(this.pass_pattern_error){
+      return;
+    }
+   
+    if(this.passwordChangeForm.invalid){
+      alert("Please fill the password and confirm password")
+      return;
+    }
+//  this.go_reg.removeControl('confirm_password')
+  // this.go_reg.removeControl('cofirm_email')
+    // console.log(this.go_reg.value);return false;
+  let url = `${environment.apiUrl}${'csrUserRegistration'}`;
+  console.log("dd",url)
+  let data = this.passwordChangeForm.value;
+  delete data.confirm_email
+  delete data.confirm_password
+  this.restApi.post(url,data).subscribe(schDet=>
+    {   
+      console.log("result",schDet)    
+      alert("Password Updated Successfully, Please Login Again..")
+      this.dialogRef.closeAll()
+      this.signOut()
+      // this.router.navigate(['/authentication/login']); 
+      
+    })
+  }
+  signOut(){
+    this.restApi.signOut()
+    this.router.navigateByUrl('/')
+  }
+  closeDialog(){
+    this.dialogRef.closeAll()
+  }
+
+}

ng8-seed/src/app/components/payment/payment.component.html

@@ -28,7 +28,7 @@
    <mat-card>
       <mat-card-header>
          <mat-card-title>
-            Review
+            <h5>Review</h5>
          </mat-card-title>
       </mat-card-header>
       <mat-card-content>
@@ -94,7 +94,11 @@
             <div *ngIf="payment_mode == '2' && contribute_type != '2'" class="ac_det">
                   <div fxLayout="row"  fxLayout.xs="column" fxLayoutGap.lg="0" class="p-2">
                         <div fxFlex="50" fxFlex.xs="100" fxFlex.sm="100" >
-                              <mat-card class="p-2"> 
+                              <mat-card class="add-text"> 
+                                 <mat-card-header>
+                                    <mat-card-title>Account Details</mat-card-title>
+                                 </mat-card-header>
+                                 <mat-card-content>
                               <p>A/C Name : Tamil Nadu State Parent Teacher Association - CSR Funds <br>
                               <!-- <p>Association : CSR Funds</p> -->
                                A/C Number : 142301000022944 <br>
@@ -102,6 +106,7 @@
                               IFSC : IOBA0001423<br>
                               Bank : Indian Overseas Bank<br>
                               Branch : College Road, Chennai
+                              </mat-card-content>
                               </mat-card>
                            </div>
                            <div fxFlex="50" fxFlex.xs="100" fxFlex.sm="100" >
@@ -116,22 +121,22 @@
                                        </mat-form-field>
                                        <div *ngIf="offlineDetForm.value.payment_type == '1' && offlineDetForm.controls['check_branch_bank']">
                                           
-                                          <div fxLayout="row">
+                                          <div fxLayout="row" fxLayout.xs="column">
-                                          <mat-form-field style="width: 50%;" class="mr-1">
+                                          <mat-form-field class="mr-1" fxFlex.xs="100" fxFlex="50" >
                                              <input matInput type="text" formControlName="payment_ref" placeholder="Cheque / DD Number">
                                          
                                           </mat-form-field>
-                                             <mat-form-field  style="width: 50%;">                             
+                                             <mat-form-field  fxFlex.xs="100" fxFlex="50">                             
                                                    <input matInput [matDatepicker]="picker"  placeholder="Date" formControlName="check_date">
                                                    <mat-datepicker-toggle matSuffix  [for]="picker"></mat-datepicker-toggle>
                                                    <mat-datepicker #picker></mat-datepicker>
                                                  </mat-form-field>
                                                 </div>
-                                                <div fxLayout="row">
+                                                <div fxLayout="row" fxLayout.xs="column">
-                                                 <mat-form-field style="width: 50%;" class="mr-1">
+                                                 <mat-form-field fxFlex.xs="100" fxFlex="50" class="mr-1">
                                                       <input matInput type="text" formControlName="check_branch_bank" placeholder="Drawn on Bank and Branch">
                                                    </mat-form-field>
-                                                   <mat-form-field style="width: 50%;">
+                                                   <mat-form-field fxFlex.xs="100" fxFlex="50">
                                                         
                                                          <mat-select placeholder="Mode of deposit" formControlName="check_deposit_mode">
                                                             <mat-option *ngFor="let value of deposit_mode_data" [value]="value.id">{{value.name}}</mat-option>
@@ -142,13 +147,13 @@
                                                       <div fxLayout="row">
                                                             <div fxFlex="100" fxFlex.xs="100" fxFlex.sm="100" >
                                                             <div *ngIf="offlineDetForm.value.check_deposit_mode == '1' && offlineDetForm.controls['check_deposit_mode']">
-                                                                  <p>Please despatch your Cheque / DD to the below address :<br>
+                                                                  <p style="font-weight:100">Please despatch your Cheque / DD to the below address :<br>
-
+                                                                     <span class="add-text">
                                                                         The Secretary,<br>
                                                                         Tamil Nadu State Parent Teachers Association<br>
                                                                         6, College Rd, Subba Road Avenue, <br>
                                                                         Nungambakkam, Chennai  600006<br>
-                                                                        Tamil Nadu</p>
+                                                                        Tamil Nadu</span></p>
                                                               </div>
                                                               <div *ngIf="offlineDetForm.value.check_deposit_mode == '2' && offlineDetForm.controls['check_deposit_mode']">
                                                                     <mat-form-field style="width: 100%;">
@@ -259,3 +264,7 @@
   
 </form>
     </mat-card>
+
+    <footer class="footer">
+      <h5>&#9400; TN Schools, All rights reserved &nbsp;&nbsp;|<span class="footer-web"><a class="footer-privacy" href="#/privacy-policy" target="_blank">Privacy Policy</a></span></h5>
+     </footer>

ng8-seed/src/app/components/payment/payment.component.scss

@@ -204,3 +204,41 @@ $product-bg-color-hover: rgba(103, 58, 183, 0.7);
 .half-field{
     width: 40%;
 }
+.footer {
+    margin:0;
+    width:100%;
+    overflow: hidden;
+  position: relative;
+  // bottom: 10px;
+  top:20px;
+  // margin:0;
+  width: 100%;
+  padding-left:10px;
+  /* Set the fixed height of the footer here */
+  height: 40px;
+  line-height: 60px;
+  background-color:rgb(69, 189, 189);
+}
+.footer h5{
+    font-size: 13px;
+    color:white;
+    font-weight: bold;
+  position: absolute;
+  top: 1%;
+  left: 50%;
+  -moz-transform: translateX(-50%) translateY(-50%);
+  -webkit-transform: translateX(-50%) translateY(-50%);
+  transform: translateX(-50%) translateY(-50%);
+}
+.footer-privacy{
+    color:blue;
+    text-decoration: underline;
+    
+}
+.footer-web{
+    margin-left: 15px;
+  }
+  .add-text{
+      //font-family: monospace;
+      font-weight: 500;
+  }

ng8-seed/src/app/components/payment/payment.component.ts

@@ -118,7 +118,7 @@ export class PaymentComponent implements OnInit {
     
   }
   proceed_for_payment(){
-    if(this.payment_mode  ==  ''){
+    if(this.payment_mode  ==  ''  &&  this.contribute_type != '2'){
       alert('Please Choose the Payment Option')
       return;
     }

ng8-seed/src/app/components/privacy-policy/privacy-policy.component.html

@@ -479,3 +479,6 @@ updated and became immediately effective on October, 16th 2019</FONT></FONT></P>
 </BODY>
 </HTML>
 </mat-card-content></mat-card>
+<footer class="footer">
+    <h5>&#9400; TN Schools, All rights reserved &nbsp;&nbsp;|<span class="footer-web"><a class="footer-privacy" href="#/privacy-policy" target="_blank">Privacy Policy</a></span></h5>
+   </footer>

ng8-seed/src/app/components/privacy-policy/privacy-policy.component.scss

@@ -0,0 +1,35 @@
+.footer {
+    margin:0;
+    width:100%;
+    overflow: hidden;
+  position: relative;
+  // bottom: 10px;
+  top:20px;
+  // margin:0;
+  width: 100%;
+  padding-left:10px;
+  /* Set the fixed height of the footer here */
+  height: 40px;
+  line-height: 60px;
+  background-color:rgb(69, 189, 189);
+}
+.footer h5{
+    font-size: 13px;
+    color:white;
+    font-weight: bold;
+  position: absolute;
+  top: 1%;
+  left: 50%;
+  -moz-transform: translateX(-50%) translateY(-50%);
+  -webkit-transform: translateX(-50%) translateY(-50%);
+  transform: translateX(-50%) translateY(-50%);
+}
+.footer-privacy{
+    color:blue;
+    text-decoration: underline;
+    
+}
+.footer-web{
+  margin-left: 15px;
+}
+

ng8-seed/src/app/components/project-detail/project-detail.component.html

@@ -1,5 +1,11 @@
 <!-- <app-layout-admin></app-layout-admin> -->
 <div id="top"></div>
+<head>
+        <meta property="og:description" content="description" />
+        <meta property="og:image" content="http://cdn.some.com/random.jpg" />
+
+        <div id='hidden' style='display:none;'><img src="http://cdn.some.com/random.jpg"></div>
+    </head>
 <mat-card class="p-2 main-detail-product">
         <div fxLayout="row wrap">
             <div fxFlex.xs="100" fxFlex.sm="100" fxFlex.md="30" fxFlex.lg="50" fxFlex.xl="30">
@@ -494,5 +500,5 @@
         </div>
     </mat-card>
     <footer class="footer">
-            <h5>&#9400; TN Schools, All rights reserved &nbsp;&nbsp;<span ><a class="footer-privacy" href="#/privacy-policy" target="_blank">Privacy Policy</a></span></h5>
+        <h5>&#9400; TN Schools, All rights reserved &nbsp;&nbsp;|<span class="footer-web"><a class="footer-privacy" href="#/privacy-policy" target="_blank">Privacy Policy</a></span></h5>
        </footer>

ng8-seed/src/app/components/project-detail/project-detail.component.scss

@@ -156,6 +156,10 @@ table {
       text-decoration: underline;
       
   }
+  .footer-web{
+    margin-left: 15px;
+  }
+  
     .support_mat{
       border:2px solid gray;
       border-radius: 10px;

ng8-seed/src/app/components/projects/projects.component.html

@@ -445,5 +445,5 @@
 <!-- </div> -->
 </div>
 <footer class="footer">
-        <h5>&#9400; TN Schools, All rights reserved &nbsp;&nbsp;<span ><a class="footer-privacy" href="#/privacy-policy" target="_blank">Privacy Policy</a></span></h5>
+    <h5>&#9400; TN Schools, All rights reserved &nbsp;&nbsp;|<span class="footer-web"><a class="footer-privacy" href="#/privacy-policy" target="_blank">Privacy Policy</a></span></h5>
    </footer>

ng8-seed/src/app/components/projects/projects.component.scss

@@ -178,3 +178,7 @@ $product-bg-color-hover: rgba(103, 58, 183, 0.7);
     text-decoration: underline;
     
 }
+.footer-web{
+    margin-left: 15px;
+  }
+  

ng8-seed/src/app/components/register/register-component.html

@@ -19,7 +19,7 @@
                                     <input matInput placeholder="E Mail" type="email" name="email" formControlName="email" required >
                                 </mat-form-field>
                                 <mat-form-field style="width: 100%">
-                                    <input matInput placeholder="Confirm E Mail" type="email" name="confirm_email" formControlName="confirm_email" required (change)="checkValidators($event.target.value,'email')">
+                                    <input matInput placeholder="Confirm E Mail" type="email" name="confirm_email" formControlName="confirm_email" required (keyup)="checkValidators($event.target.value,'email')">
                                 </mat-form-field>
                                 <div style="color:red;font-size: 14px;float: right" *ngIf="email_pattern_error"> Email & Confirm Email does not match.</div>
                                 <mat-form-field style="width: 100%">
@@ -35,7 +35,7 @@
                                 </mat-form-field>
                               
                                 <mat-form-field style="width: 100%">
-                                    <input matInput placeholder="Confirm Password" type="password" name="confirm_password" formControlName="confirm_password"  required  (change)="checkValidators($event.target.value,'pass')">
+                                    <input matInput placeholder="Confirm Password" type="password" name="confirm_password" formControlName="confirm_password"  required  (keyup)="checkValidators($event.target.value,'pass')">
                                 </mat-form-field>
                                 <div style="color:red;font-size: 14px;float: right" *ngIf="pass_pattern_error"> Password & Confirm Password does not match.</div>
                                 <!-- <div fxLayout="row" fxLayoutAlign="start center" class="mb-2">
@@ -59,20 +59,20 @@
                             <div fxLayout="column" fxLayoutAlign="start stretch" formGroupName="org_info">
                              <div *ngIf="slide1">
                                 <mat-form-field style="width: 100%">
-                                    <input matInput placeholder="Organisation Name" type="text" name="orgname" formControlName="orgname" required>
+                                    <input matInput placeholder="Organisation Name" type="text" name="orgname" formControlName="orgname" >
                               </mat-form-field>
                               <mat-form-field style="width: 100%;">
-                                    <textarea matInput placeholder="Registered Address" name="org_address" formControlName="org_address" required></textarea>
+                                    <textarea matInput placeholder="Registered Address" name="org_address" formControlName="org_address" ></textarea>
                               </mat-form-field> 
                             </div>
                               <div class="mt-1 mb-1">
                                     <label class="mr-1">Do you want to avail 80G Exemption</label>
-                                    <mat-slide-toggle name="slideToggle" (change)="change_fun2($event)" required> 
+                                    <mat-slide-toggle name="slideToggle" (change)="change_fun2($event)" > 
                                     </mat-slide-toggle>
                                 </div>
                                 <div *ngIf="slide2">
                               <mat-form-field style="width: 100%">
-                                    <input matInput placeholder="PAN of the Organisation" type="text" name="org_pan" max="10" maxlength="10" formControlName="org_pan"  required>
+                                    <input matInput placeholder="PAN of the Organisation" type="text" name="org_pan" max="10" maxlength="10" formControlName="org_pan"  >
                               </mat-form-field>  
                             </div> 
                         </div> 

ng8-seed/src/app/components/register/register.component.ts

@@ -38,13 +38,13 @@ export class RegisterComponent {
     this.go_reg = this.fb.group(
       {
         id: new FormControl(''),
-        name: new FormControl(''),
+        name: new FormControl('',Validators.compose([Validators.required])),
-        email: new FormControl('',Validators.email),
+        email: new FormControl('',Validators.compose([Validators.required,Validators.email])),
-        confirm_email:new FormControl('',Validators.email),
+        confirm_email:new FormControl('',Validators.compose([Validators.required,Validators.email])),
         mobile: new FormControl(''),
         // user_dob:new FormControl(''),
-        password: new FormControl(''),
+        password: new FormControl('',Validators.compose([Validators.required])),
-        confirm_password:new FormControl(''),
+        confirm_password:new FormControl('',Validators.compose([Validators.required])),
         user_type:new FormControl('1'),
         org_info: this.fb.group({
         orgname: new FormControl(''),
@@ -129,7 +129,10 @@ export class RegisterComponent {
   }
   csrUserRegistration()
   {
-    
+    if(this.go_reg.invalid){
+      alert("Please fill all the mandatory fields marked with '*'")
+      return;
+    }
 //  this.go_reg.removeControl('confirm_password')
   // this.go_reg.removeControl('cofirm_email')
     // console.log(this.go_reg.value);return false;

ng8-seed/src/app/components/req-list/req-list.component.html

@@ -44,14 +44,14 @@
   <!-- price Column -->
   <ng-container matColumnDef="Cost_Per_Unit">
     <mat-header-cell   *matHeaderCellDef  > Cost Per Unit<br> (in Rs) </mat-header-cell>
-    <mat-cell data-label="Cost/Qty" style="text-align: right;" *matCellDef="let row;" > {{row.cost_per_unit === null?0:row.cost_per_unit}} </mat-cell>
+    <mat-cell data-label="Cost/Qty"  *matCellDef="let row;" > {{row.cost_per_unit === null?0:row.cost_per_unit}} </mat-cell>
     <!-- <td mat-footer-cell *matFooterCellDef> Total </td> -->
   </ng-container>
 
   <!-- Total Column -->
   <ng-container matColumnDef="Amount">
     <mat-header-cell  *matHeaderCellDef  > Amount <br/>(in Rs) </mat-header-cell>
-    <mat-cell data-label="Amount" style="text-align: right;"  *matCellDef="let row ;let i=index" style="text-align: right;">{{row.amount}}</mat-cell>
+    <mat-cell class="amount-mob" data-label="Amount"   *matCellDef="let row ;let i=index">{{row.amount}}</mat-cell>
     <!-- <td mat-footer-cell *matFooterCellDef> {{somethingChanged()}} </td> -->
   </ng-container>
 

ng8-seed/src/app/components/req-list/req-list.component.scss

@@ -60,14 +60,21 @@
     .mat-table .mat-cell:first-child {
     margin-top: 4%;
   }
+  .mat-column-Item_Need{
+    margin:0px;
+    padding: 0px;
+    flex: 0 0 18%;
+  }
 }
 .mat-column-School{
   flex: 0 0 18%;
 }
 .mat-column-Item_Need{
+ 
   flex: 0 0 18%;
 
 }
+
 .mat-column-Required_Qty{
   
   justify-content: center;
@@ -81,14 +88,18 @@
   justify-content: center;
 
 }
+.mat-column-Sponsor_Qty{
+  justify-content: center;
+}
 .mat-column-Cost_Per_Unit{
-  flex: 0 0 12%;
+ // flex: 0 0 12%;
   justify-content: flex-end !important;
 }
 .mat-column-Amount{
+  margin:0px;
+  padding: 0px;
   justify-content: flex-end ;
-  align-items: flex-end;
+ 
-  text-align: right;
 }
 @media(max-width:768px) {
     .main-detail-product {

ng8-seed/src/app/components/user-profile/user-profile.component.html

@@ -27,7 +27,7 @@
 
 <!-- <div class=""> -->
         <!-- <div class=""> -->
-            <div fxLayoutAlign="start" >
+            <div fxLayoutAlign="start"  #table_element >
                
                         <mat-tab-group class="mt-2">
                                 <mat-tab class="tab-group" >
@@ -41,7 +41,7 @@
                             <!-- <p>We would need some of your information to facilitate your contributions and keep you updated on the progress of the projects or new projects</p> -->
                             <form [formGroup]="profile_form">
                                 <div fxLayout="row" fxLayoutAlign="center center" fxLayoutAlign="flex-start" fxLayoutGap="10px" fxLayout.xs="column">
-                                    <mat-form-field style="              justify-content:center;align-content: center;"  fxFlex.xs="100" fxFlex="70">
+                                    <mat-form-field style="              justify-content:center;align-content: center;"  fxFlex.xs="100" fxFlex="100">
                                         <input matInput placeholder="Name" type="text" name="name" formControlName="name" required>
                                     </mat-form-field>
                                     <mat-form-field fxFlex.xs="100" fxFlex="60">
@@ -105,7 +105,12 @@
                                       <mat-radio-button value="no">No</mat-radio-button>
                                     </mat-radio-group><br/><br/> -->
                                    <br/><br/>
-                                  <!-- <button class="mat-red" mat-raised-button (click)="csrUserRegistration()">Register</button>                         -->
+                                   <div style="float:right;">
+                                    <span style="margin-right: 20px;">
+                                   <a  (click)="changePassword_fun()">Change Password</a>
+                                    </span>
+                                   <button style="float:right;" class="mat-red" mat-raised-button (click)="csrUserRegistration()">Update</button>   
+                                </div>                     
                                 
                                 <!-- <div>
                                     <p>Sign Up Using</p> <a href="#" class="shared-icon mr-1 mat-blue"><i class="fa fa-facebook fa-lg mr-1"></i> Facebook</a><a href="#" class="shared-icon mat-red"><i class="fa fa-google fa-lg mr-1"></i>Google</a>
@@ -144,12 +149,12 @@
                      <ng-template mat-tab-label>Contributions</ng-template>
                      <h2 class="base-border">Contributions</h2>
                      <div *ngIf="contribution_data.length > 0">
-                     <div style="text-align: right;">
+                     <div style="text-align: right;" *ngIf="certificate_success_date != null && certificate_success_date!= ''">
                         <button  mat-raised-button class="mb-1" color="primary" (click)="certificateDialog()">Certificate</button>
                      </div>
-                     <div    id="table_element">
+                     <div   [ngClass]="{'example-container mat-elevation-z8':clientWidth <= 500}" >
                          <!--[ngClass]="{'example-container mat-elevation-z8':clientWidth <= 500}"-->
-        <table   mat-table class="example-container mat-elevation-z8"
+        <table   mat-table 
        [dataSource]="dataSource" multiTemplateDataRows
        >
        <ng-container matColumnDef="Date">
@@ -315,3 +320,8 @@
 </body>
 </html>
 </div> 
+
+<footer class="footer">
+    <h5>&#9400; TN Schools, All rights reserved &nbsp;&nbsp;|<span class="footer-web"><a class="footer-privacy" href="#/privacy-policy" target="_blank">Privacy Policy</a></span></h5>
+   </footer>
+  

ng8-seed/src/app/components/user-profile/user-profile.component.scss

@@ -179,4 +179,43 @@
     }
      
     }
+    .footer {
+      margin:0;
+      width:100%;
+      overflow: hidden;
+    position: relative;
+    // bottom: 10px;
+    top:20px;
+    // margin:0;
+    width: 100%;
+    padding-left:10px;
+    /* Set the fixed height of the footer here */
+    height: 40px;
+    line-height: 60px;
+    background-color:rgb(69, 189, 189);
+  }
+  .footer h5{
+      font-size: 13px;
+      color:white;
+      font-weight: bold;
+    position: absolute;
+    top: 1%;
+    left: 50%;
+    -moz-transform: translateX(-50%) translateY(-50%);
+    -webkit-transform: translateX(-50%) translateY(-50%);
+    transform: translateX(-50%) translateY(-50%);
+  }
+  .footer-privacy{
+      color:blue;
+      text-decoration: underline;
       
+  }
+  .footer-web{
+    margin-left: 15px;
+  }
+  .html2canvas-container { width: 3000px !important; height: 3000px !important; }
+
+  a{
+    text-decoration: underline;
+    color: blue;
+  }

ng8-seed/src/app/components/user-profile/user-profile.component.ts

@@ -4,10 +4,12 @@ import { FormGroup, FormBuilder, FormControl } from '@angular/forms';
 import {animate, state, style, transition, trigger} from '@angular/animations';
 import { MatTableDataSource, MatSnackBar, MatDialog } from '@angular/material';
 import * as jspdf from 'jspdf';  
+import  {environment} from  'environments/environment'
   
 import html2canvas from 'html2canvas';
 import { Router } from '@angular/router';
 import { UserCertificateComponent } from '../user-certificate/user-certificate.component';
+import { PasswordChangeComponent } from '../password-change/password-change.component';
 
 @Component({
   selector: 'app-user-profile',
@@ -35,17 +37,21 @@ export class UserProfileComponent implements OnInit {
   slide2: boolean;
  @ViewChild('table_element',{static:true}) table_element
   clientWidth: any;
+  certificate_success_date: any='';
   
-  constructor(private apiService:ApiService,private _fb:FormBuilder,private matSnackBar:MatSnackBar,public router:Router,private matDialog:MatDialog) { }
+  constructor(private apiService:ApiService,private _fb:FormBuilder,private matSnackBar:MatSnackBar,public router:Router,private matDialog:MatDialog,private restApi:ApiService) { }
 
   ngOnInit() {
     this.getProfile()
     this.profile_form=this._fb.group({
-      name:['',{disabled:true}],
+      id:[''],
-      email:['',{disabled:true}],
+      name:[''],
-      mobile:['',{disabled:true}],
+      email:[{value:'',disabled:true}],
+      mobile:[{value:'',disabled:true}],
+      password:[null],
       user_type:new FormControl(''),
         org_info: this._fb.group({
+          id:[''],
         orgname: new FormControl(''),
         org_address: new FormControl(''),
         org_pan: new FormControl(''),
@@ -73,12 +79,24 @@ export class UserProfileComponent implements OnInit {
       this.user_data.user_type == '2' ? this.slide1 =true : this.slide1=false
       this.profile_form.patchValue(this.user_data)
       this.profile_form.controls['org_info'].patchValue(this.user_data);
+      this.profile_form.controls['org_info']['controls'].id.setValue(this.user_data.org_id)
+      
+
       this.contribution_data=res['records'].contribution_data
       this.contribution_data.forEach(element=>{
         element.detailRow=true;
       })
       console.log("con",this.contribution_data,this.isExpansionDetailRow);
-      this.contribution_data=this.contribution_data.filter(val=>val.payment_mode !='0')
+      this.contribution_data=this.contribution_data.filter(val=>{
+        if(val.payment_mode ==  '0' &&  val.cont_type !=2){
+
+        }
+        else{
+          return  val;
+        }
+       })
+       this.certificate_success_date=this.contribution_data.filter(val=>val.txnstatus ==  'SUCCESS').map(val=>val.contribute_date)[0];
+       console.log(this.certificate_success_date)
       this.dataSource=this.contribution_data;
       }
     })
@@ -111,6 +129,9 @@ export class UserProfileComponent implements OnInit {
   performOperation(data){
    
     console.log(data)
+    this.matSnackBar.open("Processing Please Wait...",'', {
+      duration: 3000,
+    })
     let param={ "merchant_txn_id":data.merchant_txn_id,"flag":""}
     if(data.txnstatus == 'SUCCESS'){
       param.flag="PDF"
@@ -135,6 +156,18 @@ export class UserProfileComponent implements OnInit {
         })
         }
       }
+      else{
+        if(result['msg']){
+        this.matSnackBar.open(result['msg'],'', {
+          duration: 6000,
+        })
+      }
+      else{
+        this.matSnackBar.open("something went wrong try again later ",'', {
+          duration: 6000,
+        })
+      }
+      }
     })
   }
   generatePDF(){
@@ -172,7 +205,34 @@ export class UserProfileComponent implements OnInit {
       "height":"630px",
       "width":"820px",
       panelClass: 'custom-modalbox',
-      data:{org_name:this.user_data.orgname,logged_user_name:user_name,latest_contribute_date:this.contribution_data[0].contribute_date}
+      data:{org_name:this.user_data.orgname,logged_user_name:user_name,latest_contribute_date:this.certificate_success_date}
+    })
+  }
+  csrUserRegistration()
+  {
+   
+//  this.go_reg.removeControl('confirm_password')
+  // this.go_reg.removeControl('cofirm_email')
+    // console.log(this.go_reg.value);return false;
+  let url = `${environment.apiUrl}${'csrUserRegistration'}`;
+  console.log("dd",url)
+  let data = this.profile_form.value;
+  delete data.confirm_email
+  delete data.confirm_password
+  this.restApi.post(url,data).subscribe(schDet=>
+    {   
+      console.log("result",schDet)    
+      alert("Updated Successfully")
+      // this.router.navigate(['/authentication/login']); 
+      
+    })
+  }
+  changePassword_fun(){
+    this.matDialog.open(PasswordChangeComponent,{
+      "height":"360px",
+      "width":"320px",
+      panelClass: 'custom-modalbox',
+      data:this.profile_form.value.id
     })
   }
 

ng8-seed/src/app/dashboard/dashboard.component.html

@@ -232,8 +232,6 @@ showCaptions="true"
       
    </mat-card> -->
 
-
    <footer class="footer">
-  <h5>&#9400; TN Schools, All rights reserved &nbsp;&nbsp;<span ><a class="footer-privacy" href="#/privacy-policy" target="_blank">Privacy Policy</a></span></h5>
+      <h5>&#9400; TN Schools, All rights reserved &nbsp;&nbsp;|<span class="footer-web"><a class="footer-privacy" href="#/privacy-policy" target="_blank">Privacy Policy</a></span></h5>
      </footer>
-

ng8-seed/src/app/dashboard/dashboard.component.scss

@@ -752,6 +752,9 @@ hr{
     text-decoration: underline;
     
 }
+.footer-web{
+    margin-left: 15px;
+  }
 
 html body{
     margin:0;

ng8-seed/src/app/layouts/admin/admin-layout.component.html

@@ -134,6 +134,7 @@
                               <a [routerLink]="['/'+menuitem.state]" *ngIf="menuitem.type === 'sub' && menuitem.name == 'My Account' && user_name != ''">
                               <!-- <mat-icon>{{ menuitem.icon }}</mat-icon> -->
                               <span style="text-transform: capitalize;"><strong>{{ menuitem.name == 'My Account' ? user_name == '' ? menuitem.name : user_name : menuitem.name  | translate }}</strong></span>
+                              <mat-icon class="menu-caret">arrow_drop_down</mat-icon>
                               </a>
 
                               <ul class="dropdown" *ngIf="menuitem.type === 'sub' && user_name != ''">

ng8-seed/src/assets/styles/app.scss

@@ -46,7 +46,10 @@ Author: TrendSetter Themes
 @import "scss/utilities/utilities";
 .custom-modalbox {
     mat-dialog-container {
-        padding: 0;
+        padding: 0px;
+        margin: 0px;
     }
 }
+@import '~@ngx-share/button/themes/default/default-theme';
+
 

ng8-seed/src/assets/styles/scss/core/_sessions.scss

@@ -44,7 +44,7 @@
 
 body .login-session{
     position: relative;
-    z-index: 99;
+    z-index: 0;
     padding: 2rem !important;
 }
 .text-white {

ng8-seed/src/icon.ts

@@ -0,0 +1,33 @@
+import { library } from '@fortawesome/fontawesome-svg-core';
+
+import { faFacebookF } from '@fortawesome/free-brands-svg-icons/faFacebookF';
+import { faTwitter } from '@fortawesome/free-brands-svg-icons/faTwitter';
+import { faRedditAlien } from '@fortawesome/free-brands-svg-icons/faRedditAlien';
+import { faLinkedinIn } from '@fortawesome/free-brands-svg-icons/faLinkedinIn';
+import { faGooglePlusG } from '@fortawesome/free-brands-svg-icons/faGooglePlusG';
+import { faTumblr } from '@fortawesome/free-brands-svg-icons/faTumblr';
+import { faPinterestP } from '@fortawesome/free-brands-svg-icons/faPinterestP';
+import { faWhatsapp } from '@fortawesome/free-brands-svg-icons/faWhatsapp';
+import { faVk } from '@fortawesome/free-brands-svg-icons/faVk';
+import { faFacebookMessenger } from '@fortawesome/free-brands-svg-icons/faFacebookMessenger';
+import { faTelegramPlane } from '@fortawesome/free-brands-svg-icons/faTelegramPlane';
+import { faMix } from '@fortawesome/free-brands-svg-icons/faMix';
+import { faXing } from '@fortawesome/free-brands-svg-icons/faXing';
+import { faLine } from '@fortawesome/free-brands-svg-icons/faLine';
+
+import { faCommentAlt } from '@fortawesome/free-solid-svg-icons/faCommentAlt';
+import { faMinus } from '@fortawesome/free-solid-svg-icons/faMinus';
+import { faEllipsisH } from '@fortawesome/free-solid-svg-icons/faEllipsisH';
+import { faLink } from '@fortawesome/free-solid-svg-icons/faLink';
+import { faExclamation } from '@fortawesome/free-solid-svg-icons/faExclamation';
+import { faPrint } from '@fortawesome/free-solid-svg-icons/faPrint';
+import { faCheck } from '@fortawesome/free-solid-svg-icons/faCheck';
+import { faEnvelope } from '@fortawesome/free-solid-svg-icons/faEnvelope';
+
+const icons = [
+  faFacebookF, faTwitter, faLinkedinIn, faGooglePlusG, faPinterestP, faRedditAlien, faTumblr,
+  faWhatsapp, faVk, faFacebookMessenger, faTelegramPlane, faMix, faXing, faCommentAlt, faLine,
+  faEnvelope, faCheck, faPrint, faExclamation, faLink, faEllipsisH, faMinus
+];
+
+library.add(...icons);

ng8-seed/src/index.html

@@ -2,7 +2,15 @@
 <html>
 
 <head>
+        <!-- <head> -->
+                <meta property="og:description" content="Alone we can do so little,
+                together we can do so much " />
+                <meta property="og:image" content="https://contribute.tnschools.gov.in/certificate.jpg" />
+        
+                
+            <!-- </head> -->
     <base href="./">
+    <meta property="og:image" content="certificate.jpg" />
     <meta charset="utf-8">
     <meta http-equiv="X-UA-Compatible" content="IE=edge">
     <meta name="viewport" content="width=device-width, initial-scale=1">

ng8-seed/src/main.ts

@@ -3,6 +3,7 @@ import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
 
 import { AppModule } from './app/app.module';
 import { environment } from './environments/environment';
+import './icon.ts';
 
 if (environment.production) {
   enableProdMode();