Route.js 43 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394959697989910010110210310410510610710810911011111211311411511611711811912012112212312412512612712812913013113213313413513613713813914014114214314414514614714814915015115215315415515615715815916016116216316416516616716816917017117217317417517617717817918018118218318418518618718818919019119219319419519619719819920020120220320420520620720820921021121221321421521621721821922022122222322422522622722822923023123223323423523623723823924024124224324424524624724824925025125225325425525625725825926026126226326426526626726826927027127227327427527627727827928028128228328428528628728828929029129229329429529629729829930030130230330430530630730830931031131231331431531631731831932032132232332432532632732832933033133233333433533633733833934034134234334434534634734834935035135235335435535635735835936036136236336436536636736836937037137237337437537637737837938038138238338438538638738838939039139239339439539639739839940040140240340440540640740840941041141241341441541641741841942042142242342442542642742842943043143243343443543643743843944044144244344444544644744844945045145245345445545645745845946046146246346446546646746846947047147247347447547647747847948048148248348448548648748848949049149249349449549649749849950050150250350450550650750850951051151251351451551651751851952052152252352452552652752852953053153253353453553653753853954054154254354454554654754854955055155255355455555655755855956056156256356456556656756856957057157257357457557657757857958058158258358458558658758858959059159259359459559659759859960060160260360460560660760860961061161261361461561661761861962062162262362462562662762862963063163263363463563663763863964064164264364464564664764864965065165265365465565665765865966066166266366466566666766866967067167267367467567667767867968068168268368468568668768868969069169269369469569669769869970070170270370470570670770870971071171271371471571671771871972072172272372472572672772872973073173273373473573673773873974074174274374474574674774874975075175275375475575675775875976076176276376476576676776876977077177277377477577677777877978078178278378478578678778878979079179279379479579679779879980080180280380480580680780880981081181281381481581681781881982082182282382482582682782882983083183283383483583683783883984084184284384484584684784884985085185285385485585685785885986086186286386486586686786886987087187287387487587687787887988088188288388488588688788888989089189289389489589689789889990090190290390490590690790890991091191291391491591691791891992092192292392492592692792892993093193293393493593693793893994094194294394494594694794894995095195295395495595695795895996096196296396496596696796896997097197297397497597697797897998098198298398498598698798898999099199299399499599699799899910001001100210031004100510061007100810091010101110121013101410151016101710181019102010211022102310241025102610271028102910301031103210331034103510361037103810391040104110421043104410451046104710481049105010511052105310541055105610571058105910601061106210631064106510661067106810691070107110721073107410751076107710781079108010811082108310841085108610871088108910901091109210931094109510961097109810991100110111021103110411051106110711081109111011111112111311141115111611171118111911201121112211231124112511261127112811291130113111321133113411351136113711381139114011411142114311441145114611471148114911501151115211531154115511561157115811591160116111621163116411651166116711681169117011711172
  1. MWF.xDesktop.requireApp("process.ProcessDesigner", "Property", null, false);
  2. MWF.xApplication.process.ProcessDesigner.Route = new Class({
  3. initialize: function (data, process) {
  4. this.data = data;
  5. this.process = process;
  6. this.paper = this.process.paper;
  7. this.loaded = false;
  8. this.l1 = 8;
  9. this.l2 = 12;
  10. this.aj = 25;
  11. this.corners = [];
  12. this.toSelf = false;
  13. this.isLineEvent = false;
  14. this.isTextEvent = false;
  15. this.isSetEvent = false;
  16. this.isArrowEvent = false;
  17. this.isPointEvent = false;
  18. this.checked = false;
  19. this.isBack = false;
  20. this.isBrokenLine = false;
  21. this.tmpbeginPoint = null;
  22. this.tmpEndPoint = null;
  23. this.toActivity = this.getNextActivity();
  24. this.positionPoints = this.getRoutePoint();
  25. if (!this.process.options.isView) {
  26. this.listItem = new MWF.APPPD.Route.List(this);
  27. this.listItem.load();
  28. }
  29. },
  30. getRoutePoint: function () {
  31. var points = [];
  32. if (this.data.track) {
  33. var pointArr = this.data.track.split(/\s+/g);
  34. pointArr.each(function (p) {
  35. var pArr = p.split(/(?:,\s*){1}|(?:;\s*){1}/g);
  36. points.push({"x": pArr[0], "y": pArr[1]});
  37. }.bind(this));
  38. }
  39. return points;
  40. },
  41. reload: function (fromPath, toPath) {
  42. if (this.toActivity && this.fromActivity) {
  43. if (this.toActivity.data.id == this.fromActivity.data.id) {
  44. this.toSelf = true;
  45. } else {
  46. this.toSelf = false;
  47. }
  48. }
  49. // this.positionPoints = this.getRoutePoint();
  50. this.getPoint(fromPath, toPath);
  51. this.redraw();
  52. },
  53. load: function (fromActivity) {
  54. if (this.process.isNewProcess) {
  55. this.data.createTime = new Date().format('db');
  56. this.data.updateTime = new Date().format('db');
  57. }
  58. if (fromActivity) this.fromActivity = fromActivity;
  59. if (this.toActivity && this.fromActivity) {
  60. if (this.toActivity.data.id == this.fromActivity.data.id) {
  61. this.toSelf = true;
  62. } else {
  63. this.toSelf = false;
  64. }
  65. }
  66. this.getPoint();
  67. this.draw();
  68. this.loaded = true;
  69. },
  70. setActivity: function (toActivity, fromActivity) {
  71. if (toActivity) {
  72. if (this.toActivity) {
  73. this.toActivity.fromRoutes.erase(this);
  74. }
  75. this.toActivity = toActivity;
  76. this.data.activity = this.toActivity.data.id;
  77. this.data.activityType = this.toActivity.data.type;
  78. if (this.toActivity.fromRoutes.indexOf(this) == -1) this.toActivity.fromRoutes.push(this);
  79. }
  80. if (fromActivity) {
  81. if (this.fromActivity) {
  82. this.fromActivity.routes.erase(this);
  83. this.fromActivity.removeRouteData(this.data.id);
  84. // this.fromActivity.data.routeList.erase(this.data.id);
  85. }
  86. this.fromActivity = fromActivity;
  87. if (this.data.id) this.fromActivity.addRouteData(this.data.id);
  88. if (this.fromActivity.routes.indexOf(this) == -1) this.fromActivity.routes.push(this);
  89. }
  90. },
  91. getNextActivity: function () {
  92. var id = this.data.activity;
  93. var type = this.data.activityType;
  94. if (type) {
  95. if (type.toLowerCase() == "begin") {
  96. if (this.process.begin.data.id == id) {
  97. this.process.begin.fromRoutes.push(this);
  98. return this.process.begin;
  99. }
  100. } else {
  101. var activity = this.process[type + "s"][id];
  102. if (activity) {
  103. if (activity.fromRoutes.indexOf(this) == -1) activity.fromRoutes.push(this);
  104. return activity;
  105. }
  106. }
  107. }
  108. return null;
  109. },
  110. redraw: function () {
  111. if (this.beginPoint && this.endPoint) {
  112. if (this.set) {
  113. //this.set.show();
  114. //this.set.clear();
  115. } else {
  116. this.set = this.paper.set();
  117. }
  118. if (this.point) {
  119. this.point.show();
  120. this.point.attr("path", MWFRaphael.getCirclePath(this.beginPoint.x, this.beginPoint.y, 3));
  121. } else {
  122. this.point = this.paper.circlePath(this.beginPoint.x, this.beginPoint.y, 3);
  123. this.point.attr(this.process.css.route.decision.normal);
  124. this.set.push(this.point);
  125. }
  126. if (this.line) {
  127. this.line.show();
  128. this.line.attr("path", this.getLinePath());
  129. } else {
  130. this.line = this.paper.path(this.getLinePath());
  131. this.line.toBack();
  132. this.line.attr(this.process.css.route.line.normal);
  133. this.set.push(this.line);
  134. }
  135. this.line.toBack();
  136. if (this.text) {
  137. this.text.show();
  138. var p = this.getTextPoint();
  139. this.text.attr({
  140. "text": this.data.name || MWF.APPPD.LP.unnamed,
  141. "x": p.x,
  142. "y": p.y
  143. });
  144. } else {
  145. this.text = this.createText();
  146. this.set.push(this.text);
  147. }
  148. if (this.arrow) {
  149. this.arrow.show();
  150. var beginPoint = (this.positionPoints.length) ? this.positionPoints[this.positionPoints.length - 1] : this.beginPoint;
  151. this.arrow.attr("path", MWFRaphael.getArrowPath(beginPoint, this.endPoint, this.l1, this.l2, this.aj));
  152. } else {
  153. this.arrow = this.createArrow();
  154. this.arrow.attr(this.process.css.route.arrow.normal);
  155. this.set.push(this.arrow);
  156. }
  157. if (this.set) {
  158. this.set.attr({"transform": ""});
  159. if (this.checked) {
  160. if (this.process.currentSelected == this) {
  161. this.point.attr(this.process.css.route.decision.selected);
  162. this.line.attr(this.process.css.route.line.selected);
  163. this.arrow.attr(this.process.css.route.arrow.selected);
  164. this.text.attr(this.process.css.route.linetext.selected);
  165. } else {
  166. this.point.attr(this.process.css.route.decision.normal);
  167. this.line.attr(this.process.css.route.line.normal);
  168. this.arrow.attr(this.process.css.route.arrow.normal);
  169. this.text.attr(this.process.css.route.linetext.normal);
  170. }
  171. } else {
  172. this.point.attr(this.process.css.route.decision["no-checked"]);
  173. this.line.attr(this.process.css.route.line["no-checked"]);
  174. this.arrow.attr(this.process.css.route.arrow["no-checked"]);
  175. this.text.attr(this.process.css.route.linetext["no-checked"]);
  176. }
  177. if (this.isBack) {
  178. this.set.toBack();
  179. } else {
  180. this.set.toFront();
  181. }
  182. }
  183. } else {
  184. if (this.point) this.point.hide();
  185. if (this.line) this.line.hide();
  186. if (this.arrow) this.arrow.hide();
  187. if (this.set) this.set.hide();
  188. }
  189. this.setListItemData();
  190. this.setEvent();
  191. },
  192. draw: function () {
  193. if (this.beginPoint && this.endPoint) {
  194. this.point = this.paper.circlePath(this.beginPoint.x, this.beginPoint.y, 3);
  195. this.point.attr(this.process.css.route.decision.normal);
  196. this.line = this.paper.path(this.getLinePath());
  197. this.line.toBack();
  198. this.line.attr(this.process.css.route.line.normal);
  199. this.text = this.createText();
  200. this.arrow = this.createArrow();
  201. this.arrow.attr(this.process.css.route.arrow.normal);
  202. this.set = this.paper.set();
  203. this.set.push(this.point, this.line, this.arrow, this.text);
  204. this.point.data("bind", this);
  205. this.line.data("bind", this);
  206. this.arrow.data("bind", this);
  207. this.text.data("bind", this);
  208. if (!this.toSelf) {
  209. this.positionPoints.each(function (p, idx) {
  210. this.createCorner(p, idx);
  211. }.bind(this));
  212. }
  213. if (this.checked) {
  214. if (this.process.currentSelected == this) {
  215. this.point.attr(this.process.css.route.decision.selected);
  216. this.line.attr(this.process.css.route.line.selected);
  217. this.arrow.attr(this.process.css.route.arrow.selected);
  218. this.text.attr(this.process.css.route.linetext.selected);
  219. } else {
  220. this.point.attr(this.process.css.route.decision.normal);
  221. this.line.attr(this.process.css.route.line.normal);
  222. this.arrow.attr(this.process.css.route.arrow.normal);
  223. this.text.attr(this.process.css.route.linetext.normal);
  224. }
  225. } else {
  226. this.point.attr(this.process.css.route.decision["no-checked"]);
  227. this.line.attr(this.process.css.route.line["no-checked"]);
  228. this.arrow.attr(this.process.css.route.arrow["no-checked"]);
  229. this.text.attr(this.process.css.route.linetext["no-checked"]);
  230. }
  231. if (this.isBack) {
  232. this.set.toBack();
  233. } else {
  234. this.set.toFront();
  235. }
  236. } else {
  237. if (this.point) this.point.hide();
  238. if (this.line) this.line.hide();
  239. if (this.arrow) this.arrow.hide();
  240. if (this.text) this.text.hide();
  241. if (this.set) this.set.hide();
  242. }
  243. this.setEvent();
  244. },
  245. setEvent: function () {
  246. if (this.set) {
  247. if (!this.isSetEvent) {
  248. this.set.mousedown(function (e) {
  249. this.selected();
  250. //this.process.unSelectedEvent = false;
  251. e.stopPropagation();
  252. }.bind(this));
  253. this.set.click(function (e) {
  254. e.stopPropagation();
  255. }.bind(this));
  256. this.isSetEvent = true;
  257. }
  258. ;
  259. }
  260. if (this.line) {
  261. if (!this.isLineEvent) {
  262. this.line.mousedown(function (e) {
  263. if (!this.toSelf) {
  264. var offsetP = MWF.getOffset(e);
  265. this.checkBrokenLineBegin(offsetP.offsetX, offsetP.offsetY);
  266. //this.checkBrokenLineBegin(e.clientX, e.clientY);
  267. }
  268. }.bind(this));
  269. this.isLineEvent = true;
  270. }
  271. ;
  272. }
  273. ;
  274. if (this.arrow) {
  275. if (!this.isArrowEvent) {
  276. this.arrow.drag(
  277. function (dx, dy, x, y, e) {
  278. this.arrowMove(dx, dy, x, y.e);
  279. }.bind(this),
  280. function () {
  281. this.arrowMoveStart();
  282. }.bind(this),
  283. function () {
  284. this.arrowMoveEnd();
  285. }.bind(this)
  286. );
  287. this.arrow.hover(function () {
  288. var beginPoint = this.beginPoint;
  289. if (this.positionPoints.length) {
  290. beginPoint = this.positionPoints[this.positionPoints.length - 1];
  291. }
  292. beginPoint.x = beginPoint.x.toFloat();
  293. beginPoint.y = beginPoint.y.toFloat();
  294. var path = MWFRaphael.getArrowPath(beginPoint, this.endPoint, 20, 30, this.aj);
  295. this.arrow.attr("path", path);
  296. }.bind(this), function () {
  297. var beginPoint = this.beginPoint;
  298. if (this.positionPoints.length) {
  299. beginPoint = this.positionPoints[this.positionPoints.length - 1];
  300. }
  301. beginPoint.x = beginPoint.x.toFloat();
  302. beginPoint.y = beginPoint.y.toFloat();
  303. var path = MWFRaphael.getArrowPath(beginPoint, this.endPoint, this.l1, this.l2, this.aj);
  304. this.arrow.attr("path", path);
  305. }.bind(this));
  306. }
  307. this.isArrowEvent = true;
  308. }
  309. ;
  310. if (this.point) {
  311. if (!this.isPointEvent) {
  312. this.point.drag(
  313. function (dx, dy, x, y, e) {
  314. this.pointMove(dx, dy, x, y.e);
  315. }.bind(this),
  316. function () {
  317. this.pointMoveStart();
  318. }.bind(this),
  319. function () {
  320. this.pointMoveEnd();
  321. }.bind(this)
  322. );
  323. this.point.hover(function () {
  324. var path = MWFRaphael.getCirclePath(this.beginPoint.x, this.beginPoint.y, 8);
  325. this.point.attr("path", path);
  326. }.bind(this), function () {
  327. var path = MWFRaphael.getCirclePath(this.beginPoint.x, this.beginPoint.y, 3);
  328. this.point.attr("path", path);
  329. }.bind(this));
  330. }
  331. this.isPointEvent = true;
  332. }
  333. ;
  334. if (this.text) {
  335. if (!this.isTextEvent) {
  336. this.text.drag(
  337. function (dx, dy, x, y) {
  338. this.textMove(dx, dy, x, y);
  339. }.bind(this),
  340. function () {
  341. this.textMoveStart();
  342. }.bind(this),
  343. function () {
  344. this.textMoveEnd();
  345. }.bind(this)
  346. );
  347. this.isTextEvent = true;
  348. }
  349. }
  350. ;
  351. },
  352. arrowMoveStart: function () {
  353. this.arrow.data("originalPoint", {
  354. "x": this.endPoint.x,
  355. "y": this.endPoint.y
  356. });
  357. // this.arrow.toBack();
  358. // if (this.line) this.line.toBack();
  359. this.process.isChangeRouteTo = true;
  360. this.process.currentChangeRoute = this;
  361. },
  362. arrowMove: function (dx, dy, x, y) {
  363. this.isBack = true;
  364. var p = this.arrow.data("originalPoint");
  365. this.endPoint = {
  366. "x": p.x + dx - 6,
  367. "y": p.y + dy - 6
  368. };
  369. this.redraw();
  370. },
  371. arrowMoveEnd: function () {
  372. this.isBack = false;
  373. if (this.process.isChangeRouteTo) {
  374. this.endPoint = this.arrow.data("originalPoint");
  375. this.redraw();
  376. this.process.isChangeRouteTo = false;
  377. this.process.currentChangeRoute = null;
  378. }
  379. //this.arrow.toFront();
  380. if (this.line) this.line.toFront();
  381. },
  382. pointMoveStart: function () {
  383. this.point.data("originalPoint", {
  384. "x": this.beginPoint.x,
  385. "y": this.beginPoint.y
  386. });
  387. //this.point.toBack();
  388. //if (this.line) this.line.toBack();
  389. this.process.isChangeRouteFrom = true;
  390. this.process.currentChangeRoute = this;
  391. },
  392. pointMove: function (dx, dy, x, y) {
  393. if (dx > 10 || dy > 10) this.isBack = true;
  394. var p = this.point.data("originalPoint");
  395. this.beginPoint = {
  396. "x": p.x + dx - 4,
  397. "y": p.y + dy - 4
  398. };
  399. this.redraw();
  400. },
  401. pointMoveEnd: function () {
  402. this.isBack = false;
  403. if (this.process.isChangeRouteFrom) {
  404. this.beginPoint = this.point.data("originalPoint");
  405. this.redraw();
  406. this.process.isChangeRouteFrom = false;
  407. this.process.currentChangeRoute = null;
  408. }
  409. //this.point.toFront();
  410. if (this.line) this.line.toFront();
  411. },
  412. cornerBrokenLineBegin: function (e, corner) {
  413. if (!this.process.isCreateRoute) {
  414. // var x = e.layerX;
  415. // var y = e.layerY;
  416. var offsetP = MWF.getOffset(e);
  417. var x = offsetP.offsetX;
  418. var y = offsetP.offsetY;
  419. var idx = this.corners.indexOf(corner);
  420. if (idx != -1) {
  421. this.process.brokenLineBeginMousemoveBind = function (e) {
  422. this.doBeginBrokenLine(e, x, y, idx - 1, corner, true);
  423. }.bind(this);
  424. this.process.brokenLineMouseupBind = function () {
  425. this.endBrokenLine();
  426. }.bind(this);
  427. this.paper.canvas.addEvent("mousemove", this.process.brokenLineBeginMousemoveBind);
  428. this.paper.canvas.addEvent("mouseup", this.process.brokenLineMouseupBind);
  429. }
  430. }
  431. },
  432. checkBrokenLineBegin: function (x, y) {
  433. if (!this.process.isCreateRoute) {
  434. var movePointIndex = this.getNearIndex(this.positionPoints, {"x": x, "y": y});
  435. if (movePointIndex === null) {
  436. var idx = this.getCornerPointIndex(x, y);
  437. this.process.brokenLineBeginMousemoveBind = function (e) {
  438. this.doBeginBrokenLine(e, x, y, idx);
  439. }.bind(this);
  440. this.process.brokenLineMouseupBind = function () {
  441. this.endBrokenLine();
  442. }.bind(this);
  443. this.paper.canvas.addEvent("mousemove", this.process.brokenLineBeginMousemoveBind);
  444. this.paper.canvas.addEvent("mouseup", this.process.brokenLineMouseupBind);
  445. } else {
  446. }
  447. }
  448. ;
  449. },
  450. getCornerPointIndex: function (x, y) {
  451. cornerPointIndex = -1;
  452. var tmpLong = 500000;
  453. if (this.positionPoints.length) {
  454. var tmpArr = this.positionPoints.concat(this.endPoint);
  455. tmpArr.unshift(this.beginPoint);
  456. for (var i = 0; i < tmpArr.length - 1; i++) {
  457. var p1 = tmpArr[i];
  458. var p2 = tmpArr[i + 1];
  459. var n = MWFRaphael.getMinDistance({"x": x, "y": y}, p1, p2).h;
  460. if (n < tmpLong) {
  461. tmpLong = n;
  462. cornerPointIndex = i - 1;
  463. }
  464. }
  465. ;
  466. }
  467. ;
  468. return cornerPointIndex;
  469. },
  470. getNearIndex: function (pList, p) {
  471. for (var i = 0; i < pList.length; i++) {
  472. var tmpp = pList[i];
  473. var lineP = {"x": tmpp.x.toFloat(), "y": tmpp.y.toFloat()};
  474. var tmp = MWFRaphael.getPointDistance(p, lineP);
  475. if (tmp <= 8) {
  476. return i;
  477. }
  478. }
  479. return null;
  480. },
  481. endBrokenLine: function () {
  482. this.process.isBrokenLine = false;
  483. if (this.removeCorner) {
  484. this.corners.splice(this.removeCorner.idx + 1, 1);
  485. this.removeCorner.corner.remove();
  486. this.positionPoints.splice(this.removeCorner.idx + 1, 1);
  487. this.removeCorner = null;
  488. }
  489. this.isBrokenLine = false;
  490. this.data.track = this.positionPointsToString();
  491. this.paper.canvas.removeEvent("mouseup", this.process.brokenLineMouseupBind);
  492. this.paper.canvas.removeEvent("mousemove", this.process.brokenLineBeginMousemoveBind);
  493. this.paper.canvas.removeEvent("mousemove", this.process.brokenLineMousemoveBind);
  494. },
  495. positionPointsToString: function () {
  496. var arr = [];
  497. this.positionPoints.each(function (p) {
  498. arr.push(p.x + "," + p.y);
  499. });
  500. return arr.join(" ");
  501. },
  502. doBeginBrokenLine: function (e, x, y, idx, corner, noCreateP) {
  503. var p1 = this.positionPoints[idx] || this.beginPoint;
  504. var p2 = this.positionPoints[idx + 2] || this.endPoint;
  505. var offsetP = MWF.getOffset(e.event);
  506. var n = MWFRaphael.getMinDistance({
  507. "x": offsetP.offsetX,
  508. "y": offsetP.offsetY
  509. }, p1, p2).h;
  510. if (n > 6) {
  511. this.process.isBrokenLine = true;
  512. this.isBrokenLine = true;
  513. if (!corner || this.removeCorner) {
  514. if (!noCreateP) this.positionPoints.splice(idx + 1, 0, {
  515. "x": offsetP.offsetX,
  516. "y": offsetP.offsetY
  517. });
  518. if (this.removeCorner) {
  519. corner = this.removeCorner.corner;
  520. this.removeCorner = null;
  521. } else {
  522. corner = this.createCorner(this.positionPoints[idx + 1], idx + 1);
  523. }
  524. }
  525. corner.attr(this.process.css.route.corner["default"]);
  526. this.paper.canvas.removeEvent("mousemove", this.process.brokenLineBeginMousemoveBind);
  527. this.reload();
  528. this.process.brokenLineMousemoveBind = function (e) {
  529. this.doBrokenLine(e, idx, corner);
  530. }.bind(this);
  531. this.paper.canvas.addEvent("mousemove", this.process.brokenLineMousemoveBind);
  532. }
  533. ;
  534. },
  535. doBrokenLine: function (e, idx, corner) {
  536. var offsetP = MWF.getOffset(e.event);
  537. var toX = offsetP.offsetX;
  538. var toY = offsetP.offsetY;
  539. // if (this.process.isGrid){
  540. toX = Raphael.snapTo(10, toX, 10);
  541. toY = Raphael.snapTo(10, toY, 10);
  542. // }
  543. var p1 = this.positionPoints[idx] || this.beginPoint;
  544. var p2 = this.positionPoints[idx + 2] || this.endPoint;
  545. var offset = MWFRaphael.getMinDistance({"x": toX, "y": toY}, p1, p2);
  546. var off = offset.h;
  547. if (off < 6) {
  548. this.removeCorner = {"corner": corner, "idx": idx};
  549. corner.attr("path", MWFRaphael.getRectPath((offset.p.x.toFloat()) - 2.5, (offset.p.y.toFloat()) - 2.5, 5, 5, 0));
  550. if (this.positionPoints[idx + 1]) this.positionPoints[idx + 1].x = offset.p.x;
  551. if (this.positionPoints[idx + 1]) this.positionPoints[idx + 1].y = offset.p.y;
  552. this.reload();
  553. this.process.brokenLineBeginMousemoveBind = function (e) {
  554. this.doBeginBrokenLine(e, toX, toY, idx, null, true);
  555. }.bind(this);
  556. this.paper.canvas.removeEvent("mousemove", this.process.brokenLineMousemoveBind);
  557. this.paper.canvas.addEvent("mousemove", this.process.brokenLineBeginMousemoveBind);
  558. } else {
  559. if (Math.abs(p1.x - toX) < 5) toX = p1.x;
  560. if (Math.abs(p1.y - toY) < 5) toY = p1.y;
  561. if (Math.abs(p2.x - toX) < 5) toX = p2.x;
  562. if (Math.abs(p2.y - toY) < 5) toY = p2.y;
  563. var path = MWFRaphael.getRectPath(toX - 2.5, toY - 2.5, 5, 5, 0);
  564. corner.attr("path", path);
  565. if (this.positionPoints[idx + 1]) this.positionPoints[idx + 1].x = toX;
  566. if (this.positionPoints[idx + 1]) this.positionPoints[idx + 1].y = toY;
  567. this.reload();
  568. }
  569. },
  570. selected: function () {
  571. this.process.unSelectedAll();
  572. if (this.line) this.line.attr(this.process.css.route.line.selected);
  573. if (this.point) this.point.attr(this.process.css.route.decision.selected);
  574. if (this.arrow) this.arrow.attr(this.process.css.route.arrow.selected);
  575. if (this.text) this.text.attr(this.process.css.route.linetext.selected);
  576. this.corners.each(function (corner) {
  577. corner.show();
  578. });
  579. this.process.currentSelected = this;
  580. if (this.listItem) this.listItem.selected();
  581. this.set.toFront();
  582. this.showProperty();
  583. },
  584. unSelected: function () {
  585. if (this.checked) {
  586. this.point.attr(this.process.css.route.decision.normal);
  587. this.line.attr(this.process.css.route.line.normal);
  588. this.arrow.attr(this.process.css.route.arrow.normal);
  589. this.text.attr(this.process.css.route.linetext.normal);
  590. } else {
  591. this.point.attr(this.process.css.route.decision["no-checked"]);
  592. this.line.attr(this.process.css.route.line["no-checked"]);
  593. this.arrow.attr(this.process.css.route.arrow["no-checked"]);
  594. this.text.attr(this.process.css.route.linetext["no-checked"]);
  595. }
  596. this.corners.each(function (corner) {
  597. corner.hide();
  598. });
  599. this.process.currentSelected = null;
  600. if (this.listItem) this.listItem.unSelected();
  601. if (this.property) this.property.hide();
  602. },
  603. textMove: function (dx, dy, x, y) {
  604. var x = (this.text.moveX.toFloat()) + parseFloat(dx);
  605. var y = (this.text.moveY.toFloat()) + parseFloat(dy);
  606. var dp = this.getDefaultTextPoint();
  607. var d = MWFRaphael.getPointDistance(dp, {"x": x, "y": y});
  608. if (d < 5) {
  609. this.text.attr({
  610. "x": dp.x,
  611. "y": dp.y
  612. });
  613. } else {
  614. this.text.attr({
  615. "x": x,
  616. "y": y
  617. });
  618. }
  619. },
  620. textMoveStart: function () {
  621. this.text.moveX = this.text.attr("x");
  622. this.text.moveY = this.text.attr("y");
  623. },
  624. textMoveEnd: function () {
  625. var x = this.text.attr("x");
  626. var y = this.text.attr("y");
  627. var dp = this.getDefaultTextPoint();
  628. var d = MWFRaphael.getPointDistance(dp, {"x": x, "y": y});
  629. if (d < 5) {
  630. this.data.position = "";
  631. } else {
  632. x = x.toInt();
  633. y = y.toInt();
  634. this.data.position = x + "," + y;
  635. }
  636. },
  637. getLinePath: function () {
  638. var path = "";
  639. if (this.beginPoint && this.endPoint) {
  640. path = "M" + this.beginPoint.x + "," + this.beginPoint.y;
  641. this.positionPoints.each(function (p, idx) {
  642. var p0;
  643. var p2;
  644. if (idx == 0) {
  645. p0 = this.beginPoint;
  646. } else {
  647. p0 = this.positionPoints[idx - 1];
  648. }
  649. if (this.positionPoints[idx + 1]) {
  650. p2 = this.positionPoints[idx + 1];
  651. } else {
  652. p2 = this.endPoint;
  653. }
  654. p.x = p.x.toFloat();
  655. p.y = p.y.toFloat();
  656. var minus1 = MWFRaphael.getMinus(Math.abs(p.x - p0.x), Math.abs(p.y - p0.y), 12);
  657. var minus2 = MWFRaphael.getMinus(Math.abs(p.x - p2.x), Math.abs(p.y - p2.y), 12);
  658. var qp0 = null;
  659. var qp2 = null;
  660. if (p.x >= p0.x && p.y >= p0.y) {
  661. qp0 = {"x": p.x - minus1.x, "y": p.y - minus1.y};
  662. } else if (p.x <= p0.x && p.y <= p0.y) {
  663. qp0 = {"x": p.x + minus1.x, "y": p.y + minus1.y};
  664. } else if (p.x >= p0.x && p.y <= p0.y) {
  665. qp0 = {"x": p.x - minus1.x, "y": p.y + minus1.y};
  666. } else if (p.x <= p0.x && p.y >= p0.y) {
  667. qp0 = {"x": p.x + minus1.x, "y": p.y - minus1.y};
  668. }
  669. if (p.x >= p2.x && p.y >= p2.y) {
  670. qp2 = {"x": p.x - minus2.x, "y": p.y - minus2.y};
  671. } else if (p.x <= p2.x && p.y <= p2.y) {
  672. qp2 = {"x": p.x + minus2.x, "y": p.y + minus2.y};
  673. } else if (p.x >= p2.x && p.y <= p2.y) {
  674. qp2 = {"x": p.x - minus2.x, "y": p.y + minus2.y};
  675. } else if (p.x <= p2.x && p.y >= p2.y) {
  676. qp2 = {"x": p.x + minus2.x, "y": p.y - minus2.y};
  677. }
  678. path += "L" + qp0.x + "," + qp0.y;
  679. path += "Q" + p.x + ", " + p.y + ", " + qp2.x + "," + qp2.y;
  680. }.bind(this));
  681. path += "L" + this.endPoint.x + "," + this.endPoint.y;
  682. }
  683. return path;
  684. },
  685. getDefaultTextPoint: function () {
  686. var x = "";
  687. var y = "";
  688. if (this.toSelf) {
  689. x = this.positionPoints[2].x + (this.positionPoints[1].x - this.positionPoints[2].x) / 2;
  690. y = this.positionPoints[2].y - 8;
  691. } else {
  692. var p1 = this.beginPoint;
  693. var p2 = this.endPoint;
  694. if (this.positionPoints[0]) p2 = this.positionPoints[0];
  695. var xoff = (p2.x.toFloat() - p1.x.toFloat()) * 0.4;
  696. var yoff = (p2.y.toFloat() - p1.y.toFloat()) * 0.4;
  697. x = p1.x.toFloat() + xoff;
  698. y = p1.y.toFloat() + yoff;
  699. }
  700. return {"x": x, "y": y};
  701. },
  702. getTextPoint: function () {
  703. var x = "";
  704. var y = "";
  705. if (this.data.position) {
  706. var pArr = this.data.position.split(/(?:,\s*){1}|(?:;\s*){1}/g);
  707. x = pArr[0];
  708. y = pArr[1];
  709. } else {
  710. var p = this.getDefaultTextPoint();
  711. x = p.x;
  712. y = p.y;
  713. }
  714. return {"x": x, "y": y};
  715. },
  716. createText: function () {
  717. var text = null;
  718. if (this.beginPoint && this.endPoint) {
  719. var p = this.getTextPoint();
  720. text = this.paper.text(p.x, p.y, this.data.name || MWF.APPPD.LP.unnamed);
  721. text.attr(this.process.css.route.linetext.normal);
  722. return text;
  723. }
  724. },
  725. createArrow: function () {
  726. var beginPoint = this.beginPoint;
  727. if (this.positionPoints.length) {
  728. beginPoint = this.positionPoints[this.positionPoints.length - 1];
  729. }
  730. beginPoint.x = beginPoint.x.toFloat();
  731. beginPoint.y = beginPoint.y.toFloat();
  732. return this.paper.arrow(beginPoint, this.endPoint, this.l1, this.l2, this.aj);
  733. },
  734. createCorner: function (p, idx) {
  735. var corner = this.paper.rectPath((p.x.toFloat()) - 2.5, (p.y.toFloat()) - 2.5, 5, 5, 0);
  736. corner.data("position", p);
  737. corner.attr(this.process.css.route.corner["default"]);
  738. corner.hide();
  739. this.corners.splice(idx, 0, corner);
  740. corner.mousedown(function (e) {
  741. this.cornerBrokenLineBegin(e, corner);
  742. }.bind(this));
  743. this.set.push(corner);
  744. return corner;
  745. },
  746. getPoint: function (fromPath, toPath) {
  747. var fromActivityPath = fromPath;
  748. if (this.fromActivity) {
  749. if (!fromActivityPath) fromActivityPath = this.fromActivity.shap.attr("path");
  750. }
  751. var toActivityPath = toPath;
  752. if (this.toActivity) {
  753. if (!toActivityPath) toActivityPath = this.toActivity.shap.attr("path");
  754. }
  755. if (fromActivityPath && toActivityPath) {
  756. this.checked = true;
  757. if (this.toSelf) {
  758. var p1x = this.fromActivity.center.x + this.fromActivity.width;
  759. var p1y = this.fromActivity.center.y;
  760. var p2x = this.fromActivity.center.x + this.fromActivity.width;
  761. var p2y = this.fromActivity.center.y - this.fromActivity.height;
  762. var p3x = this.fromActivity.center.x;
  763. var p3y = this.fromActivity.center.y - this.fromActivity.height;
  764. this.positionPoints = [];
  765. this.positionPoints.push({"x": p1x, "y": p1y});
  766. this.positionPoints.push({"x": p2x, "y": p2y});
  767. this.positionPoints.push({"x": p3x, "y": p3y});
  768. this.beginPoint = {
  769. "x": this.fromActivity.center.x + this.fromActivity.width / 2,
  770. "y": this.fromActivity.center.y
  771. };
  772. this.endPoint = {
  773. "x": this.fromActivity.center.x,
  774. "y": this.fromActivity.center.y - this.fromActivity.height / 2
  775. };
  776. } else {
  777. var beginLinePath;
  778. var endLinePath;
  779. if (this.positionPoints[0]) {
  780. beginLinePath = "M" + this.fromActivity.center.x + "," + this.fromActivity.center.y + "L" + this.positionPoints[0].x + "," + this.positionPoints[0].y;
  781. var p = this.positionPoints[this.positionPoints.length - 1];
  782. endLinePath = "M" + p.x + "," + p.y + "L" + this.toActivity.center.x + "," + this.toActivity.center.y;
  783. } else {
  784. beginLinePath = "M" + this.fromActivity.center.x + "," + this.fromActivity.center.y + "L" + this.toActivity.center.x + "," + this.toActivity.center.y;
  785. endLinePath = "M" + this.fromActivity.center.x + "," + this.fromActivity.center.y + "L" + this.toActivity.center.x + "," + this.toActivity.center.y;
  786. }
  787. var decisionPoints = Raphael.pathIntersection(beginLinePath, fromActivityPath);
  788. var endPoints = Raphael.pathIntersection(endLinePath, toActivityPath);
  789. this.beginPoint = decisionPoints[0];
  790. this.endPoint = endPoints[0];
  791. }
  792. }
  793. if (!fromActivityPath && toActivityPath) {
  794. this.checked = false;
  795. var decisionY;
  796. var decisionX;
  797. if (this.tmpBeginPoint) {
  798. decisionY = this.tmpBeginPoint.y.toFloat();
  799. decisionX = this.tmpBeginPoint.x.toFloat();
  800. } else {
  801. decisionY = this.toActivity.center.y.toFloat() - 500;
  802. decisionX = this.toActivity.center.x.toFloat();
  803. }
  804. var endLinePath = "M" + decisionX + "," + decisionY + "L" + this.toActivity.center.x + "," + this.toActivity.center.y;
  805. var endPoints = Raphael.pathIntersection(endLinePath, toActivityPath);
  806. this.endPoint = endPoints[0];
  807. this.beginPoint = this.tmpBeginPoint || {"x": this.endPoint.x, "y": this.endPoint.y - 30};
  808. this.tmpBeginPoint = null;
  809. }
  810. if (fromActivityPath && !toActivityPath) {
  811. this.checked = false;
  812. var endY;
  813. var endX;
  814. if (this.tmpEndPoint) {
  815. endY = this.tmpEndPoint.y.toFloat();
  816. endX = this.tmpEndPoint.x.toFloat();
  817. } else {
  818. endY = this.fromActivity.center.y.toFloat() + 500;
  819. endX = this.fromActivity.center.x.toFloat();
  820. }
  821. var beginLinePath = "M" + this.fromActivity.center.x + "," + this.fromActivity.center.y + "L" + endX + "," + endY;
  822. var decisionPoints = Raphael.pathIntersection(beginLinePath, fromActivityPath);
  823. this.beginPoint = decisionPoints[0];
  824. this.endPoint = this.tmpEndPoint || {"x": this.beginPoint.x, "y": this.beginPoint.y + 30};
  825. this.tmpEndPoint = null;
  826. }
  827. if (!fromActivityPath && !toActivityPath) {
  828. this.checked = false;
  829. this.beginPoint = {"x": 10, "y": 10};
  830. this.endPoint = {"x": 10, "y": 30};
  831. }
  832. },
  833. setListItemData: function () {
  834. if (this.listItem) {
  835. var routeName = this.data.name || MWF.APPPD.LP.unnamed;
  836. var name = "";
  837. if (this.toActivity) {
  838. name = this.toActivity.data.name;
  839. if (!name) name = MWF.APPPD.LP.unnamed;
  840. } else {
  841. name = MWF.APPPD.LP.unknow;
  842. }
  843. this.listItem.row.tds[1].set("text", routeName + " (to " + name + ")");
  844. }
  845. },
  846. destroy: function () {
  847. if (this.fromActivity) {
  848. this.fromActivity.removeRouteData(this.data.id);
  849. // if (this.fromActivity.data.routeList){
  850. // this.fromActivity.data.routeList.erase(this.data.id);
  851. // }
  852. this.fromActivity.routes.erase(this);
  853. }
  854. if (this.listItem) {
  855. this.listItem.row.tr.destroy();
  856. }
  857. var routes = {};
  858. var routeDatas = {};
  859. for (rid in this.process.routes) {
  860. if (rid != this.data.id) {
  861. routes[rid] = this.process.routes[rid];
  862. routeDatas[rid] = this.process.routeDatas[rid];
  863. } else {
  864. this.process.routes[rid] = null;
  865. this.process.routeDatas[rid] = null;
  866. }
  867. }
  868. this.process.routes = null;
  869. this.process.routeDatas = null;
  870. this.process.routes = routes;
  871. this.process.routeDatas = routeDatas;
  872. this.process.process.routeList.erase(this.data);
  873. this.set.remove();
  874. },
  875. showProperty: function () {
  876. if (!this.property) {
  877. this.property = new MWF.APPPD.Route.Property(this, {
  878. "onPostLoad": function () {
  879. this.property.show();
  880. }.bind(this)
  881. });
  882. this.property.load();
  883. } else {
  884. this.property.show();
  885. }
  886. },
  887. _setEditProperty: function (name, input, oldValue) {
  888. debugger;
  889. if (name === "passExpired" || name === "passSameTarget" || name === "sole") {
  890. if (this.data[name]) {
  891. if (this.fromActivity) {
  892. this.fromActivity.routes.each(function(route){
  893. if (route.data.id !== this.data.id) {
  894. if (route.data[name]) {
  895. route.data[name] = false;
  896. if (route.property){
  897. var node = route.property.propertyContent.getElementById(route.data.id+name);
  898. if (node) node.getElements("input")[1].set("checked", true);
  899. }
  900. }
  901. }
  902. }.bind(this));
  903. }
  904. }
  905. }
  906. }
  907. });
  908. MWF.xApplication.process.ProcessDesigner.Route.List = new Class({
  909. initialize: function(route){
  910. this.route = route;
  911. this.process = route.process;
  912. this.paper = this.route.paper;
  913. },
  914. load: function(){
  915. var routeName = this.route.data.name || MWF.APPPD.LP.unnamed;
  916. var name = "";
  917. if (this.route.toActivity){
  918. name = this.route.toActivity.data.name;
  919. if (!name) name = MWF.APPPD.LP.unnamed;
  920. } else {
  921. name = MWF.APPPD.LP.unknow;
  922. }
  923. this.row = this.process.routeTable.push([
  924. {
  925. "content": " ",
  926. "properties": {
  927. "styles": this.process.css.route.icon
  928. }
  929. },
  930. {
  931. "content": routeName+" (to "+name+")",
  932. "properties": {
  933. "styles": this.process.css.list.listText
  934. }
  935. },
  936. {
  937. "content": "<img src=\""+"/x_component_process_ProcessDesigner/$Process/default/icon/copy.png"+"\" />",
  938. "properties": {
  939. "styles": this.process.css.list.listIcon,
  940. "events": {
  941. "click": this.copyRoute.bind(this)
  942. }
  943. }
  944. },
  945. {
  946. "content": "<img src=\""+"/x_component_process_ProcessDesigner/$Process/default/icon/delete.png"+"\" />",
  947. "properties": {
  948. "styles": this.process.css.list.listIcon,
  949. "events": {
  950. "click": this.deleteRoute.bind(this)
  951. }
  952. }
  953. }
  954. ]
  955. );
  956. this.row.tr.addEvent("click", function(){
  957. this.listSelected();
  958. }.bind(this));
  959. },
  960. copyRoute: function(){
  961. this.process.copyRoute(this.route);
  962. },
  963. deleteRoute: function(e){
  964. this.process.deleteRoute(e, this.route);
  965. },
  966. selected: function(){
  967. if (this.process.currentListSelected) this.process.currentListSelected.listUnSelected();
  968. this.row.tr.setStyles(this.process.css.list.listRowSelected);
  969. this.process.currentListSelected = this;
  970. },
  971. unSelected: function(){
  972. this.process.currentListSelected = null;
  973. this.row.tr.setStyles(this.process.css.list.listRow);
  974. },
  975. listSelected: function(){
  976. this.route.selected();
  977. },
  978. listUnSelected: function(){
  979. this.route.unSelected();
  980. }
  981. });
  982. MWF.xApplication.process.ProcessDesigner.Route.Property = new Class({
  983. Implements: [Options, Events],
  984. Extends: MWF.APPPD.Property,
  985. initialize: function(route, options){
  986. this.setOptions(options);
  987. this.route = route;
  988. this.process = route.process;
  989. this.paper = this.process.paper;
  990. this.data = route.data;
  991. this.htmlPath = "/x_component_process_ProcessDesigner/$Process/route.html";
  992. },
  993. setValue: function(name, value){
  994. this.data[name] = value;
  995. if (name=="name"){
  996. if (!value) this.data[name] = MWF.APPPD.LP.unnamed;
  997. this.route.reload();
  998. }
  999. },
  1000. show: function(){
  1001. if (!this.process.options.isView){
  1002. if (!this.propertyContent){
  1003. this.propertyContent = new Element("div", {"styles": {"overflow": "hidden"}}).inject(this.process.propertyListNode);
  1004. this.process.panel.propertyTabPage.showTabIm();
  1005. this.JsonTemplate = new MWF.widget.JsonTemplate(this.data, this.htmlString);
  1006. this.propertyContent.set("html", this.JsonTemplate.load());
  1007. this.process.panel.data = this.data;
  1008. this.loadRouteCondition();
  1009. this.setEditNodeEvent();
  1010. this.setEditNodeStyles(this.propertyContent);
  1011. this.loadPropertyTab();
  1012. this.loadPersonInput();
  1013. this.loadScriptInput();
  1014. this.loadScriptText();
  1015. this.loadConditionInput();
  1016. this.loadFormSelect();
  1017. }else{
  1018. this.propertyContent.setStyle("display", "block");
  1019. }
  1020. }
  1021. },
  1022. loadRouteCondition: function(){
  1023. var routeConditionNode = this.propertyContent.getElement(".MWFRouteCondition");
  1024. var type = this.route.fromActivity.type;
  1025. if (type=="choice" || type=="condition" || type=="parallel"){
  1026. if (!routeConditionNode){
  1027. routeConditionNode = new Element("div.MWFTab", {
  1028. "title": MWF.APPPD.LP.condition,
  1029. "html": "<div class=\"MWFScriptText\" name=\"scriptText\"></div>"
  1030. }).inject(this.propertyContent.getFirst());
  1031. }
  1032. }else{
  1033. if (routeConditionNode) routeConditionNode.destroy();
  1034. }
  1035. }
  1036. //loadScriptText: function(){
  1037. // var node = this.propertyContent.getElement(".MWFScriptText");
  1038. // if (node){
  1039. // MWF.require("MWF.xApplication.process.ProcessDesigner.widget.ScriptText", function(){
  1040. // var _self = this;
  1041. // // scriptNodes.each(function(node){
  1042. // var data = (_self.route.fromActivity.data.extension) ? JSON.decode(_self.route.fromActivity.data.extension) : {};
  1043. // var code = (data[_self.route.data.id]) || "";
  1044. //
  1045. // var script = new MWF.xApplication.process.ProcessDesigner.widget.ScriptText(node, code, this.process.designer, {
  1046. // "maskNode": this.process.designer.content,
  1047. // "onChange": function(code){
  1048. // var id = _self.route.data.id;
  1049. // data[id] = code;
  1050. // var jsonString = JSON.encode(data);
  1051. // _self.route.fromActivity.data.extension = jsonString;
  1052. // _self.route.fromActivity.data.scriptText = "return this.library.choiceRoute('"+encodeURIComponent(jsonString)+"');";
  1053. // }
  1054. // });
  1055. // //this.setScriptItems(script, node);
  1056. // // }.bind(this));
  1057. // }.bind(this));
  1058. // }
  1059. //}
  1060. });