mirror of
https://bitbucket.org/wisemapping/wisemapping-frontend.git
synced 2024-11-13 02:37:57 +01:00
Migrate to ts node graph.
This commit is contained in:
parent
c58f434509
commit
49efa9c340
@ -56,6 +56,7 @@ import { DesignerOptions } from './DesignerOptionsBuilder';
|
||||
import MainTopic from './MainTopic';
|
||||
import DragTopic from './DragTopic';
|
||||
import CentralTopic from './CentralTopic';
|
||||
import FeatureType from './model/FeatureType';
|
||||
|
||||
class Designer extends Events {
|
||||
private _mindmap: Mindmap;
|
||||
@ -890,7 +891,7 @@ class Designer extends Events {
|
||||
addIconType(iconType: string): void {
|
||||
const topicsIds = this.getModel().filterTopicsIds();
|
||||
if (topicsIds.length > 0) {
|
||||
this._actionDispatcher.addFeatureToTopic(topicsIds[0], TopicFeatureFactory.Icon.id, {
|
||||
this._actionDispatcher.addFeatureToTopic(topicsIds[0], TopicFeatureFactory.Icon.id as FeatureType, {
|
||||
id: iconType,
|
||||
});
|
||||
}
|
||||
|
@ -17,11 +17,11 @@
|
||||
*/
|
||||
import { $assert } from '@wisemapping/core-js';
|
||||
import PersistenceManager from './PersistenceManager';
|
||||
import { Size } from './Size';
|
||||
import SizeType from './SizeType';
|
||||
|
||||
export type DesignerOptions = {
|
||||
zoom: number,
|
||||
containerSize?: Size,
|
||||
containerSize?: SizeType,
|
||||
readOnly?: boolean,
|
||||
mapId?: string,
|
||||
container: string,
|
||||
|
@ -16,17 +16,29 @@
|
||||
* limitations under the License.
|
||||
*/
|
||||
import { $assert } from '@wisemapping/core-js';
|
||||
import { ElementClass } from '@wisemapping/web2d';
|
||||
import TopicConfig from './TopicConfig';
|
||||
import NodeModel from './model/NodeModel';
|
||||
import Workspace from './Workspace';
|
||||
import DragTopic from './DragTopic';
|
||||
import LayoutManager from './layout/LayoutManager';
|
||||
import SizeType from './SizeType';
|
||||
import PositionType from './PositionType';
|
||||
|
||||
class NodeGraph {
|
||||
/**
|
||||
* @constructs
|
||||
* @param {mindplot.model.NodeModel} nodeModel
|
||||
* @param {Object<Number, String, Boolean>} options
|
||||
* @throws will throw an error if nodeModel is null or undefined
|
||||
*/
|
||||
constructor(nodeModel, options) {
|
||||
abstract class NodeGraph {
|
||||
private _mouseEvents: boolean;
|
||||
|
||||
private _options;
|
||||
|
||||
private _onFocus: boolean;
|
||||
|
||||
private _size: SizeType;
|
||||
|
||||
private _model: NodeModel;
|
||||
|
||||
private _elem2d: ElementClass;
|
||||
|
||||
constructor(nodeModel: NodeModel, options) {
|
||||
$assert(nodeModel, 'model can not be null');
|
||||
|
||||
this._options = options;
|
||||
@ -36,46 +48,33 @@ class NodeGraph {
|
||||
this._size = { width: 50, height: 20 };
|
||||
}
|
||||
|
||||
/** @return true if option is set to read-only */
|
||||
isReadOnly() {
|
||||
isReadOnly(): boolean {
|
||||
return this._options.readOnly;
|
||||
}
|
||||
|
||||
/** @return model type */
|
||||
getType() {
|
||||
getType(): string {
|
||||
const model = this.getModel();
|
||||
return model.getType();
|
||||
}
|
||||
|
||||
/**
|
||||
* @param {String} id
|
||||
* @throws will throw an error if the topic id is not a number
|
||||
*/
|
||||
setId(id) {
|
||||
setId(id: number) {
|
||||
$assert(typeof id === 'number', `id is not a number:${id}`);
|
||||
this.getModel().setId(id);
|
||||
}
|
||||
|
||||
_set2DElement(elem2d) {
|
||||
protected _set2DElement(elem2d: ElementClass) {
|
||||
this._elem2d = elem2d;
|
||||
}
|
||||
|
||||
/**
|
||||
* @return 2D element
|
||||
* @throws will throw an error if the element is null or undefined within node graph
|
||||
*/
|
||||
get2DElement() {
|
||||
get2DElement(): ElementClass {
|
||||
$assert(this._elem2d, 'NodeGraph has not been initialized properly');
|
||||
return this._elem2d;
|
||||
}
|
||||
|
||||
/** @abstract */
|
||||
setPosition(point, fireEvent) {
|
||||
throw new Error('Unsupported operation');
|
||||
}
|
||||
abstract setPosition(point, fireEvent): void;
|
||||
|
||||
/** */
|
||||
addEvent(type, listener) {
|
||||
addEvent(type: string, listener) {
|
||||
const elem = this.get2DElement();
|
||||
elem.addEvent(type, listener);
|
||||
}
|
||||
@ -102,41 +101,30 @@ class NodeGraph {
|
||||
return this._mouseEvents;
|
||||
}
|
||||
|
||||
/** @return {Object<Number>} size */
|
||||
getSize() {
|
||||
getSize(): SizeType {
|
||||
return this._size;
|
||||
}
|
||||
|
||||
/** @param {Object<Number>} size */
|
||||
setSize(size) {
|
||||
this._size.width = parseInt(size.width, 10);
|
||||
this._size.height = parseInt(size.height, 10);
|
||||
}
|
||||
|
||||
/**
|
||||
* @return {mindplot.model.NodeModel} the node model
|
||||
*/
|
||||
getModel() {
|
||||
getModel(): NodeModel {
|
||||
$assert(this._model, 'Model has not been initialized yet');
|
||||
return this._model;
|
||||
}
|
||||
|
||||
/**
|
||||
* @param {mindplot.NodeModel} model the node model
|
||||
* @throws will throw an error if model is null or undefined
|
||||
*/
|
||||
setModel(model) {
|
||||
setModel(model: NodeModel) {
|
||||
$assert(model, 'Model can not be null');
|
||||
this._model = model;
|
||||
}
|
||||
|
||||
/** */
|
||||
getId() {
|
||||
getId(): number {
|
||||
return this._model.getId();
|
||||
}
|
||||
|
||||
/** */
|
||||
setOnFocus(focus) {
|
||||
setOnFocus(focus: boolean) {
|
||||
if (this._onFocus !== focus) {
|
||||
this._onFocus = focus;
|
||||
const outerShape = this.getOuterShape();
|
||||
@ -157,29 +145,30 @@ class NodeGraph {
|
||||
}
|
||||
}
|
||||
|
||||
/** @return {Boolean} true if the node graph is on focus */
|
||||
isOnFocus() {
|
||||
abstract closeEditors(): void;
|
||||
|
||||
abstract setCursor(type: string): void;
|
||||
|
||||
abstract getOuterShape(): ElementClass;
|
||||
|
||||
isOnFocus(): boolean {
|
||||
return this._onFocus;
|
||||
}
|
||||
|
||||
/** */
|
||||
dispose(workspace) {
|
||||
dispose(workspace: Workspace) {
|
||||
this.setOnFocus(false);
|
||||
workspace.removeChild(this);
|
||||
}
|
||||
|
||||
/** */
|
||||
createDragNode(layoutManager) {
|
||||
createDragNode(layoutManager: LayoutManager) {
|
||||
const dragShape = this._buildDragShape();
|
||||
return new DragTopic(dragShape, this, layoutManager);
|
||||
}
|
||||
|
||||
_buildDragShape() {
|
||||
$assert(false, '_buildDragShape must be implemented by all nodes.');
|
||||
}
|
||||
abstract _buildDragShape();
|
||||
|
||||
/** */
|
||||
getPosition() {
|
||||
getPosition(): PositionType {
|
||||
const model = this.getModel();
|
||||
return model.getPosition();
|
||||
}
|
20
packages/mindplot/src/components/PositionType.ts
Normal file
20
packages/mindplot/src/components/PositionType.ts
Normal file
@ -0,0 +1,20 @@
|
||||
/*
|
||||
* Copyright [2021] [wisemapping]
|
||||
*
|
||||
* Licensed under WiseMapping Public License, Version 1.0 (the "License").
|
||||
* It is basically the Apache License, Version 2.0 (the "License") plus the
|
||||
* "powered by wisemapping" text requirement on every single page;
|
||||
* you may not use this file except in compliance with the License.
|
||||
* You may obtain a copy of the license at
|
||||
*
|
||||
* http://www.wisemapping.org/license
|
||||
*
|
||||
* Unless required by applicable law or agreed to in writing, software
|
||||
* distributed under the License is distributed on an "AS IS" BASIS,
|
||||
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
||||
* See the License for the specific language governing permissions and
|
||||
* limitations under the License.
|
||||
*/
|
||||
type PositionType = { x: number, y: number };
|
||||
|
||||
export default PositionType;
|
@ -154,8 +154,8 @@ class RelationshipPivot {
|
||||
const controlPoint = Shape.calculateDefaultControlPoints(sourcePosition, toPosition);
|
||||
|
||||
const spoint = new Point();
|
||||
spoint.x = parseInt(controlPoint[0].x, 10) + parseInt(sourcePosition.x, 10);
|
||||
spoint.y = parseInt(controlPoint[0].y, 10) + parseInt(sourcePosition.y, 10);
|
||||
spoint.x = parseInt(controlPoint[0].x, 10) + sourcePosition.x;
|
||||
spoint.y = parseInt(controlPoint[0].y, 10) + sourcePosition.y;
|
||||
return Shape.calculateRelationShipPointCoordinates(this._sourceTopic, spoint);
|
||||
}
|
||||
|
||||
|
@ -1,4 +0,0 @@
|
||||
export type Size = {
|
||||
width: number;
|
||||
height: number;
|
||||
};
|
23
packages/mindplot/src/components/SizeType.ts
Normal file
23
packages/mindplot/src/components/SizeType.ts
Normal file
@ -0,0 +1,23 @@
|
||||
/*
|
||||
* Copyright [2021] [wisemapping]
|
||||
*
|
||||
* Licensed under WiseMapping Public License, Version 1.0 (the "License").
|
||||
* It is basically the Apache License, Version 2.0 (the "License") plus the
|
||||
* "powered by wisemapping" text requirement on every single page;
|
||||
* you may not use this file except in compliance with the License.
|
||||
* You may obtain a copy of the license at
|
||||
*
|
||||
* http://www.wisemapping.org/license
|
||||
*
|
||||
* Unless required by applicable law or agreed to in writing, software
|
||||
* distributed under the License is distributed on an "AS IS" BASIS,
|
||||
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
||||
* See the License for the specific language governing permissions and
|
||||
* limitations under the License.
|
||||
*/
|
||||
type SizeType = {
|
||||
width: number;
|
||||
height: number;
|
||||
};
|
||||
|
||||
export default SizeType;
|
@ -34,6 +34,7 @@ import NodeModel from './model/NodeModel';
|
||||
import RelationshipModel from './model/RelationshipModel';
|
||||
import Topic from './Topic';
|
||||
import Command from './Command';
|
||||
import FeatureType from './model/FeatureType';
|
||||
|
||||
class StandaloneActionDispatcher extends ActionDispatcher {
|
||||
private _actionRunner: DesignerActionRunner;
|
||||
@ -252,7 +253,7 @@ class StandaloneActionDispatcher extends ActionDispatcher {
|
||||
}
|
||||
|
||||
/** */
|
||||
addFeatureToTopic(topicId: number, featureType: string, attributes) {
|
||||
addFeatureToTopic(topicId: number, featureType: FeatureType, attributes) {
|
||||
const command = new AddFeatureToTopicCommand(topicId, featureType, attributes);
|
||||
this.execute(command);
|
||||
}
|
||||
|
@ -18,7 +18,7 @@
|
||||
import { $assert, $defined } from '@wisemapping/core-js';
|
||||
import { Workspace as Workspace2D, ElementClass as Element2D } from '@wisemapping/web2d';
|
||||
import ScreenManager from './ScreenManager';
|
||||
import { Size } from './Size';
|
||||
import SizeType from './SizeType';
|
||||
|
||||
class Workspace {
|
||||
private _zoom: number;
|
||||
@ -27,13 +27,13 @@ class Workspace {
|
||||
|
||||
private _isReadOnly: boolean;
|
||||
|
||||
private _containerSize: Size;
|
||||
private _containerSize: SizeType;
|
||||
|
||||
private _workspace: Workspace2D;
|
||||
|
||||
private _eventsEnabled: boolean;
|
||||
|
||||
private _visibleAreaSize: Size;
|
||||
private _visibleAreaSize: SizeType;
|
||||
|
||||
constructor(screenManager: ScreenManager, zoom: number, isReadOnly: boolean) {
|
||||
// Create a suitable container ...
|
||||
@ -61,7 +61,7 @@ class Workspace {
|
||||
this._eventsEnabled = true;
|
||||
|
||||
// Readjust if the window is resized ...
|
||||
window.addEventListener('resize', (event) => {
|
||||
window.addEventListener('resize', () => {
|
||||
this._adjustWorkspace();
|
||||
});
|
||||
|
||||
@ -76,7 +76,7 @@ class Workspace {
|
||||
return this._isReadOnly;
|
||||
}
|
||||
|
||||
private _createWorkspace():Workspace2D {
|
||||
private _createWorkspace(): Workspace2D {
|
||||
// Initialize workspace ...
|
||||
const browserVisibleSize = this._screenManager.getVisibleBrowserSize();
|
||||
const coordOriginX = -(browserVisibleSize.width / 2);
|
||||
@ -96,7 +96,7 @@ class Workspace {
|
||||
return new Workspace2D(workspaceProfile);
|
||||
}
|
||||
|
||||
append(shape:Element2D):void {
|
||||
append(shape: Element2D): void {
|
||||
if ($defined(shape.addToWorkspace)) {
|
||||
shape.addToWorkspace(this);
|
||||
} else {
|
||||
@ -104,7 +104,7 @@ class Workspace {
|
||||
}
|
||||
}
|
||||
|
||||
removeChild(shape:Element2D):void {
|
||||
removeChild(shape: Element2D): void {
|
||||
// Element is a node, not a web2d element?
|
||||
if ($defined(shape.removeFromWorkspace)) {
|
||||
shape.removeFromWorkspace(this);
|
||||
@ -113,17 +113,17 @@ class Workspace {
|
||||
}
|
||||
}
|
||||
|
||||
addEvent(type: string, listener):void {
|
||||
addEvent(type: string, listener): void {
|
||||
this._workspace.addEvent(type, listener);
|
||||
}
|
||||
|
||||
removeEvent(type: string, listener):void {
|
||||
removeEvent(type: string, listener): void {
|
||||
$assert(type, 'type can not be null');
|
||||
$assert(listener, 'listener can not be null');
|
||||
this._workspace.removeEvent(type, listener);
|
||||
}
|
||||
|
||||
getSize():Size {
|
||||
getSize(): SizeType {
|
||||
return this._workspace.getCoordSize();
|
||||
}
|
||||
|
||||
|
@ -18,11 +18,12 @@
|
||||
import { $assert, $defined } from '@wisemapping/core-js';
|
||||
import Command from '../Command';
|
||||
import CommandContext from '../CommandContext';
|
||||
import FeatureType from '../model/FeatureType';
|
||||
|
||||
class AddFeatureToTopicCommand extends Command {
|
||||
private _topicId: number;
|
||||
|
||||
private _featureType: string;
|
||||
private _featureType: FeatureType;
|
||||
|
||||
private _attributes: object;
|
||||
|
||||
@ -38,7 +39,7 @@ class AddFeatureToTopicCommand extends Command {
|
||||
* @extends mindplot.Command
|
||||
* @see mindplot.model.FeatureModel and subclasses
|
||||
*/
|
||||
constructor(topicId: number, featureType: string, attributes: object) {
|
||||
constructor(topicId: number, featureType: FeatureType, attributes: object) {
|
||||
$assert($defined(topicId), 'topicId can not be null');
|
||||
$assert(featureType, 'featureType can not be null');
|
||||
$assert(attributes, 'attributes can not be null');
|
||||
|
@ -16,8 +16,7 @@
|
||||
* limitations under the License.
|
||||
*/
|
||||
import { $assert } from '@wisemapping/core-js';
|
||||
|
||||
export type FeatureType = 'note' | 'link' | 'icon';
|
||||
import FeatureType from './FeatureType';
|
||||
|
||||
class FeatureModel {
|
||||
static _next_id = 0;
|
||||
|
@ -2,7 +2,8 @@ import { $assert } from '@wisemapping/core-js';
|
||||
import IconModel from './IconModel';
|
||||
import LinkModel from './LinkModel';
|
||||
import NoteModel from './NoteModel';
|
||||
import FeatureModel, { FeatureType } from './FeatureModel';
|
||||
import FeatureModel from './FeatureModel';
|
||||
import FeatureType from './FeatureType';
|
||||
|
||||
interface NodeById {
|
||||
id: FeatureType,
|
||||
|
20
packages/mindplot/src/components/model/FeatureType.ts
Normal file
20
packages/mindplot/src/components/model/FeatureType.ts
Normal file
@ -0,0 +1,20 @@
|
||||
/*
|
||||
* Copyright [2021] [wisemapping]
|
||||
*
|
||||
* Licensed under WiseMapping Public License, Version 1.0 (the "License").
|
||||
* It is basically the Apache License, Version 2.0 (the "License") plus the
|
||||
* "powered by wisemapping" text requirement on every single page;
|
||||
* you may not use this file except in compliance with the License.
|
||||
* You may obtain a copy of the license at
|
||||
*
|
||||
* http://www.wisemapping.org/license
|
||||
*
|
||||
* Unless required by applicable law or agreed to in writing, software
|
||||
* distributed under the License is distributed on an "AS IS" BASIS,
|
||||
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
||||
* See the License for the specific language governing permissions and
|
||||
* limitations under the License.
|
||||
*/
|
||||
type FeatureType = 'note' | 'link' | 'icon';
|
||||
|
||||
export default FeatureType;
|
@ -17,6 +17,7 @@
|
||||
* limitations under the License.
|
||||
*/
|
||||
import { $assert, $defined } from '@wisemapping/core-js';
|
||||
import PositionType from '../PositionType';
|
||||
import FeatureModel from './FeatureModel';
|
||||
import Mindmap from './Mindmap';
|
||||
|
||||
@ -76,7 +77,7 @@ abstract class INodeModel {
|
||||
this.putProperty('position', `{x:${x},y:${y}}`);
|
||||
}
|
||||
|
||||
getPosition(): { x: number, y: number } {
|
||||
getPosition(): PositionType {
|
||||
const value = this.getProperty('position') as string;
|
||||
let result;
|
||||
if (value != null) {
|
||||
|
@ -19,8 +19,9 @@ import { $assert, $defined } from '@wisemapping/core-js';
|
||||
import cloneDeep from 'lodash/cloneDeep';
|
||||
import INodeModel, { NodeModelType } from './INodeModel';
|
||||
import FeatureModelFactory from './FeatureModelFactory';
|
||||
import FeatureModel, { FeatureType } from './FeatureModel';
|
||||
import FeatureModel from './FeatureModel';
|
||||
import Mindmap from './Mindmap';
|
||||
import FeatureType from './FeatureType';
|
||||
|
||||
class NodeModel extends INodeModel {
|
||||
private _properties: Record<string, string | number | boolean>;
|
||||
|
@ -22,9 +22,9 @@ import { TopicShape } from '../model/INodeModel';
|
||||
import ConnectionLine from '../ConnectionLine';
|
||||
import FeatureModelFactory from '../model/FeatureModelFactory';
|
||||
import NodeModel from '../model/NodeModel';
|
||||
import { FeatureType } from '../model/FeatureModel';
|
||||
import RelationshipModel from '../model/RelationshipModel';
|
||||
import XMLMindmapSerializer from './XMLMindmapSerializer';
|
||||
import FeatureType from '../model/FeatureType';
|
||||
|
||||
class XMLSerializerPela implements XMLMindmapSerializer {
|
||||
private static MAP_ROOT_NODE = 'map';
|
||||
|
Loading…
Reference in New Issue
Block a user