nope/resources/ui/graph/defaults/default.context-menu.ts

/**
 * @author Martin Karkowski
 * @email m.karkowski@zema.de
 * @create date 2020-04-09 08:50:11
 * @modify date 2020-10-29 12:07:56
 * @desc [description]
 */

import { IRigthClickActions } from '../../layout/layout';
import { clusterSelected } from '../addons/cluster.selected';
import { IContextConfig } from '../editor';
import { IBaseEdgeOptions } from '../interfaces/IBaseEdgeOptions';
import { IBaseNodeOptions } from '../interfaces/IBaseNodeOptions';
import { ICallbackData } from '../interfaces/IGraphTool';

export type rigthClickActions = Array<{
    label?: string;
    onClick?: (event?: any) => void;
    divider?: boolean
}>;

export type mousePosition = {
    x: number,
    y: number
}

export type rightClickActionGenerator = (component?: any, event?: mousePosition) => rigthClickActions;


export function generateDefaulContextMenu<N extends IBaseNodeOptions, E extends IBaseEdgeOptions, D extends ICallbackData<N,E>>() {
    const contextMenuGenerator: IContextConfig<D> = {
        background: (network) => {
            const ret:IRigthClickActions<ICallbackData<N,E>> = [];
            ret.push(
                {
                    label: 'Fit Graph',
                    onClick: () => network.network.fit()
                },
                {
                    label: 'Paste Element',
                    onClick: async () => {
                        try{
                            
                        } catch (e) {

                        }
                    }
                },
            );
            return ret;
        },
        edge: (network, position) => {
            return [
                {
                    label: 'Delete Selection',
                    onClick: () => network.network.deleteSelected()
                }
            ];
        },
        node: (network, position) => {
            const ret: IRigthClickActions<ICallbackData<N,E>> = [];

            if (network.network.isCluster(network.network.getSelectedNodes()[0])) {
                const id = network.network.getSelectedNodes()[0];
                ret.push(
                    {
                        label: 'open cluster',
                        onClick() {
                            network.network.openCluster(id);
                        }
                    },
                );
            }
            ret.push(
                {
                    label: 'compress',
                    onClick() {
                        clusterSelected(network)
                    }
                },
                {
                    label: 'copy',
                    onClick() {
                        // copySelectionToClipboard();
                    }
                },
                {
                    label: 'delete',
                    onClick: () => network.network.deleteSelected()
                },
                {
                    label: 'edit',
                    onClick() {
                        console.log('not implemented');
                    }
                }
            );

            return ret;
        },
        default: (network) => {

            const menu = [];

            if (network.network.getSelectedNodes().length > 0) {
                menu.push(
                    {
                        label: 'cluster selected',
                        onClick() {
                            clusterSelected(network, false);
                        }
                    },
                    {
                        divider: true,
                    },
                    {
                        label: 'copy selected',
                        onClick() {
                            // component.copySelectionToClipboard();
                        }
                    }
                );
            }

            menu.push({
                label: 'delete selected',
                onClick: () => network.network.deleteSelected()
            });
            return menu;
        }
    }

    return contextMenuGenerator;
}