134 lines
6.6 KiB
JavaScript
134 lines
6.6 KiB
JavaScript
"use strict";
|
|
(function () {
|
|
'use strict';
|
|
angular.module('myitsmApp')
|
|
.directive('textAreaExpand', ['events', '$timeout',
|
|
function (events, $timeout) {
|
|
return {
|
|
restrict: 'E',
|
|
templateUrl: 'views/common/text-area-expand-directive.html',
|
|
replace: true,
|
|
scope: {
|
|
ticket: '=',
|
|
fieldName: '=',
|
|
context: '=',
|
|
editMode: '=',
|
|
isRequired: '=?',
|
|
isEditable: '=?',
|
|
fieldValueChange: '&',
|
|
limit: '=?'
|
|
},
|
|
link: function (scope, element) {
|
|
var container = element.find('.ticket-summary-content__text'), textAreaObject = container.find('textarea.content');
|
|
scope.name = scope.fieldName === 'custom' ? 'value' : scope.fieldName;
|
|
if (!_.isBoolean(scope.isRequired)) {
|
|
scope.isRequired = false;
|
|
}
|
|
if (!_.isBoolean(scope.isEditable)) {
|
|
scope.isEditable = true;
|
|
}
|
|
function init() {
|
|
if (_.isUndefined(scope.ticket[scope.name])) {
|
|
scope.fieldData = '';
|
|
scope.ticket[scope.name] = '';
|
|
}
|
|
else {
|
|
scope.fieldData = scope.ticket[scope.name];
|
|
}
|
|
scope.textFieldExpanded = false;
|
|
adjustTextFieldHeight();
|
|
}
|
|
scope.viewTextFieldExpandable = function () {
|
|
var maxDescriptionHeight = 100, viewTextAreaObject = container.find('div.content');
|
|
return !scope.editMode && scope.context !== 'create'
|
|
&& (viewTextAreaObject[0] && viewTextAreaObject[0].scrollHeight > maxDescriptionHeight);
|
|
};
|
|
scope.textFieldExpandable = function () {
|
|
var maxDescriptionHeight = 100;
|
|
return !scope.editMode && scope.context !== 'create'
|
|
&& (textAreaObject[0] && textAreaObject[0].scrollHeight > maxDescriptionHeight);
|
|
};
|
|
scope.textFieldCollapsed = function () {
|
|
return !scope.textFieldExpanded && scope.textFieldExpandable();
|
|
};
|
|
scope.viewTextFieldCollapsed = function () {
|
|
return !scope.textFieldExpanded && scope.viewTextFieldExpandable();
|
|
};
|
|
scope.showMoreVisible = function () {
|
|
return !scope.textFieldExpanded && scope.viewTextFieldExpandable();
|
|
};
|
|
scope.showLessVisible = function () {
|
|
return scope.textFieldExpanded && scope.viewTextFieldExpandable();
|
|
};
|
|
scope.toggleTextField = function () {
|
|
scope.textFieldExpanded = !scope.textFieldExpanded;
|
|
$timeout(function () {
|
|
textAreaObject.scrollTop(0);
|
|
});
|
|
};
|
|
scope.$on(events.TOGGLE_EDIT_MODE, handleToggleEditMode);
|
|
scope.$on(events.DISCARD_CHANGES, handleDiscardChanges);
|
|
scope.$on(events.SAVE_CHANGES, handleSaveChanges);
|
|
function adjustTextFieldHeight() {
|
|
var scrollHeightAdjustment = 14;
|
|
$timeout(function () {
|
|
textAreaObject.height(textAreaObject[0] && textAreaObject[0].scrollHeight - scrollHeightAdjustment);
|
|
});
|
|
}
|
|
function handleToggleEditMode() {
|
|
scope.editMode = true;
|
|
adjustFieldHeight();
|
|
}
|
|
function handleSaveChanges() {
|
|
var isCustomField = (scope.fieldName === 'custom');
|
|
scope.editMode = false;
|
|
var changes = {};
|
|
if (scope.fieldData !== scope.ticket[scope.name]) {
|
|
if (scope.fieldName === 'custom') {
|
|
var customFields = {};
|
|
customFields[scope.ticket && scope.ticket.name] = scope.fieldData;
|
|
changes.customFields = customFields;
|
|
}
|
|
else {
|
|
changes[scope.fieldName] = scope.fieldData;
|
|
}
|
|
scope.ticket[scope.name] = scope.fieldData;
|
|
}
|
|
var isDraft = (scope.context === 'draft');
|
|
scope.$emit(events.SAVE_CHANGES_REQUEST, changes, isDraft, isCustomField);
|
|
if (isDraft) {
|
|
scope.$emit(events.SAVE_CHANGES_COMPLETE);
|
|
}
|
|
adjustTextFieldHeight();
|
|
}
|
|
function handleDiscardChanges() {
|
|
scope.editMode = false;
|
|
scope.fieldData = _.clone(scope.ticket[scope.name]);
|
|
adjustTextFieldHeight();
|
|
}
|
|
function adjustFieldHeight() {
|
|
var scrollHeightAdjustment = 14;
|
|
$timeout(function () {
|
|
textAreaObject.height(textAreaObject[0].scrollHeight - scrollHeightAdjustment);
|
|
});
|
|
}
|
|
scope.setFieldData = function () {
|
|
textAreaObject.css("height", "auto");
|
|
var height = textAreaObject[0].scrollHeight;
|
|
if (height > 0) {
|
|
textAreaObject.css("height", height + "px");
|
|
}
|
|
scope.ticket[scope.name] = scope.fieldData;
|
|
scope.fieldValueChange();
|
|
};
|
|
scope.$watch('ticket.value', function (value) {
|
|
if (!_.isUndefined(value) && scope.fieldData != value) {
|
|
scope.fieldData = value || '';
|
|
}
|
|
});
|
|
init();
|
|
}
|
|
};
|
|
}]);
|
|
}());
|