Skip to content

Commit

Permalink
Feature undo/redo changes (#692)
Browse files Browse the repository at this point in the history
  • Loading branch information
@DubrovinPavel
DubrovinPavel authored Mar 23, 2020
1 parent 63b7b26 commit 73735d7
Show file tree
Hide file tree
Showing 40 changed files with 1,071 additions and 167 deletions.
45 changes: 42 additions & 3 deletions addon/components/fd-color-setting-panel.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -106,6 +106,10 @@ export default Component.extend(

const rgbaTextValue = this.hexToRGBA(this.get('textValue'));
const rgbabackgroundValue = this.hexToRGBA(this.get('backgroundValue'));
const oldText = objectModel.get(textPath);
const oldBrush = objectModel.get(brushPath);
const oldTextValue = this._getRgbaArray(oldText);
const oldBrushValue = this._getRgbaArray(oldBrush);

objectModel.set(`${textPath}.R`, rgbaTextValue[0]);
objectModel.set(`${textPath}.G`, rgbaTextValue[1]);
Expand All @@ -118,12 +122,47 @@ export default Component.extend(
objectModel.set(`${brushPath}.A`, rgbabackgroundValue[3]);

objectView.setColors();
if (!isNone(this.get('stereotypeValue'))) {
objectModel.set('stereotype', this.get('stereotypeValue'));
objectView.updateInputValue();
const oldStereotype = objectModel.get('stereotype');
const newStereotype = this.get('stereotypeValue');
if (!isNone(newStereotype)) {
objectModel.set('stereotype', newStereotype);
objectView.setInputValues();
objectView.updateRectangles();
}

this._createHistoryStep(oldTextValue, rgbaTextValue, oldBrushValue, rgbabackgroundValue, oldStereotype, newStereotype);
this.closePopup(e, true);
objectView.paper.$el.focus();
}
},

/**
Get rgba array from color JSON.
@method _getRgbaArray
*/
_getRgbaArray(colorObject) {
return A([colorObject.R, colorObject.G, colorObject.B, colorObject.A]);
},

/**
Create history step for colors/stereotype changing.
@method _createHistoryStep
*/
_createHistoryStep(oldTextValue, newTextValue, oldBrushValue, newBrushValue, oldStereotype, newStereotype) {
const graph = this.get('value.model.graph');
if (isNone(graph)) {
return;
}

let changes = A();
changes.addObject({ field: 'textColor', oldValue: oldTextValue, newValue: newTextValue });
changes.addObject({ field: 'brushColor', oldValue: oldBrushValue, newValue: newBrushValue });
if (!isNone(newStereotype)) {
changes.addObject({ field: 'stereotype', oldValue: oldStereotype, newValue: newStereotype });
}

graph.trigger('history:add', this.get('value.model').get('id'), changes);
}
});
4 changes: 2 additions & 2 deletions addon/components/fd-uml-diagram-editor.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -274,7 +274,7 @@ FdPopupActions, {
let jointjsCallback = this.get('jointjsCallback');
let newObject = jointjsCallback(x, y);
this.clearData();

return newObject;
}

Expand Down Expand Up @@ -372,7 +372,7 @@ FdPopupActions, {
if (storeCallback) {
let linkRecord = storeCallback({ startClassRepObj: newLink.get('startClassRepObj'), endClassRepObj: newLink.get('endClassRepObj') });
newLink.set({ 'repositoryObject': linkRecord });
this.paper.trigger('checkexistelements', newLink.get('objectModel'), this.paper.findViewByModel(newLink));
this.paper.trigger('checkexistelements:addstep', newLink, this.paper.findViewByModel(newLink));
}

this.clearData();
Expand Down
37 changes: 29 additions & 8 deletions addon/components/fd-uml-diagram.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -14,6 +14,7 @@ import uuid from 'npm:node-uuid';

import FdPrimitivesArraySortingMixin from '../mixins/fd-primitives-array-sorting';
import FdKeyPressLogicMixin from '../mixins/fd-uml-diagram-component/fd-keypress-logic';
import FdDiagramHistoryMixin from '../mixins/fd-uml-diagram-component/fd-diagram-history';
import FdUmlElement from '../objects/uml-primitives/fd-uml-element';
import FdUmlLink from '../objects/uml-primitives/fd-uml-link';
import {
Expand All @@ -30,7 +31,8 @@ import {
*/
export default Component.extend(
FdPrimitivesArraySortingMixin,
FdKeyPressLogicMixin, {
FdKeyPressLogicMixin,
FdDiagramHistoryMixin, {
/**
Store of current application.
Expand Down Expand Up @@ -217,6 +219,7 @@ export default Component.extend(
this._super(...arguments);

const namespace = joint.shapes;
this.set('diagramTempId', uuid.v4());
let graph = this.set('graph', new joint.dia.Graph({}, { cellNamespace: namespace , cellViewNamespace: namespace}));
let paper = this.set('paper', new joint.dia.Paper({
el: this.get('element'),
Expand Down Expand Up @@ -261,6 +264,7 @@ export default Component.extend(
paper.on('updaterepobj', this._updateRepObj, this);
paper.on('getrepobjvalues', this._getRepObjValues, this);
paper.on('checkexistelements', this._checkOnExistElements, this);
paper.on('checkexistelements:addstep', this._checkOnExistElementsAddStep, this);
paper.on('cell:highlight', this._highlighted, this);
paper.on('element:openeditform', this._elementOpenEditForm, this);
paper.on('element:openpopup', this._elementOpenPopup, this);
Expand Down Expand Up @@ -311,14 +315,15 @@ export default Component.extend(
graph.on('change:vertices', fitPaperToContent);
graph.on('remove', fitPaperToContent);
graph.on('remove', this._removeElements, this);
graph.on('history:add', this._createHistoryRecord, this);

fitPaperToContent();

this.get('fdDiagramService').on('updateJointObjectViewTriggered', this, this._updateJointObjectView);
this.get('readonlyObserver').apply(this);
},

willDestroy() {
willDestroyElement() {
this._super(...arguments);

this.get('fdDiagramService').off('updateJointObjectViewTriggered', this, this._updateJointObjectView);
Expand Down Expand Up @@ -396,7 +401,7 @@ export default Component.extend(
default:
if (this.get('currentTargetElementIsPointer')) {
var linkView = element.model.findView(this.paper);
linkView.highlight(null, { multiHighlight: e.shiftKey });
linkView.highlight(null, { multiHighlight: e.shiftKey || e.ctrlKey });
}
}
} else {
Expand Down Expand Up @@ -514,6 +519,7 @@ export default Component.extend(
*/
_addNewElement(newElement) {
if (!isNone(newElement)) {
this._createHistoryRecord(newElement.get('id'), { field: 'Add', oldValue: null, newValue: JSON.stringify(newElement.get('objectModel').get('primitive')) });
let graph = this.get('graph');
graph.addCell([newElement]);
}
Expand All @@ -539,7 +545,7 @@ export default Component.extend(
let startDragLink = this.get('startDragLink');
let newElement = startDragLink(options);
if (isNone(newElement)) {
element.highlight(null, { multiHighlight: options.e.shiftKey })
element.highlight(null, { multiHighlight: options.e.shiftKey || options.e.ctrlKey })
} else {
this.set('draggedLink', newElement);
let graph = this.get('graph');
Expand Down Expand Up @@ -766,6 +772,7 @@ export default Component.extend(
if (data.ghost) {
if (data.widthResize || data.heightResize) {
let newSize = data.ghost.size();
this._createHistoryRecord(view.model.get('id'), { field: 'size', oldValue: view.model.get('size'), newValue: newSize });
view.updateRectangles(newSize.width, newSize.height);
} else {
let shift = evt.data.shift;
Expand All @@ -782,6 +789,7 @@ export default Component.extend(
valueY = valueY > ghostMoveBorder[3] ? ghostMoveBorder[3] : valueY;
}

this._createHistoryRecord(view.model.get('id'), { field: 'position', oldValue: view.model.position(), newValue: { x: valueX, y: valueY }});
view.model.position(valueX, valueY);
}

Expand All @@ -796,6 +804,7 @@ export default Component.extend(
});

view.highlight();
paper.$el.focus();
}
},

Expand All @@ -816,8 +825,7 @@ export default Component.extend(
let store = this.get('store');
let modelName = this._getModelName(objectModel.get('primitive.$type'));

let allModels = store.peekAll(`${modelName}`);
let repositoryObject = allModels.findBy('id', repositoryObjectId.slice(1, -1));
let repositoryObject = store.peekRecord(modelName, repositoryObjectId.slice(1, -1));
if (isNone(repositoryObject)) {
return;
}
Expand Down Expand Up @@ -906,6 +914,20 @@ export default Component.extend(
return newConnectedClass;
},

/**
Find exist elements and update repository object and add history step.
@method _checkOnExistElementsAddStep
@param {Object} newLink new link.
@param {Object} view JoinJS view of this element.
@param {Boolean} isSourse flag.
*/
_checkOnExistElementsAddStep(newLink, view, isSource) {
const objectModel = newLink.get('objectModel');
this._checkOnExistElements(objectModel, view, isSource);
this._createHistoryRecord(newLink.get('id'), { field: 'Add', oldValue: null, newValue: JSON.stringify(objectModel.get('primitive')) });
},

/**
Find exist elements and update repository object.
Expand Down Expand Up @@ -1225,8 +1247,7 @@ export default Component.extend(
if (!isNone(repositoryObject)) {
let store = this.get('store');
let modelName = this._getModelName(removeObject.get('primitive.$type'));
let allModels = store.peekAll(`${modelName}`);
let currentRepObj = allModels.findBy('id', repositoryObject.slice(1, -1));
let currentRepObj = store.peekRecord(modelName, repositoryObject.slice(1, -1));
if (!isNone(currentRepObj)) {
this._decrementPropertyReferenceCount(currentRepObj);
}
Expand Down
Loading

0 comments on commit 73735d7

Please sign in to comment.