angular2-fontawesome
Version:
Angular 5 Component/Directive for Fontawesome
141 lines (140 loc) • 5.55 kB
JavaScript
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
var core_1 = require("@angular/core");
var core_2 = require("@angular/core");
var core_3 = require("@angular/core");
var FA_COMPONENT_TEMPLATE = "\n <i [ngClass]=\"classList\"></i>\n";
var FaComponent = /** @class */ (function () {
function FaComponent(el) {
// TODO (travelist): Support for fa-li selector
// if (el.nativeElement.tagName == 'FA')
// else this.classList = ['fa', 'fa-li']
this.classList = ['fa'];
}
FaComponent.prototype.ngOnChanges = function (changes) {
for (var key in changes) {
var previousValue = changes[key].previousValue;
var currentValue = changes[key].currentValue;
switch (key) {
case 'name':
this.removeFaClass("fa-" + previousValue);
this.addFaClass("fa-" + currentValue);
break;
case 'alt':
// TODO(travelist): Write code for the alt parameter
break;
case 'size':
if (FaComponent.sizeValidator.test(currentValue)) {
if (previousValue === 1) {
this.removeFaClass('fa-lg');
}
else {
this.removeFaClass("fa-" + previousValue + "x");
}
if (currentValue === 1) {
this.classList.push('fa-lg');
}
else {
this.classList.push("fa-" + currentValue + "x");
}
}
break;
case 'stack':
if (FaComponent.sizeValidator.test(currentValue)) {
this.removeFaClass("fa-stack-" + previousValue + "x");
this.addFaClass("fa-stack-" + currentValue + "x");
}
break;
case 'flip':
if (FaComponent.flipValidator.test(currentValue)) {
this.removeFaClass("fa-flip-" + previousValue);
this.addFaClass("fa-flip-" + currentValue);
}
break;
case 'pull':
if (FaComponent.pullValidator.test(currentValue)) {
this.removeFaClass("fa-pull-" + previousValue);
this.addFaClass("fa-pull-" + currentValue);
}
break;
case 'rotate':
if (FaComponent.rotateValidator.test(currentValue)) {
this.removeFaClass("fa-rotate-" + previousValue);
this.addFaClass("fa-rotate-" + currentValue);
}
break;
case 'border':
if (currentValue) {
this.addFaClass('fa-border');
}
else {
this.removeFaClass('fa-border');
}
break;
case 'spin':
if (currentValue) {
this.addFaClass('fa-spin');
}
else {
this.removeFaClass('fa-spin');
}
break;
case 'fw':
if (currentValue) {
this.addFaClass('fa-fw');
}
else {
this.removeFaClass('fa-fw');
}
break;
case 'inverse':
if (currentValue) {
this.addFaClass('fa-inverse');
}
else {
this.removeFaClass('fa-inverse');
}
break;
}
}
};
FaComponent.prototype.addFaClass = function (className) {
// better to check uniqueness
this.classList.push(className);
};
FaComponent.prototype.removeFaClass = function (className) {
var index;
if ((index = this.classList.indexOf(className)) >= 0) {
this.classList.splice(index, 1);
}
};
FaComponent.sizeValidator = /[1-5]/;
FaComponent.flipValidator = /['horizontal'|'vertical']/;
FaComponent.pullValidator = /['right'|'left']/;
FaComponent.rotateValidator = /[90|180|270]/;
FaComponent.decorators = [
{ type: core_1.Component, args: [{
selector: 'fa',
template: FA_COMPONENT_TEMPLATE
},] },
];
/** @nocollapse */
FaComponent.ctorParameters = function () { return [
{ type: core_2.ElementRef, },
]; };
FaComponent.propDecorators = {
'name': [{ type: core_3.Input },],
'alt': [{ type: core_3.Input },],
'size': [{ type: core_3.Input },],
'stack': [{ type: core_3.Input },],
'flip': [{ type: core_3.Input },],
'pull': [{ type: core_3.Input },],
'rotate': [{ type: core_3.Input },],
'border': [{ type: core_3.Input },],
'spin': [{ type: core_3.Input },],
'fw': [{ type: core_3.Input },],
'inverse': [{ type: core_3.Input },],
};
return FaComponent;
}());
exports.FaComponent = FaComponent;