Home page carousel
[eliot.git] / blueprints / common / eliot-ui / frontend-src / src / app / signup / signup.component.ts
diff --git a/blueprints/common/eliot-ui/frontend-src/src/app/signup/signup.component.ts b/blueprints/common/eliot-ui/frontend-src/src/app/signup/signup.component.ts
new file mode 100644 (file)
index 0000000..86e21fb
--- /dev/null
@@ -0,0 +1,88 @@
+import { Component, OnInit } from '@angular/core';
+import { ToolbarService } from './../toolbar/toolbar.service';
+
+import { Router, ActivatedRoute } from '@angular/router';
+import { FormBuilder, FormGroup, Validators } from '@angular/forms';
+import { UserService } from '../_services/user.service';
+// import { ToastrService } from 'ngx-toastr';
+import { AuthenticationService } from '../_services/authentication.service';
+
+// import * as  particlesJS from 'particles.js';
+// import {particlesJS} from 'particles.js';
+// import 'particles.js/particles';
+declare var particlesJS: any;
+
+
+
+@Component({
+  selector: 'app-signup',
+  templateUrl: './signup.component.html',
+  styleUrls: ['./signup.component.scss']
+})
+export class SignupComponent implements OnInit {
+
+  // particlesJS: any;
+  // particlesJS = window.particlesJS;
+  
+  signupForm: FormGroup;
+  loading = false;
+  submitted = false;
+  returnUrl: string;
+  hide = true;
+  constructor(
+    public toolbarService: ToolbarService,
+    private formBuilder: FormBuilder,
+    private route: ActivatedRoute,
+    private router: Router,
+    private authenticationService: AuthenticationService,
+    private userService: UserService,
+    
+    // private toastr: ToastrService
+  ) { }
+
+  ngOnInit() {
+    
+    this.toolbarService.show();
+    this.signupForm = this.formBuilder.group({
+      username: ['', Validators.required],
+      firstname: ['', Validators.required],
+      lastname: ['', Validators.required],
+      email: ['', Validators.required],
+      password: ['', Validators.required],
+      role: ['', Validators.required]
+    });
+
+    particlesJS.load('particles-js', './../../assets/particlesjs-config-1.json', function() {
+      console.log('callback - particles.js config loaded');
+    });
+    // particlesJS
+  }
+
+  get fval() { return this.signupForm.controls; }
+
+
+  onFormSubmit() {
+    console.log("on Form Submit Method triggered......")
+    this.submitted = true;
+
+    // return for here if form is invalid
+    console.log(this.signupForm);
+    if (this.signupForm.invalid) {
+      console.log("Signup Form invalid...");
+      return;
+    }
+    this.loading = true;
+    this.userService.register(this.signupForm.value).subscribe(
+      (data) => {
+        alert('User Registered successfully!!');
+        this.router.navigate(['/login']);
+      },
+      (error) => {
+        // this.toastr.error(error.error.message, 'Error');
+        this.loading = false;
+
+      }
+    )
+  }
+
+}