vmario/wisemapping-frontend
1
0
Fork 0
mirror of https://bitbucket.org/wisemapping/wisemapping-frontend.git synced 2024-11-21 22:27:56 +01:00
Code Issues Packages Projects Releases Wiki Activity

Merge branch 'develop' of https://bitbucket.org/wisemapping/wisemapping-frontend into feature/import-freemind-to-wisemapping

Browse Source
This commit is contained in:
Ezequiel-Vega 2022-03-10 12:37:02 -03:00
commit 2225a3c640
21 changed files with 390 additions and 367 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

473
packages/editor/src/classes/menu/Menu.ts
View File

@ -38,150 +38,17 @@ class Menu extends IMenu {
const widgetsBaseUrl = `${baseUrl}css/widget`;
// Create panels ...
const designerModel = designer.getModel();
const fontFamilyModel = {
getValue() {
const nodes = designerModel.filterSelectedTopics();
let result = null;
for (let i = 0; i < nodes.length; i++) {
const fontFamily = nodes[i].getFontFamily();
if (result != null && result !== fontFamily) {
result = null;
break;
}
result = fontFamily;
}
return result;
},
setValue(value: string) {
designer.changeFontFamily(value);
},
};
this._toolbarElems.push(new FontFamilyPanel('fontFamily', fontFamilyModel));
Menu._registerTooltip('fontFamily', $msg('FONT_FAMILY'));
const fontSizeModel = {
getValue(): number {
const nodes = designerModel.filterSelectedTopics();
let result = null;
for (let i = 0; i < nodes.length; i++) {
const fontSize = nodes[i].getFontSize();
if (result != null && result !== fontSize) {
result = null;
break;
}
result = fontSize;
}
return result;
},
setValue(value: number) {
designer.changeFontSize(value);
},
};
this._toolbarElems.push(new FontSizePanel('fontSize', fontSizeModel));
Menu._registerTooltip('fontSize', $msg('FONT_SIZE'));
const topicShapeModel = {
getValue() {
const nodes = designerModel.filterSelectedTopics();
let result = null;
for (let i = 0; i < nodes.length; i++) {
const shapeType = nodes[i].getShapeType();
if (result != null && result !== shapeType) {
result = null;
break;
}
result = shapeType;
}
return result;
},
setValue(value: string) {
designer.changeTopicShape(value);
},
};
this._toolbarElems.push(new TopicShapePanel('topicShape', topicShapeModel));
Menu._registerTooltip('topicShape', $msg('TOPIC_SHAPE'));
// Create icon panel dialog ...
const topicIconModel = {
getValue() {
return null;
},
setValue(value: string) {
designer.addIconType(value);
},
};
this._toolbarElems.push(new IconPanel('topicIcon', topicIconModel));
Menu._registerTooltip('topicIcon', $msg('TOPIC_ICON'));
const topicColorModel = {
getValue() {
const nodes = designerModel.filterSelectedTopics();
let result = null;
for (let i = 0; i < nodes.length; i++) {
const color = nodes[i].getBackgroundColor();
if (result != null && result !== color) {
result = null;
break;
}
result = color;
}
return result;
},
setValue(hex: string) {
designer.changeBackgroundColor(hex);
},
};
this._toolbarElems.push(new ColorPalettePanel('topicColor', topicColorModel, widgetsBaseUrl));
Menu._registerTooltip('topicColor', $msg('TOPIC_COLOR'));
const borderColorModel = {
getValue() {
const nodes = designerModel.filterSelectedTopics();
let result = null;
for (let i = 0; i < nodes.length; i++) {
const color = nodes[i].getBorderColor();
if (result != null && result !== color) {
result = null;
break;
}
result = color;
}
return result;
},
setValue(hex: string) {
designer.changeBorderColor(hex);
},
};
this._toolbarElems.push(new ColorPalettePanel('topicBorder', borderColorModel, widgetsBaseUrl));
Menu._registerTooltip('topicBorder', $msg('TOPIC_BORDER_COLOR'));
const fontColorModel = {
getValue() {
let result = null;
const nodes = designerModel.filterSelectedTopics();
for (let i = 0; i < nodes.length; i++) {
const color = nodes[i].getFontColor();
if (result != null && result !== color) {
result = null;
break;
}
result = color;
}
return result;
},
setValue(hex) {
designer.changeFontColor(hex);
},
};
this._toolbarElems.push(new ColorPalettePanel('fontColor', fontColorModel, baseUrl));
Menu._registerTooltip('fontColor', $msg('FONT_COLOR'));
Menu._registerTooltip('export', $msg('EXPORT'));
Menu._registerTooltip('print', $msg('PRINT'));
// Common actions ....
const backTolist = $('#backToList');
backTolist.bind('click', (event) => {
event.stopPropagation();
window.location.href = '/c/maps/';
return false;
});
Menu._registerTooltip('backToList', $msg('BACK_TO_MAP_LIST'));
this._addButton('zoom-plus', false, false, () => {
designer.zoomIn();
@ -198,98 +65,246 @@ class Menu extends IMenu {
});
Menu._registerTooltip('position', $msg('CENTER_POSITION'));
const undoButton = this._addButton('undoEdition', false, false, () => {
designer.undo();
});
if (undoButton) {
undoButton.disable();
}
Menu._registerTooltip('undoEdition', $msg('UNDO'), 'meta+Z');
const redoButton = this._addButton('redoEdition', false, false, () => {
designer.redo();
});
if (redoButton) {
redoButton.disable();
}
Menu._registerTooltip('redoEdition', $msg('REDO'), 'meta+shift+Z');
if (redoButton && undoButton) {
designer.addEvent('modelUpdate', (event) => {
if (event.undoSteps > 0) {
undoButton.enable();
} else {
undoButton.disable();
}
if (event.redoSteps > 0) {
redoButton.enable();
} else {
redoButton.disable();
}
});
}
this._addButton('addTopic', true, false, () => {
designer.createSiblingForSelectedNode();
});
Menu._registerTooltip('addTopic', $msg('ADD_TOPIC'), 'Enter');
this._addButton('deleteTopic', true, true, () => {
designer.deleteSelectedEntities();
});
Menu._registerTooltip('deleteTopic', $msg('TOPIC_DELETE'), 'Delete');
this._addButton('topicLink', true, false, () => {
designer.addLink();
});
Menu._registerTooltip('topicLink', $msg('TOPIC_LINK'));
this._addButton('topicRelation', true, false, (event) => {
designer.showRelPivot(event);
});
Menu._registerTooltip('topicRelation', $msg('TOPIC_RELATIONSHIP'));
this._addButton('topicNote', true, false, () => {
designer.addNote();
});
Menu._registerTooltip('topicNote', $msg('TOPIC_NOTE'));
this._addButton('fontBold', true, false, () => {
designer.changeFontWeight();
});
Menu._registerTooltip('fontBold', $msg('FONT_BOLD'), 'meta+B');
this._addButton('fontItalic', true, false, () => {
designer.changeFontStyle();
});
Menu._registerTooltip('fontItalic', $msg('FONT_ITALIC'), 'meta+I');
if (saveElem) {
this._addButton('save', false, false,
() => {
this.save(saveElem, designer, true);
});
Menu._registerTooltip('save', $msg('SAVE'), 'meta+S');
if (!readOnly) {
window.addEventListener('beforeunload', () => {
if (this.isSaveRequired()) {
this.save(saveElem, designer, false);
// Edition actions ...
if (!readOnly) {
const fontFamilyModel = {
getValue() {
const nodes = designerModel.filterSelectedTopics();
let result = null;
for (let i = 0; i < nodes.length; i++) {
const fontFamily = nodes[i].getFontFamily();
if (result != null && result !== fontFamily) {
result = null;
break;
}
result = fontFamily;
}
this.unlockMap(designer);
});
return result;
},
// Autosave on a fixed period of time ...
setInterval(
setValue(value: string) {
designer.changeFontFamily(value);
},
};
this._toolbarElems.push(new FontFamilyPanel('fontFamily', fontFamilyModel));
Menu._registerTooltip('fontFamily', $msg('FONT_FAMILY'));
const fontSizeModel = {
getValue(): number {
const nodes = designerModel.filterSelectedTopics();
let result = null;
for (let i = 0; i < nodes.length; i++) {
const fontSize = nodes[i].getFontSize();
if (result != null && result !== fontSize) {
result = null;
break;
}
result = fontSize;
}
return result;
},
setValue(value: number) {
designer.changeFontSize(value);
},
};
this._toolbarElems.push(new FontSizePanel('fontSize', fontSizeModel));
Menu._registerTooltip('fontSize', $msg('FONT_SIZE'));
const topicShapeModel = {
getValue() {
const nodes = designerModel.filterSelectedTopics();
let result = null;
for (let i = 0; i < nodes.length; i++) {
const shapeType = nodes[i].getShapeType();
if (result != null && result !== shapeType) {
result = null;
break;
}
result = shapeType;
}
return result;
},
setValue(value: string) {
designer.changeTopicShape(value);
},
};
this._toolbarElems.push(new TopicShapePanel('topicShape', topicShapeModel));
Menu._registerTooltip('topicShape', $msg('TOPIC_SHAPE'));
// Create icon panel dialog ...
const topicIconModel = {
getValue() {
return null;
},
setValue(value: string) {
designer.addIconType(value);
},
};
this._toolbarElems.push(new IconPanel('topicIcon', topicIconModel));
Menu._registerTooltip('topicIcon', $msg('TOPIC_ICON'));
const topicColorModel = {
getValue() {
const nodes = designerModel.filterSelectedTopics();
let result = null;
for (let i = 0; i < nodes.length; i++) {
const color = nodes[i].getBackgroundColor();
if (result != null && result !== color) {
result = null;
break;
}
result = color;
}
return result;
},
setValue(hex: string) {
designer.changeBackgroundColor(hex);
},
};
this._toolbarElems.push(new ColorPalettePanel('topicColor', topicColorModel, widgetsBaseUrl));
Menu._registerTooltip('topicColor', $msg('TOPIC_COLOR'));
const borderColorModel = {
getValue() {
const nodes = designerModel.filterSelectedTopics();
let result = null;
for (let i = 0; i < nodes.length; i++) {
const color = nodes[i].getBorderColor();
if (result != null && result !== color) {
result = null;
break;
}
result = color;
}
return result;
},
setValue(hex: string) {
designer.changeBorderColor(hex);
},
};
this._toolbarElems.push(new ColorPalettePanel('topicBorder', borderColorModel, widgetsBaseUrl));
Menu._registerTooltip('topicBorder', $msg('TOPIC_BORDER_COLOR'));
const fontColorModel = {
getValue() {
let result = null;
const nodes = designerModel.filterSelectedTopics();
for (let i = 0; i < nodes.length; i++) {
const color = nodes[i].getFontColor();
if (result != null && result !== color) {
result = null;
break;
}
result = color;
}
return result;
},
setValue(hex) {
designer.changeFontColor(hex);
},
};
this._toolbarElems.push(new ColorPalettePanel('fontColor', fontColorModel, baseUrl));
Menu._registerTooltip('fontColor', $msg('FONT_COLOR'));
const undoButton = this._addButton('undoEdition', false, false, () => {
designer.undo();
});
if (undoButton) {
undoButton.disable();
}
Menu._registerTooltip('undoEdition', $msg('UNDO'), 'meta+Z');
const redoButton = this._addButton('redoEdition', false, false, () => {
designer.redo();
});
if (redoButton) {
redoButton.disable();
}
Menu._registerTooltip('redoEdition', $msg('REDO'), 'meta+shift+Z');
if (redoButton && undoButton) {
designer.addEvent('modelUpdate', (event) => {
if (event.undoSteps > 0) {
undoButton.enable();
} else {
undoButton.disable();
}
if (event.redoSteps > 0) {
redoButton.enable();
} else {
redoButton.disable();
}
});
}
this._addButton('addTopic', true, false, () => {
designer.createSiblingForSelectedNode();
});
Menu._registerTooltip('addTopic', $msg('ADD_TOPIC'), 'Enter');
this._addButton('deleteTopic', true, true, () => {
designer.deleteSelectedEntities();
});
Menu._registerTooltip('deleteTopic', $msg('TOPIC_DELETE'), 'Delete');
this._addButton('topicLink', true, false, () => {
designer.addLink();
});
Menu._registerTooltip('topicLink', $msg('TOPIC_LINK'));
this._addButton('topicRelation', true, false, (event) => {
designer.showRelPivot(event);
});
Menu._registerTooltip('topicRelation', $msg('TOPIC_RELATIONSHIP'));
this._addButton('topicNote', true, false, () => {
designer.addNote();
});
Menu._registerTooltip('topicNote', $msg('TOPIC_NOTE'));
this._addButton('fontBold', true, false, () => {
designer.changeFontWeight();
});
Menu._registerTooltip('fontBold', $msg('FONT_BOLD'), 'meta+B');
this._addButton('fontItalic', true, false, () => {
designer.changeFontStyle();
});
Menu._registerTooltip('fontItalic', $msg('FONT_ITALIC'), 'meta+I');
if (saveElem) {
this._addButton('save', false, false,
() => {
this.save(saveElem, designer, true);
});
Menu._registerTooltip('save', $msg('SAVE'), 'meta+S');
if (!readOnly) {
window.addEventListener('beforeunload', () => {
if (this.isSaveRequired()) {
this.save(saveElem, designer, false);
}
}, 10000,
);
this.unlockMap(designer);
});
// Autosave on a fixed period of time ...
setInterval(
() => {
if (this.isSaveRequired()) {
this.save(saveElem, designer, false);
}
}, 10000,
);
}
}
}
Menu._registerTooltip('export', $msg('EXPORT'));
Menu._registerTooltip('print', $msg('PRINT'));
const shareElem = $('#shareIt');
if (shareElem.length !== 0) {
Menu._registerTooltip('shareIt', $msg('COLLABORATE'));
@ -316,14 +331,6 @@ class Menu extends IMenu {
Menu._registerTooltip('keyboardShortcuts', $msg('KEYBOARD_SHOTCUTS'));
}
const backTolist = $('#backToList');
backTolist.bind('click', (event) => {
event.stopPropagation();
window.location.href = '/c/maps/';
return false;
});
Menu._registerTooltip('backToList', $msg('BACK_TO_MAP_LIST'));
// Account dialog ...
const accountSettings = $('#account');
if (accountSettings.length !== 0) {

118
packages/editor/src/components/toolbar/index.tsx
View File

@ -55,63 +55,67 @@ export default function Toolbar({
</ToolbarButton>
</div>
)}
<div id="edit" className="buttonContainer">
<ToolbarButton id="undoEdition" className="buttonOn">
<img src={UndoSvg} />
</ToolbarButton>
<ToolbarButton id="redoEdition" className="buttonOn">
<img src={RedoSvg} />
</ToolbarButton>
</div>
<div id="nodeStyle" className="buttonContainer">
<ToolbarButton id="addTopic" className="buttonOn">
<img src={TopicAddSvg} />
</ToolbarButton>
<ToolbarButton id="deleteTopic" className="buttonOn">
<img src={TopicDeleteSvg} />
</ToolbarButton>
<ToolbarButtonExt id="topicBorder" className="buttonExtOn">
<img src={TopicBorderSvg} />
</ToolbarButtonExt>
<ToolbarButtonExt id="topicColor" className="buttonExtOn">
<img src={TopicColorSvg} />
</ToolbarButtonExt>
<ToolbarButtonExt id="topicShape" className="buttonExtOn">
<img src={TopicShapeSvg} />
</ToolbarButtonExt>
</div>
<div id="font" className="buttonContainer">
<ToolbarButton id="fontFamily" className="buttonOn">
<img src={FontTypeSvg} />
</ToolbarButton>
<ToolbarButtonExt id="fontSize" className="buttonExtOn">
<img src={FontSizeSvg} />
</ToolbarButtonExt>
<ToolbarButton id="fontBold" className="buttonOn">
<img src={FontBoldSvg} />
</ToolbarButton>
<ToolbarButton id="fontItalic" className="buttonOn">
<img src={FontItalicSvg} />
</ToolbarButton>
<ToolbarButtonExt id="fontColor" className="buttonExtOn">
<img src={FontColorSvg} />
</ToolbarButtonExt>
</div>
<div id="nodeContent" className="buttonContainer">
<ToolbarButtonExt id="topicIcon" className="buttonExtOn">
<img src={TopicIconSvg} />
</ToolbarButtonExt>
<ToolbarButton id="topicNote" className="buttonOn">
<img src={TopicNoteSvg} />
</ToolbarButton>
<ToolbarButton id="topicLink" className="buttonOn">
<img src={TopicLinkSvg} />
</ToolbarButton>
<ToolbarButton id="topicRelation" className="buttonOn">
<img src={TopicRelationSvg} />
</ToolbarButton>
</div>
<div id="separator" className="buttonContainer"></div>
{(editorMode === 'edition-editor' || editorMode === 'edition-owner' || editorMode === 'showcase') && (
<>
<div id="edit" className="buttonContainer">
<ToolbarButton id="undoEdition" className="buttonOn">
<img src={UndoSvg} />
</ToolbarButton>
<ToolbarButton id="redoEdition" className="buttonOn">
<img src={RedoSvg} />
</ToolbarButton>
</div>
<div id="nodeStyle" className="buttonContainer">
<ToolbarButton id="addTopic" className="buttonOn">
<img src={TopicAddSvg} />
</ToolbarButton>
<ToolbarButton id="deleteTopic" className="buttonOn">
<img src={TopicDeleteSvg} />
</ToolbarButton>
<ToolbarButtonExt id="topicBorder" className="buttonExtOn">
<img src={TopicBorderSvg} />
</ToolbarButtonExt>
<ToolbarButtonExt id="topicColor" className="buttonExtOn">
<img src={TopicColorSvg} />
</ToolbarButtonExt>
<ToolbarButtonExt id="topicShape" className="buttonExtOn">
<img src={TopicShapeSvg} />
</ToolbarButtonExt>
</div>
<div id="font" className="buttonContainer">
<ToolbarButton id="fontFamily" className="buttonOn">
<img src={FontTypeSvg} />
</ToolbarButton>
<ToolbarButtonExt id="fontSize" className="buttonExtOn">
<img src={FontSizeSvg} />
</ToolbarButtonExt>
<ToolbarButton id="fontBold" className="buttonOn">
<img src={FontBoldSvg} />
</ToolbarButton>
<ToolbarButton id="fontItalic" className="buttonOn">
<img src={FontItalicSvg} />
</ToolbarButton>
<ToolbarButtonExt id="fontColor" className="buttonExtOn">
<img src={FontColorSvg} />
</ToolbarButtonExt>
</div>
<div id="nodeContent" className="buttonContainer">
<ToolbarButtonExt id="topicIcon" className="buttonExtOn">
<img src={TopicIconSvg} />
</ToolbarButtonExt>
<ToolbarButton id="topicNote" className="buttonOn">
<img src={TopicNoteSvg} />
</ToolbarButton>
<ToolbarButton id="topicLink" className="buttonOn">
<img src={TopicLinkSvg} />
</ToolbarButton>
<ToolbarButton id="topicRelation" className="buttonOn">
<img src={TopicRelationSvg} />
</ToolbarButton>
</div>
<div id="separator" className="buttonContainer"></div>
</>
)}
<ToolbarRightContainer>
<ToolbarButton
id="export"

2
packages/editor/src/index.tsx
View File

@ -90,7 +90,7 @@ const Editor = ({
const result = buildDesigner(buildOptions);
// Register toolbar event ...
if (options.mode === 'edition-owner' || options.mode === 'edition-editor' || options.mode === 'showcase') {
if (options.mode === 'edition-owner' || options.mode === 'edition-editor' || options.mode === 'edition-viewer' || options.mode === 'showcase') {
const menu = new Menu(designer, 'toolbar');
// If a node has focus, focus can be move to another node using the keys.

0
packages/mindplot/assets/icons/appsgoogle-maps.svg → packages/mindplot/assets/icons/appsgoogle_maps.svg
View File

Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 1.6 KiB

After

Width:  |  Height:  |  Size: 1.6 KiB

2
packages/mindplot/src/components/ConnectionLine.ts
View File

@ -97,7 +97,7 @@ class ConnectionLine {
this._line2d.setVisibility(value, fade);
}
isVisible() {
isVisible(): boolean {
return this._line2d.isVisible();
}

4
packages/mindplot/src/components/Designer.ts
View File

@ -110,7 +110,7 @@ class Designer extends Events {
// Init Screen manager..
const screenManager = new ScreenManager(divElement);
this._workspace = new Workspace(screenManager, this._model.getZoom(), options.mode === 'viewonly');
this._workspace = new Workspace(screenManager, this._model.getZoom(), this.isReadOnly());
// Init layout manager ...
this._eventBussDispatcher = new EventBusDispatcher();
@ -623,7 +623,7 @@ class Designer extends Events {
}
isReadOnly(): boolean {
return Boolean(this._options?.mode === 'viewonly');
return this._options.mode === 'viewonly' || this._options.mode === 'edition-viewer';
}
nodeModelToTopic(nodeModel: NodeModel): Topic {

1
packages/mindplot/src/components/DesignerOptionsBuilder.ts
View File

@ -42,7 +42,6 @@ class OptionsBuilder {
width: window.screen.width,
height: window.screen.height,
};
console.log(`height:${containerSize.height}`);
}
const defaultOptions: DesignerOptions = {

2
packages/mindplot/src/components/ImageIcon.js
View File

@ -206,7 +206,7 @@ ImageIcon.prototype.ICON_FAMILIES = [{
},
{
id: 'appsgoogle',
icons: ['appsgoogle_youtube', 'appsgoogle_gmail', 'appsgoogle-maps'],
icons: ['appsgoogle_youtube', 'appsgoogle_gmail', 'appsgoogle_maps'],
},
{
id: 'tag',

19
packages/mindplot/src/components/LocalStorageManager.ts
View File

@ -23,23 +23,34 @@ class LocalStorageManager extends PersistenceManager {
private forceLoad: boolean;
constructor(documentUrl: string, forceLoad: boolean) {
private readOnly: boolean;
constructor(documentUrl: string, forceLoad: boolean, readOnly = true) {
super();
this.documentUrl = documentUrl;
this.forceLoad = forceLoad;
this.readOnly = readOnly;
}
saveMapXml(mapId: string, mapDoc: Document): void {
const mapXml = new XMLSerializer().serializeToString(mapDoc);
localStorage.setItem(`${mapId}-xml`, mapXml);
if (!this.readOnly) {
localStorage.setItem(`${mapId}-xml`, mapXml);
}
console.log(`Map XML to save => ${this.saveMapXml}`);
}
discardChanges(mapId: string) {
localStorage.removeItem(`${mapId}-xml`);
if (!this.readOnly) {
localStorage.removeItem(`${mapId}-xml`);
}
}
loadMapDom(mapId: string) {
let xml = localStorage.getItem(`${mapId}-xml`);
let xml;
if (!this.readOnly) {
xml = localStorage.getItem(`${mapId}-xml`);
}
if (xml == null || this.forceLoad) {
$.ajax({
url: this.documentUrl.replace('{id}', mapId),

44
packages/mindplot/src/components/Relationship.ts
View File

@ -20,8 +20,10 @@ import { Arrow, Point, ElementClass } from '@wisemapping/web2d';
import ConnectionLine from './ConnectionLine';
import ControlPoint from './ControlPoint';
import RelationshipModel from './model/RelationshipModel';
import PositionType from './PositionType';
import Topic from './Topic';
import Shape from './util/Shape';
import Workspace from './Workspace';
class Relationship extends ConnectionLine {
private _focusShape: ElementClass;
@ -187,7 +189,7 @@ class Relationship extends ConnectionLine {
this._startArrow.setVisibility(this.isVisible() && this._showStartArrow);
}
addToWorkspace(workspace) {
addToWorkspace(workspace: Workspace): void {
workspace.append(this._focusShape);
workspace.append(this._controlPointsController);
@ -207,11 +209,11 @@ class Relationship extends ConnectionLine {
this.redraw();
}
_initializeControlPointController(): void {
private _initializeControlPointController(): void {
this.setOnFocus(true);
}
removeFromWorkspace(workspace) {
removeFromWorkspace(workspace: Workspace): void {
workspace.removeChild(this._focusShape);
workspace.removeChild(this._controlPointsController);
if (!workspace.isReadOnly) {
@ -243,7 +245,7 @@ class Relationship extends ConnectionLine {
}
}
private _refreshShape() {
private _refreshShape(): void {
const sPos = this._line2d.getFrom();
const tPos = this._line2d.getTo();
const ctrlPoints = this._line2d.getControlPoints();
@ -279,19 +281,31 @@ class Relationship extends ConnectionLine {
setVisibility(value: boolean, fade = 0) {
super.setVisibility(value, fade);
if (this._showEndArrow) this._endArrow.setVisibility(this._showEndArrow);
// If visibility change, remove the on focus.
this.setOnFocus(false);
if (this._showEndArrow) {
this._endArrow.setVisibility(this._showEndArrow);
}
this._startArrow.setVisibility(this._showStartArrow && value, fade);
}
setOpacity(opacity: number) {
setOpacity(opacity: number): void {
super.setOpacity(opacity);
if (this._showEndArrow) this._endArrow.setOpacity(opacity);
if (this._showStartArrow) this._startArrow.setOpacity(opacity);
if (this._showEndArrow) {
this._endArrow.setOpacity(opacity);
}
if (this._showStartArrow) {
this._startArrow.setOpacity(opacity);
}
}
setShowEndArrow(visible: boolean) {
this._showEndArrow = visible;
if (this._isInWorkspace) this.redraw();
if (this._isInWorkspace) {
this.redraw();
}
}
setShowStartArrow(visible: boolean) {
@ -315,25 +329,25 @@ class Relationship extends ConnectionLine {
if (this._endArrow) this._endArrow.setFrom(x, y);
}
setSrcControlPoint(control) {
setSrcControlPoint(control: PositionType): void {
this._line2d.setSrcControlPoint(control);
this._startArrow.setControlPoint(control);
}
setDestControlPoint(control) {
setDestControlPoint(control: PositionType) {
this._line2d.setDestControlPoint(control);
if (this._showEndArrow) this._endArrow.setControlPoint(control);
}
getControlPoints() {
getControlPoints(): PositionType {
return this._line2d.getControlPoints();
}
isSrcControlPointCustom() {
isSrcControlPointCustom(): boolean {
return this._line2d.isSrcControlPointCustom();
}
isDestControlPointCustom() {
isDestControlPointCustom(): boolean {
return this._line2d.isDestControlPointCustom();
}
@ -345,7 +359,7 @@ class Relationship extends ConnectionLine {
this._line2d.setIsDestControlPointCustom(isCustom);
}
getId() {
getId(): number {
return this._model.getId();
}

4
packages/mindplot/src/components/Topic.ts
View File

@ -375,17 +375,14 @@ abstract class Topic extends NodeGraph {
this.adjustShapes();
}
/** */
addRelationship(relationship: Relationship) {
this._relationships.push(relationship);
}
/** */
deleteRelationship(relationship: Rect) {
this._relationships = this._relationships.filter((r) => r !== relationship);
}
/** */
getRelationships(): Relationship[] {
return this._relationships;
}
@ -1093,6 +1090,7 @@ abstract class Topic extends NodeGraph {
const connector = targetTopic.getShrinkConnector();
if ($defined(connector)) {
connector.setVisibility(false);
targetTopic.isCollapsed(false);
}
}
}

16
packages/mindplot/src/components/commands/AddRelationshipCommand.ts
View File

@ -17,6 +17,7 @@
*/
import { $assert } from '@wisemapping/core-js';
import Command from '../Command';
import CommandContext from '../CommandContext';
import RelationshipModel from '../model/RelationshipModel';
class AddRelationshipCommand extends Command {
@ -25,27 +26,20 @@ class AddRelationshipCommand extends Command {
/**
* @classdesc This command class handles do/undo of adding a relationship to a topic.
*/
constructor(model:RelationshipModel) {
constructor(model: RelationshipModel) {
$assert(model, 'Relationship model can not be null');
super();
this._model = model;
}
/**
* Overrides abstract parent method
*/
execute(commandContext) {
execute(commandContext: CommandContext) {
const relationship = commandContext.addRelationship(this._model);
relationship.setOnFocus(true);
}
/**
* Overrides abstract parent method
* @see {@link mindplot.Command.undoExecute}
*/
undoExecute(commandContext) {
const rel = commandContext.findRelationships(this._model.getId());
undoExecute(commandContext: CommandContext) {
const rel = commandContext.findRelationships([this._model.getId()]);
commandContext.deleteRelationship(rel[0]);
}
}

7
packages/mindplot/src/components/commands/AddTopicCommand.ts
View File

@ -38,9 +38,6 @@ class AddTopicCommand extends Command {
this._parentsIds = parentTopicsId;
}
/**
* Overrides abstract parent method
*/
execute(commandContext: CommandContext) {
const me = this;
this._models.forEach((model, index) => {
@ -68,10 +65,6 @@ class AddTopicCommand extends Command {
});
}
/**
* Overrides abstract parent method
* @see {@link mindplot.Command.undoExecute}
*/
undoExecute(commandContext: CommandContext) {
// Delete disconnected the nodes. Create a copy of the topics ...
const clonedModel = [];

7
packages/mindplot/src/components/commands/ChangeFeatureToTopicCommand.ts
View File

@ -37,9 +37,6 @@ class ChangeFeatureToTopicCommand extends Command {
this._attributes = attributes;
}
/**
* Overrides abstract parent method
*/
execute(commandContext: CommandContext) {
const topic = commandContext.findTopics([this._topicId])[0];
const feature = topic.findFeatureById(this._featureId);
@ -49,10 +46,6 @@ class ChangeFeatureToTopicCommand extends Command {
this._attributes = oldAttributes;
}
/**
* Overrides abstract parent method
* @see {@link mindplot.Command.undoExecute}
*/
undoExecute(commandContext: CommandContext) {
this.execute(commandContext);
}

3
packages/mindplot/src/components/commands/DragTopicCommand.ts
View File

@ -47,9 +47,6 @@ class DragTopicCommand extends Command {
this._order = order;
}
/**
* Overrides abstract parent method
*/
execute(commandContext: CommandContext): void {
const topic = commandContext.findTopics([this._topicsId])[0];
topic.setVisibility(false);

16
packages/mindplot/src/components/commands/MoveControlPointCommand.ts
View File

@ -19,19 +19,20 @@ import { $assert, $defined } from '@wisemapping/core-js';
import { Line } from '@wisemapping/web2d';
import Command from '../Command';
import ControlPoint from '../ControlPoint';
import PositionType from '../PositionType';
class MoveControlPointCommand extends Command {
private _ctrlPointControler: ControlPoint;
private _line: Line;
private _controlPoint: any;
private _controlPoint: Line;
private _oldControlPoint: any;
private _oldControlPoint: Line;
private _originalEndPoint: any;
private _originalEndPoint: PositionType;
private _wasCustom: any;
private _wasCustom: boolean;
private _endPoint: any;
@ -68,9 +69,6 @@ class MoveControlPointCommand extends Command {
this._point = point;
}
/**
* Overrides abstract parent method
*/
execute() {
const model = this._line.getModel();
switch (this._point) {
@ -97,10 +95,6 @@ class MoveControlPointCommand extends Command {
this._line.getLine().updateLine(this._point);
}
/**
* Overrides abstract parent method
* @see {@link mindplot.Command.undoExecute}
*/
undoExecute() {
const line = this._line;
const model = line.getModel();

2
packages/mindplot/src/components/persistence/XMLSerializerTango.ts
View File

@ -106,7 +106,7 @@ class XMLSerializerTango implements XMLMindmapSerializer {
}
}
if (topic.areChildrenShrunken() && topic.getType() !== 'CentralTopic') {
if ((topic.areChildrenShrunken() && topic.getChildren().length > 0) && topic.getType() !== 'CentralTopic') {
parentTopic.setAttribute('shrink', 'true');
}

6
packages/webapp/src/classes/client/rest-client/index.ts
View File

@ -615,8 +615,14 @@ export default class RestClient implements Client {
if (this.persistenceManager) {
return this.persistenceManager;
}
let persistence: PersistenceManager;
if (editorMode === 'edition-owner' || editorMode === 'edition-editor') {
if (!global.lockSession) {
throw new Error(`Session could not be found: global.lockSession: '${global.lockSession}' - global.lockTimestamp: '${global.lockTimestamp}' - ${global.mindmapLocked} - ${global.mindmapLockedMsg}`)
}
persistence = new RESTPersistenceManager({
documentUrl: '/c/restful/maps/{id}/document',
revertUrl: '/c/restful/maps/{id}/history/latest',

2
packages/webapp/src/components/editor-page/EditorOptionsBuider.ts → packages/webapp/src/components/editor-page/EditorOptionsBuilder.ts
View File

@ -2,7 +2,7 @@ import { EditorOptions } from '@wisemapping/editor';
import { EditorRenderMode } from '@wisemapping/mindplot';
import AppConfig from '../../classes/app-config';
export default class EditorOptionsBulder {
export default class EditorOptionsBuilder {
static build(locale: string, mode: EditorRenderMode, hotkeys: boolean): EditorOptions {
let options: EditorOptions = {

11
packages/webapp/src/components/editor-page/index.tsx
View File

@ -10,7 +10,7 @@ import { hotkeysEnabled } from '../../redux/editorSlice';
import ReactGA from 'react-ga';
import Client from '../../classes/client';
import { activeInstance, fetchAccount, fetchMapById } from '../../redux/clientSlice';
import EditorOptionsBulder from './EditorOptionsBuider';
import EditorOptionsBuilder from './EditorOptionsBuilder';
export type EditorPropsType = {
isTryMode: boolean;
@ -23,6 +23,7 @@ const EditorPage = ({ isTryMode }: EditorPropsType): React.ReactElement => {
const client: Client = useSelector(activeInstance);
useEffect(() => {
document.title = `${global.mapTitle ? global.mapTitle : 'unknown'} | WiseMapping `;
ReactGA.pageview(window.location.pathname + window.location.search);
}, []);
@ -36,16 +37,16 @@ const EditorPage = ({ isTryMode }: EditorPropsType): React.ReactElement => {
const fetchResult = fetchMapById(mapId);
if (!fetchResult.isLoading) {
if (fetchResult.error) {
throw new Error(`User coild not be loaded: ${JSON.stringify(fetchResult.error)}`);
throw new Error(`Map information could not be loaded: ${JSON.stringify(fetchResult)}`);
}
result = fetchResult.map.role === 'owner' ? 'edition-owner' : 'edition-editor';
result = `edition-${fetchResult?.map?.role}`;
}
}
return result;
}
// What is the role ?
const mapId = EditorOptionsBulder.loadMapId();
const mapId = EditorOptionsBuilder.loadMapId();
const mode = findEditorMode(isTryMode, mapId);
// Account settings can be null and editor cannot be initilized multiple times. This creates problems
@ -55,7 +56,7 @@ const EditorPage = ({ isTryMode }: EditorPropsType): React.ReactElement => {
let options, persistence: PersistenceManager;
if (loadCompleted) {
options = EditorOptionsBulder.build(userLocale.code, mode, hotkey);
options = EditorOptionsBuilder.build(userLocale.code, mode, hotkey);
persistence = client.buildPersistenceManager(mode);
}

18
packages/webapp/src/redux/clientSlice.ts
View File

@ -47,9 +47,21 @@ export const fetchMapById = (id: number): MapLoadResult => {
return client.fetchAllMaps();
});
const result = data?.find((m) => m.id == id);
const map = result || null;
return { isLoading: isLoading, error: error, map: map };
// If the map can not be loaded, create an error object.
let map: MapInfo;
let errorMsg: ErrorInfo = error;
if (!isLoading) {
// Sanitize error structure ...
if (errorMsg) {
errorMsg = Object.keys(error).length !== 0 ? error : null;
}
// Seach for object...
map = data?.find((m) => m.id == id);
if (map === null && !errorMsg) {
errorMsg = { msg: `Map with id ${id} could not be found. Please, reflesh the page` }
}
}
return { isLoading: isLoading, error: errorMsg, map: map };
};
export const fetchAccount = (): AccountInfo | undefined => {