mxEdgeStyle.js 42 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980981982983984985986987988989990991992993994995996997998999100010011002100310041005100610071008100910101011101210131014101510161017101810191020102110221023102410251026102710281029103010311032103310341035103610371038103910401041104210431044104510461047104810491050105110521053105410551056105710581059106010611062106310641065106610671068106910701071107210731074107510761077107810791080108110821083108410851086108710881089109010911092109310941095109610971098109911001101110211031104110511061107110811091110111111121113111411151116111711181119112011211122112311241125112611271128112911301131113211331134113511361137113811391140114111421143114411451146114711481149115011511152115311541155115611571158115911601161116211631164116511661167116811691170117111721173117411751176117711781179118011811182118311841185118611871188118911901191119211931194119511961197119811991200120112021203120412051206120712081209121012111212121312141215121612171218121912201221122212231224122512261227122812291230123112321233123412351236123712381239124012411242124312441245124612471248124912501251125212531254125512561257125812591260126112621263126412651266126712681269127012711272127312741275127612771278127912801281128212831284128512861287128812891290129112921293129412951296129712981299130013011302130313041305130613071308130913101311131213131314131513161317131813191320132113221323132413251326132713281329133013311332133313341335133613371338133913401341134213431344134513461347134813491350135113521353135413551356135713581359136013611362136313641365136613671368136913701371137213731374137513761377137813791380138113821383138413851386138713881389139013911392139313941395139613971398139914001401140214031404140514061407140814091410141114121413141414151416141714181419142014211422142314241425142614271428142914301431143214331434143514361437143814391440144114421443144414451446144714481449145014511452145314541455145614571458145914601461146214631464146514661467146814691470147114721473147414751476147714781479148014811482148314841485148614871488148914901491149214931494149514961497149814991500150115021503150415051506150715081509151015111512151315141515151615171518151915201521152215231524152515261527152815291530153115321533153415351536153715381539154015411542154315441545154615471548154915501551155215531554155515561557155815591560156115621563156415651566156715681569157015711572157315741575157615771578157915801581158215831584158515861587158815891590159115921593159415951596159715981599160016011602160316041605160616071608160916101611161216131614161516161617161816191620162116221623162416251626162716281629163016311632163316341635163616371638163916401641164216431644164516461647164816491650165116521653
  1. /**
  2. * Copyright (c) 2006-2015, JGraph Ltd
  3. * Copyright (c) 2006-2015, Gaudenz Alder
  4. */
  5. var mxEdgeStyle =
  6. {
  7. /**
  8. * Class: mxEdgeStyle
  9. *
  10. * Provides various edge styles to be used as the values for
  11. * <mxConstants.STYLE_EDGE> in a cell style.
  12. *
  13. * Example:
  14. *
  15. * (code)
  16. * var style = stylesheet.getDefaultEdgeStyle();
  17. * style[mxConstants.STYLE_EDGE] = mxEdgeStyle.ElbowConnector;
  18. * (end)
  19. *
  20. * Sets the default edge style to <ElbowConnector>.
  21. *
  22. * Custom edge style:
  23. *
  24. * To write a custom edge style, a function must be added to the mxEdgeStyle
  25. * object as follows:
  26. *
  27. * (code)
  28. * mxEdgeStyle.MyStyle = function(state, source, target, points, result)
  29. * {
  30. * if (source != null && target != null)
  31. * {
  32. * var pt = new mxPoint(target.getCenterX(), source.getCenterY());
  33. *
  34. * if (mxUtils.contains(source, pt.x, pt.y))
  35. * {
  36. * pt.y = source.y + source.height;
  37. * }
  38. *
  39. * result.push(pt);
  40. * }
  41. * };
  42. * (end)
  43. *
  44. * In the above example, a right angle is created using a point on the
  45. * horizontal center of the target vertex and the vertical center of the source
  46. * vertex. The code checks if that point intersects the source vertex and makes
  47. * the edge straight if it does. The point is then added into the result array,
  48. * which acts as the return value of the function.
  49. *
  50. * The new edge style should then be registered in the <mxStyleRegistry> as follows:
  51. * (code)
  52. * mxStyleRegistry.putValue('myEdgeStyle', mxEdgeStyle.MyStyle);
  53. * (end)
  54. *
  55. * The custom edge style above can now be used in a specific edge as follows:
  56. *
  57. * (code)
  58. * model.setStyle(edge, 'edgeStyle=myEdgeStyle');
  59. * (end)
  60. *
  61. * Note that the key of the <mxStyleRegistry> entry for the function should
  62. * be used in string values, unless <mxGraphView.allowEval> is true, in
  63. * which case you can also use mxEdgeStyle.MyStyle for the value in the
  64. * cell style above.
  65. *
  66. * Or it can be used for all edges in the graph as follows:
  67. *
  68. * (code)
  69. * var style = graph.getStylesheet().getDefaultEdgeStyle();
  70. * style[mxConstants.STYLE_EDGE] = mxEdgeStyle.MyStyle;
  71. * (end)
  72. *
  73. * Note that the object can be used directly when programmatically setting
  74. * the value, but the key in the <mxStyleRegistry> should be used when
  75. * setting the value via a key, value pair in a cell style.
  76. *
  77. * Function: EntityRelation
  78. *
  79. * Implements an entity relation style for edges (as used in database
  80. * schema diagrams). At the time the function is called, the result
  81. * array contains a placeholder (null) for the first absolute point,
  82. * that is, the point where the edge and source terminal are connected.
  83. * The implementation of the style then adds all intermediate waypoints
  84. * except for the last point, that is, the connection point between the
  85. * edge and the target terminal. The first ant the last point in the
  86. * result array are then replaced with mxPoints that take into account
  87. * the terminal's perimeter and next point on the edge.
  88. *
  89. * Parameters:
  90. *
  91. * state - <mxCellState> that represents the edge to be updated.
  92. * source - <mxCellState> that represents the source terminal.
  93. * target - <mxCellState> that represents the target terminal.
  94. * points - List of relative control points.
  95. * result - Array of <mxPoints> that represent the actual points of the
  96. * edge.
  97. */
  98. EntityRelation: function(state, source, target, points, result)
  99. {
  100. var view = state.view;
  101. var graph = view.graph;
  102. var segment = mxUtils.getValue(state.style,
  103. mxConstants.STYLE_SEGMENT,
  104. mxConstants.ENTITY_SEGMENT) * view.scale;
  105. var pts = state.absolutePoints;
  106. var p0 = pts[0];
  107. var pe = pts[pts.length-1];
  108. var isSourceLeft = false;
  109. if (source != null)
  110. {
  111. var sourceGeometry = graph.getCellGeometry(source.cell);
  112. if (sourceGeometry.relative)
  113. {
  114. isSourceLeft = sourceGeometry.x <= 0.5;
  115. }
  116. else if (target != null)
  117. {
  118. isSourceLeft = ((pe != null) ? pe.x : target.x + target.width) < ((p0 != null) ? p0.x : source.x);
  119. }
  120. }
  121. if (p0 != null)
  122. {
  123. source = new mxCellState();
  124. source.x = p0.x;
  125. source.y = p0.y;
  126. }
  127. else if (source != null)
  128. {
  129. var constraint = mxUtils.getPortConstraints(source, state, true, mxConstants.DIRECTION_MASK_NONE);
  130. if (constraint != mxConstants.DIRECTION_MASK_NONE && constraint != mxConstants.DIRECTION_MASK_WEST +
  131. mxConstants.DIRECTION_MASK_EAST)
  132. {
  133. isSourceLeft = constraint == mxConstants.DIRECTION_MASK_WEST;
  134. }
  135. }
  136. else
  137. {
  138. return;
  139. }
  140. var isTargetLeft = true;
  141. if (target != null)
  142. {
  143. var targetGeometry = graph.getCellGeometry(target.cell);
  144. if (targetGeometry.relative)
  145. {
  146. isTargetLeft = targetGeometry.x <= 0.5;
  147. }
  148. else if (source != null)
  149. {
  150. isTargetLeft = ((p0 != null) ? p0.x : source.x + source.width) < ((pe != null) ? pe.x : target.x);
  151. }
  152. }
  153. if (pe != null)
  154. {
  155. target = new mxCellState();
  156. target.x = pe.x;
  157. target.y = pe.y;
  158. }
  159. else if (target != null)
  160. {
  161. var constraint = mxUtils.getPortConstraints(target, state, false, mxConstants.DIRECTION_MASK_NONE);
  162. if (constraint != mxConstants.DIRECTION_MASK_NONE && constraint != mxConstants.DIRECTION_MASK_WEST +
  163. mxConstants.DIRECTION_MASK_EAST)
  164. {
  165. isTargetLeft = constraint == mxConstants.DIRECTION_MASK_WEST;
  166. }
  167. }
  168. if (source != null && target != null)
  169. {
  170. var x0 = (isSourceLeft) ? source.x : source.x + source.width;
  171. var y0 = view.getRoutingCenterY(source);
  172. var xe = (isTargetLeft) ? target.x : target.x + target.width;
  173. var ye = view.getRoutingCenterY(target);
  174. var seg = segment;
  175. var dx = (isSourceLeft) ? -seg : seg;
  176. var dep = new mxPoint(x0 + dx, y0);
  177. dx = (isTargetLeft) ? -seg : seg;
  178. var arr = new mxPoint(xe + dx, ye);
  179. // Adds intermediate points if both go out on same side
  180. if (isSourceLeft == isTargetLeft)
  181. {
  182. var x = (isSourceLeft) ?
  183. Math.min(x0, xe)-segment :
  184. Math.max(x0, xe)+segment;
  185. result.push(new mxPoint(x, y0));
  186. result.push(new mxPoint(x, ye));
  187. }
  188. else if ((dep.x < arr.x) == isSourceLeft)
  189. {
  190. var midY = y0 + (ye - y0) / 2;
  191. result.push(dep);
  192. result.push(new mxPoint(dep.x, midY));
  193. result.push(new mxPoint(arr.x, midY));
  194. result.push(arr);
  195. }
  196. else
  197. {
  198. result.push(dep);
  199. result.push(arr);
  200. }
  201. }
  202. },
  203. /**
  204. * Function: Loop
  205. *
  206. * Implements a self-reference, aka. loop.
  207. */
  208. Loop: function(state, source, target, points, result)
  209. {
  210. var pts = state.absolutePoints;
  211. var p0 = pts[0];
  212. var pe = pts[pts.length-1];
  213. if (p0 != null && pe != null)
  214. {
  215. if (points != null && points.length > 0)
  216. {
  217. for (var i = 0; i < points.length; i++)
  218. {
  219. var pt = points[i];
  220. pt = state.view.transformControlPoint(state, pt);
  221. result.push(new mxPoint(pt.x, pt.y));
  222. }
  223. }
  224. return;
  225. }
  226. if (source != null)
  227. {
  228. var view = state.view;
  229. var graph = view.graph;
  230. var pt = (points != null && points.length > 0) ? points[0] : null;
  231. if (pt != null)
  232. {
  233. pt = view.transformControlPoint(state, pt);
  234. if (mxUtils.contains(source, pt.x, pt.y))
  235. {
  236. pt = null;
  237. }
  238. }
  239. var x = 0;
  240. var dx = 0;
  241. var y = 0;
  242. var dy = 0;
  243. var seg = mxUtils.getValue(state.style, mxConstants.STYLE_SEGMENT,
  244. graph.gridSize) * view.scale;
  245. var dir = mxUtils.getValue(state.style, mxConstants.STYLE_DIRECTION,
  246. mxConstants.DIRECTION_WEST);
  247. if (dir == mxConstants.DIRECTION_NORTH ||
  248. dir == mxConstants.DIRECTION_SOUTH)
  249. {
  250. x = view.getRoutingCenterX(source);
  251. dx = seg;
  252. }
  253. else
  254. {
  255. y = view.getRoutingCenterY(source);
  256. dy = seg;
  257. }
  258. if (pt == null ||
  259. pt.x < source.x ||
  260. pt.x > source.x + source.width)
  261. {
  262. if (pt != null)
  263. {
  264. x = pt.x;
  265. dy = Math.max(Math.abs(y - pt.y), dy);
  266. }
  267. else
  268. {
  269. if (dir == mxConstants.DIRECTION_NORTH)
  270. {
  271. y = source.y - 2 * dx;
  272. }
  273. else if (dir == mxConstants.DIRECTION_SOUTH)
  274. {
  275. y = source.y + source.height + 2 * dx;
  276. }
  277. else if (dir == mxConstants.DIRECTION_EAST)
  278. {
  279. x = source.x - 2 * dy;
  280. }
  281. else
  282. {
  283. x = source.x + source.width + 2 * dy;
  284. }
  285. }
  286. }
  287. else if (pt != null)
  288. {
  289. x = view.getRoutingCenterX(source);
  290. dx = Math.max(Math.abs(x - pt.x), dy);
  291. y = pt.y;
  292. dy = 0;
  293. }
  294. result.push(new mxPoint(x - dx, y - dy));
  295. result.push(new mxPoint(x + dx, y + dy));
  296. }
  297. },
  298. /**
  299. * Function: ElbowConnector
  300. *
  301. * Uses either <SideToSide> or <TopToBottom> depending on the horizontal
  302. * flag in the cell style. <SideToSide> is used if horizontal is true or
  303. * unspecified. See <EntityRelation> for a description of the
  304. * parameters.
  305. */
  306. ElbowConnector: function(state, source, target, points, result)
  307. {
  308. var pt = (points != null && points.length > 0) ? points[0] : null;
  309. var vertical = false;
  310. var horizontal = false;
  311. if (source != null && target != null)
  312. {
  313. if (pt != null)
  314. {
  315. var left = Math.min(source.x, target.x);
  316. var right = Math.max(source.x + source.width,
  317. target.x + target.width);
  318. var top = Math.min(source.y, target.y);
  319. var bottom = Math.max(source.y + source.height,
  320. target.y + target.height);
  321. pt = state.view.transformControlPoint(state, pt);
  322. vertical = pt.y < top || pt.y > bottom;
  323. horizontal = pt.x < left || pt.x > right;
  324. }
  325. else
  326. {
  327. var left = Math.max(source.x, target.x);
  328. var right = Math.min(source.x + source.width,
  329. target.x + target.width);
  330. vertical = left == right;
  331. if (!vertical)
  332. {
  333. var top = Math.max(source.y, target.y);
  334. var bottom = Math.min(source.y + source.height,
  335. target.y + target.height);
  336. horizontal = top == bottom;
  337. }
  338. }
  339. }
  340. if (!horizontal && (vertical ||
  341. state.style[mxConstants.STYLE_ELBOW] == mxConstants.ELBOW_VERTICAL))
  342. {
  343. mxEdgeStyle.TopToBottom(state, source, target, points, result);
  344. }
  345. else
  346. {
  347. mxEdgeStyle.SideToSide(state, source, target, points, result);
  348. }
  349. },
  350. /**
  351. * Function: SideToSide
  352. *
  353. * Implements a vertical elbow edge. See <EntityRelation> for a description
  354. * of the parameters.
  355. */
  356. SideToSide: function(state, source, target, points, result)
  357. {
  358. var view = state.view;
  359. var pt = (points != null && points.length > 0) ? points[0] : null;
  360. var pts = state.absolutePoints;
  361. var p0 = pts[0];
  362. var pe = pts[pts.length-1];
  363. if (pt != null)
  364. {
  365. pt = view.transformControlPoint(state, pt);
  366. }
  367. if (p0 != null)
  368. {
  369. source = new mxCellState();
  370. source.x = p0.x;
  371. source.y = p0.y;
  372. }
  373. if (pe != null)
  374. {
  375. target = new mxCellState();
  376. target.x = pe.x;
  377. target.y = pe.y;
  378. }
  379. if (source != null && target != null)
  380. {
  381. var l = Math.max(source.x, target.x);
  382. var r = Math.min(source.x + source.width,
  383. target.x + target.width);
  384. var x = (pt != null) ? pt.x : Math.round(r + (l - r) / 2);
  385. var y1 = view.getRoutingCenterY(source);
  386. var y2 = view.getRoutingCenterY(target);
  387. if (pt != null)
  388. {
  389. if (pt.y >= source.y && pt.y <= source.y + source.height)
  390. {
  391. y1 = pt.y;
  392. }
  393. if (pt.y >= target.y && pt.y <= target.y + target.height)
  394. {
  395. y2 = pt.y;
  396. }
  397. }
  398. if (!mxUtils.contains(target, x, y1) &&
  399. !mxUtils.contains(source, x, y1))
  400. {
  401. result.push(new mxPoint(x, y1));
  402. }
  403. if (!mxUtils.contains(target, x, y2) &&
  404. !mxUtils.contains(source, x, y2))
  405. {
  406. result.push(new mxPoint(x, y2));
  407. }
  408. if (result.length == 1)
  409. {
  410. if (pt != null)
  411. {
  412. if (!mxUtils.contains(target, x, pt.y) &&
  413. !mxUtils.contains(source, x, pt.y))
  414. {
  415. result.push(new mxPoint(x, pt.y));
  416. }
  417. }
  418. else
  419. {
  420. var t = Math.max(source.y, target.y);
  421. var b = Math.min(source.y + source.height,
  422. target.y + target.height);
  423. result.push(new mxPoint(x, t + (b - t) / 2));
  424. }
  425. }
  426. }
  427. },
  428. /**
  429. * Function: TopToBottom
  430. *
  431. * Implements a horizontal elbow edge. See <EntityRelation> for a
  432. * description of the parameters.
  433. */
  434. TopToBottom: function(state, source, target, points, result)
  435. {
  436. var view = state.view;
  437. var pt = (points != null && points.length > 0) ? points[0] : null;
  438. var pts = state.absolutePoints;
  439. var p0 = pts[0];
  440. var pe = pts[pts.length-1];
  441. if (pt != null)
  442. {
  443. pt = view.transformControlPoint(state, pt);
  444. }
  445. if (p0 != null)
  446. {
  447. source = new mxCellState();
  448. source.x = p0.x;
  449. source.y = p0.y;
  450. }
  451. if (pe != null)
  452. {
  453. target = new mxCellState();
  454. target.x = pe.x;
  455. target.y = pe.y;
  456. }
  457. if (source != null && target != null)
  458. {
  459. var t = Math.max(source.y, target.y);
  460. var b = Math.min(source.y + source.height,
  461. target.y + target.height);
  462. var x = view.getRoutingCenterX(source);
  463. if (pt != null &&
  464. pt.x >= source.x &&
  465. pt.x <= source.x + source.width)
  466. {
  467. x = pt.x;
  468. }
  469. var y = (pt != null) ? pt.y : Math.round(b + (t - b) / 2);
  470. if (!mxUtils.contains(target, x, y) &&
  471. !mxUtils.contains(source, x, y))
  472. {
  473. result.push(new mxPoint(x, y));
  474. }
  475. if (pt != null &&
  476. pt.x >= target.x &&
  477. pt.x <= target.x + target.width)
  478. {
  479. x = pt.x;
  480. }
  481. else
  482. {
  483. x = view.getRoutingCenterX(target);
  484. }
  485. if (!mxUtils.contains(target, x, y) &&
  486. !mxUtils.contains(source, x, y))
  487. {
  488. result.push(new mxPoint(x, y));
  489. }
  490. if (result.length == 1)
  491. {
  492. if (pt != null && result.length == 1)
  493. {
  494. if (!mxUtils.contains(target, pt.x, y) &&
  495. !mxUtils.contains(source, pt.x, y))
  496. {
  497. result.push(new mxPoint(pt.x, y));
  498. }
  499. }
  500. else
  501. {
  502. var l = Math.max(source.x, target.x);
  503. var r = Math.min(source.x + source.width,
  504. target.x + target.width);
  505. result.push(new mxPoint(l + (r - l) / 2, y));
  506. }
  507. }
  508. }
  509. },
  510. /**
  511. * Function: SegmentConnector
  512. *
  513. * Implements an orthogonal edge style. Use <mxEdgeSegmentHandler>
  514. * as an interactive handler for this style.
  515. *
  516. * state - <mxCellState> that represents the edge to be updated.
  517. * sourceScaled - <mxCellState> that represents the source terminal.
  518. * targetScaled - <mxCellState> that represents the target terminal.
  519. * controlHints - List of relative control points.
  520. * result - Array of <mxPoints> that represent the actual points of the
  521. * edge.
  522. *
  523. */
  524. SegmentConnector: function(state, sourceScaled, targetScaled, controlHints, result)
  525. {
  526. // Creates array of all way- and terminalpoints
  527. var pts = mxEdgeStyle.scalePointArray(state.absolutePoints, state.view.scale);
  528. var source = mxEdgeStyle.scaleCellState(sourceScaled, state.view.scale);
  529. var target = mxEdgeStyle.scaleCellState(targetScaled, state.view.scale);
  530. var tol = 1;
  531. // Whether the first segment outgoing from the source end is horizontal
  532. var lastPushed = (result.length > 0) ? result[0] : null;
  533. var horizontal = true;
  534. var hint = null;
  535. // Adds waypoints only if outside of tolerance
  536. function pushPoint(pt)
  537. {
  538. pt.x = Math.round(pt.x * state.view.scale * 10) / 10;
  539. pt.y = Math.round(pt.y * state.view.scale * 10) / 10;
  540. if (lastPushed == null || Math.abs(lastPushed.x - pt.x) >= tol || Math.abs(lastPushed.y - pt.y) >= Math.max(1, state.view.scale))
  541. {
  542. result.push(pt);
  543. lastPushed = pt;
  544. }
  545. return lastPushed;
  546. };
  547. // Adds the first point
  548. var pt = pts[0];
  549. if (pt == null && source != null)
  550. {
  551. pt = new mxPoint(state.view.getRoutingCenterX(source), state.view.getRoutingCenterY(source));
  552. }
  553. else if (pt != null)
  554. {
  555. pt = pt.clone();
  556. }
  557. var lastInx = pts.length - 1;
  558. // Adds the waypoints
  559. if (controlHints != null && controlHints.length > 0)
  560. {
  561. // Converts all hints and removes nulls
  562. var hints = [];
  563. for (var i = 0; i < controlHints.length; i++)
  564. {
  565. var tmp = state.view.transformControlPoint(state, controlHints[i], true);
  566. if (tmp != null)
  567. {
  568. hints.push(tmp);
  569. }
  570. }
  571. if (hints.length == 0)
  572. {
  573. return;
  574. }
  575. // Aligns source and target hint to fixed points
  576. if (pt != null && hints[0] != null)
  577. {
  578. if (Math.abs(hints[0].x - pt.x) < tol)
  579. {
  580. hints[0].x = pt.x;
  581. }
  582. if (Math.abs(hints[0].y - pt.y) < tol)
  583. {
  584. hints[0].y = pt.y;
  585. }
  586. }
  587. var pe = pts[lastInx];
  588. if (pe != null && hints[hints.length - 1] != null)
  589. {
  590. if (Math.abs(hints[hints.length - 1].x - pe.x) < tol)
  591. {
  592. hints[hints.length - 1].x = pe.x;
  593. }
  594. if (Math.abs(hints[hints.length - 1].y - pe.y) < tol)
  595. {
  596. hints[hints.length - 1].y = pe.y;
  597. }
  598. }
  599. hint = hints[0];
  600. var currentTerm = source;
  601. var currentPt = pts[0];
  602. var hozChan = false;
  603. var vertChan = false;
  604. var currentHint = hint;
  605. if (currentPt != null)
  606. {
  607. currentTerm = null;
  608. }
  609. // Check for alignment with fixed points and with channels
  610. // at source and target segments only
  611. for (var i = 0; i < 2; i++)
  612. {
  613. var fixedVertAlign = currentPt != null && currentPt.x == currentHint.x;
  614. var fixedHozAlign = currentPt != null && currentPt.y == currentHint.y;
  615. var inHozChan = currentTerm != null && (currentHint.y >= currentTerm.y &&
  616. currentHint.y <= currentTerm.y + currentTerm.height);
  617. var inVertChan = currentTerm != null && (currentHint.x >= currentTerm.x &&
  618. currentHint.x <= currentTerm.x + currentTerm.width);
  619. hozChan = fixedHozAlign || (currentPt == null && inHozChan);
  620. vertChan = fixedVertAlign || (currentPt == null && inVertChan);
  621. // If the current hint falls in both the hor and vert channels in the case
  622. // of a floating port, or if the hint is exactly co-incident with a
  623. // fixed point, ignore the source and try to work out the orientation
  624. // from the target end
  625. if (i==0 && ((hozChan && vertChan) || (fixedVertAlign && fixedHozAlign)))
  626. {
  627. }
  628. else
  629. {
  630. if (currentPt != null && (!fixedHozAlign && !fixedVertAlign) && (inHozChan || inVertChan))
  631. {
  632. horizontal = inHozChan ? false : true;
  633. break;
  634. }
  635. if (vertChan || hozChan)
  636. {
  637. horizontal = hozChan;
  638. if (i == 1)
  639. {
  640. // Work back from target end
  641. horizontal = hints.length % 2 == 0 ? hozChan : vertChan;
  642. }
  643. break;
  644. }
  645. }
  646. currentTerm = target;
  647. currentPt = pts[lastInx];
  648. if (currentPt != null)
  649. {
  650. currentTerm = null;
  651. }
  652. currentHint = hints[hints.length - 1];
  653. if (fixedVertAlign && fixedHozAlign)
  654. {
  655. hints = hints.slice(1);
  656. }
  657. }
  658. if (horizontal && ((pts[0] != null && pts[0].y != hint.y) ||
  659. (pts[0] == null && source != null &&
  660. (hint.y < source.y || hint.y > source.y + source.height))))
  661. {
  662. pushPoint(new mxPoint(pt.x, hint.y));
  663. }
  664. else if (!horizontal && ((pts[0] != null && pts[0].x != hint.x) ||
  665. (pts[0] == null && source != null &&
  666. (hint.x < source.x || hint.x > source.x + source.width))))
  667. {
  668. pushPoint(new mxPoint(hint.x, pt.y));
  669. }
  670. if (horizontal)
  671. {
  672. pt.y = hint.y;
  673. }
  674. else
  675. {
  676. pt.x = hint.x;
  677. }
  678. for (var i = 0; i < hints.length; i++)
  679. {
  680. horizontal = !horizontal;
  681. hint = hints[i];
  682. // mxLog.show();
  683. // mxLog.debug('hint', i, hint.x, hint.y);
  684. if (horizontal)
  685. {
  686. pt.y = hint.y;
  687. }
  688. else
  689. {
  690. pt.x = hint.x;
  691. }
  692. pushPoint(pt.clone());
  693. }
  694. }
  695. else
  696. {
  697. hint = pt;
  698. // FIXME: First click in connect preview toggles orientation
  699. horizontal = true;
  700. }
  701. // Adds the last point
  702. pt = pts[lastInx];
  703. if (pt == null && target != null)
  704. {
  705. pt = new mxPoint(state.view.getRoutingCenterX(target), state.view.getRoutingCenterY(target));
  706. }
  707. if (pt != null)
  708. {
  709. if (hint != null)
  710. {
  711. if (horizontal && ((pts[lastInx] != null && pts[lastInx].y != hint.y) ||
  712. (pts[lastInx] == null && target != null &&
  713. (hint.y < target.y || hint.y > target.y + target.height))))
  714. {
  715. pushPoint(new mxPoint(pt.x, hint.y));
  716. }
  717. else if (!horizontal && ((pts[lastInx] != null && pts[lastInx].x != hint.x) ||
  718. (pts[lastInx] == null && target != null &&
  719. (hint.x < target.x || hint.x > target.x + target.width))))
  720. {
  721. pushPoint(new mxPoint(hint.x, pt.y));
  722. }
  723. }
  724. }
  725. // Removes bends inside the source terminal for floating ports
  726. if (pts[0] == null && source != null)
  727. {
  728. while (result.length > 1 && result[1] != null &&
  729. mxUtils.contains(source, result[1].x, result[1].y))
  730. {
  731. result.splice(1, 1);
  732. }
  733. }
  734. // Removes bends inside the target terminal
  735. if (pts[lastInx] == null && target != null)
  736. {
  737. while (result.length > 1 && result[result.length - 1] != null &&
  738. mxUtils.contains(target, result[result.length - 1].x, result[result.length - 1].y))
  739. {
  740. result.splice(result.length - 1, 1);
  741. }
  742. }
  743. // Removes last point if inside tolerance with end point
  744. if (pe != null && result[result.length - 1] != null &&
  745. Math.abs(pe.x - result[result.length - 1].x) <= tol &&
  746. Math.abs(pe.y - result[result.length - 1].y) <= tol)
  747. {
  748. result.splice(result.length - 1, 1);
  749. // Lines up second last point in result with end point
  750. if (result[result.length - 1] != null)
  751. {
  752. if (Math.abs(result[result.length - 1].x - pe.x) < tol)
  753. {
  754. result[result.length - 1].x = pe.x;
  755. }
  756. if (Math.abs(result[result.length - 1].y - pe.y) < tol)
  757. {
  758. result[result.length - 1].y = pe.y;
  759. }
  760. }
  761. }
  762. },
  763. orthBuffer: 10,
  764. orthPointsFallback: true,
  765. dirVectors: [ [ -1, 0 ],
  766. [ 0, -1 ], [ 1, 0 ], [ 0, 1 ], [ -1, 0 ], [ 0, -1 ], [ 1, 0 ] ],
  767. wayPoints1: [ [ 0, 0], [ 0, 0], [ 0, 0], [ 0, 0], [ 0, 0], [ 0, 0],
  768. [ 0, 0], [ 0, 0], [ 0, 0], [ 0, 0], [ 0, 0], [ 0, 0] ],
  769. routePatterns: [
  770. [ [ 513, 2308, 2081, 2562 ], [ 513, 1090, 514, 2184, 2114, 2561 ],
  771. [ 513, 1090, 514, 2564, 2184, 2562 ],
  772. [ 513, 2308, 2561, 1090, 514, 2568, 2308 ] ],
  773. [ [ 514, 1057, 513, 2308, 2081, 2562 ], [ 514, 2184, 2114, 2561 ],
  774. [ 514, 2184, 2562, 1057, 513, 2564, 2184 ],
  775. [ 514, 1057, 513, 2568, 2308, 2561 ] ],
  776. [ [ 1090, 514, 1057, 513, 2308, 2081, 2562 ], [ 2114, 2561 ],
  777. [ 1090, 2562, 1057, 513, 2564, 2184 ],
  778. [ 1090, 514, 1057, 513, 2308, 2561, 2568 ] ],
  779. [ [ 2081, 2562 ], [ 1057, 513, 1090, 514, 2184, 2114, 2561 ],
  780. [ 1057, 513, 1090, 514, 2184, 2562, 2564 ],
  781. [ 1057, 2561, 1090, 514, 2568, 2308 ] ] ],
  782. inlineRoutePatterns: [
  783. [ null, [ 2114, 2568 ], null, null ],
  784. [ null, [ 514, 2081, 2114, 2568 ] , null, null ],
  785. [ null, [ 2114, 2561 ], null, null ],
  786. [ [ 2081, 2562 ], [ 1057, 2114, 2568 ],
  787. [ 2184, 2562 ],
  788. null ] ],
  789. vertexSeperations: [],
  790. limits: [
  791. [ 0, 0, 0, 0, 0, 0, 0, 0, 0 ],
  792. [ 0, 0, 0, 0, 0, 0, 0, 0, 0 ] ],
  793. LEFT_MASK: 32,
  794. TOP_MASK: 64,
  795. RIGHT_MASK: 128,
  796. BOTTOM_MASK: 256,
  797. LEFT: 1,
  798. TOP: 2,
  799. RIGHT: 4,
  800. BOTTOM: 8,
  801. // TODO remove magic numbers
  802. SIDE_MASK: 480,
  803. //mxEdgeStyle.LEFT_MASK | mxEdgeStyle.TOP_MASK | mxEdgeStyle.RIGHT_MASK
  804. //| mxEdgeStyle.BOTTOM_MASK,
  805. CENTER_MASK: 512,
  806. SOURCE_MASK: 1024,
  807. TARGET_MASK: 2048,
  808. VERTEX_MASK: 3072,
  809. // mxEdgeStyle.SOURCE_MASK | mxEdgeStyle.TARGET_MASK,
  810. getJettySize: function(state, isSource)
  811. {
  812. var value = mxUtils.getValue(state.style, (isSource) ? mxConstants.STYLE_SOURCE_JETTY_SIZE :
  813. mxConstants.STYLE_TARGET_JETTY_SIZE, mxUtils.getValue(state.style,
  814. mxConstants.STYLE_JETTY_SIZE, mxEdgeStyle.orthBuffer));
  815. if (value == 'auto')
  816. {
  817. // Computes the automatic jetty size
  818. var type = mxUtils.getValue(state.style, (isSource) ? mxConstants.STYLE_STARTARROW : mxConstants.STYLE_ENDARROW, mxConstants.NONE);
  819. if (type != mxConstants.NONE)
  820. {
  821. var size = mxUtils.getNumber(state.style, (isSource) ? mxConstants.STYLE_STARTSIZE : mxConstants.STYLE_ENDSIZE, mxConstants.DEFAULT_MARKERSIZE);
  822. value = Math.max(2, Math.ceil((size + mxEdgeStyle.orthBuffer) / mxEdgeStyle.orthBuffer)) * mxEdgeStyle.orthBuffer;
  823. }
  824. else
  825. {
  826. value = 2 * mxEdgeStyle.orthBuffer;
  827. }
  828. }
  829. return value;
  830. },
  831. /**
  832. * Function: scalePointArray
  833. *
  834. * Scales an array of <mxPoint>
  835. *
  836. * Parameters:
  837. *
  838. * points - array of <mxPoint> to scale
  839. * scale - the scaling to divide by
  840. *
  841. */
  842. scalePointArray: function(points, scale)
  843. {
  844. var result = [];
  845. if (points != null)
  846. {
  847. for (var i = 0; i < points.length; i++)
  848. {
  849. if (points[i] != null)
  850. {
  851. var pt = new mxPoint(Math.round(points[i].x / scale * 10) / 10,
  852. Math.round(points[i].y / scale * 10) / 10);
  853. result[i] = pt;
  854. }
  855. else
  856. {
  857. result[i] = null;
  858. }
  859. }
  860. }
  861. else
  862. {
  863. result = null;
  864. }
  865. return result;
  866. },
  867. /**
  868. * Function: scaleCellState
  869. *
  870. * Scales an <mxCellState>
  871. *
  872. * Parameters:
  873. *
  874. * state - <mxCellState> to scale
  875. * scale - the scaling to divide by
  876. *
  877. */
  878. scaleCellState: function(state, scale)
  879. {
  880. var result = null;
  881. if (state != null)
  882. {
  883. result = state.clone();
  884. result.setRect(Math.round(state.x / scale * 10) / 10,
  885. Math.round(state.y / scale * 10) / 10,
  886. Math.round(state.width / scale * 10) / 10,
  887. Math.round(state.height / scale * 10) / 10);
  888. }
  889. else
  890. {
  891. result = null;
  892. }
  893. return result;
  894. },
  895. /**
  896. * Function: OrthConnector
  897. *
  898. * Implements a local orthogonal router between the given
  899. * cells.
  900. *
  901. * Parameters:
  902. *
  903. * state - <mxCellState> that represents the edge to be updated.
  904. * sourceScaled - <mxCellState> that represents the source terminal.
  905. * targetScaled - <mxCellState> that represents the target terminal.
  906. * controlHints - List of relative control points.
  907. * result - Array of <mxPoints> that represent the actual points of the
  908. * edge.
  909. *
  910. */
  911. OrthConnector: function(state, sourceScaled, targetScaled, controlHints, result)
  912. {
  913. var graph = state.view.graph;
  914. var sourceEdge = source == null ? false : graph.getModel().isEdge(source.cell);
  915. var targetEdge = target == null ? false : graph.getModel().isEdge(target.cell);
  916. var pts = mxEdgeStyle.scalePointArray(state.absolutePoints, state.view.scale);
  917. var source = mxEdgeStyle.scaleCellState(sourceScaled, state.view.scale);
  918. var target = mxEdgeStyle.scaleCellState(targetScaled, state.view.scale);
  919. var p0 = pts[0];
  920. var pe = pts[pts.length-1];
  921. var sourceX = source != null ? source.x : p0.x;
  922. var sourceY = source != null ? source.y : p0.y;
  923. var sourceWidth = source != null ? source.width : 0;
  924. var sourceHeight = source != null ? source.height : 0;
  925. var targetX = target != null ? target.x : pe.x;
  926. var targetY = target != null ? target.y : pe.y;
  927. var targetWidth = target != null ? target.width : 0;
  928. var targetHeight = target != null ? target.height : 0;
  929. var sourceBuffer = mxEdgeStyle.getJettySize(state, true);
  930. var targetBuffer = mxEdgeStyle.getJettySize(state, false);
  931. //console.log('sourceBuffer', sourceBuffer);
  932. //console.log('targetBuffer', targetBuffer);
  933. // Workaround for loop routing within buffer zone
  934. if (source != null && target == source)
  935. {
  936. targetBuffer = Math.max(sourceBuffer, targetBuffer);
  937. sourceBuffer = targetBuffer;
  938. }
  939. var totalBuffer = targetBuffer + sourceBuffer;
  940. // console.log('totalBuffer', totalBuffer);
  941. var tooShort = false;
  942. // Checks minimum distance for fixed points and falls back to segment connector
  943. if (p0 != null && pe != null)
  944. {
  945. var dx = pe.x - p0.x;
  946. var dy = pe.y - p0.y;
  947. tooShort = dx * dx + dy * dy < totalBuffer * totalBuffer;
  948. }
  949. if (tooShort || (mxEdgeStyle.orthPointsFallback && (controlHints != null &&
  950. controlHints.length > 0)) || sourceEdge || targetEdge)
  951. {
  952. mxEdgeStyle.SegmentConnector(state, sourceScaled, targetScaled, controlHints, result);
  953. return;
  954. }
  955. // Determine the side(s) of the source and target vertices
  956. // that the edge may connect to
  957. // portConstraint [source, target]
  958. var portConstraint = [mxConstants.DIRECTION_MASK_ALL, mxConstants.DIRECTION_MASK_ALL];
  959. var rotation = 0;
  960. if (source != null)
  961. {
  962. portConstraint[0] = mxUtils.getPortConstraints(source, state, true,
  963. mxConstants.DIRECTION_MASK_ALL);
  964. rotation = mxUtils.getValue(source.style, mxConstants.STYLE_ROTATION, 0);
  965. //console.log('source rotation', rotation);
  966. if (rotation != 0)
  967. {
  968. var newRect = mxUtils.getBoundingBox(new mxRectangle(sourceX, sourceY, sourceWidth, sourceHeight), rotation);
  969. sourceX = newRect.x;
  970. sourceY = newRect.y;
  971. sourceWidth = newRect.width;
  972. sourceHeight = newRect.height;
  973. }
  974. }
  975. if (target != null)
  976. {
  977. portConstraint[1] = mxUtils.getPortConstraints(target, state, false,
  978. mxConstants.DIRECTION_MASK_ALL);
  979. rotation = mxUtils.getValue(target.style, mxConstants.STYLE_ROTATION, 0);
  980. //console.log('target rotation', rotation);
  981. if (rotation != 0)
  982. {
  983. var newRect = mxUtils.getBoundingBox(new mxRectangle(targetX, targetY, targetWidth, targetHeight), rotation);
  984. targetX = newRect.x;
  985. targetY = newRect.y;
  986. targetWidth = newRect.width;
  987. targetHeight = newRect.height;
  988. }
  989. }
  990. //console.log('source' , sourceX, sourceY, sourceWidth, sourceHeight);
  991. //console.log('targetX' , targetX, targetY, targetWidth, targetHeight);
  992. var dir = [0, 0];
  993. // Work out which faces of the vertices present against each other
  994. // in a way that would allow a 3-segment connection if port constraints
  995. // permitted.
  996. // geo -> [source, target] [x, y, width, height]
  997. var geo = [ [sourceX, sourceY, sourceWidth, sourceHeight] ,
  998. [targetX, targetY, targetWidth, targetHeight] ];
  999. var buffer = [sourceBuffer, targetBuffer];
  1000. for (var i = 0; i < 2; i++)
  1001. {
  1002. mxEdgeStyle.limits[i][1] = geo[i][0] - buffer[i];
  1003. mxEdgeStyle.limits[i][2] = geo[i][1] - buffer[i];
  1004. mxEdgeStyle.limits[i][4] = geo[i][0] + geo[i][2] + buffer[i];
  1005. mxEdgeStyle.limits[i][8] = geo[i][1] + geo[i][3] + buffer[i];
  1006. }
  1007. // Work out which quad the target is in
  1008. var sourceCenX = geo[0][0] + geo[0][2] / 2.0;
  1009. var sourceCenY = geo[0][1] + geo[0][3] / 2.0;
  1010. var targetCenX = geo[1][0] + geo[1][2] / 2.0;
  1011. var targetCenY = geo[1][1] + geo[1][3] / 2.0;
  1012. var dx = sourceCenX - targetCenX;
  1013. var dy = sourceCenY - targetCenY;
  1014. var quad = 0;
  1015. // 0 | 1
  1016. // -----
  1017. // 3 | 2
  1018. if (dx < 0)
  1019. {
  1020. if (dy < 0)
  1021. {
  1022. quad = 2;
  1023. }
  1024. else
  1025. {
  1026. quad = 1;
  1027. }
  1028. }
  1029. else
  1030. {
  1031. if (dy <= 0)
  1032. {
  1033. quad = 3;
  1034. // Special case on x = 0 and negative y
  1035. if (dx == 0)
  1036. {
  1037. quad = 2;
  1038. }
  1039. }
  1040. }
  1041. //console.log('quad', quad);
  1042. // Check for connection constraints
  1043. var currentTerm = null;
  1044. if (source != null)
  1045. {
  1046. currentTerm = p0;
  1047. }
  1048. var constraint = [ [0.5, 0.5] , [0.5, 0.5] ];
  1049. for (var i = 0; i < 2; i++)
  1050. {
  1051. if (currentTerm != null)
  1052. {
  1053. constraint[i][0] = (currentTerm.x - geo[i][0]) / geo[i][2];
  1054. if (Math.abs(currentTerm.x - geo[i][0]) <= 1)
  1055. {
  1056. dir[i] = mxConstants.DIRECTION_MASK_WEST;
  1057. }
  1058. else if (Math.abs(currentTerm.x - geo[i][0] - geo[i][2]) <= 1)
  1059. {
  1060. dir[i] = mxConstants.DIRECTION_MASK_EAST;
  1061. }
  1062. constraint[i][1] = (currentTerm.y - geo[i][1]) / geo[i][3];
  1063. if (Math.abs(currentTerm.y - geo[i][1]) <= 1)
  1064. {
  1065. dir[i] = mxConstants.DIRECTION_MASK_NORTH;
  1066. }
  1067. else if (Math.abs(currentTerm.y - geo[i][1] - geo[i][3]) <= 1)
  1068. {
  1069. dir[i] = mxConstants.DIRECTION_MASK_SOUTH;
  1070. }
  1071. }
  1072. currentTerm = null;
  1073. if (target != null)
  1074. {
  1075. currentTerm = pe;
  1076. }
  1077. }
  1078. var sourceTopDist = geo[0][1] - (geo[1][1] + geo[1][3]);
  1079. var sourceLeftDist = geo[0][0] - (geo[1][0] + geo[1][2]);
  1080. var sourceBottomDist = geo[1][1] - (geo[0][1] + geo[0][3]);
  1081. var sourceRightDist = geo[1][0] - (geo[0][0] + geo[0][2]);
  1082. mxEdgeStyle.vertexSeperations[1] = Math.max(sourceLeftDist - totalBuffer, 0);
  1083. mxEdgeStyle.vertexSeperations[2] = Math.max(sourceTopDist - totalBuffer, 0);
  1084. mxEdgeStyle.vertexSeperations[4] = Math.max(sourceBottomDist - totalBuffer, 0);
  1085. mxEdgeStyle.vertexSeperations[3] = Math.max(sourceRightDist - totalBuffer, 0);
  1086. //==============================================================
  1087. // Start of source and target direction determination
  1088. // Work through the preferred orientations by relative positioning
  1089. // of the vertices and list them in preferred and available order
  1090. var dirPref = [];
  1091. var horPref = [];
  1092. var vertPref = [];
  1093. horPref[0] = (sourceLeftDist >= sourceRightDist) ? mxConstants.DIRECTION_MASK_WEST
  1094. : mxConstants.DIRECTION_MASK_EAST;
  1095. vertPref[0] = (sourceTopDist >= sourceBottomDist) ? mxConstants.DIRECTION_MASK_NORTH
  1096. : mxConstants.DIRECTION_MASK_SOUTH;
  1097. horPref[1] = mxUtils.reversePortConstraints(horPref[0]);
  1098. vertPref[1] = mxUtils.reversePortConstraints(vertPref[0]);
  1099. var preferredHorizDist = sourceLeftDist >= sourceRightDist ? sourceLeftDist
  1100. : sourceRightDist;
  1101. var preferredVertDist = sourceTopDist >= sourceBottomDist ? sourceTopDist
  1102. : sourceBottomDist;
  1103. var prefOrdering = [ [0, 0] , [0, 0] ];
  1104. var preferredOrderSet = false;
  1105. // If the preferred port isn't available, switch it
  1106. for (var i = 0; i < 2; i++)
  1107. {
  1108. if (dir[i] != 0x0)
  1109. {
  1110. continue;
  1111. }
  1112. if ((horPref[i] & portConstraint[i]) == 0)
  1113. {
  1114. horPref[i] = mxUtils.reversePortConstraints(horPref[i]);
  1115. }
  1116. if ((vertPref[i] & portConstraint[i]) == 0)
  1117. {
  1118. vertPref[i] = mxUtils
  1119. .reversePortConstraints(vertPref[i]);
  1120. }
  1121. prefOrdering[i][0] = vertPref[i];
  1122. prefOrdering[i][1] = horPref[i];
  1123. }
  1124. if (preferredVertDist > 0
  1125. && preferredHorizDist > 0)
  1126. {
  1127. // Possibility of two segment edge connection
  1128. if (((horPref[0] & portConstraint[0]) > 0)
  1129. && ((vertPref[1] & portConstraint[1]) > 0))
  1130. {
  1131. prefOrdering[0][0] = horPref[0];
  1132. prefOrdering[0][1] = vertPref[0];
  1133. prefOrdering[1][0] = vertPref[1];
  1134. prefOrdering[1][1] = horPref[1];
  1135. preferredOrderSet = true;
  1136. }
  1137. else if (((vertPref[0] & portConstraint[0]) > 0)
  1138. && ((horPref[1] & portConstraint[1]) > 0))
  1139. {
  1140. prefOrdering[0][0] = vertPref[0];
  1141. prefOrdering[0][1] = horPref[0];
  1142. prefOrdering[1][0] = horPref[1];
  1143. prefOrdering[1][1] = vertPref[1];
  1144. preferredOrderSet = true;
  1145. }
  1146. }
  1147. if (preferredVertDist > 0 && !preferredOrderSet)
  1148. {
  1149. prefOrdering[0][0] = vertPref[0];
  1150. prefOrdering[0][1] = horPref[0];
  1151. prefOrdering[1][0] = vertPref[1];
  1152. prefOrdering[1][1] = horPref[1];
  1153. preferredOrderSet = true;
  1154. }
  1155. if (preferredHorizDist > 0 && !preferredOrderSet)
  1156. {
  1157. prefOrdering[0][0] = horPref[0];
  1158. prefOrdering[0][1] = vertPref[0];
  1159. prefOrdering[1][0] = horPref[1];
  1160. prefOrdering[1][1] = vertPref[1];
  1161. preferredOrderSet = true;
  1162. }
  1163. // The source and target prefs are now an ordered list of
  1164. // the preferred port selections
  1165. // If the list contains gaps, compact it
  1166. for (var i = 0; i < 2; i++)
  1167. {
  1168. if (dir[i] != 0x0)
  1169. {
  1170. continue;
  1171. }
  1172. if ((prefOrdering[i][0] & portConstraint[i]) == 0)
  1173. {
  1174. prefOrdering[i][0] = prefOrdering[i][1];
  1175. }
  1176. dirPref[i] = prefOrdering[i][0] & portConstraint[i];
  1177. dirPref[i] |= (prefOrdering[i][1] & portConstraint[i]) << 8;
  1178. dirPref[i] |= (prefOrdering[1 - i][i] & portConstraint[i]) << 16;
  1179. dirPref[i] |= (prefOrdering[1 - i][1 - i] & portConstraint[i]) << 24;
  1180. if ((dirPref[i] & 0xF) == 0)
  1181. {
  1182. dirPref[i] = dirPref[i] << 8;
  1183. }
  1184. if ((dirPref[i] & 0xF00) == 0)
  1185. {
  1186. dirPref[i] = (dirPref[i] & 0xF) | dirPref[i] >> 8;
  1187. }
  1188. if ((dirPref[i] & 0xF0000) == 0)
  1189. {
  1190. dirPref[i] = (dirPref[i] & 0xFFFF)
  1191. | ((dirPref[i] & 0xF000000) >> 8);
  1192. }
  1193. dir[i] = dirPref[i] & 0xF;
  1194. if (portConstraint[i] == mxConstants.DIRECTION_MASK_WEST
  1195. || portConstraint[i] == mxConstants.DIRECTION_MASK_NORTH
  1196. || portConstraint[i] == mxConstants.DIRECTION_MASK_EAST
  1197. || portConstraint[i] == mxConstants.DIRECTION_MASK_SOUTH)
  1198. {
  1199. dir[i] = portConstraint[i];
  1200. }
  1201. }
  1202. //==============================================================
  1203. // End of source and target direction determination
  1204. var sourceIndex = dir[0] == mxConstants.DIRECTION_MASK_EAST ? 3
  1205. : dir[0];
  1206. var targetIndex = dir[1] == mxConstants.DIRECTION_MASK_EAST ? 3
  1207. : dir[1];
  1208. sourceIndex -= quad;
  1209. targetIndex -= quad;
  1210. if (sourceIndex < 1)
  1211. {
  1212. sourceIndex += 4;
  1213. }
  1214. if (targetIndex < 1)
  1215. {
  1216. targetIndex += 4;
  1217. }
  1218. var routePattern = mxEdgeStyle.routePatterns[sourceIndex - 1][targetIndex - 1];
  1219. //console.log('routePattern', routePattern);
  1220. mxEdgeStyle.wayPoints1[0][0] = geo[0][0];
  1221. mxEdgeStyle.wayPoints1[0][1] = geo[0][1];
  1222. switch (dir[0])
  1223. {
  1224. case mxConstants.DIRECTION_MASK_WEST:
  1225. mxEdgeStyle.wayPoints1[0][0] -= sourceBuffer;
  1226. mxEdgeStyle.wayPoints1[0][1] += constraint[0][1] * geo[0][3];
  1227. break;
  1228. case mxConstants.DIRECTION_MASK_SOUTH:
  1229. mxEdgeStyle.wayPoints1[0][0] += constraint[0][0] * geo[0][2];
  1230. mxEdgeStyle.wayPoints1[0][1] += geo[0][3] + sourceBuffer;
  1231. break;
  1232. case mxConstants.DIRECTION_MASK_EAST:
  1233. mxEdgeStyle.wayPoints1[0][0] += geo[0][2] + sourceBuffer;
  1234. mxEdgeStyle.wayPoints1[0][1] += constraint[0][1] * geo[0][3];
  1235. break;
  1236. case mxConstants.DIRECTION_MASK_NORTH:
  1237. mxEdgeStyle.wayPoints1[0][0] += constraint[0][0] * geo[0][2];
  1238. mxEdgeStyle.wayPoints1[0][1] -= sourceBuffer;
  1239. break;
  1240. }
  1241. var currentIndex = 0;
  1242. // Orientation, 0 horizontal, 1 vertical
  1243. var lastOrientation = (dir[0] & (mxConstants.DIRECTION_MASK_EAST | mxConstants.DIRECTION_MASK_WEST)) > 0 ? 0
  1244. : 1;
  1245. var initialOrientation = lastOrientation;
  1246. var currentOrientation = 0;
  1247. for (var i = 0; i < routePattern.length; i++)
  1248. {
  1249. var nextDirection = routePattern[i] & 0xF;
  1250. // Rotate the index of this direction by the quad
  1251. // to get the real direction
  1252. var directionIndex = nextDirection == mxConstants.DIRECTION_MASK_EAST ? 3
  1253. : nextDirection;
  1254. directionIndex += quad;
  1255. if (directionIndex > 4)
  1256. {
  1257. directionIndex -= 4;
  1258. }
  1259. var direction = mxEdgeStyle.dirVectors[directionIndex - 1];
  1260. currentOrientation = (directionIndex % 2 > 0) ? 0 : 1;
  1261. // Only update the current index if the point moved
  1262. // in the direction of the current segment move,
  1263. // otherwise the same point is moved until there is
  1264. // a segment direction change
  1265. if (currentOrientation != lastOrientation)
  1266. {
  1267. currentIndex++;
  1268. // Copy the previous way point into the new one
  1269. // We can't base the new position on index - 1
  1270. // because sometime elbows turn out not to exist,
  1271. // then we'd have to rewind.
  1272. mxEdgeStyle.wayPoints1[currentIndex][0] = mxEdgeStyle.wayPoints1[currentIndex - 1][0];
  1273. mxEdgeStyle.wayPoints1[currentIndex][1] = mxEdgeStyle.wayPoints1[currentIndex - 1][1];
  1274. }
  1275. var tar = (routePattern[i] & mxEdgeStyle.TARGET_MASK) > 0;
  1276. var sou = (routePattern[i] & mxEdgeStyle.SOURCE_MASK) > 0;
  1277. var side = (routePattern[i] & mxEdgeStyle.SIDE_MASK) >> 5;
  1278. side = side << quad;
  1279. if (side > 0xF)
  1280. {
  1281. side = side >> 4;
  1282. }
  1283. var center = (routePattern[i] & mxEdgeStyle.CENTER_MASK) > 0;
  1284. if ((sou || tar) && side < 9)
  1285. {
  1286. var limit = 0;
  1287. var souTar = sou ? 0 : 1;
  1288. if (center && currentOrientation == 0)
  1289. {
  1290. limit = geo[souTar][0] + constraint[souTar][0] * geo[souTar][2];
  1291. }
  1292. else if (center)
  1293. {
  1294. limit = geo[souTar][1] + constraint[souTar][1] * geo[souTar][3];
  1295. }
  1296. else
  1297. {
  1298. limit = mxEdgeStyle.limits[souTar][side];
  1299. }
  1300. if (currentOrientation == 0)
  1301. {
  1302. var lastX = mxEdgeStyle.wayPoints1[currentIndex][0];
  1303. var deltaX = (limit - lastX) * direction[0];
  1304. if (deltaX > 0)
  1305. {
  1306. mxEdgeStyle.wayPoints1[currentIndex][0] += direction[0]
  1307. * deltaX;
  1308. }
  1309. }
  1310. else
  1311. {
  1312. var lastY = mxEdgeStyle.wayPoints1[currentIndex][1];
  1313. var deltaY = (limit - lastY) * direction[1];
  1314. if (deltaY > 0)
  1315. {
  1316. mxEdgeStyle.wayPoints1[currentIndex][1] += direction[1]
  1317. * deltaY;
  1318. }
  1319. }
  1320. }
  1321. else if (center)
  1322. {
  1323. // Which center we're travelling to depend on the current direction
  1324. mxEdgeStyle.wayPoints1[currentIndex][0] += direction[0]
  1325. * Math.abs(mxEdgeStyle.vertexSeperations[directionIndex] / 2);
  1326. mxEdgeStyle.wayPoints1[currentIndex][1] += direction[1]
  1327. * Math.abs(mxEdgeStyle.vertexSeperations[directionIndex] / 2);
  1328. }
  1329. if (currentIndex > 0
  1330. && mxEdgeStyle.wayPoints1[currentIndex][currentOrientation] == mxEdgeStyle.wayPoints1[currentIndex - 1][currentOrientation])
  1331. {
  1332. currentIndex--;
  1333. }
  1334. else
  1335. {
  1336. lastOrientation = currentOrientation;
  1337. }
  1338. }
  1339. for (var i = 0; i <= currentIndex; i++)
  1340. {
  1341. if (i == currentIndex)
  1342. {
  1343. // Last point can cause last segment to be in
  1344. // same direction as jetty/approach. If so,
  1345. // check the number of points is consistent
  1346. // with the relative orientation of source and target
  1347. // jx. Same orientation requires an even
  1348. // number of turns (points), different requires
  1349. // odd.
  1350. var targetOrientation = (dir[1] & (mxConstants.DIRECTION_MASK_EAST | mxConstants.DIRECTION_MASK_WEST)) > 0 ? 0
  1351. : 1;
  1352. var sameOrient = targetOrientation == initialOrientation ? 0 : 1;
  1353. // (currentIndex + 1) % 2 is 0 for even number of points,
  1354. // 1 for odd
  1355. if (sameOrient != (currentIndex + 1) % 2)
  1356. {
  1357. // The last point isn't required
  1358. break;
  1359. }
  1360. }
  1361. result.push(new mxPoint(Math.round(mxEdgeStyle.wayPoints1[i][0] * state.view.scale * 10) / 10,
  1362. Math.round(mxEdgeStyle.wayPoints1[i][1] * state.view.scale * 10) / 10));
  1363. }
  1364. //console.log(result);
  1365. // Removes duplicates
  1366. var index = 1;
  1367. while (index < result.length)
  1368. {
  1369. if (result[index - 1] == null || result[index] == null ||
  1370. result[index - 1].x != result[index].x ||
  1371. result[index - 1].y != result[index].y)
  1372. {
  1373. index++;
  1374. }
  1375. else
  1376. {
  1377. result.splice(index, 1);
  1378. }
  1379. }
  1380. },
  1381. getRoutePattern: function(dir, quad, dx, dy)
  1382. {
  1383. var sourceIndex = dir[0] == mxConstants.DIRECTION_MASK_EAST ? 3
  1384. : dir[0];
  1385. var targetIndex = dir[1] == mxConstants.DIRECTION_MASK_EAST ? 3
  1386. : dir[1];
  1387. sourceIndex -= quad;
  1388. targetIndex -= quad;
  1389. if (sourceIndex < 1)
  1390. {
  1391. sourceIndex += 4;
  1392. }
  1393. if (targetIndex < 1)
  1394. {
  1395. targetIndex += 4;
  1396. }
  1397. var result = routePatterns[sourceIndex - 1][targetIndex - 1];
  1398. if (dx == 0 || dy == 0)
  1399. {
  1400. if (inlineRoutePatterns[sourceIndex - 1][targetIndex - 1] != null)
  1401. {
  1402. result = inlineRoutePatterns[sourceIndex - 1][targetIndex - 1];
  1403. }
  1404. }
  1405. return result;
  1406. }
  1407. };