bitwarden-estensione-browser/src/app/modal.component.ts

77 lines
2.4 KiB
TypeScript
Raw Normal View History

2018-06-06 23:25:57 +02:00
import * as jq from 'jquery';
import {
Component,
ComponentFactoryResolver,
Type,
ViewContainerRef,
} from '@angular/core';
import { ModalComponent as BaseModalComponent } from 'jslib/angular/components/modal.component';
2018-08-01 15:13:55 +02:00
import { Utils } from 'jslib/misc/utils';
2018-06-06 23:25:57 +02:00
2019-04-02 15:29:20 +02:00
import { MessagingService } from 'jslib/abstractions/messaging.service';
2018-06-06 23:25:57 +02:00
@Component({
selector: 'app-modal',
template: `<ng-template #container></ng-template>`,
})
export class ModalComponent extends BaseModalComponent {
el: any = null;
2019-04-02 15:29:20 +02:00
constructor(componentFactoryResolver: ComponentFactoryResolver, messagingService: MessagingService) {
super(componentFactoryResolver, messagingService);
2018-06-06 23:25:57 +02:00
}
ngOnDestroy() { /* Nothing */ }
2019-07-25 18:24:32 +02:00
show<T>(type: Type<T>, parentContainer: ViewContainerRef, fade: boolean = true,
setComponentParameters: (component: T) => void = null): T {
2018-06-06 23:25:57 +02:00
this.parentContainer = parentContainer;
this.fade = fade;
const factory = this.componentFactoryResolver.resolveComponentFactory<T>(type);
const componentRef = this.container.createComponent<T>(factory);
2019-07-25 18:24:32 +02:00
if (setComponentParameters != null) {
setComponentParameters(componentRef.instance);
}
2018-06-06 23:25:57 +02:00
const modals = Array.from(document.querySelectorAll('.modal'));
if (modals.length > 0) {
this.el = jq(modals[0]);
this.el.modal('show');
this.el.on('show.bs.modal', () => {
this.onShow.emit();
2019-04-02 15:29:20 +02:00
this.messagingService.send('modalShow');
2018-06-06 23:25:57 +02:00
});
this.el.on('shown.bs.modal', () => {
this.onShown.emit();
2019-04-02 15:29:20 +02:00
this.messagingService.send('modalShown');
2018-08-01 15:13:55 +02:00
if (!Utils.isMobileBrowser) {
this.el.find('*[appAutoFocus]').focus();
}
2018-06-06 23:25:57 +02:00
});
this.el.on('hide.bs.modal', () => {
this.onClose.emit();
2019-04-02 15:29:20 +02:00
this.messagingService.send('modalClose');
2018-06-06 23:25:57 +02:00
});
this.el.on('hidden.bs.modal', () => {
this.onClosed.emit();
2019-04-02 15:29:20 +02:00
this.messagingService.send('modalClosed');
2018-06-06 23:25:57 +02:00
if (this.parentContainer != null) {
this.parentContainer.clear();
}
});
}
return componentRef.instance;
}
close() {
if (this.el != null) {
this.el.modal('hide');
}
}
}