flash-messages-angular
Version:
Angular 2 flash messages module
80 lines • 4.34 kB
JavaScript
;
var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
return c > 3 && r && Object.defineProperty(target, key, r), r;
};
var __metadata = (this && this.__metadata) || function (k, v) {
if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
};
Object.defineProperty(exports, "__esModule", { value: true });
var core_1 = require("@angular/core");
var flash_message_1 = require("./flash-message");
var flash_messages_service_1 = require("./flash-messages.service");
var FlashMessagesComponent = /** @class */ (function () {
function FlashMessagesComponent(_flashMessagesService, _cdRef) {
this._flashMessagesService = _flashMessagesService;
this._cdRef = _cdRef;
this._defaults = {
text: 'default message',
closeOnClick: false,
showCloseBtn: false,
cssClass: ''
};
this.messages = [];
this.classes = '';
this._grayOut = false;
this._flashMessagesService.show = this.show.bind(this);
this._flashMessagesService.grayOut = this.grayOut.bind(this);
}
FlashMessagesComponent.prototype.ngOnInit = function () { };
FlashMessagesComponent.prototype.show = function (text, options) {
var _this = this;
if (options === void 0) { options = {}; }
var defaults = {
timeout: 2500,
closeOnClick: false,
showCloseBtn: false,
cssClass: '',
text: "default message"
};
for (var attrname in options) {
defaults[attrname] = options[attrname];
}
var message = new flash_message_1.FlashMessage(text, defaults.cssClass, defaults.closeOnClick, defaults.showCloseBtn);
message.timer = window.setTimeout(function () {
_this._remove(message);
_this._cdRef.detectChanges();
}, defaults.timeout);
this.messages.push(message);
this._cdRef.detectChanges();
};
FlashMessagesComponent.prototype.close = function (message) {
clearTimeout(message.timer);
this._remove(message);
this._cdRef.detectChanges();
};
FlashMessagesComponent.prototype.alertClicked = function (message) {
if (message.closeOnClick) {
this.close(message);
}
};
FlashMessagesComponent.prototype.grayOut = function (value) {
if (value === void 0) { value = false; }
this._grayOut = value;
};
FlashMessagesComponent.prototype._remove = function (message) {
this.messages = this.messages.filter(function (msg) { return msg.id !== message.id; });
};
FlashMessagesComponent = __decorate([
core_1.Component({
selector: 'flash-messages',
template: "\n <div id=\"flashMessages\" class=\"flash-messages\">\n <div id=\"grayOutDiv\" *ngIf='_grayOut && messages.length'></div>\n <div class=\"alert flash-message {{message.cssClass}}\" [ngClass]=\"{'alert-dismissible':message.showCloseBtn}\" [style.cursor]=\"message.closeOnClick?'pointer':'inherit'\" *ngFor='let message of messages' (click)=\"alertClicked(message)\">\n <button *ngIf=\"message.showCloseBtn\" type=\"button\" class=\"close\" data-dismiss=\"alert\" aria-label=\"Close\" (click)=\"close(message)\"><span aria-hidden=\"true\">×</span></button>\n <div [innerHTML]=\"message.text\"></div>\n </div> \n </div>\n "
}),
__metadata("design:paramtypes", [flash_messages_service_1.FlashMessagesService, core_1.ChangeDetectorRef])
], FlashMessagesComponent);
return FlashMessagesComponent;
}());
exports.FlashMessagesComponent = FlashMessagesComponent;
//# sourceMappingURL=flash-messages.component.js.map