-
Notifications
You must be signed in to change notification settings - Fork 7
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Merge pull request #50 from ORCID/emailPage
Email page
- Loading branch information
Showing
11 changed files
with
229 additions
and
67 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,58 @@ | ||
| <div class="row justify-content-center"> | ||
| <div class="col col-lg-7 text-center"> | ||
| <div class="card"> | ||
| <div class="card-block"> | ||
| <h2>Create a new iD collection</h2> | ||
| <p class="mb-0">To get started, we'll need your email address</p> | ||
| <p class="small mt-1 mb-3"><i>Used only to send collection editing instructions to you. We don't save or display this.</i></p> | ||
| <form | ||
| class | ||
| #formRefEmail="ngForm" | ||
| (ngSubmit)="submitEmail(formRefEmail.value)" | ||
| novalidate> | ||
| <div class="form-group row justify-content-center"> | ||
| <label for="email" class="sr-only">Email</label> | ||
| <div class="col-8"> | ||
| <input | ||
| [(ngModel)]="email" | ||
| #emailRef="ngModel" | ||
| autocomplete="off" | ||
| class="form-control text-center" | ||
| id="email" | ||
| name="email" | ||
| placeholder="[email protected]" | ||
| type="email" | ||
| required | ||
| > | ||
| </div> | ||
| </div> | ||
| <button *ngIf="!formEmailSubmitted || showEmailErrorMessage" | ||
| class="btn btn-primary" | ||
| type="submit" | ||
| role="button" | ||
| > | ||
| Continue & Sign into ORCID | ||
| </button> | ||
| </form> | ||
| <p (click)="showEmailErrorMessage = !showEmailErrorMessage" *ngIf="showEmailErrorMessage && formEmailSubmitted" class="text-danger mt-2"><strong>Oops, something went wrong.</strong> Check the address and try again.</p> | ||
| <p class="mt-3"><small><strong>Don't have an ORCID iD?</strong> Register for an iD and create your collection at the same time. Click 'Sign into ORCID' above, then 'Register now' on the next screen.</small></p> | ||
| <div | ||
| *ngIf="emailSubmitSuccess" | ||
| class="row justify-content-center" | ||
| > | ||
| <div class="card-block"> | ||
| <p>Thanks! To finish creating your collection, sign into ORCID.</p> | ||
|
|
||
| <a href="{{orcid_oauth_url}}"><button | ||
| class="btn btn-primary" | ||
| role="button" | ||
| > | ||
| Sign into ORCID | ||
| </button></a> | ||
| <p class="mt-2"><small><strong>Don't have an ORCID iD?</strong> Register for an iD and create your collection at the same time. Click 'Sign into ORCID' above, then 'Register now' on the next screen.</small></p> | ||
| </div> | ||
| </div> | ||
| </div> | ||
| </div> | ||
| </div> | ||
| </div> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,66 @@ | ||
| @import '../../variables'; | ||
|
|
||
| form p { | ||
| margin-bottom: 2rem; | ||
|
|
||
| &.form-control-label { | ||
| margin-bottom: 0; | ||
| } | ||
| } | ||
|
|
||
| legend { | ||
| color: $title-h1-font-color; | ||
| font: bold 2.5rem $font-stack; | ||
| } | ||
|
|
||
| small{ | ||
| font-style: italic; | ||
| line-height: .8rem; | ||
| } | ||
|
|
||
| .card .card { | ||
|
|
||
| background-color: $gray97; | ||
|
|
||
| h2 { | ||
| text-align: left; | ||
| } | ||
|
|
||
| h3 { | ||
| font: bold 1rem $font-stack; | ||
| margin: 1rem 0 0 0; | ||
| } | ||
|
|
||
| p { | ||
| margin: .1rem 0; | ||
| } | ||
|
|
||
| small{ | ||
| font: italic 1rem $font-stack; | ||
| } | ||
|
|
||
| button { | ||
| float: left; | ||
| margin: 1rem 0 0 0; | ||
|
|
||
| fa { | ||
| color: $white; | ||
| } | ||
| } | ||
|
|
||
| .card-block { | ||
| padding-top: .5rem; | ||
| } | ||
|
|
||
| #collection-links{ | ||
| a { | ||
| word-break: break-all; | ||
| } | ||
| } | ||
|
|
||
| div.text-success { | ||
| float: left; | ||
| margin: 1.5rem 0 0 1rem; | ||
| } | ||
|
|
||
| } |
25 changes: 25 additions & 0 deletions
25
src/app/collection-email/collection-email.component.spec.ts
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,25 @@ | ||
| import { async, ComponentFixture, TestBed } from '@angular/core/testing'; | ||
|
|
||
| import { CollectionEmailComponent } from './collection-email.component'; | ||
|
|
||
| describe('CollectionEmailComponent', () => { | ||
| let component: CollectionEmailComponent; | ||
| let fixture: ComponentFixture<CollectionEmailComponent>; | ||
|
|
||
| beforeEach(async(() => { | ||
| TestBed.configureTestingModule({ | ||
| declarations: [ CollectionEmailComponent ] | ||
| }) | ||
| .compileComponents(); | ||
| })); | ||
|
|
||
| beforeEach(() => { | ||
| fixture = TestBed.createComponent(CollectionEmailComponent); | ||
| component = fixture.componentInstance; | ||
| fixture.detectChanges(); | ||
| }); | ||
|
|
||
| it('should create', () => { | ||
| expect(component).toBeTruthy(); | ||
| }); | ||
| }); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,59 @@ | ||
| import { Component, OnInit } from '@angular/core'; | ||
|
|
||
| import { Collection } from './../shared/collection/collection'; | ||
| import { CollectionService } from './../shared/collection/collection.service'; | ||
|
|
||
| @Component({ | ||
| selector: 'app-collection-email', | ||
| templateUrl: './collection-email.component.html', | ||
| styleUrls: ['./collection-email.component.scss'] | ||
| }) | ||
| export class CollectionEmailComponent implements OnInit { | ||
| public publicKey: string; | ||
| public privateKey: string; | ||
| private response: any; | ||
|
|
||
| email: string; | ||
| formEmailSubmitted: boolean; | ||
| ngForm: any; | ||
| showEmailErrorMessage: boolean; | ||
| showEmailWarningMessage: boolean; | ||
|
|
||
| constructor( | ||
| private collectionService: CollectionService | ||
| ) { | ||
| this.email = ''; | ||
| this.formEmailSubmitted = false | ||
| this.showEmailErrorMessage = false; | ||
| this.showEmailWarningMessage = false; | ||
| } | ||
|
|
||
| ngOnInit() { | ||
| } | ||
|
|
||
| submitEmail( form: any ): void { | ||
| this.formEmailSubmitted = true; | ||
| var re = /^(([^<>()\[\]\\.,;:\s@"]+(\.[^<>()\[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/; | ||
| if (re.test(form.email) == false) { | ||
| console.log("invalid email"); | ||
| this.showEmailErrorMessage = true; | ||
| } else { | ||
| var formString = JSON.stringify(form); | ||
| this.collectionService.editEmail(formString).subscribe( | ||
| (response) => { | ||
| this.response = response; | ||
| console.log(this.response); | ||
| var response_parsed = JSON.parse(JSON.stringify(this.response, null, 2)); | ||
| this.showEmailErrorMessage = false; | ||
| window.location.replace(response_parsed.redirect + '&email=' + response_parsed.email); | ||
| }, | ||
| (err) => { | ||
| console.log(err); | ||
| this.showEmailErrorMessage = true; | ||
| }, | ||
| () => {} | ||
| ); | ||
| } | ||
| } | ||
|
|
||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters