ng-feedback
Version:
An angular directive for sending feedback featuring Angular 6, Html2canvas, Angular Material, Rxjs, inspired by Google send feedback, based on angular-cli.
133 lines (132 loc) • 10.2 kB
JavaScript
/**
* @fileoverview added by tsickle
* @suppress {checkTypes,extraRequire,uselessCode} checked by tsc
*/
import { Directive, HostListener, EventEmitter, Output, Input } from '@angular/core';
import { MatDialog } from '@angular/material';
import { FeedbackDialogComponent } from './feedback-dialog/feedback-dialog.component';
import { FeedbackService } from './feedback.service';
import { Overlay } from '@angular/cdk/overlay';
export class FeedbackDirective {
/**
* @param {?} dialogRef
* @param {?} feedbackService
* @param {?} overlay
*/
constructor(dialogRef, feedbackService, overlay) {
this.dialogRef = dialogRef;
this.feedbackService = feedbackService;
this.title = 'Send feedback';
this.placeholder = 'Describe your issue or share your ideas';
this.editTip = 'Click to highlight or hide info';
this.checkboxLabel = 'Include screenshot';
this.cancelLabel = 'CANCEL';
this.sendLabel = 'SEND';
this.moveToolbarTip = 'move toolbar';
this.drawRectTip = 'Draw using yellow to highlight issues or black to hide sensitive info';
this.highlightTip = 'highlight issues';
this.hideTip = 'hide sensitive info';
this.editDoneLabel = 'DONE';
this.send = new EventEmitter();
this.feedbackService.feedback$.subscribe((feedback) => {
this.send.emit(feedback);
});
this.overlay = overlay;
}
/**
* @return {?}
*/
onClick() {
this.openFeedbackDialog();
}
/**
* @return {?}
*/
openFeedbackDialog() {
this.feedbackService.initScreenshotCanvas();
/** @type {?} */
const dialogRef = this.dialogRef.open(FeedbackDialogComponent, {
panelClass: 'feedbackDialog',
backdropClass: 'dialogBackDrop',
disableClose: true,
height: 'auto',
width: 'auto',
scrollStrategy: this.overlay.scrollStrategies.reposition()
});
}
/**
* @return {?}
*/
ngOnInit() {
this.feedbackService.initialVariables = {
title: this.title,
placeholder: this.placeholder,
editTip: this.editTip,
checkboxLabel: this.checkboxLabel,
cancelLabel: this.cancelLabel,
sendLabel: this.sendLabel,
moveToolbarTip: this.moveToolbarTip,
drawRectTip: this.drawRectTip,
highlightTip: this.highlightTip,
hideTip: this.hideTip,
editDoneLabel: this.editDoneLabel
};
}
}
FeedbackDirective.decorators = [
{ type: Directive, args: [{ selector: '[feedback]' },] }
];
/** @nocollapse */
FeedbackDirective.ctorParameters = () => [
{ type: MatDialog },
{ type: FeedbackService },
{ type: Overlay }
];
FeedbackDirective.propDecorators = {
title: [{ type: Input }],
placeholder: [{ type: Input }],
editTip: [{ type: Input }],
checkboxLabel: [{ type: Input }],
cancelLabel: [{ type: Input }],
sendLabel: [{ type: Input }],
moveToolbarTip: [{ type: Input }],
drawRectTip: [{ type: Input }],
highlightTip: [{ type: Input }],
hideTip: [{ type: Input }],
editDoneLabel: [{ type: Input }],
send: [{ type: Output }],
onClick: [{ type: HostListener, args: ['click',] }]
};
if (false) {
/** @type {?} */
FeedbackDirective.prototype.overlay;
/** @type {?} */
FeedbackDirective.prototype.title;
/** @type {?} */
FeedbackDirective.prototype.placeholder;
/** @type {?} */
FeedbackDirective.prototype.editTip;
/** @type {?} */
FeedbackDirective.prototype.checkboxLabel;
/** @type {?} */
FeedbackDirective.prototype.cancelLabel;
/** @type {?} */
FeedbackDirective.prototype.sendLabel;
/** @type {?} */
FeedbackDirective.prototype.moveToolbarTip;
/** @type {?} */
FeedbackDirective.prototype.drawRectTip;
/** @type {?} */
FeedbackDirective.prototype.highlightTip;
/** @type {?} */
FeedbackDirective.prototype.hideTip;
/** @type {?} */
FeedbackDirective.prototype.editDoneLabel;
/** @type {?} */
FeedbackDirective.prototype.send;
/** @type {?} */
FeedbackDirective.prototype.dialogRef;
/** @type {?} */
FeedbackDirective.prototype.feedbackService;
}
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZmVlZGJhY2suZGlyZWN0aXZlLmpzIiwic291cmNlUm9vdCI6Im5nOi8vbmctZmVlZGJhY2svIiwic291cmNlcyI6WyJsaWIvZmVlZGJhY2suZGlyZWN0aXZlLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiI7Ozs7QUFBQSxPQUFPLEVBQUMsU0FBUyxFQUFFLFlBQVksRUFBRSxZQUFZLEVBQUUsTUFBTSxFQUFFLEtBQUssRUFBUyxNQUFNLGVBQWUsQ0FBQztBQUMzRixPQUFPLEVBQUMsU0FBUyxFQUFDLE1BQU0sbUJBQW1CLENBQUM7QUFDNUMsT0FBTyxFQUFDLHVCQUF1QixFQUFDLE1BQU0sNkNBQTZDLENBQUM7QUFDcEYsT0FBTyxFQUFDLGVBQWUsRUFBQyxNQUFNLG9CQUFvQixDQUFDO0FBQ25ELE9BQU8sRUFBQyxPQUFPLEVBQUMsTUFBTSxzQkFBc0IsQ0FBQztBQUc3QyxNQUFNOzs7Ozs7Z0JBZXVCLFNBQW9CLEVBQVUsZUFBZ0MsRUFBRSxPQUFnQjtRQUFoRixjQUFTLEdBQVQsU0FBUyxDQUFXO1FBQVUsb0JBQWUsR0FBZixlQUFlLENBQWlCO3FCQWJoRSxlQUFlOzJCQUNULHlDQUF5Qzt1QkFDckQsaUNBQWlDOzZCQUMzQixvQkFBb0I7MkJBQ3RCLFFBQVE7eUJBQ1YsTUFBTTs4QkFDRCxjQUFjOzJCQUNqQix1RUFBdUU7NEJBQ3RFLGtCQUFrQjt1QkFDdkIscUJBQXFCOzZCQUNmLE1BQU07b0JBQ1AsSUFBSSxZQUFZLEVBQVU7UUFHaEQsSUFBSSxDQUFDLGVBQWUsQ0FBQyxTQUFTLENBQUMsU0FBUyxDQUN0QyxDQUFDLFFBQVEsRUFBRSxFQUFFO1lBQ1gsSUFBSSxDQUFDLElBQUksQ0FBQyxJQUFJLENBQUMsUUFBUSxDQUFDLENBQUM7U0FDMUIsQ0FDRixDQUFDO1FBQ0YsSUFBSSxDQUFDLE9BQU8sR0FBRyxPQUFPLENBQUM7Ozs7O0lBSWxCLE9BQU87UUFDWixJQUFJLENBQUMsa0JBQWtCLEVBQUUsQ0FBQztLQUMzQjs7OztJQUVNLGtCQUFrQjtRQUN2QixJQUFJLENBQUMsZUFBZSxDQUFDLG9CQUFvQixFQUFFLENBQUM7O1FBQzVDLE1BQU0sU0FBUyxHQUFHLElBQUksQ0FBQyxTQUFTLENBQUMsSUFBSSxDQUFDLHVCQUF1QixFQUFFO1lBQzdELFVBQVUsRUFBRSxnQkFBZ0I7WUFDNUIsYUFBYSxFQUFFLGdCQUFnQjtZQUMvQixZQUFZLEVBQUUsSUFBSTtZQUNsQixNQUFNLEVBQUUsTUFBTTtZQUNkLEtBQUssRUFBRSxNQUFNO1lBQ2IsY0FBYyxFQUFFLElBQUksQ0FBQyxPQUFPLENBQUMsZ0JBQWdCLENBQUMsVUFBVSxFQUFFO1NBQzNELENBQUMsQ0FBQzs7Ozs7SUFHTCxRQUFRO1FBQ04sSUFBSSxDQUFDLGVBQWUsQ0FBQyxnQkFBZ0IsR0FBRztZQUN0QyxLQUFLLEVBQUUsSUFBSSxDQUFDLEtBQUs7WUFDakIsV0FBVyxFQUFFLElBQUksQ0FBQyxXQUFXO1lBQzdCLE9BQU8sRUFBRSxJQUFJLENBQUMsT0FBTztZQUNyQixhQUFhLEVBQUUsSUFBSSxDQUFDLGFBQWE7WUFDakMsV0FBVyxFQUFFLElBQUksQ0FBQyxXQUFXO1lBQzdCLFNBQVMsRUFBRSxJQUFJLENBQUMsU0FBUztZQUN6QixjQUFjLEVBQUUsSUFBSSxDQUFDLGNBQWM7WUFDbkMsV0FBVyxFQUFFLElBQUksQ0FBQyxXQUFXO1lBQzdCLFlBQVksRUFBRSxJQUFJLENBQUMsWUFBWTtZQUMvQixPQUFPLEVBQUUsSUFBSSxDQUFDLE9BQU87WUFDckIsYUFBYSxFQUFFLElBQUksQ0FBQyxhQUFhO1NBQ2xDLENBQUM7S0FDSDs7O1lBeERGLFNBQVMsU0FBQyxFQUFDLFFBQVEsRUFBRSxZQUFZLEVBQUM7Ozs7WUFMM0IsU0FBUztZQUVULGVBQWU7WUFDZixPQUFPOzs7b0JBS1osS0FBSzswQkFDTCxLQUFLO3NCQUNMLEtBQUs7NEJBQ0wsS0FBSzswQkFDTCxLQUFLO3dCQUNMLEtBQUs7NkJBQ0wsS0FBSzswQkFDTCxLQUFLOzJCQUNMLEtBQUs7c0JBQ0wsS0FBSzs0QkFDTCxLQUFLO21CQUNMLE1BQU07c0JBV04sWUFBWSxTQUFDLE9BQU8iLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQge0RpcmVjdGl2ZSwgSG9zdExpc3RlbmVyLCBFdmVudEVtaXR0ZXIsIE91dHB1dCwgSW5wdXQsIE9uSW5pdH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XHJcbmltcG9ydCB7TWF0RGlhbG9nfSBmcm9tICdAYW5ndWxhci9tYXRlcmlhbCc7XHJcbmltcG9ydCB7RmVlZGJhY2tEaWFsb2dDb21wb25lbnR9IGZyb20gJy4vZmVlZGJhY2stZGlhbG9nL2ZlZWRiYWNrLWRpYWxvZy5jb21wb25lbnQnO1xyXG5pbXBvcnQge0ZlZWRiYWNrU2VydmljZX0gZnJvbSAnLi9mZWVkYmFjay5zZXJ2aWNlJztcclxuaW1wb3J0IHtPdmVybGF5fSBmcm9tICdAYW5ndWxhci9jZGsvb3ZlcmxheSc7XHJcblxyXG5ARGlyZWN0aXZlKHtzZWxlY3RvcjogJ1tmZWVkYmFja10nfSlcclxuZXhwb3J0IGNsYXNzIEZlZWRiYWNrRGlyZWN0aXZlIGltcGxlbWVudHMgT25Jbml0IHtcclxuICBwcml2YXRlIG92ZXJsYXk6IE92ZXJsYXk7XHJcbiAgQElucHV0KCkgdGl0bGU6IHN0cmluZyA9ICdTZW5kIGZlZWRiYWNrJztcclxuICBASW5wdXQoKSBwbGFjZWhvbGRlcjogc3RyaW5nID0gJ0Rlc2NyaWJlIHlvdXIgaXNzdWUgb3Igc2hhcmUgeW91ciBpZGVhcyc7XHJcbiAgQElucHV0KCkgZWRpdFRpcCA9ICdDbGljayB0byBoaWdobGlnaHQgb3IgaGlkZSBpbmZvJztcclxuICBASW5wdXQoKSBjaGVja2JveExhYmVsID0gJ0luY2x1ZGUgc2NyZWVuc2hvdCc7XHJcbiAgQElucHV0KCkgY2FuY2VsTGFiZWwgPSAnQ0FOQ0VMJztcclxuICBASW5wdXQoKSBzZW5kTGFiZWwgPSAnU0VORCc7XHJcbiAgQElucHV0KCkgbW92ZVRvb2xiYXJUaXAgPSAnbW92ZSB0b29sYmFyJztcclxuICBASW5wdXQoKSBkcmF3UmVjdFRpcCA9ICdEcmF3IHVzaW5nIHllbGxvdyB0byBoaWdobGlnaHQgaXNzdWVzIG9yIGJsYWNrIHRvIGhpZGUgc2Vuc2l0aXZlIGluZm8nO1xyXG4gIEBJbnB1dCgpIGhpZ2hsaWdodFRpcCA9ICdoaWdobGlnaHQgaXNzdWVzJztcclxuICBASW5wdXQoKSBoaWRlVGlwID0gJ2hpZGUgc2Vuc2l0aXZlIGluZm8nO1xyXG4gIEBJbnB1dCgpIGVkaXREb25lTGFiZWwgPSAnRE9ORSc7XHJcbiAgQE91dHB1dCgpIHB1YmxpYyBzZW5kID0gbmV3IEV2ZW50RW1pdHRlcjxvYmplY3Q+KCk7XHJcblxyXG4gIHB1YmxpYyBjb25zdHJ1Y3Rvcihwcml2YXRlIGRpYWxvZ1JlZjogTWF0RGlhbG9nLCBwcml2YXRlIGZlZWRiYWNrU2VydmljZTogRmVlZGJhY2tTZXJ2aWNlLCBvdmVybGF5OiBPdmVybGF5KSB7XHJcbiAgICB0aGlzLmZlZWRiYWNrU2VydmljZS5mZWVkYmFjayQuc3Vic2NyaWJlKFxyXG4gICAgICAoZmVlZGJhY2spID0+IHtcclxuICAgICAgICB0aGlzLnNlbmQuZW1pdChmZWVkYmFjayk7XHJcbiAgICAgIH1cclxuICAgICk7XHJcbiAgICB0aGlzLm92ZXJsYXkgPSBvdmVybGF5O1xyXG4gIH1cclxuXHJcbiAgQEhvc3RMaXN0ZW5lcignY2xpY2snKVxyXG4gIHB1YmxpYyBvbkNsaWNrKCkge1xyXG4gICAgdGhpcy5vcGVuRmVlZGJhY2tEaWFsb2coKTtcclxuICB9XHJcblxyXG4gIHB1YmxpYyBvcGVuRmVlZGJhY2tEaWFsb2coKSB7XHJcbiAgICB0aGlzLmZlZWRiYWNrU2VydmljZS5pbml0U2NyZWVuc2hvdENhbnZhcygpO1xyXG4gICAgY29uc3QgZGlhbG9nUmVmID0gdGhpcy5kaWFsb2dSZWYub3BlbihGZWVkYmFja0RpYWxvZ0NvbXBvbmVudCwge1xyXG4gICAgICBwYW5lbENsYXNzOiAnZmVlZGJhY2tEaWFsb2cnLFxyXG4gICAgICBiYWNrZHJvcENsYXNzOiAnZGlhbG9nQmFja0Ryb3AnLFxyXG4gICAgICBkaXNhYmxlQ2xvc2U6IHRydWUsXHJcbiAgICAgIGhlaWdodDogJ2F1dG8nLFxyXG4gICAgICB3aWR0aDogJ2F1dG8nLFxyXG4gICAgICBzY3JvbGxTdHJhdGVneTogdGhpcy5vdmVybGF5LnNjcm9sbFN0cmF0ZWdpZXMucmVwb3NpdGlvbigpXHJcbiAgICB9KTtcclxuICB9XHJcblxyXG4gIG5nT25Jbml0KCk6IHZvaWQge1xyXG4gICAgdGhpcy5mZWVkYmFja1NlcnZpY2UuaW5pdGlhbFZhcmlhYmxlcyA9IHtcclxuICAgICAgdGl0bGU6IHRoaXMudGl0bGUsXHJcbiAgICAgIHBsYWNlaG9sZGVyOiB0aGlzLnBsYWNlaG9sZGVyLFxyXG4gICAgICBlZGl0VGlwOiB0aGlzLmVkaXRUaXAsXHJcbiAgICAgIGNoZWNrYm94TGFiZWw6IHRoaXMuY2hlY2tib3hMYWJlbCxcclxuICAgICAgY2FuY2VsTGFiZWw6IHRoaXMuY2FuY2VsTGFiZWwsXHJcbiAgICAgIHNlbmRMYWJlbDogdGhpcy5zZW5kTGFiZWwsXHJcbiAgICAgIG1vdmVUb29sYmFyVGlwOiB0aGlzLm1vdmVUb29sYmFyVGlwLFxyXG4gICAgICBkcmF3UmVjdFRpcDogdGhpcy5kcmF3UmVjdFRpcCxcclxuICAgICAgaGlnaGxpZ2h0VGlwOiB0aGlzLmhpZ2hsaWdodFRpcCxcclxuICAgICAgaGlkZVRpcDogdGhpcy5oaWRlVGlwLFxyXG4gICAgICBlZGl0RG9uZUxhYmVsOiB0aGlzLmVkaXREb25lTGFiZWxcclxuICAgIH07XHJcbiAgfVxyXG5cclxufVxyXG4iXX0=