109 lines
2.2 KiB
JavaScript
Vendored
109 lines
2.2 KiB
JavaScript
Vendored
/**
|
|
* Flow plugin.
|
|
*/
|
|
Draw.loadPlugin(function(ui)
|
|
{
|
|
// Adds resource for action
|
|
mxResources.parse('toggleFlow=Toggle Flow...');
|
|
|
|
// Max number of edges per page
|
|
var pageSize = 20;
|
|
|
|
var uiCreatePopupMenu = ui.menus.createPopupMenu;
|
|
ui.menus.createPopupMenu = function(menu, cell, evt)
|
|
{
|
|
uiCreatePopupMenu.apply(this, arguments);
|
|
|
|
var graph = ui.editor.graph;
|
|
|
|
if (graph.model.isEdge(graph.getSelectionCell()))
|
|
{
|
|
this.addMenuItems(menu, ['-', 'toggleFlow'], null, evt);
|
|
}
|
|
};
|
|
|
|
//
|
|
// Main function
|
|
//
|
|
function toggleFlow(cells)
|
|
{
|
|
for (var i = 0; i < cells.length; i++)
|
|
{
|
|
if (ui.editor.graph.model.isEdge(cells[i]))
|
|
{
|
|
var state = ui.editor.graph.view.getState(cells[i]);
|
|
|
|
if (state.shape != null)
|
|
{
|
|
var paths = state.shape.node.getElementsByTagName('path');
|
|
|
|
if (paths.length > 1)
|
|
{
|
|
if (paths[1].getAttribute('class') == 'mxEdgeFlow')
|
|
{
|
|
paths[1].removeAttribute('class');
|
|
|
|
if (mxUtils.getValue(state.style, mxConstants.STYLE_DASHED, '0') != '1')
|
|
{
|
|
paths[1].removeAttribute('stroke-dasharray');
|
|
}
|
|
}
|
|
else
|
|
{
|
|
paths[1].setAttribute('class', 'mxEdgeFlow');
|
|
|
|
if (mxUtils.getValue(state.style, mxConstants.STYLE_DASHED, '0') != '1')
|
|
{
|
|
paths[1].setAttribute('stroke-dasharray', '8');
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
};
|
|
|
|
// Adds action
|
|
ui.actions.addAction('toggleFlow', function()
|
|
{
|
|
var cell = ui.editor.graph.getSelectionCell();
|
|
|
|
if (ui.editor.graph.model.isEdge(cell))
|
|
{
|
|
toggleFlow(ui.editor.graph.getSelectionCells());
|
|
}
|
|
});
|
|
|
|
// Click handler for chromeless mode
|
|
if (ui.editor.isChromelessView())
|
|
{
|
|
ui.editor.graph.click = function(me)
|
|
{
|
|
if (ui.editor.graph.model.isEdge(me.getCell()))
|
|
{
|
|
toggleFlow([me.getCell()]);
|
|
}
|
|
};
|
|
}
|
|
|
|
try
|
|
{
|
|
var style = document.createElement('style')
|
|
style.type = 'text/css';
|
|
style.innerHTML = ['.mxEdgeFlow {',
|
|
'animation: mxEdgeFlow 0.5s linear;',
|
|
'animation-iteration-count: infinite;',
|
|
'}',
|
|
'@keyframes mxEdgeFlow {',
|
|
'to {',
|
|
'stroke-dashoffset: -16;',
|
|
'}',
|
|
'}'].join('\n');
|
|
document.getElementsByTagName('head')[0].appendChild(style);
|
|
}
|
|
catch (e)
|
|
{
|
|
// ignore
|
|
}
|
|
});
|