peter/doneit-web
1
0
Fork 0
mirror of https://code.equilibrium.co.ao/ITO/doneit-web.git synced 2026-04-19 13:02:56 +00:00
Code Issues Packages Projects Releases Wiki Activity

Improve notification

Browse Source
This commit is contained in:
Peter Maquiran
2021-06-15 15:09:20 +01:00
parent bfb81fd84f
commit c856cc2927
32 changed files with 218 additions and 1447 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/app/shared/pin/pin.page.ts
+5 -84
View File
@@ -3,6 +3,7 @@ import { AnimationController, ModalController } from '@ionic/angular';
import { BadRequestPage } from '../popover/bad-request/bad-request.page';
import { SuccessMessagePage } from '../popover/success-message/success-message.page';
import crypto from 'crypto-js'
import { ToastService } from 'src/app/services/toast.service';
@Component({
selector: 'app-pin',
templateUrl: './pin.page.html',
@@ -12,7 +13,8 @@ export class PinPage implements OnInit {
code = []
constructor( private modalController: ModalController,
private animationController: AnimationController) { }
private animationController: AnimationController,
private toastService: ToastService) { }
ngOnInit() {
}
@@ -41,7 +43,7 @@ export class PinPage implements OnInit {
if(this.code.length == 4) {
this.close()
//this.successMessage()
//this.toastService.successMessage()
const code = this.code.join('')
const encrypted = crypto.SHA1(code)
@@ -49,94 +51,13 @@ export class PinPage implements OnInit {
localStorage.setItem('PIN', encrypted)
} else {
this.badRequest()
this.toastService.badRequest()
}
}
async successMessage(message?: any, callback?) {
const enterAnimation = (baseEl: any) => {
const backdropAnimation = this.animationController.create()
.addElement(baseEl.querySelector('ion-backdrop')!)
.fromTo('opacity', '0.01', 'var(--backdrop-opacity)');
const wrapperAnimation = this.animationController.create()
.addElement(baseEl.querySelector('.modal-wrapper')!)
.keyframes([
{ offset: 0, opacity: '1', right: '-100%' },
{ offset: 1, opacity: '1', right: '0px' }
]);
return this.animationController.create()
.addElement(baseEl)
.easing('ease-out')
.duration(500)
.addAnimation([backdropAnimation, wrapperAnimation]);
}
const leaveAnimation = (baseEl: any) => {
return enterAnimation(baseEl).direction('reverse');
}
const modal = await this.modalController.create({
enterAnimation,
leaveAnimation,
component: SuccessMessagePage,
componentProps: {
message: message || 'Processo efetuado' ,
},
cssClass: 'notification-modal'
});
modal.present()
modal.dismiss()
}
async badRequest(message?: string, callback?) {
const enterAnimation = (baseEl: any) => {
const backdropAnimation = this.animationController.create()
.addElement(baseEl.querySelector('ion-backdrop')!)
.fromTo('opacity', '0.01', 'var(--backdrop-opacity)');
const wrapperAnimation = this.animationController.create()
.addElement(baseEl.querySelector('.modal-wrapper')!)
.keyframes([
{ offset: 0, opacity: '1', right: '-100%' },
{ offset: 1, opacity: '1', right: '0px' }
]);
return this.animationController.create()
.addElement(baseEl)
.easing('ease-out')
.duration(500)
.addAnimation([backdropAnimation, wrapperAnimation]);
}
const leaveAnimation = (baseEl: any) => {
return enterAnimation(baseEl).direction('reverse');
}
const modal = await this.modalController.create({
enterAnimation,
leaveAnimation,
component: BadRequestPage,
componentProps: {
message: message || 'Processo efetuado' ,
},
cssClass: 'notification-modal'
});
modal.present()
setTimeout(()=>{
this.close()
modal.dismiss()
},3000)
}
}