diff --git a/src/app/pages/AddAppPage/components/add-app/add-app.component.scss b/src/app/pages/AddAppPage/components/add-app/add-app.component.scss index 33f3569..fac7230 100644 --- a/src/app/pages/AddAppPage/components/add-app/add-app.component.scss +++ b/src/app/pages/AddAppPage/components/add-app/add-app.component.scss @@ -2,34 +2,9 @@ -// .add-app { -// padding-top: 80px; -// .header { -// text-align: center; -// h2 { -// padding: 10px; -// margin: 20px 0; -// display: inline-block; -// } - - -// } -// .form-actions { -// .btn { -// background: $primary; -// color: $white; -// } -// } -// .ng-valid[required] { -// border-left: 5px solid #42A948; /* green */ -// } - -// .ng-invalid { -// border-left: 5px solid #a94442; /* red */ -// } -// .custom-messages { -// h3 { -// padding: 15px; -// } -// } -// } \ No newline at end of file +.add-app { + .custom-messages .alert { + padding-top: 10px; + padding-bottom: 10px; + } +} \ No newline at end of file diff --git a/src/app/pages/AddAppPage/components/add-app/add-app.component.ts b/src/app/pages/AddAppPage/components/add-app/add-app.component.ts index ecd34fe..d7852b9 100644 --- a/src/app/pages/AddAppPage/components/add-app/add-app.component.ts +++ b/src/app/pages/AddAppPage/components/add-app/add-app.component.ts @@ -1,6 +1,6 @@ import {CivicFile} from '../../../../shared/models/civic-file.model'; import {UploadService} from '../../../../services/upload.service'; -import {Component, OnInit, Input, OnChanges, SimpleChanges} from '@angular/core'; +import {Component, OnInit, Input, OnChanges, SimpleChanges, ViewChild, ElementRef} from '@angular/core'; import {AppService} from '../../../../services/app.service'; import {CategoriesService} from '../../../../services/category.service'; @@ -26,6 +26,7 @@ export class AddAppComponent implements OnInit, OnChanges { constructor(private appService: AppService, private tagsService: TagsService, private technologiesService: TechnologiesService, private categoriesService: CategoriesService, private uploadService: UploadService) { this.submitted = false; + this.successful = false; this.isAddingNewApp = true; } @@ -41,6 +42,7 @@ export class AddAppComponent implements OnInit, OnChanges { public selectedTechnologies: string[] = []; private newTag: string; private submitted: boolean; + private successful: boolean; private message; private error; private appLogo: CivicFile; @@ -53,6 +55,9 @@ export class AddAppComponent implements OnInit, OnChanges { private needsToUpdateNgoLogo: boolean; public phoneRegex = '\\+4\\d{10}'; + @ViewChild('appLogoInput') appLogoInputRef: ElementRef; + @ViewChild('ngoLogoInput') ngoLogoInputRef: ElementRef; + ngOnChanges(changes: SimpleChanges) { if (changes['app']) { this.submitted = false; @@ -177,7 +182,7 @@ export class AddAppComponent implements OnInit, OnChanges { this.isNgoLogoUploaded = false; } this.error = err.toString(); - } + } addApp(form) { if (this.isAddingNewApp) { @@ -237,12 +242,11 @@ export class AddAppComponent implements OnInit, OnChanges { if (this.message === 'success') { this.error = null; this.setDefaultsForLogoWhenEditingApp(); - } else { const errorRegex = /\(ERROR\)\:(.*)/; this.error = errorRegex.exec(this.message); } - + AddAppComponent.scrollToTop(); } } }); @@ -250,6 +254,7 @@ export class AddAppComponent implements OnInit, OnChanges { } private addNewApp(form) { + this.successful = false; this.submitted = true; if (this.isAppLogoValid && this.isNgoLogoValid) { @@ -273,22 +278,33 @@ export class AddAppComponent implements OnInit, OnChanges { this.message = response['result']; if (this.message === 'success') { + this.submitted = false; + this.successful = true; this.error = null; - this.setDefaultsForLogoRelated(); + form.reset(); + this.setFormDefaults(); } else { const errorRegex = /\(ERROR\):(.*)/; this.error = errorRegex.exec(this.message)[1]; } + AddAppComponent.scrollToTop(); } } }); } else { this.error = 'Logo-ul aplicației sau al organizației este invalid, poate sa fie doar .png sau .jpg, maxim 500px x 500px.'; + AddAppComponent.scrollToTop(); } } private setDefaultsForLogoRelated() { + if (this.appLogoInputRef) { + this.appLogoInputRef.nativeElement.value = null; + } + if (this.ngoLogoInputRef) { + this.ngoLogoInputRef.nativeElement.value = null; + } this.ngoLogo = null; this.appLogo = null; this.isAppLogoUploaded = false; @@ -306,4 +322,20 @@ export class AddAppComponent implements OnInit, OnChanges { this.needsToUpdateNgoLogo = false; } + + private setFormDefaults() { + this.setDefaultsForLogoRelated(); + this.selectedAppTags = []; + this.selectedTechnologies = []; + } + + private static scrollToTop() { + (function scrollSmoothly() { + const currentScroll = document.documentElement.scrollTop || document.body.scrollTop; + if (currentScroll > 0) { + window.requestAnimationFrame(scrollSmoothly); + window.scrollTo(0, currentScroll - (currentScroll / 8)); + } + })(); + } } diff --git a/src/app/pages/AddAppPage/components/add-app/add-app.template.html b/src/app/pages/AddAppPage/components/add-app/add-app.template.html index 13f030d..47c6822 100644 --- a/src/app/pages/AddAppPage/components/add-app/add-app.template.html +++ b/src/app/pages/AddAppPage/components/add-app/add-app.template.html @@ -13,18 +13,16 @@