ng2-json-editor
Version:
Angular2 component for editing large json documents
96 lines • 5.56 kB
JavaScript
/*
* This file is part of ng2-json-editor.
* Copyright (C) 2017 CERN.
*
* ng2-json-editor is free software; you can redistribute it and/or
* modify it under the terms of the GNU General Public License as
* published by the Free Software Foundation; either version 2 of the
* License, or (at your option) any later version.
*
* ng2-json-editor is distributed in the hope that it will be useful, but
* WITHOUT ANY WARRANTY; without even the implied warranty of
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU
* General Public License for more details.
*
* You should have received a copy of the GNU General Public License
* along with ng2-json-editor; if not, write to the Free Software Foundation, Inc.,
* 59 Temple Place, Suite 330, Boston, MA 02111-1307, USA.
* In applying this license, CERN does not
* waive the privileges and immunities granted to it by virtue of its status
* as an Intergovernmental Organization or submit itself to any jurisdiction.
*/
var __extends = (this && this.__extends) || (function () {
var extendStatics = Object.setPrototypeOf ||
({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
return function (d, b) {
extendStatics(d, b);
function __() { this.constructor = d; }
d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
};
})();
import { Component, ChangeDetectionStrategy, Input, ChangeDetectorRef } from '@angular/core';
import { AbstractSubscriberComponent } from '../../abstract-subscriber';
import { DomUtilService, PathUtilService, ProblemsService } from '../../shared/services';
var ProblemsConsoleTabComponent = (function (_super) {
__extends(ProblemsConsoleTabComponent, _super);
function ProblemsConsoleTabComponent(domUtilService, pathUtilService, problemsService, changeDetectorRef) {
var _this = _super.call(this) || this;
_this.domUtilService = domUtilService;
_this.pathUtilService = pathUtilService;
_this.problemsService = problemsService;
_this.changeDetectorRef = changeDetectorRef;
_this.problemCount = 0;
return _this;
}
ProblemsConsoleTabComponent.prototype.ngOnInit = function () {
var _this = this;
this.problemsService.externalCategorizedProblems$
.map(function (categorizedProblemMap) { return categorizedProblemMap[_this.problemType]; })
.takeUntil(this.isDestroyed)
.subscribe(function (problemMap) {
_this.externalProblemMap = problemMap;
_this.changeDetectorRef.markForCheck();
});
this.problemsService.internalCategorizedProblems$
.map(function (categorizedProblemMap) { return categorizedProblemMap[_this.problemType]; })
.takeUntil(this.isDestroyed)
.subscribe(function (problemMap) {
_this.internalProblemMap = problemMap;
_this.changeDetectorRef.markForCheck();
});
// TODO: create WarningsConsoleTabComponent with same template to avoid `if`
var problemCount$ = this.problemType === 'errors' ? this.problemsService.errorCount$ : this.problemsService.warningCount$;
problemCount$
.takeUntil(this.isDestroyed)
.subscribe(function (problemCount) {
_this.problemCount = problemCount;
});
this.iconClassName = this.problemType === 'errors' ? 'fa fa-times' : 'fa fa-exclamation-triangle';
};
ProblemsConsoleTabComponent.prototype.focusAndSelectPath = function (path) {
this.domUtilService.focusAndSelectFirstEditableChildById(path, true);
};
return ProblemsConsoleTabComponent;
}(AbstractSubscriberComponent));
export { ProblemsConsoleTabComponent };
ProblemsConsoleTabComponent.decorators = [
{ type: Component, args: [{
selector: 'problems-console-tab',
styles: [".list-group-item:hover { background-color: #faebcc; } .list-group-item:hover > .title { text-decoration: underline; } .list-group-item:hover.nested { background-color: #e2dcd1; } .list-group-item .title { cursor: pointer; color: #0074D9; } ",
".fa-exclamation-triangle { color: #f1c40f; } .fa-times { color: #D14024; } "],
template: "<ng-template tabHeading> <i [ngClass]=\"iconClassName\"></i> {{problemType | titlecase}} <span class=\"badge\">{{problemCount}}</span> </ng-template> <ul class=\"list-group\"> <ng-container *ngFor=\"let key of internalProblemMap | keys\"> <li *ngFor=\"let problem of internalProblemMap[key]\" class=\"list-group-item\" (click)=\"focusAndSelectPath(key)\"> <i [ngClass]=\"iconClassName\"></i> {{ problem.message }} </li> </ng-container> <ng-container *ngFor=\"let key of externalProblemMap | keys\"> <li *ngFor=\"let problem of externalProblemMap[key]\" class=\"list-group-item\" (click)=\"focusAndSelectPath(key)\"> <i [ngClass]=\"iconClassName\"></i> {{ problem.message }} </li> </ng-container> </ul>",
changeDetection: ChangeDetectionStrategy.OnPush
},] },
];
/** @nocollapse */
ProblemsConsoleTabComponent.ctorParameters = function () { return [
{ type: DomUtilService, },
{ type: PathUtilService, },
{ type: ProblemsService, },
{ type: ChangeDetectorRef, },
]; };
ProblemsConsoleTabComponent.propDecorators = {
'problemType': [{ type: Input },],
};
//# sourceMappingURL=problems-console-tab.component.js.map