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

Add disconnect node capabilities.

Browse Source
This commit is contained in:
Paulo Gustavo Veiga 2023-01-06 23:57:39 -08:00
parent 4158f3773e
commit 8061bd375a
23 changed files with 277 additions and 183 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
packages/editor/lang/de.json
View File

@ -11,9 +11,7 @@
"editor.try-welcome-description-mobile": {
"defaultMessage": "Melden Sie sich an, um kostenlos eine unbegrenzte Anzahl von Mindmaps zu erstellen, zu teilen und zu veröffentlichen. Eingeschränkte Funktionen der Mindmap-Edition werden auf Mobilgeräten unterstützt. Verwenden Sie den Desktop-Browser für vollständige Editorfunktionen."
},
"editor.edit-mobile": {
"defaultMessage": "Hinweis für Mobilgeräte."
},
"editor.edit-description-mobile": {
"defaultMessage": "Eingeschränkte Funktionen der Mindmap-Edition werden auf Mobilgeräten unterstützt. Verwenden Sie den Desktop-Browser für vollständige Editorfunktionen."
},
@ -80,7 +78,7 @@
"editor-panel.note-panel-title": {
"defaultMessage": "Notiz"
},
"icon.label": {
"editor-panel.icon-title": {
"defaultMessage": "Symbol"
},
"editor-panel.link-panel-title": {
@ -259,5 +257,14 @@
},
"editor-panel.tooltip-topic-fill-color-default": {
"defaultMessage": "Standardfüllfarbe"
},
"action.delete": {
"defaultMessage": "Löschen"
},
"editor-panel.tooltip-topic-font-color-default": {
"defaultMessage": "Farbe defekt"
},
"shortcut-help-pane.drag-disconnect": {
"defaultMessage": "Color de relleno por defekto"
}
}

31
packages/editor/lang/en.json
View File

@ -2,8 +2,8 @@
"action.accept": {
"defaultMessage": "Accept"
},
"action.cancel": {
"defaultMessage": "Cancel"
"action.delete": {
"defaultMessage": "Delete"
},
"appbar.back-to-map-list": {
"defaultMessage": "Back to maps list"
@ -47,6 +47,12 @@
"appbar.tooltip-undo": {
"defaultMessage": "Undo"
},
"editor-panel.link-panel-title": {
"defaultMessage": "Link"
},
"editor-panel.note-panel-title": {
"defaultMessage": "Note"
},
"editor-panel.tooltip-add-icon": {
"defaultMessage": "Add Icon"
},
@ -107,6 +113,9 @@
"editor-panel.tooltip-topic-font-color": {
"defaultMessage": "Color"
},
"editor-panel.tooltip-topic-font-color-default": {
"defaultMessage": "Default color"
},
"editor-panel.tooltip-topic-font-italic": {
"defaultMessage": "Italic"
},
@ -134,9 +143,6 @@
"editor.edit-description-mobile": {
"defaultMessage": "Limited mindmap edition capabilities are supported in Mobile devices. Use Desktop browser for full editor capabilities."
},
"editor.edit-mobile": {
"defaultMessage": "Note for mobile devices."
},
"editor.try-welcome": {
"defaultMessage": "This edition space showcases some of the mindmap editor capabilities!"
},
@ -152,21 +158,15 @@
"icon-picker.show-images": {
"defaultMessage": "Show images"
},
"editor-panel.icon-title": {
"defaultMessage": "Icon"
},
"link.help_text": {
"defaultMessage": "Address is not valid"
},
"link.placeholder": {
"defaultMessage": "https://www.example.com"
},
"editor-panel.note-panel-title": {
"defaultMessage": "Note"
},
"icon.label": {
"defaultMessage": "Icon"
},
"editor-panel.link-panel-title": {
"defaultMessage": "Link"
},
"shortcut-help-pane.action": {
"defaultMessage": "Action"
},
@ -203,6 +203,9 @@
"shortcut-help-pane.deselect-all-topics": {
"defaultMessage": "Deselect all topics"
},
"shortcut-help-pane.drag-disconnect": {
"defaultMessage": "Disconnect topic"
},
"shortcut-help-pane.edit-multiline": {
"defaultMessage": "Add multi-line topic text"
},

15
packages/editor/lang/es.json
View File

@ -11,9 +11,7 @@
"editor.try-welcome-description-mobile": {
"defaultMessage": "Registrate para comenzar a crear, compartir y publicar una cantidad ilimitada de mapas mentales de forma gratuita. En dispositivos móbiles las funciones son limitadas. Use la versión de escritorio para tener las funciones completas."
},
"editor.edit-mobile": {
"defaultMessage": "Nota para dispositivos móbiles."
},
"editor.edit-description-mobile": {
"defaultMessage": "En dispositivos móbiles las funciones son limitadas. Use la versión de escritorio para tener las funciones completas."
},
@ -74,7 +72,7 @@
"editor-panel.note-panel-title": {
"defaultMessage": "Nota"
},
"icon.label": {
"editor-panel.icon-title": {
"defaultMessage": "Icono"
},
"editor-panel.link-panel-title": {
@ -253,5 +251,14 @@
},
"editor-panel.tooltip-topic-fill-color-default": {
"defaultMessage": "Color de relleno por defecto"
},
"action.delete": {
"defaultMessage": "Borrar"
},
"editor-panel.tooltip-topic-font-color-default": {
"defaultMessage": "Color por defecto"
},
"shortcut-help-pane.drag-disconnect": {
"defaultMessage": "Desconectar tópico"
}
}

16
packages/editor/lang/fr.json
View File

@ -11,9 +11,6 @@
"editor.try-welcome-description-mobile": {
"defaultMessage": "Inscrivez-vous pour commencer à créer, partager et publier gratuitement un nombre illimité de cartes mentales. Les capacités d'édition limitées de mindmap sont prises en charge dans les appareils mobiles. Utilisez le navigateur de bureau pour bénéficier de toutes les fonctionnalités de l'éditeur."
},
"editor.edit-mobile": {
"defaultMessage": "Remarque pour les appareils mobiles."
},
"editor.edit-description-mobile": {
"defaultMessage": "Les capacités d'édition limitées de mindmap sont prises en charge dans les appareils mobiles. Utilisez le navigateur de bureau pour bénéficier de toutes les fonctionnalités de l'éditeur."
},
@ -74,7 +71,7 @@
"editor-panel.note-panel-title": {
"defaultMessage": "Note"
},
"icon.label": {
"editor-panel.icon-title": {
"defaultMessage": "Icône"
},
"editor-panel.link-panel-title": {
@ -252,6 +249,15 @@
"defaultMessage": "La couleur de remplissage"
},
"editor-panel.tooltip-topic-fill-color-default": {
"defaultMessage": "Color de relleno por defecto"
"defaultMessage": "Couleur de relleno por defecto"
},
"action.delete": {
"defaultMessage": "Supprimer"
},
"editor-panel.tooltip-topic-font-color-default": {
"defaultMessage": "Couleur par défaut"
},
"shortcut-help-pane.drag-disconnect": {
"defaultMessage": "Déconnecter le sujet"
}
}

8
packages/editor/src/classes/default-widget-manager/react-component.tsx
View File

@ -16,22 +16,22 @@
* limitations under the License.
*/
import React from 'react';
import TopicLink from '../../components/action-widget/pane/topic-link';
import TopicNote from '../../components/action-widget/pane/topic-note';
import TopicLinkEditor from '../../components/action-widget/pane/topic-link-editor';
import TopicNoteEditor from '../../components/action-widget/pane/topic-note-editor';
import NodeProperty from '../model/node-property';
const linkContent = (
linkModel: NodeProperty<string>,
closeModal: () => void,
): React.ReactElement => {
return <TopicLink closeModal={closeModal} urlModel={linkModel}></TopicLink>;
return <TopicLinkEditor closeModal={closeModal} urlModel={linkModel}></TopicLinkEditor>;
};
const noteContent = (
noteModel: NodeProperty<string>,
closeModal: () => void,
): React.ReactElement => {
return <TopicNote closeModal={closeModal} noteModel={noteModel}></TopicNote>;
return <TopicNoteEditor closeModal={closeModal} noteModel={noteModel}></TopicNoteEditor>;
};
export { linkContent, noteContent };

60
packages/editor/src/compiled-lang/de.json
View File

@ -11,6 +11,12 @@
"value": "Abbrechen"
}
],
"action.delete": [
{
"type": 0,
"value": "Löschen"
}
],
"action.share": [
{
"type": 0,
@ -101,6 +107,24 @@
"value": "Rückgängig"
}
],
"editor-panel.icon-title": [
{
"type": 0,
"value": "Symbol"
}
],
"editor-panel.link-panel-title": [
{
"type": 0,
"value": "Link"
}
],
"editor-panel.note-panel-title": [
{
"type": 0,
"value": "Notiz"
}
],
"editor-panel.tooltip-add-icon": [
{
"type": 0,
@ -221,6 +245,12 @@
"value": "Farbe"
}
],
"editor-panel.tooltip-topic-font-color-default": [
{
"type": 0,
"value": "Farbe defekt"
}
],
"editor-panel.tooltip-topic-font-italic": [
{
"type": 0,
@ -275,12 +305,6 @@
"value": "Eingeschränkte Funktionen der Mindmap-Edition werden auf Mobilgeräten unterstützt. Verwenden Sie den Desktop-Browser für vollständige Editorfunktionen."
}
],
"editor.edit-mobile": [
{
"type": 0,
"value": "Hinweis für Mobilgeräte."
}
],
"editor.try-welcome": [
{
"type": 0,
@ -311,24 +335,12 @@
"value": "Bilder anzeigen"
}
],
"icon.label": [
{
"type": 0,
"value": "Symbol"
}
],
"link.help_text": [
{
"type": 0,
"value": "Ingültige Adresse"
}
],
"editor-panel.link-panel-title": [
{
"type": 0,
"value": "Link"
}
],
"link.placeholder": [
{
"type": 0,
@ -341,12 +353,6 @@
"value": "Anmeldung"
}
],
"editor-panel.note-panel-title": [
{
"type": 0,
"value": "Notiz"
}
],
"shortcut-help-pane.action": [
{
"type": 0,
@ -419,6 +425,12 @@
"value": "Alle Themen auswählen"
}
],
"shortcut-help-pane.drag-disconnect": [
{
"type": 0,
"value": "Color de relleno por defekto"
}
],
"shortcut-help-pane.edit-multiline": [
{
"type": 0,

58
packages/editor/src/compiled-lang/en.json
View File

@ -5,10 +5,10 @@
"value": "Accept"
}
],
"action.cancel": [
"action.delete": [
{
"type": 0,
"value": "Cancel"
"value": "Delete"
}
],
"appbar.back-to-map-list": [
@ -95,6 +95,24 @@
"value": "Undo"
}
],
"editor-panel.icon-title": [
{
"type": 0,
"value": "Icon"
}
],
"editor-panel.link-panel-title": [
{
"type": 0,
"value": "Link"
}
],
"editor-panel.note-panel-title": [
{
"type": 0,
"value": "Note"
}
],
"editor-panel.tooltip-add-icon": [
{
"type": 0,
@ -215,6 +233,12 @@
"value": "Color"
}
],
"editor-panel.tooltip-topic-font-color-default": [
{
"type": 0,
"value": "Default color"
}
],
"editor-panel.tooltip-topic-font-italic": [
{
"type": 0,
@ -269,12 +293,6 @@
"value": "Limited mindmap edition capabilities are supported in Mobile devices. Use Desktop browser for full editor capabilities."
}
],
"editor.edit-mobile": [
{
"type": 0,
"value": "Note for mobile devices."
}
],
"editor.try-welcome": [
{
"type": 0,
@ -305,36 +323,18 @@
"value": "Show images"
}
],
"icon.label": [
{
"type": 0,
"value": "Icon"
}
],
"link.help_text": [
{
"type": 0,
"value": "Address is not valid"
}
],
"editor-panel.link-panel-title": [
{
"type": 0,
"value": "Link"
}
],
"link.placeholder": [
{
"type": 0,
"value": "https://www.example.com"
}
],
"editor-panel.note-panel-title": [
{
"type": 0,
"value": "Note"
}
],
"shortcut-help-pane.action": [
{
"type": 0,
@ -407,6 +407,12 @@
"value": "Deselect all topics"
}
],
"shortcut-help-pane.drag-disconnect": [
{
"type": 0,
"value": "Disconnect topic"
}
],
"shortcut-help-pane.edit-multiline": [
{
"type": 0,

60
packages/editor/src/compiled-lang/es.json
View File

@ -11,6 +11,12 @@
"value": "Cancelar"
}
],
"action.delete": [
{
"type": 0,
"value": "Borrar"
}
],
"appbar.back-to-map-list": [
{
"type": 0,
@ -95,6 +101,24 @@
"value": "Deshacer"
}
],
"editor-panel.icon-title": [
{
"type": 0,
"value": "Icono"
}
],
"editor-panel.link-panel-title": [
{
"type": 0,
"value": "Enlace"
}
],
"editor-panel.note-panel-title": [
{
"type": 0,
"value": "Nota"
}
],
"editor-panel.tooltip-add-icon": [
{
"type": 0,
@ -215,6 +239,12 @@
"value": "Color"
}
],
"editor-panel.tooltip-topic-font-color-default": [
{
"type": 0,
"value": "Color por defecto"
}
],
"editor-panel.tooltip-topic-font-italic": [
{
"type": 0,
@ -269,12 +299,6 @@
"value": "En dispositivos móbiles las funciones son limitadas. Use la versión de escritorio para tener las funciones completas."
}
],
"editor.edit-mobile": [
{
"type": 0,
"value": "Nota para dispositivos móbiles."
}
],
"editor.try-welcome": [
{
"type": 0,
@ -305,36 +329,18 @@
"value": "Mostrar imagenes"
}
],
"icon.label": [
{
"type": 0,
"value": "Icono"
}
],
"link.help_text": [
{
"type": 0,
"value": "Dirección invalida"
}
],
"editor-panel.link-panel-title": [
{
"type": 0,
"value": "Enlace"
}
],
"link.placeholder": [
{
"type": 0,
"value": "https://www.example.com"
}
],
"editor-panel.note-panel-title": [
{
"type": 0,
"value": "Nota"
}
],
"shortcut-help-pane.action": [
{
"type": 0,
@ -407,6 +413,12 @@
"value": "Deseleccionar tópicos"
}
],
"shortcut-help-pane.drag-disconnect": [
{
"type": 0,
"value": "Desconectar tópico"
}
],
"shortcut-help-pane.edit-multiline": [
{
"type": 0,

62
packages/editor/src/compiled-lang/fr.json
View File

@ -11,6 +11,12 @@
"value": "Annuler"
}
],
"action.delete": [
{
"type": 0,
"value": "Supprimer"
}
],
"appbar.back-to-map-list": [
{
"type": 0,
@ -95,6 +101,24 @@
"value": "Annuler édition"
}
],
"editor-panel.icon-title": [
{
"type": 0,
"value": "Icône"
}
],
"editor-panel.link-panel-title": [
{
"type": 0,
"value": "Lien"
}
],
"editor-panel.note-panel-title": [
{
"type": 0,
"value": "Note"
}
],
"editor-panel.tooltip-add-icon": [
{
"type": 0,
@ -194,7 +218,7 @@
"editor-panel.tooltip-topic-fill-color-default": [
{
"type": 0,
"value": "Color de relleno por defecto"
"value": "Couleur de relleno por defecto"
}
],
"editor-panel.tooltip-topic-font-bigger": [
@ -215,6 +239,12 @@
"value": "Couleur"
}
],
"editor-panel.tooltip-topic-font-color-default": [
{
"type": 0,
"value": "Couleur par défaut"
}
],
"editor-panel.tooltip-topic-font-italic": [
{
"type": 0,
@ -269,12 +299,6 @@
"value": "Les capacités d'édition limitées de mindmap sont prises en charge dans les appareils mobiles. Utilisez le navigateur de bureau pour bénéficier de toutes les fonctionnalités de l'éditeur."
}
],
"editor.edit-mobile": [
{
"type": 0,
"value": "Remarque pour les appareils mobiles."
}
],
"editor.try-welcome": [
{
"type": 0,
@ -305,36 +329,18 @@
"value": "Afficher les images"
}
],
"icon.label": [
{
"type": 0,
"value": "Icône"
}
],
"link.help_text": [
{
"type": 0,
"value": "Adresse invalide"
}
],
"editor-panel.link-panel-title": [
{
"type": 0,
"value": "Lien"
}
],
"link.placeholder": [
{
"type": 0,
"value": "https://www.example.com"
}
],
"editor-panel.note-panel-title": [
{
"type": 0,
"value": "Note"
}
],
"shortcut-help-pane.action": [
{
"type": 0,
@ -407,6 +413,12 @@
"value": "Désélectionner tous les sujets"
}
],
"shortcut-help-pane.drag-disconnect": [
{
"type": 0,
"value": "Déconnecter le sujet"
}
],
"shortcut-help-pane.edit-multiline": [
{
"type": 0,

12
packages/editor/src/components/action-widget/pane/keyboard-shortcut-help/index.tsx
View File

@ -128,6 +128,7 @@ const KeyboardShorcutsHelp = (): ReactElement => {
<td>Ctrl + Enter</td>
<td>⌘ + Enter</td>
</tr>
<tr>
<td>
<FormattedMessage
@ -138,7 +139,16 @@ const KeyboardShorcutsHelp = (): ReactElement => {
<td>Ctrl + C / Ctrl + V</td>
<td>⌘ + C / ⌘ + V</td>
</tr>
<tr>
<td>
<FormattedMessage
id="shortcut-help-pane.drag-disconnect"
defaultMessage="Disconnect topic"
/>
</td>
<td>Ctrl + drag topic</td>
<td>⌘ + drag topic</td>
</tr>
<tr>
<td>
<FormattedMessage

24
packages/editor/src/components/action-widget/pane/save-and-delete/index.tsx
View File

@ -17,10 +17,8 @@
*/
import Box from '@mui/material/Box';
import Button from '@mui/material/Button';
import IconButton from '@mui/material/IconButton';
import React, { ReactElement } from 'react';
import NodeProperty from '../../../../classes/model/node-property';
import DeleteOutlineOutlinedIcon from '@mui/icons-material/DeleteOutlineOutlined';
import { FormattedMessage } from 'react-intl';
const SaveAndDelete = (props: {
@ -28,21 +26,31 @@ const SaveAndDelete = (props: {
closeModal: () => void;
submitHandler: () => void;
}): ReactElement => {
const value = props.model.getValue();
return (
<Box component="span">
<Button color="primary" variant="contained" onClick={props.submitHandler} sx={{ mr: 1 }}>
<Box component="span" justifyContent="flex-end" display="flex" sx={{ pt: 1 }}>
<Button
color="primary"
variant="outlined"
onClick={props.submitHandler}
sx={{ mr: 1 }}
size="small"
>
<FormattedMessage id="action.accept" defaultMessage="Accept" />
</Button>
{props.model.getValue() && props.model.getValue().trim() !== '' && (
<IconButton
{value && value.trim() !== '' && (
<Button
color="secondary"
variant="outlined"
onClick={() => {
props.closeModal();
props.model.setValue(undefined);
}}
size="small"
>
<DeleteOutlineOutlinedIcon />
</IconButton>
<FormattedMessage id="action.delete" defaultMessage="Delete" />
</Button>
)}
</Box>
);

5
packages/editor/src/components/action-widget/pane/topic-link/index.tsx → packages/editor/src/components/action-widget/pane/topic-link-editor/index.tsx
View File

@ -29,7 +29,7 @@ import { useIntl } from 'react-intl';
/**
* Url form for toolbar and node contextual editor
*/
const TopicLink = (props: {
const TopicLinkEditor = (props: {
closeModal: () => void;
urlModel: NodeProperty<string>;
}): ReactElement => {
@ -91,7 +91,6 @@ const TopicLink = (props: {
),
}}
/>
<br />
<SaveAndDelete
model={props.urlModel}
closeModal={props.closeModal}
@ -101,4 +100,4 @@ const TopicLink = (props: {
);
};
export default TopicLink;
export default TopicLinkEditor;

4
packages/editor/src/components/action-widget/pane/topic-note/index.tsx → packages/editor/src/components/action-widget/pane/topic-note-editor/index.tsx
View File

@ -23,7 +23,7 @@ import SaveAndDelete from '../save-and-delete';
/**
* Note form for toolbar and node contextual editor
*/
const TopicNote = (props: {
const TopicNoteEditor = (props: {
closeModal: () => void;
noteModel: NodeProperty<string> | null;
}): ReactElement => {
@ -55,4 +55,4 @@ const TopicNote = (props: {
);
};
export default TopicNote;
export default TopicNoteEditor;

10
packages/editor/src/components/editor-toolbar/configBuilder.tsx
View File

@ -45,8 +45,8 @@ import ActionConfig from '../../classes/action/action-config';
import { SwitchValueDirection } from '../toolbar/ToolbarValueModelBuilder';
import NodePropertyValueModelBuilder from '../../classes/model/node-property-builder';
import ColorPicker from '../action-widget/pane/color-picker';
import TopicLink from '../action-widget/pane/topic-link';
import TopicNote from '../action-widget/pane/topic-note';
import TopicLinkEditor from '../action-widget/pane/topic-link-editor';
import TopicNoteEditor from '../action-widget/pane/topic-note-editor';
import IconPicker from '../action-widget/pane/icon-picker';
import FontFamilySelector from '../action-widget/button/font-family-selector';
import Editor from '../../classes/model/editor';
@ -364,7 +364,7 @@ export function buildEditorPanelConfig(model: Editor, intl: IntlShape): ActionCo
options: [
{
render: (closeModal) => (
<TopicLink closeModal={closeModal} urlModel={modelBuilder.getLinkModel()}></TopicLink>
<TopicLinkEditor closeModal={closeModal} urlModel={modelBuilder.getLinkModel()} />
),
},
],
@ -389,7 +389,7 @@ export function buildEditorPanelConfig(model: Editor, intl: IntlShape): ActionCo
defaultMessage: 'Note',
}),
render: (closeModal) => (
<TopicNote closeModal={closeModal} noteModel={modelBuilder.getNoteModel()} />
<TopicNoteEditor closeModal={closeModal} noteModel={modelBuilder.getNoteModel()} />
),
},
],
@ -406,7 +406,7 @@ export function buildEditorPanelConfig(model: Editor, intl: IntlShape): ActionCo
defaultMessage: 'Add Icon',
}),
useClickToClose: true,
title: intl.formatMessage({ id: 'icon.label', defaultMessage: 'Icon' }),
title: intl.formatMessage({ id: 'editor-panel.icon-title', defaultMessage: 'Icon' }),
options: [
{
tooltip: intl.formatMessage({

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

@ -214,7 +214,7 @@ class Designer extends Events {
dragManager.addEvent('dragging', (event: MouseEvent, dragTopic: DragTopic) => {
// The node is being drag. Is the connection still valid ?
dragConnector.checkConnection(dragTopic);
dragConnector.checkConnection(dragTopic, event.metaKey || event.ctrlKey);
if (!dragTopic.isVisible() && dragTopic.isConnected()) {
dragTopic.setVisibility(true);

12
packages/mindplot/src/components/DesignerKeyboard.ts
View File

@ -258,7 +258,7 @@ class DesignerKeyboard extends Keyboard {
}
}
private _goToSideChild(designer: Designer, node: Topic, side: 'LEFT' | 'RIGHT') {
private _goToSideChild(designer: Designer, node: Topic, side: 'LEFT' | 'RIGHT'): void {
const children = node.getChildren();
if (children.length > 0) {
let target = children[0];
@ -284,14 +284,14 @@ class DesignerKeyboard extends Keyboard {
}
}
private _goToParent(designer: Designer, node: Topic) {
private _goToParent(designer: Designer, node: Topic): void {
const parent = node.getParent();
if (parent) {
this._goToNode(designer, parent);
}
}
private _goToChild(designer: Designer, node: Topic) {
private _goToChild(designer: Designer, node: Topic): void {
const children = node.getChildren();
if (children.length > 0) {
let target = children[0];
@ -307,7 +307,7 @@ class DesignerKeyboard extends Keyboard {
}
}
private _goToNode(designer: Designer, node: Topic) {
private _goToNode(designer: Designer, node: Topic): void {
// First deselect all the nodes ...
designer.deselectAll();
@ -315,10 +315,10 @@ class DesignerKeyboard extends Keyboard {
node.setOnFocus(true);
}
static register = function register(designer: Designer) {
static register(designer: Designer) {
this._instance = new DesignerKeyboard(designer);
this._disabled = false;
};
}
static pause() {
this._disabled = true;

12
packages/mindplot/src/components/DragConnector.ts
View File

@ -36,11 +36,15 @@ class DragConnector {
this._workspace = workspace;
}
checkConnection(dragTopic: DragTopic): void {
// Must be disconnected from their current connection ?.
const candidates = this._searchConnectionCandidates(dragTopic);
const currentConnection = dragTopic.getConnectedToTopic();
checkConnection(dragTopic: DragTopic, forceDisconnected: boolean): void {
// Is forced disconexion enabled ?
let candidates: Topic[] = [];
if (!forceDisconnected) {
candidates = this._searchConnectionCandidates(dragTopic);
}
// Must be disconnected from their current connection ?.
const currentConnection = dragTopic.getConnectedToTopic();
if (currentConnection && (candidates.length === 0 || candidates[0] !== currentConnection)) {
dragTopic.disconnect(this._workspace);
}

38
packages/mindplot/src/components/DragManager.ts
View File

@ -15,7 +15,7 @@
* See the License for the specific language governing permissions and
* limitations under the License.
*/
import { $assert, $defined } from '@wisemapping/core-js';
import { $assert } from '@wisemapping/core-js';
import DragTopic from './DragTopic';
import EventBusDispatcher from './layout/EventBusDispatcher';
import Topic from './Topic';
@ -55,10 +55,10 @@ class DragManager {
// Set initial position.
const layoutManager = me._eventDispatcher.getLayoutManager();
const dragNode = topic.createDragNode(layoutManager);
const dragNode: DragTopic = topic.createDragNode(layoutManager);
// Register mouse move listener ...
const mouseMoveListener = dragManager._buildMouseMoveListener(
const mouseMoveListener = dragManager.buildMouseMoveListener(
workspace,
dragNode,
dragManager,
@ -80,19 +80,21 @@ class DragManager {
throw new Error('Not implemented: DragManager.prototype.remove');
}
protected _buildMouseMoveListener(workspace: Workspace, dragNode, dragManager: DragManager) {
protected buildMouseMoveListener(
workspace: Workspace,
dragNode: DragTopic,
dragManager: DragManager,
): (event: MouseEvent) => void {
const screen = workspace.getScreenManager();
const me = this;
const result = (event) => {
if (!me._isDragInProcess) {
const result = (event: MouseEvent) => {
if (!this._isDragInProcess) {
// Execute Listeners ..
const startDragListener = dragManager._listeners.startdragging;
startDragListener(event, dragNode);
// Add shadow node to the workspace.
workspace.append(dragNode);
me._isDragInProcess = true;
this._isDragInProcess = true;
}
const pos = screen.getWorkspaceMousePosition(event);
@ -100,7 +102,7 @@ class DragManager {
// Call mouse move listeners ...
const dragListener = dragManager._listeners.dragging;
if ($defined(dragListener)) {
if (dragListener) {
dragListener(event, dragNode);
}
@ -112,9 +114,12 @@ class DragManager {
return result;
}
protected _buildMouseUpListener(workspace: Workspace, dragNode, dragManager: DragManager) {
protected _buildMouseUpListener(
workspace: Workspace,
dragNode: DragTopic,
dragManager: DragManager,
) {
const screen = workspace.getScreenManager();
const me = this;
const result = (event: Event) => {
$assert(dragNode.isDragTopic, 'dragNode must be an DragTopic');
@ -131,7 +136,7 @@ class DragManager {
// Change the cursor to the default.
window.document.body.style.cursor = 'default';
if (me._isDragInProcess) {
if (this._isDragInProcess) {
// Execute Listeners only if the node has been moved.
const endDragListener = dragManager._listeners.enddragging;
endDragListener(event, dragNode);
@ -139,14 +144,17 @@ class DragManager {
// Remove drag node from the workspace.
dragNode.removeFromWorkspace(workspace);
me._isDragInProcess = false;
this._isDragInProcess = false;
}
};
dragManager._mouseUpListener = result;
return result;
}
addEvent(type: 'startdragging' | 'dragging' | 'enddragging', listener) {
addEvent(
type: 'startdragging' | 'dragging' | 'enddragging',
listener: (event: MouseEvent, dragTopic: DragTopic) => void,
) {
this._listeners[type] = listener;
}
}

3
packages/mindplot/src/components/DragTopic.ts
View File

@ -70,13 +70,14 @@ class DragTopic {
this._elem2d.setPosition(cx, cy);
// In case is not free, pivot must be draw ...
if (this.isConnected() && !this.isFreeLayoutOn()) {
if (this.isConnected()) {
const parent = this.getConnectedToTopic();
const predict = this._layoutManager.predict(
parent!.getId(),
this._draggedNode.getId(),
this.getPosition(),
);
if (this._order !== predict.order) {
const dragPivot = this._getDragPivot();
const pivotPosition = predict.position;

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

@ -95,7 +95,7 @@ abstract class NodeGraph {
}
/** */
setMouseEventsEnabled(isEnabled) {
setMouseEventsEnabled(isEnabled: boolean) {
this._mouseEvents = isEnabled;
}
@ -163,7 +163,7 @@ abstract class NodeGraph {
workspace.removeChild(this);
}
createDragNode(layoutManager: LayoutManager) {
createDragNode(layoutManager: LayoutManager): DragTopic {
const dragShape = this._buildDragShape();
return new DragTopic(dragShape, this, layoutManager);

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

@ -46,6 +46,7 @@ import ColorUtil from './render/ColorUtil';
import Icon from './Icon';
import { FontStyleType } from './FontStyleType';
import { FontWeightType } from './FontWeightType';
import DragTopic from './DragTopic';
const ICON_SCALING_FACTOR = 1.3;
@ -1135,7 +1136,7 @@ abstract class Topic extends NodeGraph {
return this._isInWorkspace;
}
createDragNode(layoutManager: LayoutManager) {
createDragNode(layoutManager: LayoutManager): DragTopic {
const result = super.createDragNode(layoutManager);
// Is the node already connected ?

4
packages/mindplot/src/components/layout/ChildrenSorterStrategy.ts
View File

@ -30,10 +30,10 @@ abstract class ChildrenSorterStrategy {
abstract predict(
treeSet: RootedTreeSet,
parent,
parent: Node,
node: Node | null,
position: PositionType | null,
): void;
);
abstract verify(treeSet: RootedTreeSet, node: Node): void;

2
packages/mindplot/src/components/layout/LayoutManager.ts
View File

@ -131,8 +131,6 @@ class LayoutManager extends Events {
nodeId: number | null,
position: PositionType | null,
): { order: number; position: PositionType } {
$assert($defined(parentId), 'parentId can not be null');
const parent = this._treeSet.find(parentId);
const node = nodeId ? this._treeSet.find(nodeId) : null;
const sorter = parent.getSorter();