1/**
2 * Flow plugin.
3 */
4Draw.loadPlugin(function(ui)
5{
6	// Adds resource for action
7	mxResources.parse('toggleFlow=Toggle Flow...');
8
9	// Max number of edges per page
10	var pageSize = 20;
11
12	var uiCreatePopupMenu = ui.menus.createPopupMenu;
13	ui.menus.createPopupMenu = function(menu, cell, evt)
14	{
15		uiCreatePopupMenu.apply(this, arguments);
16
17		var graph = ui.editor.graph;
18
19		if (graph.model.isEdge(graph.getSelectionCell()))
20		{
21			this.addMenuItems(menu, ['-', 'toggleFlow'], null, evt);
22		}
23	};
24
25	//
26	// Main function
27	//
28	function toggleFlow(cells)
29	{
30		for (var i = 0; i < cells.length; i++)
31		{
32			if (ui.editor.graph.model.isEdge(cells[i]))
33			{
34				var state = ui.editor.graph.view.getState(cells[i]);
35
36				if (state.shape != null)
37				{
38					var paths = state.shape.node.getElementsByTagName('path');
39
40					if (paths.length > 1)
41					{
42						if (paths[1].getAttribute('class') == 'mxEdgeFlow')
43						{
44							paths[1].removeAttribute('class');
45
46							if (mxUtils.getValue(state.style, mxConstants.STYLE_DASHED, '0') != '1')
47							{
48								paths[1].removeAttribute('stroke-dasharray');
49							}
50						}
51						else
52						{
53							paths[1].setAttribute('class', 'mxEdgeFlow');
54
55							if (mxUtils.getValue(state.style, mxConstants.STYLE_DASHED, '0') != '1')
56							{
57								paths[1].setAttribute('stroke-dasharray', '8');
58							}
59						}
60					}
61				}
62			}
63		}
64	};
65
66	// Adds action
67	ui.actions.addAction('toggleFlow', function()
68	{
69		var cell = ui.editor.graph.getSelectionCell();
70
71		if (ui.editor.graph.model.isEdge(cell))
72		{
73			toggleFlow(ui.editor.graph.getSelectionCells());
74		}
75	});
76
77	// Click handler for chromeless mode
78	if (ui.editor.isChromelessView())
79	{
80		ui.editor.graph.click = function(me)
81		{
82			if (ui.editor.graph.model.isEdge(me.getCell()))
83			{
84				toggleFlow([me.getCell()]);
85			}
86		};
87	}
88
89	try
90	{
91		var style = document.createElement('style')
92		style.type = 'text/css';
93		style.innerHTML = ['.mxEdgeFlow {',
94			  'animation: mxEdgeFlow 0.5s linear;',
95			  'animation-iteration-count: infinite;',
96			'}',
97			'@keyframes mxEdgeFlow {',
98			  'to {',
99			    'stroke-dashoffset: -16;',
100			  '}',
101			'}'].join('\n');
102		document.getElementsByTagName('head')[0].appendChild(style);
103	}
104	catch (e)
105	{
106		// ignore
107	}
108});
109