my-test123
Version:
A planner front-end for Fabric8.
349 lines • 14.8 kB
JavaScript
import { Observable } from 'rxjs/Observable';
import { Component, EventEmitter, HostListener, Input, Output, ViewChild } from '@angular/core';
import { animate, state, style, transition, trigger } from '@angular/animations';
import { ActivatedRoute } from '@angular/router';
import { Location } from '@angular/common';
import { Router } from '@angular/router';
import { cloneDeep } from 'lodash';
import { Spaces } from 'ngx-fabric8-wit';
import { Broadcaster, Logger } from 'ngx-base';
import { AuthenticationService, UserService } from 'ngx-login-client';
import { WorkItemService } from './../../services/work-item.service';
//ngrx stuff
import { Store } from '@ngrx/store';
import * as CommentActions from './../../actions/comment.actions';
var WorkItemQuickPreviewComponent = /** @class */ (function () {
function WorkItemQuickPreviewComponent(auth, broadcaster, route, location, logger, router, spaces, store, userService, workItemService) {
this.auth = auth;
this.broadcaster = broadcaster;
this.route = route;
this.location = location;
this.logger = logger;
this.router = router;
this.spaces = spaces;
this.store = store;
this.userService = userService;
this.workItemService = workItemService;
this.selectedLabels = [];
this.selectedAssignees = [];
this.onOpenSelector = new EventEmitter();
this.onCloseSelector = new EventEmitter();
this.spaceSource = this.store
.select('listPage')
.select('space')
.filter(function (s) { return !!s; });
this.areaSource = this.store
.select('listPage')
.select('areas')
.filter(function (a) { return !!a; });
this.iterationSource = this.store
.select('listPage')
.select('iterations')
.filter(function (i) { return !!i.length; });
this.labelSource = this.store
.select('listPage')
.select('labels')
.filter(function (l) { return l !== null; });
this.collaboratorSource = this.store
.select('listPage')
.select('collaborators')
.filter(function (c) { return !!c.length; });
this.workItemStateSource = this.store
.select('listPage')
.select('workItemStates')
.filter(function (wis) { return !!wis.length; });
this.workItemCommentSource = this.store
.select('detailPage')
.select('comments');
this.collaborators = [];
this.areasUI = [];
this.iterationUI = [];
this.loggedIn = false;
this.headerEditable = false;
this.searchAssignee = false;
this.panelState = 'out';
this.areas = [];
this.iterations = [];
this.eventListeners = [];
this.queryParams = {};
this.labels = [];
this.workItemStates = [];
this.comments = [];
this.activeAddAssignee = false;
this.searchValue = '';
}
WorkItemQuickPreviewComponent.prototype.onClick = function (targetElement, assigned_user) {
if (this.assignee) {
var clickedInsidePopup = this.assignee.nativeElement.contains(targetElement);
if (!clickedInsidePopup && !assigned_user) {
this.cancelAssignment();
}
}
};
WorkItemQuickPreviewComponent.prototype.ngOnInit = function () {
var _this = this;
this.loggedIn = this.auth.isLoggedIn();
this.listenToEvents();
Observable.combineLatest(this.spaceSource, this.areaSource, this.iterationSource, this.labelSource, this.collaboratorSource, this.workItemStateSource).take(1).subscribe(function (_a) {
var spaceSource = _a[0], areaSource = _a[1], iterationSource = _a[2], labelSource = _a[3], collaboratorSource = _a[4], workItemStateSource = _a[5];
_this.collaborators = collaboratorSource.slice();
_this.areasUI = areaSource.slice();
_this.iterationUI = iterationSource.slice();
_this.labels = labelSource.slice();
_this.workItemStates = workItemStateSource.slice();
_this.workItemCommentSource.subscribe(function (comments) {
_this.comments = comments.slice();
});
});
};
WorkItemQuickPreviewComponent.prototype.ngOnDestroy = function () {
console.log('Destroying all the listeners in detail component');
this.eventListeners.forEach(function (subscriber) { return subscriber.unsubscribe(); });
};
WorkItemQuickPreviewComponent.prototype.openPreview = function (workitem) {
if (!workitem)
return;
this.workItem = workitem;
this.areas = this.extractAreaKeyValue(this.areasUI);
this.iterations = this.extractIterationKeyValue(this.iterationUI);
this.store.dispatch(new CommentActions.Get(this.workItem.commentLink));
this.panelState = 'in';
};
WorkItemQuickPreviewComponent.prototype.closePreview = function () {
var _this = this;
this.panelState = 'out';
this.eventListeners.forEach(function (subscriber) { return subscriber.unsubscribe(); });
setTimeout(function () {
_this.workItem = null;
}, 400);
};
WorkItemQuickPreviewComponent.prototype.showPreview = function (event) {
var rawText = event.rawText;
var callBack = event.callBack;
this.workItemService.renderMarkDown(rawText)
.subscribe(function (renderedHtml) {
callBack(rawText, renderedHtml);
});
};
WorkItemQuickPreviewComponent.prototype.closeHeader = function () {
this.headerEditable = false;
};
WorkItemQuickPreviewComponent.prototype.closeDetails = function () {
};
WorkItemQuickPreviewComponent.prototype.listenToEvents = function () {
var _this = this;
this.eventListeners.push(this.broadcaster.on('logout')
.subscribe(function (message) {
_this.loggedIn = false;
_this.loggedInUser = null;
}));
if (this.loggedIn) {
this.eventListeners.push(this.userService.loggedInUser.subscribe(function (user) {
_this.loggedInUser = user;
}));
}
var id = null;
this.eventListeners.push(this.spaces.current.subscribe(function (space) {
_this.closePreview();
}));
};
WorkItemQuickPreviewComponent.prototype.preventDef = function (event) {
event.preventDefault();
};
WorkItemQuickPreviewComponent.prototype.activeSearchAssignee = function () {
};
WorkItemQuickPreviewComponent.prototype.cancelAssignment = function () {
this.searchAssignee = false;
};
WorkItemQuickPreviewComponent.prototype.closeUserRestFields = function () {
this.searchAssignee = false;
if (this.workItem && this.workItem.id != null) {
this.headerEditable = false;
}
if (this.areaSelectbox && this.areaSelectbox.isOpen()) {
this.areaSelectbox.close();
}
if (this.iterationSelectbox && this.iterationSelectbox.isOpen()) {
this.iterationSelectbox.close();
}
};
WorkItemQuickPreviewComponent.prototype.extractAreaKeyValue = function (areas) {
var result = [];
var selectedFound = false;
var selectedAreaId;
if (this.workItem.area && this.workItem.area.id) {
selectedAreaId = this.workItem.area.id;
}
for (var i = 0; i < areas.length; i++) {
result.push({
key: areas[i].id,
value: (areas[i].parentPathResolved !== '/' ? areas[i].parentPathResolved : '') + '/' + areas[i].name,
selected: selectedAreaId === areas[i].id ? true : false,
cssLabelClass: undefined
});
if (selectedAreaId === areas[i].id) {
selectedFound = true;
}
}
;
return result;
};
WorkItemQuickPreviewComponent.prototype.extractIterationKeyValue = function (iterations) {
var result = [];
var selectedFound = false;
var selectedIterationId;
if (this.workItem.iteration && this.workItem.iteration.id) {
selectedIterationId = this.workItem.iteration.id;
}
for (var i = 0; i < iterations.length; i++) {
result.push({
key: iterations[i].id,
value: (iterations[i].resolvedParentPath !== '/' ? iterations[i].resolvedParentPath : '') + '/' + iterations[i].name,
selected: selectedIterationId === iterations[i].id ? true : false,
cssLabelClass: undefined
});
if (selectedIterationId === iterations[i].id) {
selectedFound = true;
}
}
;
return result;
};
WorkItemQuickPreviewComponent.prototype.focusArea = function () {
this.iterationSelectbox.close();
this.cancelAssignment();
this.areas = this.areas.concat([
{
key: '0',
value: '',
selected: false,
cssLabelClass: 'spinner spinner-sm spinner-inline'
}
]);
this.areas = this.extractAreaKeyValue(this.areasUI);
};
WorkItemQuickPreviewComponent.prototype.focusIteration = function () {
this.areaSelectbox.close();
this.cancelAssignment();
this.iterations = this.iterations.concat([
{
key: '0',
value: '',
selected: false,
cssLabelClass: 'spinner spinner-sm spinner-inline'
}
]);
this.iterations = this.extractIterationKeyValue(this.iterationUI);
};
WorkItemQuickPreviewComponent.prototype.constructUrl = function (workItem) {
return this.router.url.split('plan')[0] + 'plan/detail/' + workItem.number;
};
WorkItemQuickPreviewComponent.prototype.onLabelClick = function (event) {
var params = {
label: event.attributes.name
};
// Prepare navigation extra with query params
var navigationExtras = {
queryParams: params
};
// Navigated to filtered view
this.router.navigate([], navigationExtras);
};
WorkItemQuickPreviewComponent.prototype.onKeyEvent = function (event) {
event = (event || window.event);
// for ESC key handling
if (event.keyCode == 27) {
try {
event.preventDefault(); //Non-IE
}
catch (x) {
event.returnValue = false; //IE
}
if (this.headerEditable) {
this.closeHeader();
}
else if (this.searchAssignee) {
this.searchAssignee = false;
}
else if (this.areaSelectbox && this.areaSelectbox.isOpen()) {
this.areaSelectbox.close();
}
else if (this.iterationSelectbox && this.iterationSelectbox.isOpen()) {
this.iterationSelectbox.close();
}
else {
this.closePreview();
}
}
};
WorkItemQuickPreviewComponent.prototype.onOpen = function (event) {
this.onOpenSelector.emit('open');
};
WorkItemQuickPreviewComponent.prototype.onClose = function (event) {
this.onCloseSelector.emit(cloneDeep(this.selectedLabels));
};
WorkItemQuickPreviewComponent.prototype.openDropdown = function () {
this.dropdownRef.openDropdown();
};
WorkItemQuickPreviewComponent.prototype.closeDropdown = function () {
this.dropdownRef.closeDropdown();
};
WorkItemQuickPreviewComponent.prototype.closeAddAssignee = function () {
this.activeAddAssignee = false;
};
WorkItemQuickPreviewComponent.decorators = [
{ type: Component, args: [{
selector: 'work-item-preview',
template: require('./work-item-quick-preview.component.html'),
styles: [require('./work-item-quick-preview.component.css').toString()],
animations: [
trigger('slideInOut', [
state('in', style({
transform: 'translateX(5px)',
left: 'auto'
})),
state('out', style({
transform: 'translateX(100%)',
left: '100%'
})),
transition('in => out', animate('200ms ease-in-out')),
transition('out => in', animate('200ms ease-in-out'))
]),
]
},] },
];
/** @nocollapse */
WorkItemQuickPreviewComponent.ctorParameters = function () { return [
{ type: AuthenticationService, },
{ type: Broadcaster, },
{ type: ActivatedRoute, },
{ type: Location, },
{ type: Logger, },
{ type: Router, },
{ type: Spaces, },
{ type: Store, },
{ type: UserService, },
{ type: WorkItemService, },
]; };
WorkItemQuickPreviewComponent.propDecorators = {
'title': [{ type: ViewChild, args: ['title',] },],
'userList': [{ type: ViewChild, args: ['userList',] },],
'dropdownButton': [{ type: ViewChild, args: ['dropdownButton',] },],
'areaSelectbox': [{ type: ViewChild, args: ['areaSelectbox',] },],
'iterationSelectbox': [{ type: ViewChild, args: ['iterationSelectbox',] },],
'labelSelector': [{ type: ViewChild, args: ['labelSelector',] },],
'assignee': [{ type: ViewChild, args: ['assignee',] },],
'labelnameInput': [{ type: ViewChild, args: ['labelname',] },],
'dropdownRef': [{ type: ViewChild, args: ['dropdown',] },],
'AssigneeSelector': [{ type: ViewChild, args: ['AssigneeSelector',] },],
'selectedLabels': [{ type: Input },],
'selectedAssignees': [{ type: Input },],
'onOpenSelector': [{ type: Output },],
'onCloseSelector': [{ type: Output },],
'onClick': [{ type: HostListener, args: ['document:click', ['$event.target', '$event.target.classList.contains(' + '"assigned_user"' + ')'],] },],
'onKeyEvent': [{ type: HostListener, args: ['window:keydown', ['$event'],] },],
};
return WorkItemQuickPreviewComponent;
}());
export { WorkItemQuickPreviewComponent };
//# sourceMappingURL=work-item-quick-preview.component.js.map